refactor: use named export for everything except pages

Next expect a default export for pages so only those components should
use default exports. Everything else should use named exports to
reduce the number of import statements.

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;