# All files / src/form Checkbox.tsx

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

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
    261x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    76x
    76x
    1x
     import { forwardRef } from "react";
    import { InputToggle, type CheckboxProps } from "./InputToggle.js";

    /**
     * **Client Component**
     *
     * You'll generally want to use the `useCheckboxGroup` hook for managing the
     * checked state for groups of checkboxes and indeterminate checkbox behavior.
     *
     * @example
     * Simple Example
     * ```tsx
     * import type { ReactElement } from "react";
     * import { Checkbox } from "@react-md/core";
     *
     * function Example(): ReactElement {
     *   return <Checkbox label="Checkbox" value="a" />;
     * }
     * ```
     */
    export const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(
      function Checkbox(props, ref) {
        return <InputToggle {...props} ref={ref} type="checkbox" />;
      }
    );