mirror of
https://github.com/overleaf/overleaf.git
synced 2024-11-30 10:54:09 -05:00
48 lines
1.4 KiB
TypeScript
48 lines
1.4 KiB
TypeScript
import { ToggleButton, ToggleButtonProps } from 'react-bootstrap-5'
|
|
import {
|
|
ToggleButton as BS3ToggleButton,
|
|
ToggleButtonProps as BS3ToggleButtonProps,
|
|
} from 'react-bootstrap'
|
|
import BootstrapVersionSwitcher from '@/features/ui/components/bootstrap-5/bootstrap-version-switcher'
|
|
import { getAriaAndDataProps } from '@/features/utils/bootstrap-5'
|
|
import classnames from 'classnames'
|
|
|
|
type OLToggleButtonProps = ToggleButtonProps & {
|
|
bs3Props?: BS3ToggleButtonProps
|
|
}
|
|
|
|
function OLToggleButton(props: OLToggleButtonProps) {
|
|
const { bs3Props, ...rest } = props
|
|
|
|
const bs3ToggleButtonProps: BS3ToggleButtonProps & { active?: boolean } = {
|
|
type: rest.type,
|
|
name: rest.name,
|
|
active: rest.active,
|
|
checked: rest.checked,
|
|
disabled: rest.disabled,
|
|
onChange: rest.onChange as BS3ToggleButtonProps['onChange'],
|
|
onClick: rest.onClick as BS3ToggleButtonProps['onClick'],
|
|
value: rest.value as BS3ToggleButtonProps['value'],
|
|
children: rest.children,
|
|
className: classnames(`btn-${props.variant || 'primary'}`, rest.className),
|
|
...bs3Props,
|
|
}
|
|
|
|
// Get all `aria-*` and `data-*` attributes
|
|
const extraProps = getAriaAndDataProps(rest)
|
|
|
|
return (
|
|
<BootstrapVersionSwitcher
|
|
bs3={
|
|
<BS3ToggleButton
|
|
{...extraProps}
|
|
{...bs3ToggleButtonProps}
|
|
bsStyle={null}
|
|
/>
|
|
}
|
|
bs5={<ToggleButton {...rest} />}
|
|
/>
|
|
)
|
|
}
|
|
|
|
export default OLToggleButton
|