@mdigital_ui/ui 0.2.6 → 0.2.7

package/dist/accordion/index.js

@@ -1,5 +1,5 @@
-export { accordion_default as default } from '../chunk-22FIGRGO.js';
-import '../chunk-TUTOU4X6.js';
-import '../chunk-2OGZENFC.js';
+export { accordion_default as default } from '../chunk-CK6A2R66.js';
+import '../chunk-NTPWR57C.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/avatar/index.js

@@ -0,0 +1,4 @@
+export { Avatar, AvatarGroup, avatar_default as default } from '../chunk-UUP7YGOS.js';
+import '../chunk-NGYLRX6F.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/avatar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/badge/index.js

@@ -1,5 +1,5 @@
-export { badge_default as default } from '../chunk-AVPPV5OM.js';
-import '../chunk-TUTOU4X6.js';
-import '../chunk-2OGZENFC.js';
+export { badge_default as default } from '../chunk-JLS4MBHN.js';
+import '../chunk-NTPWR57C.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/breadcrumbs/index.js

@@ -1,7 +1,7 @@
-export { BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, breadcrumbs_default as default } from '../chunk-SGMIDNPI.js';
-import '../chunk-TWZ5LXLL.js';
-import '../chunk-EFMKUCGX.js';
-import '../chunk-TUTOU4X6.js';
-import '../chunk-2OGZENFC.js';
+export { BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, breadcrumbs_default as default } from '../chunk-INQI3UUI.js';
+import '../chunk-WVG3QQDN.js';
+import '../chunk-DH7R6NBG.js';
+import '../chunk-NTPWR57C.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/button/index.js

@@ -1,6 +1,6 @@
-export { button_default as default } from '../chunk-MLNIKNLI.js';
-import '../chunk-NQB4V5P7.js';
-import '../chunk-TUTOU4X6.js';
-import '../chunk-2OGZENFC.js';
+export { button_default as default } from '../chunk-YOG5GXIC.js';
+import '../chunk-QDHGE7IF.js';
+import '../chunk-NTPWR57C.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/button-group/index.js

@@ -1,4 +1,4 @@
-export { button_group_default as default } from '../chunk-7ODPSHIQ.js';
-import '../chunk-2OGZENFC.js';
+export { button_group_default as default } from '../chunk-3UCZ4GMN.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/card/index.js

@@ -1,4 +1,4 @@
-export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardImage, CardTitle, cardVariants, card_default as default } from '../chunk-TG2AECIN.js';
-import '../chunk-2OGZENFC.js';
+export { Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardImage, CardTitle, cardVariants, card_default as default } from '../chunk-MXDTUN3V.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/carousel/index.js

@@ -1,4 +1,4 @@
-export { carousel_default as default } from '../chunk-3QKPSJTV.js';
-import '../chunk-2OGZENFC.js';
+export { carousel_default as default } from '../chunk-HWFI4GJE.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/cascader/index.js

@@ -1,4 +1,4 @@
-export { cascader_default as default } from '../chunk-3WVJE5MF.js';
-import '../chunk-2OGZENFC.js';
+export { cascader_default as default } from '../chunk-2OUGJBXK.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/chart/index.js

@@ -1,4 +1,4 @@
-export { AreaChart, BarChart, ComposedChart, LineChart, PieChart, axisLineStyle, axisTickStyle, chartContainerVariants, cursorStyle, getChartColor, gridStyle, legendStyle, tooltipStyle } from '../chunk-Y2CXG3PT.js';
-import '../chunk-2OGZENFC.js';
+export { AreaChart, BarChart, ComposedChart, LineChart, PieChart, axisLineStyle, axisTickStyle, chartContainerVariants, cursorStyle, getChartColor, gridStyle, legendStyle, tooltipStyle } from '../chunk-C5YO5VZS.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/checkbox/index.js

@@ -1,5 +1,5 @@
-export { checkbox_default as default } from '../chunk-PQZB43VJ.js';
-import '../chunk-TUTOU4X6.js';
-import '../chunk-2OGZENFC.js';
+export { checkbox_default as default } from '../chunk-TTEBZZ3T.js';
+import '../chunk-NTPWR57C.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/checkbox-group/index.js

@@ -1,4 +1,4 @@
-export { checkbox_group_default as default } from '../chunk-7YPX6NJK.js';
-import '../chunk-2OGZENFC.js';
+export { checkbox_group_default as default } from '../chunk-4LSKRZOT.js';
+import '../chunk-NGYLRX6F.js';
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/{chunk-23BPDLT4.js → chunk-27QEPVKU.js}

@@ -1,8 +1,8 @@
-import { radioCheckedColorClasses } from './chunk-TUTOU4X6.js';
-import { cn } from './chunk-2OGZENFC.js';
+import { radioCheckedColorClasses } from './chunk-NTPWR57C.js';
+import { cn } from './chunk-NGYLRX6F.js';
 import { cva } from 'class-variance-authority';
-import React from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
+import React, { useId } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 
 var radioVariants = cva(
   "appearance-none rounded-full border-border border bg-background cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed outline-none",
@@ -35,22 +35,37 @@ var Radio = React.memo(
     error,
     className,
     ref,
+    classNames,
     ...props
   }) => {
-    const radioElement = /* @__PURE__ */ jsx(
-      "input",
-      {
-        ref,
-        type: "radio",
-        className: cn(
-          radioVariants({ color, size, error: !!error }),
-          className
-        ),
-        ...props
-      }
-    );
+    const uniqueId = useId();
+    const helperId = `radio-helper-${uniqueId}`;
+    const hasHelperText = !!(helperText || error);
+    const radioElement = /* @__PURE__ */ jsxs("div", { className: "relative inline-flex", children: [
+      /* @__PURE__ */ jsx(
+        "input",
+        {
+          ref,
+          type: "radio",
+          className: cn(
+            "radio_radio",
+            radioVariants({ color, size, error: !!error }),
+            className,
+            classNames?.radio
+          ),
+          "aria-invalid": !!error || void 0,
+          "aria-describedby": hasHelperText ? helperId : void 0,
+          ...props
+        }
+      ),
+      /* @__PURE__ */ jsx("div", { className: cn(
+        "radio_indicator",
+        "absolute inset-0 pointer-events-none",
+        classNames?.indicator
+      ) })
+    ] });
     if (!label && !helperText && !error) return radioElement;
-    return /* @__PURE__ */ jsxs("div", { className: "w-full", children: [
+    return /* @__PURE__ */ jsxs("div", { className: cn("radio_root", "w-full", classNames?.root), children: [
       /* @__PURE__ */ jsxs(
         "label",
         {
@@ -64,9 +79,11 @@ var Radio = React.memo(
               "span",
               {
                 className: cn(
+                  "radio_label",
                   "text-sm text-text-secondary select-none",
                   error && "text-error",
-                  props.disabled && "opacity-50"
+                  props.disabled && "opacity-50",
+                  classNames?.label
                 ),
                 children: label
               }
@@ -77,11 +94,14 @@ var Radio = React.memo(
       (helperText || error) && /* @__PURE__ */ jsx(
         "p",
         {
+          id: helperId,
           className: cn(
+            "radio_description",
             "mt-1 ml-0 text-xs",
-            error ? "text-error" : "text-text-secondary"
+            error ? "text-error" : "text-text-secondary",
+            classNames?.description
           ),
-          children: error || helperText
+          children: typeof error === "string" ? error : helperText
         }
       )
     ] });
@@ -91,5 +111,5 @@ Radio.displayName = "Radio";
 var radio_default = Radio;
 
 export { radio_default };
-//# sourceMappingURL=chunk-23BPDLT4.js.map
-//# sourceMappingURL=chunk-23BPDLT4.js.map
+//# sourceMappingURL=chunk-27QEPVKU.js.map
+//# sourceMappingURL=chunk-27QEPVKU.js.map

package/dist/chunk-27QEPVKU.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/radio/index.tsx"],"names":[],"mappings":"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","file":"chunk-27QEPVKU.js","sourcesContent":["'use client'\n\nimport { cva } from 'class-variance-authority'\nimport React, { useId } from 'react'\n\nimport { cn } from '../utils'\nimport { radioCheckedColorClasses } from '../variants'\nimport type { RadioProps } from './types'\n\nconst radioVariants = cva(\n  'appearance-none rounded-full border-border border bg-background cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed outline-none',\n  {\n    variants: {\n      color: radioCheckedColorClasses,\n      size: {\n        xs: 'w-(--checkbox-size-xs) h-(--checkbox-size-xs)',\n        sm: 'w-(--checkbox-size-sm) h-(--checkbox-size-sm)',\n        md: 'w-(--checkbox-size-md) h-(--checkbox-size-md)',\n        lg: 'w-(--checkbox-size-lg) h-(--checkbox-size-lg)',\n      },\n      error: {\n        true: 'border-error checked:border-error',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      color: 'primary',\n      size: 'md',\n    },\n  },\n)\n\nconst Radio = React.memo<RadioProps>(\n  ({\n    color = 'primary',\n    size = 'md',\n    label,\n    helperText,\n    error,\n    className,\n    ref,\n    classNames,\n    ...props\n  }) => {\n    // Generate unique ID for accessibility\n    const uniqueId = useId()\n    const helperId = `radio-helper-${uniqueId}`\n    const hasHelperText = !!(helperText || error)\n\n    const radioElement = (\n      <div className=\"relative inline-flex\">\n        <input\n          ref={ref}\n          type=\"radio\"\n          className={cn(\n            'radio_radio',\n            radioVariants({ color, size, error: !!error }),\n            className,\n            classNames?.radio,\n          )}\n          aria-invalid={!!error || undefined}\n          aria-describedby={hasHelperText ? helperId : undefined}\n          {...props}\n        />\n        <div className={cn(\n          'radio_indicator',\n          'absolute inset-0 pointer-events-none',\n          classNames?.indicator,\n        )} />\n      </div>\n    )\n\n    if (!label && !helperText && !error) return radioElement\n\n    return (\n      <div className={cn('radio_root', 'w-full', classNames?.root)}>\n        <label\n          className={cn(\n            'flex items-center gap-2',\n            !props.disabled && 'cursor-pointer',\n          )}\n        >\n          {radioElement}\n          {label && (\n            <span\n              className={cn(\n                'radio_label',\n                'text-sm text-text-secondary select-none',\n                error && 'text-error',\n                props.disabled && 'opacity-50',\n                classNames?.label,\n              )}\n            >\n              {label}\n            </span>\n          )}\n        </label>\n        {(helperText || error) && (\n          <p\n            id={helperId}\n            className={cn(\n              'radio_description',\n              'mt-1 ml-0 text-xs',\n              error ? 'text-error' : 'text-text-secondary',\n              classNames?.description,\n            )}\n          >\n            {typeof error === 'string' ? error : helperText}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n\nRadio.displayName = 'Radio'\n\nexport type * from './types'\nexport default Radio\n"]}

package/dist/{chunk-IRNJZ754.js → chunk-2J57G7XG.js}

@@ -1,4 +1,4 @@
-import { cn } from './chunk-2OGZENFC.js';
+import { cn } from './chunk-NGYLRX6F.js';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 import { cva } from 'class-variance-authority';
 import { XIcon } from 'lucide-react';
@@ -67,13 +67,19 @@ var modalOverlayVariants = cva(
 function ModalOverlay({
   className,
   opacity = "medium",
+  classNames,
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     DialogPrimitive.Overlay,
     {
       "data-slot": "modal-overlay",
-      className: cn(modalOverlayVariants({ opacity }), className),
+      className: cn(
+        "modal_overlay",
+        modalOverlayVariants({ opacity }),
+        classNames?.overlay,
+        className
+      ),
       ...props
     }
   );
@@ -133,16 +139,19 @@ function ModalContent({
   size = "md",
   color = "default",
   centered = false,
+  classNames,
   ...props
 }) {
   return /* @__PURE__ */ jsxs(ModalPortal, { "data-slot": "modal-portal", children: [
-    /* @__PURE__ */ jsx(ModalOverlay, {}),
+    /* @__PURE__ */ jsx(ModalOverlay, { classNames }),
     /* @__PURE__ */ jsxs(
       DialogPrimitive.Content,
       {
         "data-slot": "modal-content",
         className: cn(
+          "modal_content",
           modalContentVariants({ size, color, centered }),
+          classNames?.content,
           className
         ),
         ...props,
@@ -152,7 +161,11 @@ function ModalContent({
             DialogPrimitive.Close,
             {
               "data-slot": "modal-close",
-              className: modalCloseVariants({ size }),
+              className: cn(
+                "modal_closeButton",
+                modalCloseVariants({ size }),
+                classNames?.closeButton
+              ),
               children: [
                 /* @__PURE__ */ jsx(XIcon, {}),
                 /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
@@ -192,13 +205,19 @@ var ModalHeader = React.memo(function ModalHeader2({
   className,
   size = "md",
   color = "default",
+  classNames,
   ...props
 }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "modal-header",
-      className: cn(modalHeaderVariants({ size, color }), className),
+      className: cn(
+        "modal_header",
+        modalHeaderVariants({ size, color }),
+        classNames?.header,
+        className
+      ),
       ...props
     }
   );
@@ -219,12 +238,17 @@ var modalFooterVariants = cva(
     }
   }
 );
-var ModalFooter = React.memo(function ModalFooter2({ className, size = "md", ...props }) {
+var ModalFooter = React.memo(function ModalFooter2({ className, size = "md", classNames, ...props }) {
   return /* @__PURE__ */ jsx(
     "div",
     {
       "data-slot": "modal-footer",
-      className: cn(modalFooterVariants({ size }), className),
+      className: cn(
+        "modal_footer",
+        modalFooterVariants({ size }),
+        classNames?.footer,
+        className
+      ),
       ...props
     }
   );
@@ -242,12 +266,17 @@ var modalTitleVariants = cva("leading-none font-semibold text-text-primary", {
     size: "md"
   }
 });
-var ModalTitle = React.memo(function ModalTitle2({ className, size = "md", ...props }) {
+var ModalTitle = React.memo(function ModalTitle2({ className, size = "md", classNames, ...props }) {
   return /* @__PURE__ */ jsx(
     DialogPrimitive.Title,
     {
       "data-slot": "modal-title",
-      className: cn(modalTitleVariants({ size }), className),
+      className: cn(
+        "modal_title",
+        modalTitleVariants({ size }),
+        classNames?.title,
+        className
+      ),
       ...props
     }
   );
@@ -265,12 +294,17 @@ var modalDescriptionVariants = cva("text-text-secondary", {
     size: "md"
   }
 });
-var ModalDescription = React.memo(function ModalDescription2({ className, size = "md", ...props }) {
+var ModalDescription = React.memo(function ModalDescription2({ className, size = "md", classNames, ...props }) {
   return /* @__PURE__ */ jsx(
     DialogPrimitive.Description,
     {
       "data-slot": "modal-description",
-      className: cn(modalDescriptionVariants({ size }), className),
+      className: cn(
+        "modal_description",
+        modalDescriptionVariants({ size }),
+        classNames?.description,
+        className
+      ),
       ...props
     }
   );
@@ -289,7 +323,8 @@ function ComposedModal({
   hideHeader = false,
   hideFooter = false,
   className,
-  contentClassName
+  contentClassName,
+  classNames
 }) {
   return /* @__PURE__ */ jsx(
     Modal,
@@ -304,6 +339,7 @@ function ComposedModal({
           centered,
           showCloseButton,
           className: contentClassName,
+          classNames,
           children: [
             !hideHeader && (title || description) && /* @__PURE__ */ jsxs(
               ModalHeader,
@@ -311,14 +347,36 @@ function ComposedModal({
                 size,
                 color,
                 className,
+                classNames,
                 children: [
-                  title && /* @__PURE__ */ jsx(ModalTitle, { size, children: title }),
-                  description && /* @__PURE__ */ jsx(ModalDescription, { size, children: description })
+                  title && /* @__PURE__ */ jsx(
+                    ModalTitle,
+                    {
+                      size,
+                      classNames,
+                      children: title
+                    }
+                  ),
+                  description && /* @__PURE__ */ jsx(
+                    ModalDescription,
+                    {
+                      size,
+                      classNames,
+                      children: description
+                    }
+                  )
                 ]
               }
             ),
-            children,
-            !hideFooter && footer && /* @__PURE__ */ jsx(ModalFooter, { size, children: footer })
+            /* @__PURE__ */ jsx("div", { className: cn("modal_body", classNames?.body), children }),
+            !hideFooter && footer && /* @__PURE__ */ jsx(
+              ModalFooter,
+              {
+                size,
+                classNames,
+                children: footer
+              }
+            )
           ]
         }
       )
@@ -328,5 +386,5 @@ function ComposedModal({
 var modal_default = ComposedModal;
 
 export { Modal, ModalClose, ModalContent, ModalDescription, ModalFooter, ModalHeader, ModalOverlay, ModalPortal, ModalTitle, ModalTrigger, modal_default };
-//# sourceMappingURL=chunk-IRNJZ754.js.map
-//# sourceMappingURL=chunk-IRNJZ754.js.map
+//# sourceMappingURL=chunk-2J57G7XG.js.map
+//# sourceMappingURL=chunk-2J57G7XG.js.map

package/dist/chunk-2J57G7XG.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/modal/index.tsx"],"names":["ModalHeader","ModalFooter","ModalTitle","ModalDescription"],"mappings":"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","file":"chunk-2J57G7XG.js","sourcesContent":["'use client'\n\nimport * as DialogPrimitive from '@radix-ui/react-dialog'\nimport { cva } from 'class-variance-authority'\nimport { XIcon } from 'lucide-react'\nimport * as React from 'react'\n\nimport { cn } from '../utils'\nimport type {\n  ComposedModalProps,\n  ModalClassNames,\n  ModalColor,\n  ModalSize,\n} from './types'\n\nfunction Modal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Root>) {\n  return (\n    <DialogPrimitive.Root\n      data-slot=\"modal\"\n      {...props}\n    />\n  )\n}\n\nfunction ModalTrigger({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Trigger>) {\n  return (\n    <DialogPrimitive.Trigger\n      data-slot=\"modal-trigger\"\n      {...props}\n    />\n  )\n}\n\nfunction ModalPortal({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Portal>) {\n  return (\n    <DialogPrimitive.Portal\n      data-slot=\"modal-portal\"\n      {...props}\n    />\n  )\n}\n\nfunction ModalClose({\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Close>) {\n  return (\n    <DialogPrimitive.Close\n      data-slot=\"modal-close\"\n      {...props}\n    />\n  )\n}\n\nconst modalOverlayVariants = cva(\n  'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/20 backdrop-blur-sm',\n  {\n    variants: {\n      opacity: {\n        light: 'bg-opacity-30',\n        medium: 'bg-opacity-50',\n        heavy: 'bg-opacity-70',\n      },\n    },\n    defaultVariants: {\n      opacity: 'medium',\n    },\n  },\n)\n\nfunction ModalOverlay({\n  className,\n  opacity = 'medium',\n  classNames,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Overlay> & {\n  opacity?: 'light' | 'medium' | 'heavy'\n  classNames?: ModalClassNames\n}) {\n  return (\n    <DialogPrimitive.Overlay\n      data-slot=\"modal-overlay\"\n      className={cn(\n        'modal_overlay',\n        modalOverlayVariants({ opacity }),\n        classNames?.overlay,\n        className,\n      )}\n      {...props}\n    />\n  )\n}\n\nconst modalContentVariants = cva(\n  'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] rounded-md border duration-200',\n  {\n    variants: {\n      size: {\n        xs: 'max-w-(--modal-max-width-xs) gap-(--modal-gap-xs) p-(--modal-padding-xs) sm:max-w-(--modal-max-width-xs)',\n        sm: 'max-w-(--modal-max-width-sm) gap-(--modal-gap-sm) p-(--modal-padding-sm) sm:max-w-(--modal-max-width-sm)',\n        md: 'max-w-(--modal-max-width-md) gap-(--modal-gap-md) p-(--modal-padding-md) sm:max-w-(--modal-max-width-md)',\n        lg: 'max-w-(--modal-max-width-lg) gap-(--modal-gap-lg) p-(--modal-padding-lg) sm:max-w-(--modal-max-width-lg)',\n      },\n      color: {\n        default: 'border-border',\n        primary: 'border-primary border-l-4',\n        secondary: 'border-secondary border-l-4',\n        accent: 'border-accent border-l-4',\n        success: 'border-success border-l-4',\n        error: 'border-error border-l-4',\n        warning: 'border-warning border-l-4',\n        info: 'border-info border-l-4',\n      },\n      centered: {\n        true: 'text-center',\n        false: '',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n      color: 'default',\n      centered: false,\n    },\n  },\n)\n\nconst modalCloseVariants = cva(\n  'absolute right-4 rounded-sm opacity-70 transition-opacity hover:opacity-100 focus:outline-hidden focus:ring-2 focus:ring-primary focus:ring-offset-2 disabled:pointer-events-none text-text-secondary hover:text-text-primary [&_svg]:pointer-events-none [&_svg]:shrink-0',\n  {\n    variants: {\n      size: {\n        xs: 'top-3 [&_svg]:size-3.5',\n        sm: 'top-3 [&_svg]:size-3.5',\n        md: 'top-4 [&_svg]:size-4',\n        lg: 'top-6 [&_svg]:size-5',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n)\n\nfunction ModalContent({\n  className,\n  children,\n  showCloseButton = true,\n  size = 'md',\n  color = 'default',\n  centered = false,\n  classNames,\n  ...props\n}: React.ComponentProps<typeof DialogPrimitive.Content> & {\n  showCloseButton?: boolean\n  size?: ModalSize\n  color?: ModalColor\n  centered?: boolean\n  classNames?: ModalClassNames\n}) {\n  return (\n    <ModalPortal data-slot=\"modal-portal\">\n      <ModalOverlay classNames={classNames} />\n      <DialogPrimitive.Content\n        data-slot=\"modal-content\"\n        className={cn(\n          'modal_content',\n          modalContentVariants({ size, color, centered }),\n          classNames?.content,\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <DialogPrimitive.Close\n            data-slot=\"modal-close\"\n            className={cn(\n              'modal_closeButton',\n              modalCloseVariants({ size }),\n              classNames?.closeButton,\n            )}\n          >\n            <XIcon />\n            <span className=\"sr-only\">Close</span>\n          </DialogPrimitive.Close>\n        )}\n      </DialogPrimitive.Content>\n    </ModalPortal>\n  )\n}\n\nconst modalHeaderVariants = cva('flex flex-col text-text-primary', {\n  variants: {\n    size: {\n      xs: 'gap-1.5',\n      sm: 'gap-1.5',\n      md: 'gap-2',\n      lg: 'gap-3',\n    },\n    color: {\n      default: '',\n      primary: 'border-l-primary',\n      secondary: 'border-l-secondary',\n      success: 'border-l-success',\n      error: 'border-l-error',\n      accent: 'border-l-accent',\n      warning: 'border-l-warning',\n      info: 'border-l-info',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    color: 'default',\n  },\n})\n\n// Performance optimization: Memoize Modal subcomponents to prevent unnecessary\n// re-renders when modal state changes but subcomponent props haven't changed\nconst ModalHeader = React.memo<\n  React.ComponentProps<'div'> & {\n    size?: ModalSize\n    color?: ModalColor\n    classNames?: ModalClassNames\n  }\n>(function ModalHeader({\n  className,\n  size = 'md',\n  color = 'default',\n  classNames,\n  ...props\n}) {\n  return (\n    <div\n      data-slot=\"modal-header\"\n      className={cn(\n        'modal_header',\n        modalHeaderVariants({ size, color }),\n        classNames?.header,\n        className,\n      )}\n      {...props}\n    />\n  )\n})\n\nconst modalFooterVariants = cva(\n  'flex flex-col-reverse sm:flex-row sm:justify-end',\n  {\n    variants: {\n      size: {\n        xs: 'gap-1.5',\n        sm: 'gap-1.5',\n        md: 'gap-2',\n        lg: 'gap-3',\n      },\n    },\n    defaultVariants: {\n      size: 'md',\n    },\n  },\n)\n\nconst ModalFooter = React.memo<\n  React.ComponentProps<'div'> & {\n    size?: ModalSize\n    classNames?: ModalClassNames\n  }\n>(function ModalFooter({ className, size = 'md', classNames, ...props }) {\n  return (\n    <div\n      data-slot=\"modal-footer\"\n      className={cn(\n        'modal_footer',\n        modalFooterVariants({ size }),\n        classNames?.footer,\n        className,\n      )}\n      {...props}\n    />\n  )\n})\n\nconst modalTitleVariants = cva('leading-none font-semibold text-text-primary', {\n  variants: {\n    size: {\n      xs: 'text-base',\n      sm: 'text-base',\n      md: 'text-lg',\n      lg: 'text-2xl',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst ModalTitle = React.memo<\n  React.ComponentProps<typeof DialogPrimitive.Title> & {\n    size?: ModalSize\n    classNames?: ModalClassNames\n  }\n>(function ModalTitle({ className, size = 'md', classNames, ...props }) {\n  return (\n    <DialogPrimitive.Title\n      data-slot=\"modal-title\"\n      className={cn(\n        'modal_title',\n        modalTitleVariants({ size }),\n        classNames?.title,\n        className,\n      )}\n      {...props}\n    />\n  )\n})\n\nconst modalDescriptionVariants = cva('text-text-secondary', {\n  variants: {\n    size: {\n      xs: 'text-xs',\n      sm: 'text-xs',\n      md: 'text-sm',\n      lg: 'text-base',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n  },\n})\n\nconst ModalDescription = React.memo<\n  React.ComponentProps<typeof DialogPrimitive.Description> & {\n    size?: ModalSize\n    classNames?: ModalClassNames\n  }\n>(function ModalDescription({ className, size = 'md', classNames, ...props }) {\n  return (\n    <DialogPrimitive.Description\n      data-slot=\"modal-description\"\n      className={cn(\n        'modal_description',\n        modalDescriptionVariants({ size }),\n        classNames?.description,\n        className,\n      )}\n      {...props}\n    />\n  )\n})\n\nfunction ComposedModal({\n  open,\n  onOpenChange,\n  title,\n  description,\n  children,\n  footer,\n  size = 'md',\n  color = 'default',\n  centered = false,\n  showCloseButton = true,\n  hideHeader = false,\n  hideFooter = false,\n  className,\n  contentClassName,\n  classNames,\n}: ComposedModalProps) {\n  return (\n    <Modal\n      open={open}\n      onOpenChange={onOpenChange}\n    >\n      <ModalContent\n        size={size}\n        color={color}\n        centered={centered}\n        showCloseButton={showCloseButton}\n        className={contentClassName}\n        classNames={classNames}\n      >\n        {!hideHeader && (title || description) && (\n          <ModalHeader\n            size={size}\n            color={color}\n            className={className}\n            classNames={classNames}\n          >\n            {title && (\n              <ModalTitle\n                size={size}\n                classNames={classNames}\n              >\n                {title}\n              </ModalTitle>\n            )}\n            {description && (\n              <ModalDescription\n                size={size}\n                classNames={classNames}\n              >\n                {description}\n              </ModalDescription>\n            )}\n          </ModalHeader>\n        )}\n        <div className={cn('modal_body', classNames?.body)}>{children}</div>\n        {!hideFooter && footer && (\n          <ModalFooter\n            size={size}\n            classNames={classNames}\n          >\n            {footer}\n          </ModalFooter>\n        )}\n      </ModalContent>\n    </Modal>\n  )\n}\n\nexport type * from './types'\nexport {\n  Modal,\n  ModalClose,\n  ModalContent,\n  ModalDescription,\n  ModalFooter,\n  ModalHeader,\n  ModalOverlay,\n  ModalPortal,\n  ModalTitle,\n  ModalTrigger,\n}\nexport default ComposedModal\n"]}

package/dist/{chunk-SOIF4SHB.js → chunk-2NYVRAG4.js}

@@ -1,6 +1,6 @@
-import { getValidationStatus, cn, statusMessageVariants } from './chunk-2OGZENFC.js';
+import { getValidationStatus, cn, statusMessageVariants } from './chunk-NGYLRX6F.js';
 import { cva } from 'class-variance-authority';
-import React from 'react';
+import React, { useId } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
 var textareaVariants = cva(
@@ -61,6 +61,7 @@ var Textarea = React.memo(
     autoResize = false,
     fullWidth = true,
     className,
+    classNames,
     value,
     onChange,
     ref,
@@ -71,6 +72,9 @@ var Textarea = React.memo(
     const [internalValue, setInternalValue] = React.useState(value || "");
     const currentValue = value !== void 0 ? value : internalValue;
     const currentLength = String(currentValue).length;
+    const uniqueId = useId();
+    const textareaId = props.id || `textarea-${uniqueId}`;
+    const helperId = `textarea-helper-${uniqueId}`;
     const { status, message: helperMessage } = getValidationStatus({
       error,
       warning,
@@ -97,7 +101,9 @@ var Textarea = React.memo(
       "textarea",
       {
         ref: textareaRef,
+        id: textareaId,
         className: cn(
+          "textarea_textarea",
           textareaVariants({
             variant,
             status,
@@ -106,13 +112,14 @@ var Textarea = React.memo(
             fullWidth
           }),
           autoResize && "overflow-hidden",
-          className
+          className,
+          classNames?.textarea
         ),
         maxLength,
         value: currentValue,
         onChange: handleChange,
         "aria-invalid": status === "error",
-        "aria-describedby": helperMessage ? `textarea-helper-${status}` : void 0,
+        "aria-describedby": helperMessage ? helperId : void 0,
         ...props
       }
     );
@@ -121,24 +128,26 @@ var Textarea = React.memo(
       "div",
       {
         className: cn(
+          "textarea_root",
           "w-full flex flex-col relative",
-          !fullWidth && "inline-block"
+          !fullWidth && "inline-block",
+          classNames?.root
         ),
         children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex gap-2 items-center relative mb-0.5", children: [
-            label && /* @__PURE__ */ jsxs("p", { className: "text-sm font-medium text-text-secondary", children: [
+          /* @__PURE__ */ jsxs("div", { className: cn("textarea_wrapper", "flex gap-2 items-center relative mb-0.5", classNames?.wrapper), children: [
+            label && /* @__PURE__ */ jsxs("label", { htmlFor: textareaId, className: cn("textarea_label", "text-sm font-medium text-text-secondary", classNames?.label), children: [
               label,
-              props.required && /* @__PURE__ */ jsx("span", { className: "text-error ml-1", children: "*" })
+              props.required && /* @__PURE__ */ jsx("span", { className: cn("textarea_error", "text-error ml-1", classNames?.error), children: "*" })
             ] }),
             helperMessage && messagePosition === "top" && /* @__PURE__ */ jsx(
               "p",
               {
-                id: `textarea-helper-${status}`,
-                className: statusMessageVariants({ status }),
+                id: helperId,
+                className: cn("textarea_helper", statusMessageVariants({ status }), classNames?.helper),
                 children: helperMessage
               }
             ),
-            showCount && maxLength && /* @__PURE__ */ jsxs("span", { className: "text-xs text-text-secondary absolute right-0", children: [
+            showCount && maxLength && /* @__PURE__ */ jsxs("span", { className: cn("textarea_counter", "text-xs text-text-secondary absolute right-0", classNames?.counter), children: [
               currentLength,
               "/",
               maxLength
@@ -148,8 +157,8 @@ var Textarea = React.memo(
           helperMessage && messagePosition === "bottom" && /* @__PURE__ */ jsx(
             "p",
             {
-              id: `textarea-helper-${status}`,
-              className: cn(statusMessageVariants({ status }), "mt-0.5"),
+              id: helperId,
+              className: cn("textarea_helper", statusMessageVariants({ status }), "mt-0.5", classNames?.helper),
               children: helperMessage
             }
           )
@@ -162,5 +171,5 @@ Textarea.displayName = "Textarea";
 var textarea_default = Textarea;
 
 export { textarea_default };
-//# sourceMappingURL=chunk-SOIF4SHB.js.map
-//# sourceMappingURL=chunk-SOIF4SHB.js.map
+//# sourceMappingURL=chunk-2NYVRAG4.js.map
+//# sourceMappingURL=chunk-2NYVRAG4.js.map

package/dist/chunk-2NYVRAG4.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/textarea/index.tsx"],"names":[],"mappings":"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","file":"chunk-2NYVRAG4.js","sourcesContent":["'use client'\n\nimport { cva } from 'class-variance-authority'\nimport React, { useId } from 'react'\n\nimport { cn, getValidationStatus, statusMessageVariants } from '../utils'\nimport type { TextareaProps } from './types'\n\nconst textareaVariants = cva(\n  'w-full rounded-md focus:border-primary transition-colors text-text-primary placeholder:text-text-secondary/50 disabled:opacity-50 disabled:cursor-not-allowed read-only:bg-surface read-only:cursor-default outline-none',\n  {\n    variants: {\n      variant: {\n        outline: 'bg-background border border-border',\n        filled: 'bg-surface border border-transparent',\n      },\n      status: {\n        default: '',\n        error: '!border-error focus:!border-error',\n        warning: '!border-warning focus:!border-warning',\n        info: '!border-info focus:!border-info',\n        success: '!border-success focus:!border-success',\n      },\n      size: {\n        xs: 'min-h-(--textarea-min-height-xs) p-(--textarea-padding-xs) text-xs',\n        sm: 'min-h-(--textarea-min-height-sm) p-(--textarea-padding-sm) text-sm',\n        md: 'min-h-(--textarea-min-height-md) p-(--textarea-padding-md) text-base',\n        lg: 'min-h-(--textarea-min-height-lg) p-(--textarea-padding-lg) text-lg',\n      },\n      resize: {\n        none: 'resize-none',\n        vertical: 'resize-y',\n        horizontal: 'resize-x',\n        both: 'resize',\n      },\n      fullWidth: {\n        true: 'w-full',\n        false: 'max-w-full',\n      },\n    },\n    defaultVariants: {\n      variant: 'outline',\n      status: 'default',\n      size: 'md',\n      resize: 'vertical',\n      fullWidth: true,\n    },\n  },\n)\n\nconst Textarea = React.memo<TextareaProps>(\n  ({\n    variant = 'outline',\n    size = 'md',\n    label,\n    helperText,\n    messagePosition = 'bottom',\n    error,\n    warning,\n    info,\n    success,\n    resize = 'vertical',\n    showCount = false,\n    maxLength,\n    autoResize = false,\n    fullWidth = true,\n    className,\n    classNames,\n    value,\n    onChange,\n    ref,\n    ...props\n  }) => {\n    const internalRef = React.useRef<HTMLTextAreaElement>(null)\n    const textareaRef =\n      (ref as React.RefObject<HTMLTextAreaElement>) || internalRef\n    const [internalValue, setInternalValue] = React.useState(value || '')\n    const currentValue = value !== undefined ? value : internalValue\n    const currentLength = String(currentValue).length\n\n    // Generate unique IDs for accessibility\n    const uniqueId = useId()\n    const textareaId = props.id || `textarea-${uniqueId}`\n    const helperId = `textarea-helper-${uniqueId}`\n\n    // Use shared validation status utility\n    const { status, message: helperMessage } = getValidationStatus({\n      error,\n      warning,\n      info,\n      success,\n      helperText,\n    })\n\n    const handleChange = React.useCallback(\n      (e: React.ChangeEvent<HTMLTextAreaElement>) => {\n        if (value === undefined) {\n          setInternalValue(e.target.value)\n        }\n        onChange?.(e)\n      },\n      [value, onChange],\n    )\n\n    React.useEffect(() => {\n      if (autoResize && textareaRef.current) {\n        textareaRef.current.style.height = 'auto'\n        textareaRef.current.style.height = `${textareaRef.current.scrollHeight}px`\n      }\n    }, [currentValue, autoResize, textareaRef])\n\n    const textareaElement = (\n      <textarea\n        ref={textareaRef}\n        id={textareaId}\n        className={cn(\n          'textarea_textarea',\n          textareaVariants({\n            variant,\n            status,\n            size,\n            resize: autoResize ? 'none' : resize,\n            fullWidth,\n          }),\n          autoResize && 'overflow-hidden',\n          className,\n          classNames?.textarea,\n        )}\n        maxLength={maxLength}\n        value={currentValue}\n        onChange={handleChange}\n        aria-invalid={status === 'error'}\n        aria-describedby={helperMessage ? helperId : undefined}\n        {...props}\n      />\n    )\n\n    if (!label && !helperMessage && !showCount) return textareaElement\n\n    return (\n      <div\n        className={cn(\n          'textarea_root',\n          'w-full flex flex-col relative',\n          !fullWidth && 'inline-block',\n          classNames?.root,\n        )}\n      >\n        <div className={cn('textarea_wrapper', 'flex gap-2 items-center relative mb-0.5', classNames?.wrapper)}>\n          {label && (\n            <label htmlFor={textareaId} className={cn('textarea_label', 'text-sm font-medium text-text-secondary', classNames?.label)}>\n              {label}\n              {props.required && <span className={cn('textarea_error', 'text-error ml-1', classNames?.error)}>*</span>}\n            </label>\n          )}\n          {helperMessage && messagePosition === 'top' && (\n            <p\n              id={helperId}\n              className={cn('textarea_helper', statusMessageVariants({ status }), classNames?.helper)}\n            >\n              {helperMessage}\n            </p>\n          )}\n          {showCount && maxLength && (\n            <span className={cn('textarea_counter', 'text-xs text-text-secondary absolute right-0', classNames?.counter)}>\n              {currentLength}/{maxLength}\n            </span>\n          )}\n        </div>\n        {textareaElement}\n        {helperMessage && messagePosition === 'bottom' && (\n          <p\n            id={helperId}\n            className={cn('textarea_helper', statusMessageVariants({ status }), 'mt-0.5', classNames?.helper)}\n          >\n            {helperMessage}\n          </p>\n        )}\n      </div>\n    )\n  },\n)\n\nTextarea.displayName = 'Textarea'\n\nexport type * from './types'\nexport default Textarea\n"]}