diff options
Diffstat (limited to 'src/components/molecules/buttons/main-nav-button.tsx')
| -rw-r--r-- | src/components/molecules/buttons/main-nav-button.tsx | 75 |
1 files changed, 0 insertions, 75 deletions
diff --git a/src/components/molecules/buttons/main-nav-button.tsx b/src/components/molecules/buttons/main-nav-button.tsx deleted file mode 100644 index 59407db..0000000 --- a/src/components/molecules/buttons/main-nav-button.tsx +++ /dev/null @@ -1,75 +0,0 @@ -import Checkbox, { CheckboxProps } from '@components/atoms/forms/checkbox'; -import Label from '@components/atoms/forms/label'; -import Hamburger from '@components/atoms/icons/hamburger'; -import { VFC } from 'react'; -import { useIntl } from 'react-intl'; -import styles from './main-nav-button.module.scss'; - -export type MainNavButtonProps = { - /** - * Set additional classnames to the checkbox. - */ - checkboxClassName?: string; - /** - * The button state. - */ - isActive: CheckboxProps['value']; - /** - * Set additional classnames to the label. - */ - labelClassName?: string; - /** - * A callback function to handle button state. - */ - setIsActive: CheckboxProps['setValue']; -}; - -/** - * MainNavButton component - * - * Render a hamburger icon or a close icon depending on state. - */ -const MainNavButton: VFC<MainNavButtonProps> = ({ - checkboxClassName = '', - isActive, - labelClassName = '', - setIsActive, -}) => { - const intl = useIntl(); - const label = isActive - ? intl.formatMessage({ - defaultMessage: 'Close menu', - id: 'wT7YZb', - description: 'MainNavButton: close menu label', - }) - : intl.formatMessage({ - defaultMessage: 'Open menu', - id: 'P7j8ZZ', - description: 'MainNavButton: open menu label', - }); - const hamburgerModifier = isActive ? 'icon--active' : ''; - - return ( - <> - <Checkbox - id="main-nav-button" - name="main-nav-button" - value={isActive} - setValue={setIsActive} - className={`${styles.checkbox} ${checkboxClassName}`} - /> - <Label - htmlFor="main-nav-button" - className={`${styles.label} ${labelClassName}`} - aria-label={label} - > - <Hamburger - className={styles.icon__wrapper} - iconClassName={styles[hamburgerModifier]} - /> - </Label> - </> - ); -}; - -export default MainNavButton; |
