# All files / src/components button.tsx

100% Statements 2/2
100% Branches 2/2
100% Functions 1/1
100% Lines 2/2

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43

    16x

    56x

     import { forwardRef, type PropsWithChildren, type HTMLAttributes } from 'react';
    import cn from 'classnames';

    import '../styles/common/_buttons.scss';

    export type ButtonProps = {
      /**
       * Flag to disable the button
       */
      disabled?: boolean;
      /**
       * Type to pass to the underlying <button></button>
       */
      type?: 'button' | 'submit' | 'reset';
      /**
       * Variant of the button
       */
      variant?: 'primary' | 'secondary' | 'tertiary';
      /**
       * Classnames to be added to the button
       */
      className?: string;
    } & HTMLAttributes<HTMLButtonElement>;

    const Button = forwardRef<HTMLButtonElement, PropsWithChildren<ButtonProps>>(
      (
        { className, variant = 'primary', type = 'button', children, ...props },
        ref
      ) => (
        <button
          className={cn('button', variant, { disabled: props.disabled }, className)}
          // eslint-disable-next-line react/button-has-type
          type={type}
          ref={ref}
          {...props}
        >
          {children}
        </button>
      )
    );

    export default Button;