import { jsx } from 'react/jsx-runtime';
import { forwardRef } from 'react';
import { C as Checkbox$1, a as CheckboxGroup } from './Checkbox-BSAS8-DM.js';
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
import { useTrackingId } from './useTrackingId.js';

const Checkbox = Object.assign(
  forwardRef(
    function CheckboxInner(props, ref) {
      const data = {
        label: childrenToString(props.label),
        ariaLabel: props["aria-label"],
        ariaLabelledBy: props["aria-labelledby"],
        value: props.value
      };
      const trackingId = useTrackingId({
        name: "Checkbox",
        data,
        hasOverride: !!props["data-tracking-id"]
      });
      return /* @__PURE__ */ jsx(Checkbox$1, { ref, "data-tracking-id": trackingId, ...props });
    }
  ),
  {
    /**
     * CheckboxGroup component for grouping related checkboxes together.
     *
     * Features:
     * - Groups multiple checkboxes with a common legend
     * - Supports required field indication
     * - Optional helper text and descriptions
     * - Full accessibility support with fieldset/legend
     * - Focus management for keyboard navigation
     * - Layout utility props for positioning and spacing
     * - Flexible layout direction (row/column)
     * - Screen reader support with hidden labels
     * - Automatic tracking ID generation for analytics
     *
     * @example
     * <CheckboxGroup legend="Select your interests" required>
     *   <Checkbox label="Technology" />
     *   <Checkbox label="Sports" />
     *   <Checkbox label="Music" />
     * </CheckboxGroup>
     */
    Group: CheckboxGroup
  }
);
Checkbox.displayName = Checkbox$1.displayName;

export { Checkbox as C };
//# sourceMappingURL=Checkbox-Ckl8EFpF.js.map
