aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/molecules/forms/labelled-boolean-field.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/molecules/forms/labelled-boolean-field.tsx')
-rw-r--r--src/components/molecules/forms/labelled-boolean-field.tsx85
1 files changed, 0 insertions, 85 deletions
diff --git a/src/components/molecules/forms/labelled-boolean-field.tsx b/src/components/molecules/forms/labelled-boolean-field.tsx
deleted file mode 100644
index d110d45..0000000
--- a/src/components/molecules/forms/labelled-boolean-field.tsx
+++ /dev/null
@@ -1,85 +0,0 @@
-import { FC } from 'react';
-import {
- BooleanField,
- type BooleanFieldProps,
- Label,
- type LabelProps,
-} from '../../atoms';
-import styles from './labelled-boolean-field.module.scss';
-
-export type LabelledBooleanFieldProps = Omit<
- BooleanFieldProps,
- 'aria-labelledby' | 'className'
-> & {
- /**
- * Set additional classnames to the labelled field wrapper.
- */
- className?: string;
- /**
- * Set additional classnames to the field.
- */
- fieldClassName?: LabelledBooleanFieldProps['className'];
- /**
- * The field label.
- */
- label: LabelProps['children'];
- /**
- * Set additional classnames to the label.
- */
- labelClassName?: LabelProps['className'];
- /**
- * The label position. Default: left.
- */
- labelPosition?: 'left' | 'right';
- /**
- * The label size.
- */
- labelSize?: LabelProps['size'];
-};
-
-/**
- * LabelledBooleanField component
- *
- * Render a checkbox or radio button with a label.
- */
-export const LabelledBooleanField: FC<LabelledBooleanFieldProps> = ({
- className = '',
- fieldClassName,
- hidden,
- id,
- label,
- labelClassName,
- labelPosition = 'left',
- labelSize,
- ...props
-}) => {
- const labelHiddenModifier = hidden ? 'label--hidden' : 'label--visible';
- const labelPositionModifier = `label--${labelPosition}`;
- const labelClass = `${styles[labelPositionModifier]} ${styles[labelHiddenModifier]} ${labelClassName}`;
-
- return labelPosition === 'left' ? (
- <span className={`${styles.wrapper} ${className}`}>
- <Label className={labelClass} htmlFor={id} size={labelSize}>
- {label}
- </Label>
- <BooleanField
- {...props}
- className={fieldClassName}
- hidden={hidden}
- id={id}
- />
- </span>
- ) : (
- <span className={`${styles.wrapper} ${className}`}>
- <BooleanField
- {...props}
- className={fieldClassName}
- hidden={hidden}
- id={id}
- />
- <Label className={labelClass} htmlFor={id} size={labelSize}>
- {label}
- </Label>
- </span>
- );
-};