diff options
Diffstat (limited to 'src/components/atoms/forms/boolean-field.tsx')
| -rw-r--r-- | src/components/atoms/forms/boolean-field.tsx | 34 |
1 files changed, 8 insertions, 26 deletions
diff --git a/src/components/atoms/forms/boolean-field.tsx b/src/components/atoms/forms/boolean-field.tsx index 946e375..8f33a42 100644 --- a/src/components/atoms/forms/boolean-field.tsx +++ b/src/components/atoms/forms/boolean-field.tsx @@ -1,24 +1,15 @@ -import { ChangeEventHandler, FC, MouseEventHandler } from 'react'; +import { FC, InputHTMLAttributes } from 'react'; import styles from './boolean-field.module.scss'; -export type BooleanFieldProps = { - /** - * One or more ids that refers to the checkbox name. - */ - 'aria-labelledby'?: string; +export type BooleanFieldProps = Omit< + InputHTMLAttributes<HTMLInputElement>, + 'checked' | 'hidden' | 'name' | 'type' | 'value' +> & { /** * True if the field should be checked. */ checked: boolean; /** - * Add classnames to the checkbox. - */ - className?: string; - /** - * Field id attribute. - */ - id: string; - /** * True if the field should be visually hidden. Default: false. */ hidden?: boolean; @@ -27,14 +18,6 @@ export type BooleanFieldProps = { */ name: string; /** - * Callback function to handle state change. - */ - onChange: ChangeEventHandler<HTMLInputElement>; - /** - * A callback function to handle click. - */ - onClick?: MouseEventHandler<HTMLInputElement>; - /** * The input type. */ type: 'checkbox' | 'radio'; @@ -49,14 +32,13 @@ export type BooleanFieldProps = { * * Render a checkbox or a radio input type. */ -const BooleanField: FC<BooleanFieldProps> = ({ +export const BooleanField: FC<BooleanFieldProps> = ({ className = '', hidden = false, ...props }) => { const modifier = hidden ? 'hidden' : ''; + const inputClass = `${styles[modifier]} ${className}`; - return <input className={`${styles[modifier]} ${className}`} {...props} />; + return <input {...props} className={inputClass} />; }; - -export default BooleanField; |
