import { observer } from 'mobx-react-lite' ; import styled from 'reshadow' ; import { TabPanel } from '@cloudbeaver/core-ui' ; import { BASE_CONTAINERS_STYLES , ColoredContainer , Container } from '@cloudbeaver/core-blocks' ; import { ComponentStyle , useStyles } from '@cloudbeaver/core-theming' ; import { ChangePassword } from './ChangePassword/ChangePassword' ; interface Props { className ? : string ; style ? : ComponentStyle ; } export const AuthenticationPanel = observer < Props > ( function AuthenticationPanel ( { className , style } ) { const styles = useStyles ( style , BASE_CONTAINERS_STYLES ) ; return styled ( styles ) ( < TabPanel tabId = 'authentication' className = { className } > < ColoredContainer wrap overflow parent gap > < Container medium gap > < ChangePassword /> < /Container> < /ColoredContainer> < /TabPanel>); } ) ;