import { jsx } from 'react/jsx-runtime';
import { forwardRef } from 'react';
import { R as Radio$1, a as RadioGroup } from './Radio-dyLcVmUw.js';
import { c as childrenToString } from './childrenToString-Bz9MqbHb.js';
import { useTrackingId } from './useTrackingId.js';

const Radio = Object.assign(
  forwardRef(function RadioInner(props, ref) {
    const data = {
      label: childrenToString(props.label),
      ariaLabel: props["aria-label"],
      ariaLabelledBy: props["aria-labelledby"],
      name: props.name,
      value: props.value
    };
    const trackingId = useTrackingId({
      name: "Radio",
      data,
      hasOverride: !!props["data-tracking-id"]
    });
    return /* @__PURE__ */ jsx(Radio$1, { ref, "data-tracking-id": trackingId, ...props });
  }),
  {
    /**
     * RadioGroup component for grouping related radio options.
     *
     * Features:
     * - Groups multiple radio options together
     * - Legend support for group labeling
     * - Required field indication
     * - Accessibility support with proper fieldset semantics
     * - Layout utility props for positioning and spacing
     * - Focus and blur event handling
     * - More info support for additional context
     * - Automatic alignment based on flex direction
     *
     * @example
     * <RadioGroup legend="Choose your preference" required>
     *   <Radio label="Option A" value="a" />
     *   <Radio label="Option B" value="b" />
     *   <Radio label="Option C" value="c" />
     * </RadioGroup>
     *
     * @example
     * <RadioGroup
     *   legend="Horizontal layout"
     *   flexDirection="row"
     *   gap="4"
     * >
     *   <Radio label="Yes" value="yes" />
     *   <Radio label="No" value="no" />
     * </RadioGroup>
     */
    Group: RadioGroup
  }
);
Radio.displayName = Radio$1?.displayName ?? "RadioElement";

export { Radio as R };
//# sourceMappingURL=Radio-D9w_-JYw.js.map
