# All files / button ButtonUnstyled.tsx

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

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
    441x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
    2x
     import type { ButtonHTMLAttributes } from "react";
    import { forwardRef } from "react";
    import { buttonUnstyled } from "./buttonUnstyledStyles.js";

    /**
     * The props for the unstyled button are just all the normal button html
     * attributes without the `type` since this component forces the `type="button"`
     * value.
     *
     * @remarks \@since 6.0.0 Renamed from `UnstyledButtonProps`
     */
    export type ButtonUnstyledProps = Omit<
      ButtonHTMLAttributes<HTMLButtonElement>,
      "type"
    >;

    /**
     * **Server Component**
     *
     * A simple wrapper for a `<button type="button">` that applies the unstyled
     * utility class.
     *
     * Requires the `$disable-unstyled-utility-class` to be `false` to use.
     *
     * @see {@link buttonUnstyled}
     * @remarks \@since 6.0.0 Renamed from `UnstyledButton`
     */
    export const ButtonUnstyled = forwardRef<
      HTMLButtonElement,
      ButtonUnstyledProps
    >(function ButtonUnstyled(props, ref) {
      const { children, className, ...remaining } = props;
      return (
        <button
          {...remaining}
          ref={ref}
          type="button"
          className={buttonUnstyled({ className })}
        >
          {children}
        </button>
      );
    });