@neynar/ui 0.4.0 → 1.0.0

package/dist/components/ui/progress.js

@@ -0,0 +1,77 @@
+"use client";
+import { jsxs, jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import { ProgressRoot } from "../../node_modules/@base-ui/react/esm/progress/root/ProgressRoot.js";
+import { ProgressTrack as ProgressTrack$1 } from "../../node_modules/@base-ui/react/esm/progress/track/ProgressTrack.js";
+import { ProgressIndicator as ProgressIndicator$1 } from "../../node_modules/@base-ui/react/esm/progress/indicator/ProgressIndicator.js";
+import { ProgressLabel as ProgressLabel$1 } from "../../node_modules/@base-ui/react/esm/progress/label/ProgressLabel.js";
+import { ProgressValue as ProgressValue$1 } from "../../node_modules/@base-ui/react/esm/progress/value/ProgressValue.js";
+function Progress({ className, children, value, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    ProgressRoot,
+    {
+      value,
+      "data-slot": "progress",
+      className: cn("flex flex-wrap gap-3", className),
+      ...props,
+      children: [
+        children,
+        /* @__PURE__ */ jsx(ProgressTrack, { children: /* @__PURE__ */ jsx(ProgressIndicator, {}) })
+      ]
+    }
+  );
+}
+function ProgressTrack({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressTrack$1,
+    {
+      className: cn(
+        "bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden",
+        className
+      ),
+      "data-slot": "progress-track",
+      ...props
+    }
+  );
+}
+function ProgressIndicator({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressIndicator$1,
+    {
+      "data-slot": "progress-indicator",
+      className: cn("bg-primary h-full transition-all", className),
+      ...props
+    }
+  );
+}
+function ProgressLabel({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressLabel$1,
+    {
+      className: cn("text-sm font-medium", className),
+      "data-slot": "progress-label",
+      ...props
+    }
+  );
+}
+function ProgressValue({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    ProgressValue$1,
+    {
+      className: cn(
+        "text-muted-foreground ml-auto text-sm tabular-nums",
+        className
+      ),
+      "data-slot": "progress-value",
+      ...props
+    }
+  );
+}
+export {
+  Progress,
+  ProgressIndicator,
+  ProgressLabel,
+  ProgressTrack,
+  ProgressValue
+};
+//# sourceMappingURL=progress.js.map

package/dist/components/ui/progress.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"progress.js","sources":["../../../src/components/ui/progress.tsx"],"sourcesContent":["\"use client\";\n\nimport { Progress as ProgressPrimitive } from \"@base-ui/react/progress\";\n\nimport { cn } from \"@/lib/utils\";\n\ntype ProgressProps = ProgressPrimitive.Root.Props;\n\n/**\n * Root container for progress bar with label and value support.\n * Automatically includes track and indicator. Use `value={null}` for indeterminate state.\n */\nfunction Progress({ className, children, value, ...props }: ProgressProps) {\n  return (\n    <ProgressPrimitive.Root\n      value={value}\n      data-slot=\"progress\"\n      className={cn(\"flex flex-wrap gap-3\", className)}\n      {...props}\n    >\n      {children}\n      <ProgressTrack>\n        <ProgressIndicator />\n      </ProgressTrack>\n    </ProgressPrimitive.Root>\n  );\n}\n\ntype ProgressTrackProps = ProgressPrimitive.Track.Props;\n\n/**\n * Container for the progress indicator. Customize height with className (e.g., `h-2`, `h-3`).\n */\nfunction ProgressTrack({ className, ...props }: ProgressTrackProps) {\n  return (\n    <ProgressPrimitive.Track\n      className={cn(\n        \"bg-muted h-1.5 rounded-full relative flex w-full items-center overflow-x-hidden\",\n        className,\n      )}\n      data-slot=\"progress-track\"\n      {...props}\n    />\n  );\n}\n\ntype ProgressIndicatorProps = ProgressPrimitive.Indicator.Props;\n\n/**\n * Visual indicator showing progress completion. Customize color with className\n * (e.g., `bg-green-500`, `bg-red-500` for semantic states).\n */\nfunction ProgressIndicator({ className, ...props }: ProgressIndicatorProps) {\n  return (\n    <ProgressPrimitive.Indicator\n      data-slot=\"progress-indicator\"\n      className={cn(\"bg-primary h-full transition-all\", className)}\n      {...props}\n    />\n  );\n}\n\ntype ProgressLabelProps = ProgressPrimitive.Label.Props;\n\n/**\n * Text label describing the progress task.\n */\nfunction ProgressLabel({ className, ...props }: ProgressLabelProps) {\n  return (\n    <ProgressPrimitive.Label\n      className={cn(\"text-sm font-medium\", className)}\n      data-slot=\"progress-label\"\n      {...props}\n    />\n  );\n}\n\ntype ProgressValueProps = ProgressPrimitive.Value.Props;\n\n/**\n * Displays formatted progress value (e.g., \"65%\"). Auto-positioned to right via `ml-auto`.\n */\nfunction ProgressValue({ className, ...props }: ProgressValueProps) {\n  return (\n    <ProgressPrimitive.Value\n      className={cn(\n        \"text-muted-foreground ml-auto text-sm tabular-nums\",\n        className,\n      )}\n      data-slot=\"progress-value\"\n      {...props}\n    />\n  );\n}\n\nexport {\n  Progress,\n  ProgressTrack,\n  ProgressIndicator,\n  ProgressLabel,\n  ProgressValue,\n  type ProgressProps,\n  type ProgressTrackProps,\n  type ProgressIndicatorProps,\n  type ProgressLabelProps,\n  type ProgressValueProps,\n};\n"],"names":["ProgressPrimitive.Root","ProgressPrimitive.Track","ProgressPrimitive.Indicator","ProgressPrimitive.Label","ProgressPrimitive.Value"],"mappings":";;;;;;;;AAYA;AACE;AACE;AAACA;AAAA;AACC;AACU;AACqC;AAC3C;AAEH;AAAA;AAGD;AAAA;AAAA;AAGN;AAOA;AACE;AACE;AAACC;AAAA;AACY;AACT;AACA;AAAA;AAEQ;AACN;AAAA;AAGV;AAQA;AACE;AACE;AAACC;AAAA;AACW;AACiD;AACvD;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AAC+C;AACpC;AACN;AAAA;AAGV;AAOA;AACE;AACE;AAACC;AAAA;AACY;AACT;AACA;AAAA;AAEQ;AACN;AAAA;AAGV;;;;;;;;"}

package/dist/components/ui/radio-group.d.ts

@@ -1,288 +1,16 @@
-import * as React from "react";
-import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { Radio as RadioPrimitive } from '@base-ui/react/radio';
+import { RadioGroup as RadioGroupPrimitive } from '@base-ui/react/radio-group';
+type RadioGroupProps = RadioGroupPrimitive.Props;
 /**
- * A radio group component for single selection from multiple options
- *
- * RadioGroup allows users to select exactly one option from a set of mutually exclusive choices.
- * Built on Radix UI RadioGroup primitives with enhanced accessibility and keyboard navigation.
- * Each radio group should contain RadioGroupItem components paired with Labels for proper accessibility.
- *
- * The component follows the WAI-ARIA Radio Group design pattern and uses roving tabindex to manage
- * focus movement among radio items. It provides comprehensive keyboard navigation with arrow keys
- * and supports both controlled and uncontrolled usage patterns.
- *
- * @example Basic uncontrolled usage
- * ```tsx
- * <RadioGroup defaultValue="option-one">
- *   <div className="flex items-center space-x-2">
- *     <RadioGroupItem value="option-one" id="option-one" />
- *     <Label htmlFor="option-one">Option One</Label>
- *   </div>
- *   <div className="flex items-center space-x-2">
- *     <RadioGroupItem value="option-two" id="option-two" />
- *     <Label htmlFor="option-two">Option Two</Label>
- *   </div>
- * </RadioGroup>
- * ```
- *
- * @example Controlled radio group
- * ```tsx
- * function SizeSelector() {
- *   const [size, setSize] = useState("medium");
- *
- *   return (
- *     <RadioGroup value={size} onValueChange={setSize}>
- *       <div className="flex items-center space-x-2">
- *         <RadioGroupItem value="small" id="size-small" />
- *         <Label htmlFor="size-small">Small</Label>
- *       </div>
- *       <div className="flex items-center space-x-2">
- *         <RadioGroupItem value="medium" id="size-medium" />
- *         <Label htmlFor="size-medium">Medium</Label>
- *       </div>
- *       <div className="flex items-center space-x-2">
- *         <RadioGroupItem value="large" id="size-large" />
- *         <Label htmlFor="size-large">Large</Label>
- *       </div>
- *     </RadioGroup>
- *   );
- * }
- * ```
- *
- * @example Horizontal orientation
- * ```tsx
- * <RadioGroup
- *   defaultValue="option-one"
- *   orientation="horizontal"
- *   className="flex gap-4"
- * >
- *   <div className="flex items-center space-x-2">
- *     <RadioGroupItem value="option-one" id="r1" />
- *     <Label htmlFor="r1">Option One</Label>
- *   </div>
- *   <div className="flex items-center space-x-2">
- *     <RadioGroupItem value="option-two" id="r2" />
- *     <Label htmlFor="r2">Option Two</Label>
- *   </div>
- * </RadioGroup>
- * ```
- *
- * @example With rich content and descriptions
- * ```tsx
- * <RadioGroup defaultValue="card" name="payment-method">
- *   <div className="flex items-start space-x-2">
- *     <RadioGroupItem value="card" id="card" className="mt-1" />
- *     <div className="grid gap-1">
- *       <Label htmlFor="card">Credit Card</Label>
- *       <p className="text-sm text-muted-foreground">
- *         Pay with your credit or debit card via secure payment
- *       </p>
- *     </div>
- *   </div>
- *   <div className="flex items-start space-x-2">
- *     <RadioGroupItem value="paypal" id="paypal" className="mt-1" />
- *     <div className="grid gap-1">
- *       <Label htmlFor="paypal">PayPal</Label>
- *       <p className="text-sm text-muted-foreground">
- *         Pay with your PayPal account balance or linked bank account
- *       </p>
- *     </div>
- *   </div>
- * </RadioGroup>
- * ```
- *
- * @example Disabled state and form usage
- * ```tsx
- * <form>
- *   <RadioGroup
- *     name="subscription"
- *     required
- *     defaultValue="basic"
- *   >
- *     <div className="flex items-center space-x-2">
- *       <RadioGroupItem value="basic" id="basic" />
- *       <Label htmlFor="basic">Basic Plan</Label>
- *     </div>
- *     <div className="flex items-center space-x-2">
- *       <RadioGroupItem value="premium" id="premium" disabled />
- *       <Label htmlFor="premium" className="opacity-50">
- *         Premium Plan (Coming Soon)
- *       </Label>
- *     </div>
- *   </RadioGroup>
- * </form>
- * ```
- *
- * @param defaultValue The value of the radio item that should be checked when initially rendered. Use when you do not need to control the checked state
- * @param value The controlled value of the radio item to check. Should be used in conjunction with onValueChange
- * @param onValueChange Event handler called when the value changes
- * @param disabled When true, prevents the user from interacting with the radio group
- * @param name The name of the group. Submitted with its owning form as part of a name/value pair
- * @param required When true, indicates that the user must check a radio item before the owning form can be submitted
- * @param orientation The orientation of the component, which determines how focus moves @default "vertical"
- * @param dir The reading direction of the radio group. If omitted, assumes LTR reading mode
- * @param loop When true, keyboard navigation will loop from last item to first, and vice versa @default true
- * @param asChild Change the default rendered element for the one passed as a child @default false
- * @param className Additional CSS classes to apply to the radio group
- * @param children RadioGroupItem components and their associated labels
- *
- * @accessibility
- * - Supports keyboard navigation with Tab to enter/exit and Arrow keys to navigate between items
- * - Space key selects the focused radio item
- * - Uses roving tabindex to manage focus within the group
- * - Provides proper ARIA roles and states for screen readers
- * - Announces selected/unselected states to assistive technologies
- * - Supports Right-to-Left (RTL) text direction
- * - Works with form validation and submission
- *
- * @see {@link RadioGroupItem} for individual radio button items
- * @see {@link RadioGroupIndicator} for the visual checked indicator
- * @see {@link https://ui.shadcn.com/docs/components/radio-group} shadcn/ui Radio Group documentation
- * @see {@link https://www.radix-ui.com/primitives/docs/components/radio-group} Radix UI Radio Group primitives
- * @see {@link https://www.w3.org/WAI/ARIA/apg/patterns/radiobutton/} WAI-ARIA Radio Group Pattern
- * @since 1.0.0
+ * Container for radio button items. Manages shared state and ensures only one option can be selected.
+ * Supports controlled and uncontrolled usage.
  */
-declare function RadioGroup({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
+declare function RadioGroup({ className, ...props }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
+type RadioGroupItemProps = RadioPrimitive.Root.Props;
 /**
- * Individual radio button item for use within RadioGroup
- *
- * RadioGroupItem represents a single selectable option in a radio group.
- * Must be used within a RadioGroup component and should be paired with a Label for proper accessibility.
- * The component automatically handles visual states including checked, unchecked, focused, and disabled.
- * It includes a built-in indicator that displays when the item is selected.
- *
- * Each radio item requires a unique value prop that identifies it within the group.
- * The component forwards all standard button attributes and supports custom styling via className.
- *
- * @example Basic usage with label
- * ```tsx
- * <div className="flex items-center space-x-2">
- *   <RadioGroupItem value="option-one" id="option-one" />
- *   <Label htmlFor="option-one">Option One</Label>
- * </div>
- * ```
- *
- * @example Custom styling and theming
- * ```tsx
- * <RadioGroupItem
- *   value="premium"
- *   id="premium"
- *   className="border-purple-500 text-purple-500 data-[state=checked]:bg-purple-50"
- * />
- * <Label htmlFor="premium" className="text-purple-900">
- *   Premium Plan
- * </Label>
- * ```
- *
- * @example Disabled state
- * ```tsx
- * <div className="flex items-center space-x-2">
- *   <RadioGroupItem value="unavailable" id="unavailable" disabled />
- *   <Label htmlFor="unavailable" className="opacity-50 cursor-not-allowed">
- *     Unavailable Option
- *   </Label>
- * </div>
- * ```
- *
- * @example With complex content layout
- * ```tsx
- * <div className="flex items-start space-x-3 p-3 border rounded-lg">
- *   <RadioGroupItem value="plan-pro" id="plan-pro" className="mt-1" />
- *   <div className="grid gap-1">
- *     <Label htmlFor="plan-pro" className="font-semibold">
- *       Professional Plan
- *     </Label>
- *     <p className="text-sm text-muted-foreground">
- *       Advanced features for growing teams
- *     </p>
- *     <p className="text-lg font-bold">$29/month</p>
- *   </div>
- * </div>
- * ```
- *
- * @example Form integration with validation
- * ```tsx
- * <RadioGroupItem
- *   value="terms-accept"
- *   id="terms"
- *   required
- *   aria-describedby="terms-error"
- * />
- * <Label htmlFor="terms">
- *   I accept the terms and conditions
- * </Label>
- * ```
- *
- * @param value The value given as data when submitted with a name (required)
- * @param disabled When true, prevents the user from interacting with the item
- * @param required When true, indicates that the user must check the item before the owning form can be submitted
- * @param asChild Change the default rendered element for the one passed as a child @default false
- * @param id The id attribute for accessibility (should match Label's htmlFor)
- * @param className Additional CSS classes for custom styling
- * @param children Content to render inside the radio item (typically empty as styling is handled by the indicator)
- *
- * @accessibility
- * - Receives focus management from parent RadioGroup component
- * - Arrow keys navigate between radio options within the group
- * - Space key selects the focused radio item
- * - Screen readers announce checked/unchecked state changes
- * - Focus visible indicator appears on keyboard navigation
- * - Proper ARIA attributes (role="radio", aria-checked) applied automatically
- * - Works with form validation and submission
- * - Supports required attribute for form validation
- *
- * @see {@link RadioGroup} for the parent container component that manages the group behavior
- * @see {@link RadioGroupIndicator} for the visual checked state indicator
- * @see {@link https://ui.shadcn.com/docs/components/radio-group} shadcn/ui Radio Group usage patterns
- * @see {@link https://www.radix-ui.com/primitives/docs/components/radio-group} Radix UI Radio Group Item documentation
- * @since 1.0.0
+ * Individual radio button item. Use with RadioGroup to create mutually exclusive selections.
+ * Automatically renders an indicator when checked.
  */
-declare function RadioGroupItem({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Item>): import("react/jsx-runtime").JSX.Element;
-/**
- * Visual indicator shown when a RadioGroupItem is in the checked state
- *
- * RadioGroupIndicator automatically appears inside RadioGroupItem when that item is selected.
- * It provides the visual feedback for the checked state using a filled circle icon.
- * The indicator is automatically managed by the RadioGroupItem and only renders when checked.
- *
- * This component is typically not used directly but is included in RadioGroupItem.
- * It can be customized or replaced using the asChild pattern if needed.
- *
- * @example Default usage (automatic within RadioGroupItem)
- * ```tsx
- * // RadioGroupIndicator is automatically included in RadioGroupItem
- * <RadioGroupItem value="selected" id="selected" />
- * ```
- *
- * @example Custom indicator with asChild
- * ```tsx
- * <RadioGroupItem value="custom" id="custom">
- *   <RadioGroupIndicator asChild>
- *     <CheckIcon className="size-3 text-primary" />
- *   </RadioGroupIndicator>
- * </RadioGroupItem>
- * ```
- *
- * @example Force mounted indicator (for animations)
- * ```tsx
- * <RadioGroupIndicator forceMount className="animate-scale-in" />
- * ```
- *
- * @param forceMount Used to force mounting when more control is needed. Useful when controlling animation with React animation libraries
- * @param asChild Change the default rendered element for the one passed as a child @default false
- * @param className Additional CSS classes for custom styling of the indicator
- * @param children Custom content to render instead of the default CircleIcon (when using asChild)
- *
- * @accessibility
- * - Automatically managed by RadioGroup state - no manual interaction needed
- * - Provides visual confirmation of selection for users who can see
- * - Works with high contrast mode and forced colors
- * - Scales appropriately with font size changes
- *
- * @see {@link RadioGroupItem} for the parent radio button component
- * @see {@link RadioGroup} for the container component
- * @since 1.0.0
- */
-declare function RadioGroupIndicator({ className, ...props }: React.ComponentProps<typeof RadioGroupPrimitive.Indicator>): import("react/jsx-runtime").JSX.Element;
-export { RadioGroup, RadioGroupItem, RadioGroupIndicator };
+declare function RadioGroupItem({ className, ...props }: RadioGroupItemProps): import("react/jsx-runtime").JSX.Element;
+export { RadioGroup, RadioGroupItem, type RadioGroupProps, type RadioGroupItemProps, };
 //# sourceMappingURL=radio-group.d.ts.map

package/dist/components/ui/radio-group.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/radio-group.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,mBAAmB,MAAM,6BAA6B,CAAC;AA6DnE;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6IG;AACH,iBAAS,UAAU,CAAC,EAClB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,2CAQvD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6FG;AACH,iBAAS,cAAc,CAAC,EACtB,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,IAAI,CAAC,2CAavD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,iBAAS,mBAAmB,CAAC,EAC3B,SAAS,EACT,GAAG,KAAK,EACT,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,mBAAmB,CAAC,SAAS,CAAC,2CAU5D;AAED,OAAO,EAAE,UAAU,EAAE,cAAc,EAAE,mBAAmB,EAAE,CAAC"}
+{"version":3,"file":"radio-group.d.ts","sourceRoot":"","sources":["../../../src/components/ui/radio-group.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,IAAI,cAAc,EAAE,MAAM,sBAAsB,CAAC;AAC/D,OAAO,EAAE,UAAU,IAAI,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAK/E,KAAK,eAAe,GAAG,mBAAmB,CAAC,KAAK,CAAC;AAEjD;;;GAGG;AACH,iBAAS,UAAU,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,eAAe,2CAQ3D;AAED,KAAK,mBAAmB,GAAG,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;AAErD;;;GAGG;AACH,iBAAS,cAAc,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAE,EAAE,mBAAmB,2CAkBnE;AAED,OAAO,EACL,UAAU,EACV,cAAc,EACd,KAAK,eAAe,EACpB,KAAK,mBAAmB,GACzB,CAAC"}

package/dist/components/ui/radio-group.js

@@ -0,0 +1,42 @@
+import { jsx } from "react/jsx-runtime";
+import { cn } from "../../lib/utils.js";
+import { RadioGroup as RadioGroup$1 } from "../../node_modules/@base-ui/react/esm/radio-group/RadioGroup.js";
+import Circle from "../../node_modules/lucide-react/dist/esm/icons/circle.js";
+import { RadioRoot } from "../../node_modules/@base-ui/react/esm/radio/root/RadioRoot.js";
+import { RadioIndicator } from "../../node_modules/@base-ui/react/esm/radio/indicator/RadioIndicator.js";
+function RadioGroup({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    RadioGroup$1,
+    {
+      "data-slot": "radio-group",
+      className: cn("grid gap-3 w-full", className),
+      ...props
+    }
+  );
+}
+function RadioGroupItem({ className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    RadioRoot,
+    {
+      "data-slot": "radio-group-item",
+      className: cn(
+        "border-input text-primary dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex size-4 rounded-full shadow-xs focus-visible:ring-[3px] aria-invalid:ring-[3px] group/radio-group-item peer relative aspect-square shrink-0 border outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50",
+        className
+      ),
+      ...props,
+      children: /* @__PURE__ */ jsx(
+        RadioIndicator,
+        {
+          "data-slot": "radio-group-indicator",
+          className: "group-aria-invalid/radio-group-item:text-destructive text-primary flex size-4 items-center justify-center",
+          children: /* @__PURE__ */ jsx(Circle, { className: "absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current" })
+        }
+      )
+    }
+  );
+}
+export {
+  RadioGroup,
+  RadioGroupItem
+};
+//# sourceMappingURL=radio-group.js.map

package/dist/components/ui/radio-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"radio-group.js","sources":["../../../src/components/ui/radio-group.tsx"],"sourcesContent":["import { Radio as RadioPrimitive } from \"@base-ui/react/radio\";\nimport { RadioGroup as RadioGroupPrimitive } from \"@base-ui/react/radio-group\";\n\nimport { cn } from \"@/lib/utils\";\nimport { CircleIcon } from \"lucide-react\";\n\ntype RadioGroupProps = RadioGroupPrimitive.Props;\n\n/**\n * Container for radio button items. Manages shared state and ensures only one option can be selected.\n * Supports controlled and uncontrolled usage.\n */\nfunction RadioGroup({ className, ...props }: RadioGroupProps) {\n  return (\n    <RadioGroupPrimitive\n      data-slot=\"radio-group\"\n      className={cn(\"grid gap-3 w-full\", className)}\n      {...props}\n    />\n  );\n}\n\ntype RadioGroupItemProps = RadioPrimitive.Root.Props;\n\n/**\n * Individual radio button item. Use with RadioGroup to create mutually exclusive selections.\n * Automatically renders an indicator when checked.\n */\nfunction RadioGroupItem({ className, ...props }: RadioGroupItemProps) {\n  return (\n    <RadioPrimitive.Root\n      data-slot=\"radio-group-item\"\n      className={cn(\n        \"border-input text-primary dark:bg-input/30 focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive dark:aria-invalid:border-destructive/50 flex size-4 rounded-full shadow-xs focus-visible:ring-[3px] aria-invalid:ring-[3px] group/radio-group-item peer relative aspect-square shrink-0 border outline-none after:absolute after:-inset-x-3 after:-inset-y-2 disabled:cursor-not-allowed disabled:opacity-50\",\n        className,\n      )}\n      {...props}\n    >\n      <RadioPrimitive.Indicator\n        data-slot=\"radio-group-indicator\"\n        className=\"group-aria-invalid/radio-group-item:text-destructive text-primary flex size-4 items-center justify-center\"\n      >\n        <CircleIcon className=\"absolute top-1/2 left-1/2 size-2 -translate-x-1/2 -translate-y-1/2 fill-current\" />\n      </RadioPrimitive.Indicator>\n    </RadioPrimitive.Root>\n  );\n}\n\nexport {\n  RadioGroup,\n  RadioGroupItem,\n  type RadioGroupProps,\n  type RadioGroupItemProps,\n};\n"],"names":["RadioGroupPrimitive","RadioPrimitive.Root","RadioPrimitive.Indicator","CircleIcon"],"mappings":";;;;;;AAYA,SAAS,WAAW,EAAE,WAAW,GAAG,SAA0B;AAC5D,SACE;AAAA,IAACA;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW,GAAG,qBAAqB,SAAS;AAAA,MAC3C,GAAG;AAAA,IAAA;AAAA,EAAA;AAGV;AAQA,SAAS,eAAe,EAAE,WAAW,GAAG,SAA8B;AACpE,SACE;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,aAAU;AAAA,MACV,WAAW;AAAA,QACT;AAAA,QACA;AAAA,MAAA;AAAA,MAED,GAAG;AAAA,MAEJ,UAAA;AAAA,QAACC;AAAAA,QAAA;AAAA,UACC,aAAU;AAAA,UACV,WAAU;AAAA,UAEV,UAAA,oBAACC,QAAA,EAAW,WAAU,kFAAA,CAAkF;AAAA,QAAA;AAAA,MAAA;AAAA,IAC1G;AAAA,EAAA;AAGN;"}