@mieweb/ui 0.2.4 → 0.3.0-dev.61

package/dist/{chunk-2J2V4TMJ.cjs → chunk-35J4B3ZK.cjs}

@@ -66,6 +66,7 @@ var Avatar = React__namespace.forwardRef(
       "div",
       {
         ref,
+        "data-slot": "avatar",
         className: chunkOR5DRJCW_cjs.cn(avatarVariants({ size, ring }), className),
         ...props,
         children: showImage ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -95,38 +96,47 @@ var AvatarGroup = React__namespace.forwardRef(
     const childrenArray = React__namespace.Children.toArray(children);
     const visibleChildren = max ? childrenArray.slice(0, max) : childrenArray;
     const remainingCount = max ? Math.max(0, childrenArray.length - max) : 0;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: chunkOR5DRJCW_cjs.cn("flex -space-x-2", className), ...props, children: [
-      visibleChildren.map((child, index) => {
-        if (React__namespace.isValidElement(child)) {
-          return React__namespace.cloneElement(
-            child,
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        ref,
+        "data-slot": "avatar-group",
+        className: chunkOR5DRJCW_cjs.cn("flex -space-x-2", className),
+        ...props,
+        children: [
+          visibleChildren.map((child, index) => {
+            if (React__namespace.isValidElement(child)) {
+              return React__namespace.cloneElement(
+                child,
+                {
+                  key: index,
+                  size,
+                  className: chunkOR5DRJCW_cjs.cn(
+                    "ring-2 ring-white dark:ring-neutral-900",
+                    child.props.className
+                  )
+                }
+              );
+            }
+            return child;
+          }),
+          remainingCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
+            "div",
             {
-              key: index,
-              size,
               className: chunkOR5DRJCW_cjs.cn(
-                "ring-2 ring-white dark:ring-neutral-900",
-                child.props.className
-              )
+                avatarVariants({ size }),
+                "bg-neutral-200 text-neutral-600 dark:bg-neutral-700 dark:text-neutral-300",
+                "ring-2 ring-white dark:ring-neutral-900"
+              ),
+              children: [
+                "+",
+                remainingCount
+              ]
             }
-          );
-        }
-        return child;
-      }),
-      remainingCount > 0 && /* @__PURE__ */ jsxRuntime.jsxs(
-        "div",
-        {
-          className: chunkOR5DRJCW_cjs.cn(
-            avatarVariants({ size }),
-            "bg-neutral-200 text-neutral-600 dark:bg-neutral-700 dark:text-neutral-300",
-            "ring-2 ring-white dark:ring-neutral-900"
-          ),
-          children: [
-            "+",
-            remainingCount
-          ]
-        }
-      )
-    ] });
+          )
+        ]
+      }
+    );
   }
 );
 AvatarGroup.displayName = "AvatarGroup";
@@ -135,5 +145,5 @@ exports.Avatar = Avatar;
 exports.AvatarGroup = AvatarGroup;
 exports.avatarVariants = avatarVariants;
 exports.getInitials = getInitials;
-//# sourceMappingURL=chunk-2J2V4TMJ.cjs.map
-//# sourceMappingURL=chunk-2J2V4TMJ.cjs.map
+//# sourceMappingURL=chunk-35J4B3ZK.cjs.map
+//# sourceMappingURL=chunk-35J4B3ZK.cjs.map

package/dist/chunk-35J4B3ZK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Avatar/Avatar.tsx"],"names":["cva","React","jsx","cn","jsxs"],"mappings":"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","file":"chunk-35J4B3ZK.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Avatar Component\n// ============================================================================\n\nconst avatarVariants = cva(\n  [\n    'relative inline-flex items-center justify-center',\n    'rounded-full overflow-hidden',\n    'bg-primary-800 text-white font-semibold',\n  ],\n  {\n    variants: {\n      size: {\n        xs: 'h-6 w-6 text-xs',\n        sm: 'h-8 w-8 text-sm',\n        md: 'h-10 w-10 text-sm',\n        lg: 'h-12 w-12 text-base',\n        xl: 'h-16 w-16 text-lg',\n      },\n      ring: {\n        true: 'ring-2 ring-primary-400/30',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      ring: false,\n    },\n  }\n);\n\nexport interface AvatarProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof avatarVariants> {\n  /** Image URL for the avatar */\n  src?: string | null;\n  /** Alt text for the avatar image */\n  alt?: string;\n  /** Name to generate initials from (used as fallback when no src) */\n  name?: string;\n  /** Custom fallback content (overrides name initials) */\n  fallback?: React.ReactElement | null;\n}\n\n/**\n * Get initials from a name string.\n */\nfunction getInitials(name: string): string {\n  return name\n    .split(' ')\n    .map((part) => part[0])\n    .join('')\n    .toUpperCase()\n    .slice(0, 2);\n}\n\n/**\n * An avatar component for displaying user profile images with fallback to initials.\n *\n * @example\n * ```tsx\n * // With image\n * <Avatar src=\"/user.jpg\" alt=\"John Doe\" />\n *\n * // With initials fallback\n * <Avatar name=\"John Doe\" />\n *\n * // With custom fallback\n * <Avatar fallback={<UserIcon />} />\n * ```\n */\nconst Avatar = React.forwardRef<HTMLDivElement, AvatarProps>(\n  ({ className, src, alt, name, fallback, size, ring, ...props }, ref) => {\n    const [imageError, setImageError] = React.useState(false);\n\n    // Reset error state when src changes\n    React.useEffect(() => {\n      setImageError(false);\n    }, [src]);\n\n    const showImage = src && !imageError;\n    const initials = name ? getInitials(name) : null;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"avatar\"\n        className={cn(avatarVariants({ size, ring }), className)}\n        {...props}\n      >\n        {showImage ? (\n          <img\n            src={src}\n            alt={alt || name || 'Avatar'}\n            className=\"h-full w-full object-cover\"\n            onError={() => setImageError(true)}\n          />\n        ) : React.isValidElement(fallback) ? (\n          fallback\n        ) : initials ? (\n          initials\n        ) : (\n          <svg\n            className=\"h-[60%] w-[60%] text-white/80\"\n            fill=\"currentColor\"\n            viewBox=\"0 0 24 24\"\n          >\n            <path d=\"M12 12c2.21 0 4-1.79 4-4s-1.79-4-4-4-4 1.79-4 4 1.79 4 4 4zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z\" />\n          </svg>\n        )}\n      </div>\n    );\n  }\n);\n\nAvatar.displayName = 'Avatar';\n\n// ============================================================================\n// Avatar Group Component\n// ============================================================================\n\nexport interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Maximum number of avatars to show before +N indicator */\n  max?: number;\n  /** Size of avatars in the group */\n  size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n  /** Children should be Avatar components */\n  children: React.ReactNode;\n}\n\n/**\n * A component for displaying a group of overlapping avatars.\n *\n * @example\n * ```tsx\n * <AvatarGroup max={3}>\n *   <Avatar name=\"John Doe\" />\n *   <Avatar name=\"Jane Smith\" />\n *   <Avatar name=\"Bob Wilson\" />\n *   <Avatar name=\"Alice Brown\" />\n * </AvatarGroup>\n * ```\n */\nconst AvatarGroup = React.forwardRef<HTMLDivElement, AvatarGroupProps>(\n  ({ className, max, size = 'md', children, ...props }, ref) => {\n    const childrenArray = React.Children.toArray(children);\n    const visibleChildren = max ? childrenArray.slice(0, max) : childrenArray;\n    const remainingCount = max ? Math.max(0, childrenArray.length - max) : 0;\n\n    return (\n      <div\n        ref={ref}\n        data-slot=\"avatar-group\"\n        className={cn('flex -space-x-2', className)}\n        {...props}\n      >\n        {visibleChildren.map((child, index) => {\n          if (React.isValidElement(child)) {\n            return React.cloneElement(\n              child as React.ReactElement<AvatarProps>,\n              {\n                key: index,\n                size,\n                className: cn(\n                  'ring-2 ring-white dark:ring-neutral-900',\n                  (child as React.ReactElement<AvatarProps>).props.className\n                ),\n              }\n            );\n          }\n          return child;\n        })}\n        {remainingCount > 0 && (\n          <div\n            className={cn(\n              avatarVariants({ size }),\n              'bg-neutral-200 text-neutral-600 dark:bg-neutral-700 dark:text-neutral-300',\n              'ring-2 ring-white dark:ring-neutral-900'\n            )}\n          >\n            +{remainingCount}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nAvatarGroup.displayName = 'AvatarGroup';\n\nexport { Avatar, AvatarGroup, avatarVariants, getInitials };\n"]}

package/dist/{chunk-B5364UWR.cjs → chunk-3DBRHYTN.cjs}

@@ -12,5 +12,5 @@ var brands = {
 };
 
 exports.brands = brands;
-//# sourceMappingURL=chunk-B5364UWR.cjs.map
-//# sourceMappingURL=chunk-B5364UWR.cjs.map
+//# sourceMappingURL=chunk-3DBRHYTN.cjs.map
+//# sourceMappingURL=chunk-3DBRHYTN.cjs.map

package/dist/{chunk-B5364UWR.cjs.map → chunk-3DBRHYTN.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/brands/index.ts"],"names":[],"mappings":";;;AAiCO,IAAM,MAAA,GAAS;AAAA,EACpB,QAAA,EAAU,MAAM,OAAO,uBAAY,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,aAAa,CAAA;AAAA,EAChE,OAAA,EAAS,MAAM,OAAO,wBAAW,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,YAAY,CAAA;AAAA,EAC7D,mBAAA,EAAqB,MACnB,OAAO,kCAAqB,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,qBAAqB,CAAA;AAAA,EACnE,MAAA,EAAQ,MAAM,OAAO,uBAAU,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,WAAW,CAAA;AAAA,EAC1D,MAAA,EAAQ,MAAM,OAAO,qBAAU,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,WAAW,CAAA;AAAA,EAC1D,UAAA,EAAY,MAAM,OAAO,2BAAc,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,eAAe,CAAA;AAAA,EACtE,QAAA,EAAU,MAAM,OAAO,yBAAY,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,aAAa;AAClE","file":"chunk-B5364UWR.cjs","sourcesContent":["/**\n * @mieweb/ui Brand System\n *\n * Export all brand-related types, utilities, and configurations.\n */\n\n// Types and utilities\nexport type {\n  BrandConfig,\n  BrandColors,\n  BrandTypography,\n  BrandBorderRadius,\n  BrandBoxShadow,\n  ColorScale,\n  SemanticColors,\n} from './types';\n\nexport {\n  generateBrandCSS,\n  generateTailwindTheme,\n  createBrandPreset,\n} from './types';\n\n// Brand configurations\nexport { bluehiveBrand } from './bluehive';\nexport { defaultBrand } from './default';\nexport { enterpriseHealthBrand } from './enterprise-health';\nexport { miewebBrand } from './mieweb';\nexport { ozwellBrand } from './ozwell';\nexport { wagglelineBrand } from './waggleline';\nexport { webchartBrand } from './webchart';\n\n// All brands for iteration\nexport const brands = {\n  bluehive: () => import('./bluehive').then((m) => m.bluehiveBrand),\n  default: () => import('./default').then((m) => m.defaultBrand),\n  'enterprise-health': () =>\n    import('./enterprise-health').then((m) => m.enterpriseHealthBrand),\n  mieweb: () => import('./mieweb').then((m) => m.miewebBrand),\n  ozwell: () => import('./ozwell').then((m) => m.ozwellBrand),\n  waggleline: () => import('./waggleline').then((m) => m.wagglelineBrand),\n  webchart: () => import('./webchart').then((m) => m.webchartBrand),\n} as const;\n"]}
+{"version":3,"sources":["../src/brands/index.ts"],"names":[],"mappings":";;;AAiCO,IAAM,MAAA,GAAS;AAAA,EACpB,QAAA,EAAU,MAAM,OAAO,uBAAY,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,aAAa,CAAA;AAAA,EAChE,OAAA,EAAS,MAAM,OAAO,wBAAW,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,YAAY,CAAA;AAAA,EAC7D,mBAAA,EAAqB,MACnB,OAAO,kCAAqB,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,qBAAqB,CAAA;AAAA,EACnE,MAAA,EAAQ,MAAM,OAAO,uBAAU,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,WAAW,CAAA;AAAA,EAC1D,MAAA,EAAQ,MAAM,OAAO,qBAAU,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,WAAW,CAAA;AAAA,EAC1D,UAAA,EAAY,MAAM,OAAO,2BAAc,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,eAAe,CAAA;AAAA,EACtE,QAAA,EAAU,MAAM,OAAO,yBAAY,EAAE,IAAA,CAAK,CAAC,CAAA,KAAM,CAAA,CAAE,aAAa;AAClE","file":"chunk-3DBRHYTN.cjs","sourcesContent":["/**\n * @mieweb/ui Brand System\n *\n * Export all brand-related types, utilities, and configurations.\n */\n\n// Types and utilities\nexport type {\n  BrandConfig,\n  BrandColors,\n  BrandTypography,\n  BrandBorderRadius,\n  BrandBoxShadow,\n  ColorScale,\n  SemanticColors,\n} from './types';\n\nexport {\n  generateBrandCSS,\n  generateTailwindTheme,\n  createBrandPreset,\n} from './types';\n\n// Brand configurations\nexport { bluehiveBrand } from './bluehive';\nexport { defaultBrand } from './default';\nexport { enterpriseHealthBrand } from './enterprise-health';\nexport { miewebBrand } from './mieweb';\nexport { ozwellBrand } from './ozwell';\nexport { wagglelineBrand } from './waggleline';\nexport { webchartBrand } from './webchart';\n\n// All brands for iteration\nexport const brands = {\n  bluehive: () => import('./bluehive').then((m) => m.bluehiveBrand),\n  default: () => import('./default').then((m) => m.defaultBrand),\n  'enterprise-health': () =>\n    import('./enterprise-health').then((m) => m.enterpriseHealthBrand),\n  mieweb: () => import('./mieweb').then((m) => m.miewebBrand),\n  ozwell: () => import('./ozwell').then((m) => m.ozwellBrand),\n  waggleline: () => import('./waggleline').then((m) => m.wagglelineBrand),\n  webchart: () => import('./webchart').then((m) => m.webchartBrand),\n} as const;\n"]}

package/dist/{chunk-JFAXLE2J.js → chunk-3DM6LMZG.js}

@@ -39,7 +39,7 @@ function Tabs({
     TabsContext.Provider,
     {
       value: { value, onValueChange: handleValueChange, variant },
-      children: /* @__PURE__ */ jsx("div", { className: cn("w-full", className), children })
+      children: /* @__PURE__ */ jsx("div", { "data-slot": "tabs", className: cn("w-full", className), children })
     }
   );
 }
@@ -110,6 +110,7 @@ var TabsList = React.forwardRef(
           }
         },
         role: "tablist",
+        "data-slot": "tabs-list",
         tabIndex: 0,
         onKeyDown: handleKeyDown,
         className: cn(tabsListVariants({ variant }), className),
@@ -164,6 +165,7 @@ var TabsTrigger = React.forwardRef(
         ref,
         type: "button",
         role: "tab",
+        "data-slot": "tabs-trigger",
         "aria-selected": isSelected,
         "aria-controls": `tabpanel-${value}`,
         id: `tab-${value}`,
@@ -174,7 +176,7 @@ var TabsTrigger = React.forwardRef(
         className: cn(tabsTriggerVariants({ variant }), className),
         ...props,
         children: [
-          icon && /* @__PURE__ */ jsx("span", { className: "shrink-0", children: icon }),
+          icon && /* @__PURE__ */ jsx("span", { "data-slot": "tabs-trigger-icon", className: "shrink-0", children: icon }),
           children
         ]
       }
@@ -194,6 +196,7 @@ var TabsContent = React.forwardRef(
       {
         ref,
         role: "tabpanel",
+        "data-slot": "tabs-content",
         id: `tabpanel-${value}`,
         "aria-labelledby": `tab-${value}`,
         tabIndex: 0,
@@ -213,5 +216,5 @@ var TabsContent = React.forwardRef(
 TabsContent.displayName = "TabsContent";
 
 export { Tabs, TabsContent, TabsList, TabsTrigger, tabsListVariants, tabsTriggerVariants };
-//# sourceMappingURL=chunk-JFAXLE2J.js.map
-//# sourceMappingURL=chunk-JFAXLE2J.js.map
+//# sourceMappingURL=chunk-3DM6LMZG.js.map
+//# sourceMappingURL=chunk-3DM6LMZG.js.map

package/dist/chunk-3DM6LMZG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Tabs/Tabs.tsx"],"names":[],"mappings":"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","file":"chunk-3DM6LMZG.js","sourcesContent":["import * as React from 'react';\nimport { cva } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\n// ============================================================================\n// Tabs Context\n// ============================================================================\n\ninterface TabsContextValue {\n  value: string;\n  onValueChange: (value: string) => void;\n  variant: 'underline' | 'pills' | 'enclosed';\n}\n\nconst TabsContext = React.createContext<TabsContextValue | undefined>(\n  undefined\n);\n\nfunction useTabsContext() {\n  const context = React.useContext(TabsContext);\n  if (!context) {\n    throw new Error('Tabs components must be used within a Tabs provider');\n  }\n  return context;\n}\n\n// ============================================================================\n// Tabs Root\n// ============================================================================\n\nexport interface TabsProps {\n  /** The controlled value of the selected tab */\n  value?: string;\n  /** The default value of the selected tab (uncontrolled) */\n  defaultValue?: string;\n  /** Callback when the selected tab changes */\n  onValueChange?: (value: string) => void;\n  /** Visual variant of the tabs */\n  variant?: 'underline' | 'pills' | 'enclosed';\n  /** Tab content */\n  children: React.ReactNode;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * Accessible tabs component with keyboard navigation.\n *\n * @example\n * ```tsx\n * <Tabs defaultValue=\"tab1\">\n *   <TabsList>\n *     <TabsTrigger value=\"tab1\">Tab 1</TabsTrigger>\n *     <TabsTrigger value=\"tab2\">Tab 2</TabsTrigger>\n *   </TabsList>\n *   <TabsContent value=\"tab1\">Content 1</TabsContent>\n *   <TabsContent value=\"tab2\">Content 2</TabsContent>\n * </Tabs>\n * ```\n */\nfunction Tabs({\n  value: controlledValue,\n  defaultValue,\n  onValueChange,\n  variant = 'underline',\n  children,\n  className,\n}: TabsProps) {\n  const [uncontrolledValue, setUncontrolledValue] = React.useState(\n    defaultValue || ''\n  );\n\n  const isControlled = controlledValue !== undefined;\n  const value = isControlled ? controlledValue : uncontrolledValue;\n\n  const handleValueChange = React.useCallback(\n    (newValue: string) => {\n      if (!isControlled) {\n        setUncontrolledValue(newValue);\n      }\n      onValueChange?.(newValue);\n    },\n    [isControlled, onValueChange]\n  );\n\n  return (\n    <TabsContext.Provider\n      value={{ value, onValueChange: handleValueChange, variant }}\n    >\n      <div data-slot=\"tabs\" className={cn('w-full', className)}>\n        {children}\n      </div>\n    </TabsContext.Provider>\n  );\n}\n\nTabs.displayName = 'Tabs';\n\n// ============================================================================\n// Tabs List\n// ============================================================================\n\nconst tabsListVariants = cva(['flex items-center'], {\n  variants: {\n    variant: {\n      underline: 'border-b border-border gap-0',\n      pills: 'gap-1 p-1 rounded-lg bg-muted',\n      enclosed: 'gap-0 border-b border-border',\n    },\n  },\n  defaultVariants: {\n    variant: 'underline',\n  },\n});\n\nexport type TabsListProps = React.HTMLAttributes<HTMLDivElement>;\n\n/**\n * Container for tab triggers.\n */\nconst TabsList = React.forwardRef<HTMLDivElement, TabsListProps>(\n  ({ className, ...props }, ref) => {\n    const { variant } = useTabsContext();\n    const listRef = React.useRef<HTMLDivElement>(null);\n\n    // Keyboard navigation\n    const handleKeyDown = React.useCallback(\n      (e: React.KeyboardEvent<HTMLDivElement>) => {\n        const list = listRef.current;\n        if (!list) return;\n\n        const triggers = Array.from(\n          list.querySelectorAll<HTMLButtonElement>(\n            '[role=\"tab\"]:not([disabled])'\n          )\n        );\n        const currentIndex = triggers.findIndex(\n          (trigger) => trigger === document.activeElement\n        );\n\n        let nextIndex: number;\n\n        switch (e.key) {\n          case 'ArrowRight':\n          case 'ArrowDown':\n            e.preventDefault();\n            nextIndex =\n              currentIndex === triggers.length - 1 ? 0 : currentIndex + 1;\n            triggers[nextIndex]?.focus();\n            break;\n          case 'ArrowLeft':\n          case 'ArrowUp':\n            e.preventDefault();\n            nextIndex =\n              currentIndex === 0 ? triggers.length - 1 : currentIndex - 1;\n            triggers[nextIndex]?.focus();\n            break;\n          case 'Home':\n            e.preventDefault();\n            triggers[0]?.focus();\n            break;\n          case 'End':\n            e.preventDefault();\n            triggers[triggers.length - 1]?.focus();\n            break;\n        }\n      },\n      []\n    );\n\n    return (\n      <div\n        ref={(node) => {\n          // Combine refs\n          (listRef as React.MutableRefObject<HTMLDivElement | null>).current =\n            node;\n          if (typeof ref === 'function') {\n            ref(node);\n          } else if (ref) {\n            ref.current = node;\n          }\n        }}\n        role=\"tablist\"\n        data-slot=\"tabs-list\"\n        tabIndex={0}\n        onKeyDown={handleKeyDown}\n        className={cn(tabsListVariants({ variant }), className)}\n        {...props}\n      />\n    );\n  }\n);\n\nTabsList.displayName = 'TabsList';\n\n// ============================================================================\n// Tabs Trigger\n// ============================================================================\n\nconst tabsTriggerVariants = cva(\n  [\n    'inline-flex items-center justify-center gap-2',\n    'font-medium transition-all duration-200',\n    'whitespace-nowrap',\n    'focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2',\n    'disabled:pointer-events-none disabled:opacity-50',\n  ],\n  {\n    variants: {\n      variant: {\n        underline: [\n          'px-4 py-2 -mb-px',\n          'border-b-2 border-transparent',\n          'text-muted-foreground hover:text-foreground',\n          'data-[state=active]:border-primary-700 data-[state=active]:text-primary-800',\n        ],\n        pills: [\n          'px-3 py-1.5 rounded-md text-sm',\n          'text-muted-foreground hover:text-foreground',\n          'data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm',\n        ],\n        enclosed: [\n          'px-4 py-2 -mb-px',\n          'border border-transparent rounded-t-lg',\n          'text-muted-foreground hover:text-foreground',\n          'data-[state=active]:border-border data-[state=active]:border-b-background data-[state=active]:bg-background data-[state=active]:text-foreground',\n        ],\n      },\n    },\n    defaultVariants: {\n      variant: 'underline',\n    },\n  }\n);\n\nexport interface TabsTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {\n  /** The value that identifies this tab */\n  value: string;\n  /** Icon to show before the label */\n  icon?: React.ReactNode;\n}\n\n/**\n * A tab trigger button.\n */\nconst TabsTrigger = React.forwardRef<HTMLButtonElement, TabsTriggerProps>(\n  ({ className, value, icon, children, disabled, ...props }, ref) => {\n    const { value: selectedValue, onValueChange, variant } = useTabsContext();\n    const isSelected = selectedValue === value;\n\n    return (\n      <button\n        ref={ref}\n        type=\"button\"\n        role=\"tab\"\n        data-slot=\"tabs-trigger\"\n        aria-selected={isSelected}\n        aria-controls={`tabpanel-${value}`}\n        id={`tab-${value}`}\n        tabIndex={isSelected ? 0 : -1}\n        data-state={isSelected ? 'active' : 'inactive'}\n        disabled={disabled}\n        onClick={() => onValueChange(value)}\n        className={cn(tabsTriggerVariants({ variant }), className)}\n        {...props}\n      >\n        {icon && (\n          <span data-slot=\"tabs-trigger-icon\" className=\"shrink-0\">\n            {icon}\n          </span>\n        )}\n        {children}\n      </button>\n    );\n  }\n);\n\nTabsTrigger.displayName = 'TabsTrigger';\n\n// ============================================================================\n// Tabs Content\n// ============================================================================\n\nexport interface TabsContentProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** The value that identifies this content panel */\n  value: string;\n  /** Force mount the content (useful for animations) */\n  forceMount?: boolean;\n}\n\n/**\n * Content panel for a tab.\n */\nconst TabsContent = React.forwardRef<HTMLDivElement, TabsContentProps>(\n  ({ className, value, forceMount = false, children, ...props }, ref) => {\n    const { value: selectedValue } = useTabsContext();\n    const isSelected = selectedValue === value;\n\n    if (!isSelected && !forceMount) {\n      return null;\n    }\n\n    return (\n      <div\n        ref={ref}\n        role=\"tabpanel\"\n        data-slot=\"tabs-content\"\n        id={`tabpanel-${value}`}\n        aria-labelledby={`tab-${value}`}\n        tabIndex={0}\n        hidden={!isSelected}\n        data-state={isSelected ? 'active' : 'inactive'}\n        className={cn(\n          'focus-visible:ring-ring mt-4 rounded-lg focus-visible:ring-2 focus-visible:outline-none',\n          !isSelected && 'hidden',\n          className\n        )}\n        {...props}\n      >\n        {children}\n      </div>\n    );\n  }\n);\n\nTabsContent.displayName = 'TabsContent';\n\nexport {\n  Tabs,\n  TabsList,\n  TabsTrigger,\n  TabsContent,\n  tabsListVariants,\n  tabsTriggerVariants,\n};\n"]}

package/dist/{chunk-N3QTYHRZ.cjs → chunk-3GGET5LK.cjs}

@@ -35,6 +35,7 @@ function Skeleton({
   return /* @__PURE__ */ jsxRuntime.jsx(
     "div",
     {
+      "data-slot": "skeleton",
       className: chunkOR5DRJCW_cjs.cn(
         skeletonVariants({ variant }),
         circle && "rounded-full",
@@ -62,16 +63,24 @@ function SkeletonText({
     md: "space-y-3",
     lg: "space-y-4"
   };
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: chunkOR5DRJCW_cjs.cn(gapClasses[gap], className), "aria-hidden": "true", children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
-    Skeleton,
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
     {
-      variant: "text",
-      style: {
-        width: index === lines - 1 ? lastLineWidth : "100%"
-      }
-    },
-    index
-  )) });
+      "data-slot": "skeleton-text",
+      className: chunkOR5DRJCW_cjs.cn(gapClasses[gap], className),
+      "aria-hidden": "true",
+      children: Array.from({ length: lines }).map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+        Skeleton,
+        {
+          variant: "text",
+          style: {
+            width: index === lines - 1 ? lastLineWidth : "100%"
+          }
+        },
+        index
+      ))
+    }
+  );
 }
 SkeletonText.displayName = "SkeletonText";
 function SkeletonCard({
@@ -83,6 +92,7 @@ function SkeletonCard({
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
+      "data-slot": "skeleton-card",
       className: chunkOR5DRJCW_cjs.cn(
         "border-border bg-card space-y-4 rounded-xl border p-4",
         className
@@ -111,17 +121,25 @@ function SkeletonTable({
   columns = 4,
   className
 }) {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkOR5DRJCW_cjs.cn("space-y-3", className), "aria-hidden": "true", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "text", className: "h-5 flex-1" }, `header-${i}`)) }),
-    Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsxRuntime.jsx(
-      Skeleton,
-      {
-        variant: "text",
-        className: "flex-1"
-      },
-      `cell-${rowIndex}-${colIndex}`
-    )) }, `row-${rowIndex}`))
-  ] });
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      "data-slot": "skeleton-table",
+      className: chunkOR5DRJCW_cjs.cn("space-y-3", className),
+      "aria-hidden": "true",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_, i) => /* @__PURE__ */ jsxRuntime.jsx(Skeleton, { variant: "text", className: "h-5 flex-1" }, `header-${i}`)) }),
+        Array.from({ length: rows }).map((_, rowIndex) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: Array.from({ length: columns }).map((_2, colIndex) => /* @__PURE__ */ jsxRuntime.jsx(
+          Skeleton,
+          {
+            variant: "text",
+            className: "flex-1"
+          },
+          `cell-${rowIndex}-${colIndex}`
+        )) }, `row-${rowIndex}`))
+      ]
+    }
+  );
 }
 SkeletonTable.displayName = "SkeletonTable";
 
@@ -130,5 +148,5 @@ exports.SkeletonCard = SkeletonCard;
 exports.SkeletonTable = SkeletonTable;
 exports.SkeletonText = SkeletonText;
 exports.skeletonVariants = skeletonVariants;
-//# sourceMappingURL=chunk-N3QTYHRZ.cjs.map
-//# sourceMappingURL=chunk-N3QTYHRZ.cjs.map
+//# sourceMappingURL=chunk-3GGET5LK.cjs.map
+//# sourceMappingURL=chunk-3GGET5LK.cjs.map

package/dist/chunk-3GGET5LK.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"names":["cva","jsx","cn","jsxs","_"],"mappings":"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","file":"chunk-3GGET5LK.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst skeletonVariants = cva(\n  ['animate-pulse rounded-md bg-neutral-200 dark:bg-neutral-700'],\n  {\n    variants: {\n      variant: {\n        default: '',\n        text: 'h-4',\n        title: 'h-6',\n        avatar: 'rounded-full',\n        button: 'h-10 w-24',\n        card: 'h-40',\n        image: 'aspect-video',\n      },\n    },\n    defaultVariants: {\n      variant: 'default',\n    },\n  }\n);\n\nexport interface SkeletonProps\n  extends\n    React.HTMLAttributes<HTMLDivElement>,\n    VariantProps<typeof skeletonVariants> {\n  /** Width of the skeleton */\n  width?: string | number;\n  /** Height of the skeleton */\n  height?: string | number;\n  /** Whether to render as a circle */\n  circle?: boolean;\n}\n\n/**\n * A skeleton loading placeholder component.\n *\n * @example\n * ```tsx\n * <Skeleton variant=\"text\" width=\"60%\" />\n * <Skeleton variant=\"avatar\" width={40} height={40} />\n * <Skeleton variant=\"card\" />\n * ```\n */\nfunction Skeleton({\n  className,\n  variant,\n  width,\n  height,\n  circle,\n  style,\n  ...props\n}: SkeletonProps) {\n  return (\n    <div\n      data-slot=\"skeleton\"\n      className={cn(\n        skeletonVariants({ variant }),\n        circle && 'rounded-full',\n        className\n      )}\n      style={{\n        width: typeof width === 'number' ? `${width}px` : width,\n        height: typeof height === 'number' ? `${height}px` : height,\n        ...style,\n      }}\n      aria-hidden=\"true\"\n      {...props}\n    />\n  );\n}\n\nSkeleton.displayName = 'Skeleton';\n\n// ============================================================================\n// Skeleton Text\n// ============================================================================\n\nexport interface SkeletonTextProps {\n  /** Number of lines to display */\n  lines?: number;\n  /** Width of the last line (for varying line lengths) */\n  lastLineWidth?: string;\n  /** Gap between lines */\n  gap?: 'sm' | 'md' | 'lg';\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for text content with multiple lines.\n *\n * @example\n * ```tsx\n * <SkeletonText lines={3} lastLineWidth=\"60%\" />\n * ```\n */\nfunction SkeletonText({\n  lines = 3,\n  lastLineWidth = '60%',\n  gap = 'sm',\n  className,\n}: SkeletonTextProps) {\n  const gapClasses = {\n    sm: 'space-y-2',\n    md: 'space-y-3',\n    lg: 'space-y-4',\n  };\n\n  return (\n    <div\n      data-slot=\"skeleton-text\"\n      className={cn(gapClasses[gap], className)}\n      aria-hidden=\"true\"\n    >\n      {Array.from({ length: lines }).map((_, index) => (\n        <Skeleton\n          key={index}\n          variant=\"text\"\n          style={{\n            width: index === lines - 1 ? lastLineWidth : '100%',\n          }}\n        />\n      ))}\n    </div>\n  );\n}\n\nSkeletonText.displayName = 'SkeletonText';\n\n// ============================================================================\n// Skeleton Card\n// ============================================================================\n\nexport interface SkeletonCardProps {\n  /** Show image placeholder */\n  showImage?: boolean;\n  /** Show avatar placeholder */\n  showAvatar?: boolean;\n  /** Number of text lines */\n  textLines?: number;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for card-like content.\n *\n * @example\n * ```tsx\n * <SkeletonCard showImage showAvatar textLines={2} />\n * ```\n */\nfunction SkeletonCard({\n  showImage = true,\n  showAvatar = false,\n  textLines = 2,\n  className,\n}: SkeletonCardProps) {\n  return (\n    <div\n      data-slot=\"skeleton-card\"\n      className={cn(\n        'border-border bg-card space-y-4 rounded-xl border p-4',\n        className\n      )}\n      aria-hidden=\"true\"\n    >\n      {showImage && <Skeleton variant=\"image\" className=\"rounded-lg\" />}\n      <div className=\"space-y-3\">\n        {showAvatar && (\n          <div className=\"flex items-center gap-3\">\n            <Skeleton circle width={40} height={40} />\n            <div className=\"flex-1 space-y-2\">\n              <Skeleton variant=\"text\" width=\"50%\" />\n              <Skeleton variant=\"text\" width=\"30%\" />\n            </div>\n          </div>\n        )}\n        <Skeleton variant=\"title\" width=\"80%\" />\n        <SkeletonText lines={textLines} />\n      </div>\n    </div>\n  );\n}\n\nSkeletonCard.displayName = 'SkeletonCard';\n\n// ============================================================================\n// Skeleton Table Row\n// ============================================================================\n\nexport interface SkeletonTableProps {\n  /** Number of rows */\n  rows?: number;\n  /** Number of columns */\n  columns?: number;\n  /** Additional class name */\n  className?: string;\n}\n\n/**\n * A skeleton for table content.\n *\n * @example\n * ```tsx\n * <SkeletonTable rows={5} columns={4} />\n * ```\n */\nfunction SkeletonTable({\n  rows = 5,\n  columns = 4,\n  className,\n}: SkeletonTableProps) {\n  return (\n    <div\n      data-slot=\"skeleton-table\"\n      className={cn('space-y-3', className)}\n      aria-hidden=\"true\"\n    >\n      {/* Header */}\n      <div className=\"flex gap-4\">\n        {Array.from({ length: columns }).map((_, i) => (\n          <Skeleton key={`header-${i}`} variant=\"text\" className=\"h-5 flex-1\" />\n        ))}\n      </div>\n      {/* Rows */}\n      {Array.from({ length: rows }).map((_, rowIndex) => (\n        <div key={`row-${rowIndex}`} className=\"flex gap-4\">\n          {Array.from({ length: columns }).map((_, colIndex) => (\n            <Skeleton\n              key={`cell-${rowIndex}-${colIndex}`}\n              variant=\"text\"\n              className=\"flex-1\"\n            />\n          ))}\n        </div>\n      ))}\n    </div>\n  );\n}\n\nSkeletonTable.displayName = 'SkeletonTable';\n\nexport {\n  Skeleton,\n  SkeletonText,\n  SkeletonCard,\n  SkeletonTable,\n  skeletonVariants,\n};\n"]}

package/dist/{chunk-VV4N4WY6.cjs → chunk-3XK5GENF.cjs}

@@ -74,48 +74,74 @@ var Input = React__namespace.forwardRef(
     const helperId = `${inputId}-helper`;
     const describedByIds = [
       error ? errorId : null,
-      helperText ? helperId : null,
+      helperText && !error ? helperId : null,
       ariaDescribedBy
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: chunkOR5DRJCW_cjs.cn("flex flex-col gap-1.5", disabled && "opacity-50"), children: [
-      label && /* @__PURE__ */ jsxRuntime.jsxs(
-        "label",
-        {
-          htmlFor: inputId,
-          className: chunkOR5DRJCW_cjs.cn(
-            "text-foreground text-sm font-medium",
-            hideLabel && "sr-only"
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        "data-slot": "input-wrapper",
+        className: chunkOR5DRJCW_cjs.cn("flex flex-col gap-1.5", disabled && "opacity-50"),
+        children: [
+          label && /* @__PURE__ */ jsxRuntime.jsxs(
+            "label",
+            {
+              "data-slot": "input-label",
+              htmlFor: inputId,
+              className: chunkOR5DRJCW_cjs.cn(
+                "text-foreground text-sm font-medium",
+                hideLabel && "sr-only"
+              ),
+              children: [
+                label,
+                required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", "aria-hidden": "true", children: "*" })
+              ]
+            }
           ),
-          children: [
-            label,
-            required && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-destructive ml-1", "aria-hidden": "true", children: "*" })
-          ]
-        }
-      ),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "input",
-        {
-          id: inputId,
-          ref,
-          className: chunkOR5DRJCW_cjs.cn(
-            inputVariants({ size, hasError: hasError || !!error }),
-            className
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "input",
+            {
+              "data-slot": "input",
+              id: inputId,
+              ref,
+              className: chunkOR5DRJCW_cjs.cn(
+                inputVariants({ size, hasError: hasError || !!error }),
+                className
+              ),
+              "aria-invalid": hasError || !!error,
+              "aria-describedby": describedByIds || void 0,
+              required,
+              disabled,
+              ...props
+            }
           ),
-          "aria-invalid": hasError || !!error,
-          "aria-describedby": describedByIds || void 0,
-          required,
-          disabled,
-          ...props
-        }
-      ),
-      error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: errorId, className: "text-destructive text-sm", role: "alert", children: error }),
-      helperText && !error && /* @__PURE__ */ jsxRuntime.jsx("p", { id: helperId, className: "text-muted-foreground text-sm", children: helperText })
-    ] });
+          error && /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              id: errorId,
+              "data-slot": "input-error",
+              className: "text-destructive text-sm",
+              role: "alert",
+              children: error
+            }
+          ),
+          helperText && !error && /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
+            {
+              id: helperId,
+              "data-slot": "input-helper",
+              className: "text-muted-foreground text-sm",
+              children: helperText
+            }
+          )
+        ]
+      }
+    );
   }
 );
 Input.displayName = "Input";
 
 exports.Input = Input;
 exports.inputVariants = inputVariants;
-//# sourceMappingURL=chunk-VV4N4WY6.cjs.map
-//# sourceMappingURL=chunk-VV4N4WY6.cjs.map
+//# sourceMappingURL=chunk-3XK5GENF.cjs.map
+//# sourceMappingURL=chunk-3XK5GENF.cjs.map

package/dist/chunk-3XK5GENF.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/Input/Input.tsx"],"names":["cva","React","jsxs","cn","jsx"],"mappings":"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","file":"chunk-3XK5GENF.cjs","sourcesContent":["import * as React from 'react';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { cn } from '../../utils/cn';\n\nconst inputVariants = cva(\n  [\n    'w-full px-3 py-2',\n    'border border-input rounded-lg',\n    'bg-background text-foreground',\n    'placeholder:text-muted-foreground',\n    'transition-colors duration-200',\n    'focus:outline-none focus:ring-2 focus:ring-ring focus:border-transparent',\n    'disabled:cursor-not-allowed disabled:opacity-50',\n  ],\n  {\n    variants: {\n      size: {\n        sm: 'h-8 text-sm',\n        md: 'h-10 text-base',\n        lg: 'h-12 text-lg',\n      },\n      hasError: {\n        true: 'border-destructive focus:ring-destructive',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      hasError: false,\n    },\n  }\n);\n\nexport interface InputProps\n  extends\n    Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'>,\n    VariantProps<typeof inputVariants> {\n  /** Error message to display below the input */\n  error?: string;\n  /** Helper text to display below the input */\n  helperText?: string;\n  /** Label for the input */\n  label?: string;\n  /** Whether the label should be visually hidden (still accessible) */\n  hideLabel?: boolean;\n  /** Whether the input is required */\n  required?: boolean;\n}\n\n/**\n * A styled input component with support for labels, errors, and helper text.\n *\n * @example\n * ```tsx\n * <Input label=\"Email\" type=\"email\" placeholder=\"you@example.com\" />\n * <Input label=\"Password\" type=\"password\" error=\"Password is required\" hasError />\n * ```\n */\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      size,\n      hasError,\n      error,\n      helperText,\n      label,\n      hideLabel,\n      required,\n      disabled,\n      id,\n      'aria-describedby': ariaDescribedBy,\n      ...props\n    },\n    ref\n  ) => {\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n    const errorId = `${inputId}-error`;\n    const helperId = `${inputId}-helper`;\n\n    const describedByIds = [\n      error ? errorId : null,\n      helperText && !error ? helperId : null,\n      ariaDescribedBy,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <div\n        data-slot=\"input-wrapper\"\n        className={cn('flex flex-col gap-1.5', disabled && 'opacity-50')}\n      >\n        {label && (\n          <label\n            data-slot=\"input-label\"\n            htmlFor={inputId}\n            className={cn(\n              'text-foreground text-sm font-medium',\n              hideLabel && 'sr-only'\n            )}\n          >\n            {label}\n            {required && (\n              <span className=\"text-destructive ml-1\" aria-hidden=\"true\">\n                *\n              </span>\n            )}\n          </label>\n        )}\n        <input\n          data-slot=\"input\"\n          id={inputId}\n          ref={ref}\n          className={cn(\n            inputVariants({ size, hasError: hasError || !!error }),\n            className\n          )}\n          aria-invalid={hasError || !!error}\n          aria-describedby={describedByIds || undefined}\n          required={required}\n          disabled={disabled}\n          {...props}\n        />\n        {error && (\n          <p\n            id={errorId}\n            data-slot=\"input-error\"\n            className=\"text-destructive text-sm\"\n            role=\"alert\"\n          >\n            {error}\n          </p>\n        )}\n        {helperText && !error && (\n          <p\n            id={helperId}\n            data-slot=\"input-helper\"\n            className=\"text-muted-foreground text-sm\"\n          >\n            {helperText}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nInput.displayName = 'Input';\n\nexport { Input, inputVariants };\n"]}

package/dist/{chunk-OW2BWGST.js → chunk-4ASPCSWT.js}

@@ -73,6 +73,7 @@ function RadioGroup({
       children: /* @__PURE__ */ jsxs(
         "fieldset",
         {
+          "data-slot": "radio-group",
           role: "radiogroup",
           className: cn("flex flex-col gap-2", className),
           "aria-describedby": [description ? descriptionId : null, error ? errorId : null].filter(Boolean).join(" ") || void 0,
@@ -80,6 +81,7 @@ function RadioGroup({
             label && /* @__PURE__ */ jsx(
               "legend",
               {
+                "data-slot": "radio-group-legend",
                 className: cn(
                   "text-foreground font-medium",
                   size === "sm" && "text-xs",
@@ -93,6 +95,7 @@ function RadioGroup({
               "p",
               {
                 id: descriptionId,
+                "data-slot": "radio-group-description",
                 className: cn(
                   "text-muted-foreground",
                   size === "sm" && "text-[10px]",
@@ -105,6 +108,7 @@ function RadioGroup({
             /* @__PURE__ */ jsx(
               "div",
               {
+                "data-slot": "radio-group-items",
                 className: cn(
                   "flex gap-4",
                   orientation === "vertical" && "flex-col gap-3"
@@ -116,6 +120,7 @@ function RadioGroup({
               "p",
               {
                 id: errorId,
+                "data-slot": "radio-group-error",
                 className: cn(
                   "text-destructive",
                   size === "sm" && "text-xs",
@@ -157,41 +162,51 @@ var Radio = React.forwardRef(
         context.onChange(value);
       }
     }, [isDisabled, context, value]);
-    const radioElement = /* @__PURE__ */ jsxs("span", { className: "relative inline-flex items-center justify-center", children: [
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          ref,
-          id: radioId,
-          type: "radio",
-          name: context.name,
-          value,
-          checked: isChecked,
-          disabled: isDisabled,
-          onChange: handleChange,
-          "aria-describedby": description ? descriptionId : void 0,
-          className: cn(radioVariants({ size }), className),
-          ...props
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        "span",
-        {
-          className: cn(
-            "bg-primary-500 pointer-events-none absolute rounded-full transition-transform",
-            size === "sm" && "h-2 w-2",
-            size === "md" && "h-2.5 w-2.5",
-            size === "lg" && "h-3 w-3",
-            isChecked ? "scale-100" : "scale-0"
+    const radioElement = /* @__PURE__ */ jsxs(
+      "span",
+      {
+        "data-slot": "radio-indicator",
+        className: "relative inline-flex items-center justify-center",
+        children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref,
+              "data-slot": "radio",
+              id: radioId,
+              type: "radio",
+              name: context.name,
+              value,
+              checked: isChecked,
+              disabled: isDisabled,
+              onChange: handleChange,
+              "aria-describedby": description ? descriptionId : void 0,
+              className: cn(radioVariants({ size }), className),
+              ...props
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "radio-dot",
+              className: cn(
+                "bg-primary-500 pointer-events-none absolute rounded-full transition-transform",
+                size === "sm" && "h-2 w-2",
+                size === "md" && "h-2.5 w-2.5",
+                size === "lg" && "h-3 w-3",
+                isChecked ? "scale-100" : "scale-0"
+              )
+            }
           )
-        }
-      )
-    ] });
+        ]
+      }
+    );
     const labelElement = label && /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-0.5", children: [
       /* @__PURE__ */ jsx(
         "label",
         {
           htmlFor: radioId,
+          "data-slot": "radio-label",
           className: cn(
             "text-foreground cursor-pointer font-medium select-none",
             size === "sm" && "text-xs",
@@ -206,6 +221,7 @@ var Radio = React.forwardRef(
         "p",
         {
           id: descriptionId,
+          "data-slot": "radio-description",
           className: cn(
             "text-muted-foreground",
             size === "sm" && "text-[10px]",
@@ -219,6 +235,7 @@ var Radio = React.forwardRef(
     return /* @__PURE__ */ jsxs(
       "div",
       {
+        "data-slot": "radio-wrapper",
         className: cn(
           "flex items-start gap-3",
           labelPosition === "left" && "flex-row-reverse"
@@ -234,5 +251,5 @@ var Radio = React.forwardRef(
 Radio.displayName = "Radio";
 
 export { Radio, RadioGroup, radioVariants };
-//# sourceMappingURL=chunk-OW2BWGST.js.map
-//# sourceMappingURL=chunk-OW2BWGST.js.map
+//# sourceMappingURL=chunk-4ASPCSWT.js.map
+//# sourceMappingURL=chunk-4ASPCSWT.js.map