@sth87/shadcn-design-system 0.0.6 → 0.0.7

package/README.md

@@ -1,12 +1,12 @@
 # shadcn design-system
 
-
 A modern, fully-typed React design system built on top of **shadcn/ui** with enhanced features, TypeScript, TailwindCSS, and Radix UI primitives.
 
 [![npm version](https://img.shields.io/npm/v/@sth87/shadcn-design-system.svg)](https://www.npmjs.com/package/@sth87/shadcn-design-system)
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 ## Storybook
+
 [https://design-system-sth-kappa.vercel.app/](https://design-system-sth-kappa.vercel.app/)
 
 ## 📦 Installation

package/dist/cjs/components/Checkbox/Checkbox.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("react"),_=require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");const F=require("../../packages/ui/src/components/label.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");const a=require("../../packages/ui/src/lib/utils.cjs"),h=require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const p=require("../Tooltip/Tooltip.cjs"),M=require("motion/react"),D=require("../../utils/css.cjs"),b=o.forwardRef((g,j)=>{const{label:s,infoTooltip:i,helperText:n,state:c,variant:C="default",size:v="default",color:N,labelPosition:r="right",labelAlignment:u="center",icon:w,animation:T,id:k,...d}=g,[y,x]=o.useState(!1),I=o.useId(),l=k||I,S={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"},P=t=>{t&&(x(!0),setTimeout(()=>x(!1),800))},q=r==="top"||r==="bottom",R=q?"flex-col":"flex-row",z=q?"gap-1.5":"gap-2",A=u==="start"?"items-start":u==="center"?"items-center":"items-end",m="flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";return e.jsxs("div",{className:a.cn("flex flex-col gap-1.5 relative",{}),children:[e.jsxs("div",{className:a.cn("flex",R,z,A),children:[(r==="top"||r==="left")&&s&&e.jsxs("label",{htmlFor:l,className:m,children:[s,i&&e.jsx(p.Tooltip,{content:i,children:e.jsx(h.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative inline-flex",children:[e.jsx(_.Checkbox,{ref:j,id:l,...d,variant:C,size:v,color:N,icon:w,onCheckedChange:t=>{T&&P(!!t),d?.onCheckedChange?.(t)}}),e.jsx(M.AnimatePresence,{children:y&&e.jsx("div",{className:"pointer-events-none absolute inset-0",children:[...Array(12)].map((t,f)=>e.jsx(D.ConfettiPiece,{index:f},f))})})]}),(r==="bottom"||r==="right")&&s&&e.jsxs(F.Label,{htmlFor:l,className:m,children:[s,i&&e.jsx(p.Tooltip,{content:i,children:e.jsx(h.Info,{className:"size-3.5 min-w-3.5"})})]})]}),n&&e.jsx("div",{className:"flex items-center justify-between text-xs gap-2",children:n&&e.jsx("p",{className:a.cn("text-xs",c?S?.[c]:""),children:n})})]})});b.displayName="Checkbox";exports.default=b;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),o=require("react"),F=require("../../packages/ui/src/components/checkbox.cjs");require("@radix-ui/react-slot");require("../../packages/ui/src/components/button.cjs");require("../../packages/ui/src/components/button-group.cjs");require("../../packages/ui/src/components/input.cjs");require("../../packages/ui/src/components/textarea.cjs");const M=require("../../packages/ui/src/components/label.cjs");require("../../packages/ui/src/components/select.cjs");require("../../packages/ui/src/components/combobox.cjs");require("@radix-ui/react-tooltip");const a=require("../../packages/ui/src/lib/utils.cjs"),f=require("lucide-react");require("react-day-picker");require("../../packages/ui/src/components/popover.cjs");require("@radix-ui/react-separator");require("../../packages/ui/src/components/switch.cjs");require("vaul");require("@radix-ui/react-scroll-area");require("../../packages/ui/src/components/tree-view.cjs");require("@radix-ui/react-alert-dialog");require("@radix-ui/react-avatar");require("../../packages/ui/src/components/badge.cjs");require("@radix-ui/react-collapsible");require("cmdk");require("@radix-ui/react-dialog");require("@radix-ui/react-dropdown-menu");require("../../packages/ui/src/components/input-otp.cjs");require("../../packages/ui/src/components/radio-group.cjs");require("../../packages/ui/src/components/sidebar.cjs");require("@radix-ui/react-slider");require("../../packages/ui/src/components/tabs.cjs");require("../../packages/ui/src/components/toggle.cjs");const p=require("../Tooltip/Tooltip.cjs"),D=require("motion/react"),L=require("../../utils/css.cjs"),b=o.forwardRef((g,j)=>{const{label:t,infoTooltip:s,helperText:i,state:c,variant:C="default",size:v="default",color:N,labelPosition:r="right",labelAlignment:u="center",icon:w,animation:T,id:k,onCheckedChange:d,...y}=g,[I,x]=o.useState(!1),S=o.useId(),n=k||S,P={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"},R=l=>{l&&(x(!0),setTimeout(()=>x(!1),800)),d?.(l)},q=r==="top"||r==="bottom",z=q?"flex-col":"flex-row",A=q?"gap-1.5":"gap-2",_=u==="start"?"items-start":u==="center"?"items-center":"items-end",m="flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70";return e.jsxs("div",{className:a.cn("flex flex-col gap-1.5 relative",{}),children:[e.jsxs("div",{className:a.cn("flex",z,A,_),children:[(r==="top"||r==="left")&&t&&e.jsxs("label",{htmlFor:n,className:m,children:[t,s&&e.jsx(p.Tooltip,{content:s,children:e.jsx(f.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative inline-flex",children:[e.jsx(F.Checkbox,{ref:j,id:n,...y,variant:C,size:v,color:N,icon:w,onCheckedChange:T?R:d}),e.jsx(D.AnimatePresence,{children:I&&e.jsx("div",{className:"pointer-events-none absolute inset-0",children:[...Array(12)].map((l,h)=>e.jsx(L.ConfettiPiece,{index:h},h))})})]}),(r==="bottom"||r==="right")&&t&&e.jsxs(M.Label,{htmlFor:n,className:m,children:[t,s&&e.jsx(p.Tooltip,{content:s,children:e.jsx(f.Info,{className:"size-3.5 min-w-3.5"})})]})]}),i&&e.jsx("div",{className:"flex items-center justify-between text-xs gap-2",children:i&&e.jsx("p",{className:a.cn("text-xs",c?P?.[c]:""),children:i})})]})});b.displayName="Checkbox";exports.default=b;
 //# sourceMappingURL=Checkbox.cjs.map

package/dist/cjs/components/Checkbox/Checkbox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Checkbox as SCheckbox } from \"@dsui/ui/components/checkbox\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\nimport { Info } from \"lucide-react\";\nimport { AnimatePresence } from \"motion/react\";\nimport { ConfettiPiece } from \"@/utils/css\";\n\nexport type CheckboxProps = React.ComponentProps<typeof SCheckbox> & {\n  label?: React.ReactNode;\n  labelPosition?: \"top\" | \"left\" | \"right\" | \"bottom\";\n  labelAlignment?: \"start\" | \"center\" | \"end\";\n  infoTooltip?: React.ReactNode;\n  helperText?: React.ReactNode;\n  state?: \"default\" | \"error\" | \"success\" | \"warning\";\n  icon?: React.ReactNode;\n  animation?: \"confetti\" | undefined;\n};\n\nconst Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const {\n      label,\n      infoTooltip,\n      helperText,\n      state,\n      variant = \"default\",\n      size = \"default\",\n      color,\n      labelPosition = \"right\",\n      labelAlignment = \"center\",\n      icon,\n      animation,\n      id,\n      ...rest\n    } = props;\n    const [showConfetti, setShowConfetti] = useState(false);\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n\n    // State\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    const handleCheckedChange = (checked: boolean) => {\n      if (checked) {\n        setShowConfetti(true);\n        setTimeout(() => setShowConfetti(false), 800);\n      }\n    };\n\n    const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n    const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n    const gapClass = isVertical ? \"gap-1.5\" : \"gap-2\";\n\n    const alignmentClass =\n      labelAlignment === \"start\"\n        ? \"items-start\"\n        : labelAlignment === \"center\"\n          ? \"items-center\"\n          : \"items-end\";\n\n    const labelClass =\n      \"flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\";\n\n    return (\n      <div className={cn(\"flex flex-col gap-1.5 relative\", {})}>\n        <div className={cn(\"flex\", flexDirection, gapClass, alignmentClass)}>\n          {(labelPosition === \"top\" || labelPosition === \"left\") && label && (\n            <label htmlFor={inputId} className={labelClass}>\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"size-3.5 min-w-3.5\" />\n                </Tooltip>\n              )}\n            </label>\n          )}\n\n          <div className=\"relative inline-flex\">\n            <SCheckbox\n              ref={ref}\n              id={inputId}\n              {...rest}\n              variant={variant}\n              size={size}\n              color={color}\n              icon={icon}\n              onCheckedChange={(checked) => {\n                if (animation) handleCheckedChange(!!checked);\n                rest?.onCheckedChange?.(checked);\n              }}\n            />\n\n            <AnimatePresence>\n              {showConfetti && (\n                <div className=\"pointer-events-none absolute inset-0\">\n                  {[...Array(12)].map((_, i) => (\n                    <ConfettiPiece key={i} index={i} />\n                  ))}\n                </div>\n              )}\n            </AnimatePresence>\n          </div>\n\n          {(labelPosition === \"bottom\" || labelPosition === \"right\") &&\n            label && (\n              <Label htmlFor={inputId} className={labelClass}>\n                {label}\n                {infoTooltip && (\n                  <Tooltip content={infoTooltip}>\n                    <Info className=\"size-3.5 min-w-3.5\" />\n                  </Tooltip>\n                )}\n              </Label>\n            )}\n        </div>\n\n        {helperText && (\n          <div className=\"flex items-center justify-between text-xs gap-2\">\n            {helperText && (\n              <p\n                className={cn(\n                  \"text-xs\",\n                  state ? helperTextStyles?.[state] : \"\"\n                )}\n              >\n                {helperText}\n              </p>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\nexport default Checkbox;\n"],"names":["Checkbox","React","props","ref","label","infoTooltip","helperText","state","variant","size","color","labelPosition","labelAlignment","icon","animation","id","rest","showConfetti","setShowConfetti","useState","generatedId","inputId","helperTextStyles","handleCheckedChange","checked","isVertical","flexDirection","gapClass","alignmentClass","labelClass","cn","jsxs","Tooltip","jsx","Info","SCheckbox","AnimatePresence","_","i","ConfettiPiece","Label"],"mappings":"wsDAoBMA,EAAWC,EAAM,WACrB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAA,MACJC,EACA,YAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,UACP,MAAAC,EACA,cAAAC,EAAgB,QAChB,eAAAC,EAAiB,SACjB,KAAAC,EACA,UAAAC,EACA,GAAAC,EACA,GAAGC,CAAA,EACDd,EACE,CAACe,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAcnB,EAAM,MAAA,EACpBoB,EAAUN,GAAMK,EAGhBE,EAAmB,CACvB,QAAS,wBACT,QAAS,eACT,QAAS,eACT,MAAO,YAAA,EAGHC,EAAuBC,GAAqB,CAC5CA,IACFN,EAAgB,EAAI,EACpB,WAAW,IAAMA,EAAgB,EAAK,EAAG,GAAG,EAEhD,EAEMO,EAAad,IAAkB,OAASA,IAAkB,SAC1De,EAAgBD,EAAa,WAAa,WAC1CE,EAAWF,EAAa,UAAY,QAEpCG,EACJhB,IAAmB,QACf,cACAA,IAAmB,SACjB,eACA,YAEFiB,EACJ,uEAEF,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,iCAAkC,CAAA,CAAE,EACrD,SAAA,CAAAC,OAAC,OAAI,UAAWD,EAAAA,GAAG,OAAQJ,EAAeC,EAAUC,CAAc,EAC9D,SAAA,EAAAjB,IAAkB,OAASA,IAAkB,SAAWP,UACvD,QAAA,CAAM,QAASiB,EAAS,UAAWQ,EACjC,SAAA,CAAAzB,EACAC,SACE2B,UAAA,CAAQ,QAAS3B,EAChB,SAAA4B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,EAEJ,EAGFH,EAAAA,KAAC,MAAA,CAAI,UAAU,uBACb,SAAA,CAAAE,EAAAA,IAACE,EAAAA,SAAA,CACC,IAAAhC,EACA,GAAIkB,EACH,GAAGL,EACJ,QAAAR,EACA,KAAAC,EACA,MAAAC,EACA,KAAAG,EACA,gBAAkBW,GAAY,CACxBV,GAAWS,EAAoB,CAAC,CAACC,CAAO,EAC5CR,GAAM,kBAAkBQ,CAAO,CACjC,CAAA,CAAA,EAGFS,EAAAA,IAACG,EAAAA,gBAAA,CACE,SAAAnB,GACCgB,EAAAA,IAAC,MAAA,CAAI,UAAU,uCACZ,SAAA,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,IAAI,CAACI,EAAGC,IACtBL,EAAAA,IAACM,EAAAA,cAAA,CAAsB,MAAOD,CAAA,EAAVA,CAAa,CAClC,CAAA,CACH,CAAA,CAEJ,CAAA,EACF,GAEE3B,IAAkB,UAAYA,IAAkB,UAChDP,UACGoC,EAAAA,MAAA,CAAM,QAASnB,EAAS,UAAWQ,EACjC,SAAA,CAAAzB,EACAC,SACE2B,UAAA,CAAQ,QAAS3B,EAChB,SAAA4B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,CAAA,CAEJ,CAAA,EAEN,EAEC5B,GACC2B,EAAAA,IAAC,MAAA,CAAI,UAAU,kDACZ,SAAA3B,GACC2B,EAAAA,IAAC,IAAA,CACC,UAAWH,EAAAA,GACT,UACAvB,EAAQe,IAAmBf,CAAK,EAAI,EAAA,EAGrC,SAAAD,CAAA,CAAA,CACH,CAEJ,CAAA,EAEJ,CAEJ,CACF,EAEAN,EAAS,YAAc"}
+{"version":3,"file":"Checkbox.cjs","sources":["../../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport { Checkbox as SCheckbox } from \"@dsui/ui/components/checkbox\";\nimport { cn } from \"@dsui/ui/index\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\nimport { Info } from \"lucide-react\";\nimport { AnimatePresence } from \"motion/react\";\nimport { ConfettiPiece } from \"@/utils/css\";\nimport type { CheckedState } from \"@radix-ui/react-checkbox\";\n\nexport type CheckboxProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCheckbox>,\n  \"onCheckedChange\" | \"variant\" | \"size\" | \"color\" | \"icon\"\n> & {\n  onCheckedChange?: (checked: CheckedState) => void;\n  variant?: \"default\" | \"circle\";\n  size?: \"sm\" | \"default\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  icon?: React.ReactNode;\n  label?: React.ReactNode;\n  labelPosition?: \"top\" | \"left\" | \"right\" | \"bottom\";\n  labelAlignment?: \"start\" | \"center\" | \"end\";\n  infoTooltip?: React.ReactNode;\n  helperText?: React.ReactNode;\n  state?: \"default\" | \"error\" | \"success\" | \"warning\";\n  animation?: \"confetti\" | undefined;\n};\n\nconst Checkbox = React.forwardRef<HTMLButtonElement, CheckboxProps>(\n  (props, ref) => {\n    const {\n      label,\n      infoTooltip,\n      helperText,\n      state,\n      variant = \"default\",\n      size = \"default\",\n      color,\n      labelPosition = \"right\",\n      labelAlignment = \"center\",\n      icon,\n      animation,\n      id,\n      onCheckedChange,\n      ...rest\n    } = props;\n    const [showConfetti, setShowConfetti] = useState(false);\n    const generatedId = React.useId();\n    const inputId = id || generatedId;\n\n    // State\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    const handleCheckedChange = (checked: CheckedState) => {\n      if (checked) {\n        setShowConfetti(true);\n        setTimeout(() => setShowConfetti(false), 800);\n      }\n      onCheckedChange?.(checked);\n    };\n\n    const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n    const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n    const gapClass = isVertical ? \"gap-1.5\" : \"gap-2\";\n\n    const alignmentClass =\n      labelAlignment === \"start\"\n        ? \"items-start\"\n        : labelAlignment === \"center\"\n          ? \"items-center\"\n          : \"items-end\";\n\n    const labelClass =\n      \"flex gap-2 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\";\n\n    return (\n      <div className={cn(\"flex flex-col gap-1.5 relative\", {})}>\n        <div className={cn(\"flex\", flexDirection, gapClass, alignmentClass)}>\n          {(labelPosition === \"top\" || labelPosition === \"left\") && label && (\n            <label htmlFor={inputId} className={labelClass}>\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"size-3.5 min-w-3.5\" />\n                </Tooltip>\n              )}\n            </label>\n          )}\n\n          <div className=\"relative inline-flex\">\n            <SCheckbox\n              ref={ref}\n              id={inputId}\n              {...rest}\n              variant={variant}\n              size={size}\n              color={color}\n              icon={icon}\n              onCheckedChange={\n                animation ? handleCheckedChange : onCheckedChange\n              }\n            />\n\n            <AnimatePresence>\n              {showConfetti && (\n                <div className=\"pointer-events-none absolute inset-0\">\n                  {[...Array(12)].map((_, i) => (\n                    <ConfettiPiece key={i} index={i} />\n                  ))}\n                </div>\n              )}\n            </AnimatePresence>\n          </div>\n\n          {(labelPosition === \"bottom\" || labelPosition === \"right\") &&\n            label && (\n              <Label htmlFor={inputId} className={labelClass}>\n                {label}\n                {infoTooltip && (\n                  <Tooltip content={infoTooltip}>\n                    <Info className=\"size-3.5 min-w-3.5\" />\n                  </Tooltip>\n                )}\n              </Label>\n            )}\n        </div>\n\n        {helperText && (\n          <div className=\"flex items-center justify-between text-xs gap-2\">\n            {helperText && (\n              <p\n                className={cn(\n                  \"text-xs\",\n                  state ? helperTextStyles?.[state] : \"\"\n                )}\n              >\n                {helperText}\n              </p>\n            )}\n          </div>\n        )}\n      </div>\n    );\n  }\n);\n\nCheckbox.displayName = \"Checkbox\";\nexport default Checkbox;\n"],"names":["Checkbox","React","props","ref","label","infoTooltip","helperText","state","variant","size","color","labelPosition","labelAlignment","icon","animation","id","onCheckedChange","rest","showConfetti","setShowConfetti","useState","generatedId","inputId","helperTextStyles","handleCheckedChange","checked","isVertical","flexDirection","gapClass","alignmentClass","labelClass","cn","jsxs","Tooltip","jsx","Info","SCheckbox","AnimatePresence","_","i","ConfettiPiece","Label"],"mappings":"wsDAoCMA,EAAWC,EAAM,WACrB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAA,MACJC,EACA,YAAAC,EACA,WAAAC,EACA,MAAAC,EACA,QAAAC,EAAU,UACV,KAAAC,EAAO,UACP,MAAAC,EACA,cAAAC,EAAgB,QAChB,eAAAC,EAAiB,SACjB,KAAAC,EACA,UAAAC,EACA,GAAAC,EACA,gBAAAC,EACA,GAAGC,CAAA,EACDf,EACE,CAACgB,EAAcC,CAAe,EAAIC,EAAAA,SAAS,EAAK,EAChDC,EAAcpB,EAAM,MAAA,EACpBqB,EAAUP,GAAMM,EAGhBE,EAAmB,CACvB,QAAS,wBACT,QAAS,eACT,QAAS,eACT,MAAO,YAAA,EAGHC,EAAuBC,GAA0B,CACjDA,IACFN,EAAgB,EAAI,EACpB,WAAW,IAAMA,EAAgB,EAAK,EAAG,GAAG,GAE9CH,IAAkBS,CAAO,CAC3B,EAEMC,EAAaf,IAAkB,OAASA,IAAkB,SAC1DgB,EAAgBD,EAAa,WAAa,WAC1CE,EAAWF,EAAa,UAAY,QAEpCG,EACJjB,IAAmB,QACf,cACAA,IAAmB,SACjB,eACA,YAEFkB,EACJ,uEAEF,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,iCAAkC,CAAA,CAAE,EACrD,SAAA,CAAAC,OAAC,OAAI,UAAWD,EAAAA,GAAG,OAAQJ,EAAeC,EAAUC,CAAc,EAC9D,SAAA,EAAAlB,IAAkB,OAASA,IAAkB,SAAWP,UACvD,QAAA,CAAM,QAASkB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,EAEJ,EAGFH,EAAAA,KAAC,MAAA,CAAI,UAAU,uBACb,SAAA,CAAAE,EAAAA,IAACE,EAAAA,SAAA,CACC,IAAAjC,EACA,GAAImB,EACH,GAAGL,EACJ,QAAAT,EACA,KAAAC,EACA,MAAAC,EACA,KAAAG,EACA,gBACEC,EAAYU,EAAsBR,CAAA,CAAA,EAItCkB,EAAAA,IAACG,EAAAA,gBAAA,CACE,SAAAnB,GACCgB,EAAAA,IAAC,MAAA,CAAI,UAAU,uCACZ,SAAA,CAAC,GAAG,MAAM,EAAE,CAAC,EAAE,IAAI,CAACI,EAAGC,IACtBL,EAAAA,IAACM,EAAAA,cAAA,CAAsB,MAAOD,CAAA,EAAVA,CAAa,CAClC,CAAA,CACH,CAAA,CAEJ,CAAA,EACF,GAEE5B,IAAkB,UAAYA,IAAkB,UAChDP,UACGqC,EAAAA,MAAA,CAAM,QAASnB,EAAS,UAAWQ,EACjC,SAAA,CAAA1B,EACAC,SACE4B,UAAA,CAAQ,QAAS5B,EAChB,SAAA6B,EAAAA,IAACC,EAAAA,KAAA,CAAK,UAAU,oBAAA,CAAqB,CAAA,CACvC,CAAA,CAAA,CAEJ,CAAA,EAEN,EAEC7B,GACC4B,EAAAA,IAAC,MAAA,CAAI,UAAU,kDACZ,SAAA5B,GACC4B,EAAAA,IAAC,IAAA,CACC,UAAWH,EAAAA,GACT,UACAxB,EAAQgB,IAAmBhB,CAAK,EAAI,EAAA,EAGrC,SAAAD,CAAA,CAAA,CACH,CAEJ,CAAA,EAEJ,CAEJ,CACF,EAEAN,EAAS,YAAc"}

package/dist/cjs/components/Collapsible/Collapsible.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Collapsible.cjs","sources":["../../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Collapsible as SCollapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n} from \"@dsui/ui/components/collapsible\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ChevronDown } from \"lucide-react\";\n\nexport type CollapsibleProps = Omit<\n  React.ComponentProps<typeof SCollapsible>,\n  \"children\" | \"content\"\n> & {\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  showIcon?: boolean;\n  iconPosition?: \"left\" | \"right\";\n  iconRotation?: boolean;\n  triggerClassName?: string;\n  contentClassName?: string;\n  variant?: \"default\" | \"bordered\" | \"ghost\";\n  children?: React.ReactNode;\n};\n\nconst Collapsible = React.forwardRef<\n  React.ElementRef<typeof SCollapsible>,\n  CollapsibleProps\n>((props, ref) => {\n  const {\n    trigger,\n    content,\n    showIcon = true,\n    iconPosition = \"right\",\n    iconRotation = true,\n    triggerClassName,\n    contentClassName,\n    variant = \"default\",\n    className,\n    open,\n    defaultOpen,\n    onOpenChange,\n    children,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState(defaultOpen ?? false);\n\n  React.useEffect(() => {\n    if (open !== undefined) {\n      setIsOpen(open);\n    }\n  }, [open]);\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const variantStyles = {\n    default: {\n      root: \"rounded-lg border bg-card\",\n      trigger: \"px-4 py-3 hover:bg-accent/50\",\n      content: \"px-4 py-3 border-t\",\n    },\n    bordered: {\n      root: \"rounded-lg border-2\",\n      trigger: \"px-4 py-3 font-semibold hover:bg-accent\",\n      content: \"px-4 py-3 border-t-2\",\n    },\n    ghost: {\n      root: \"\",\n      trigger: \"px-2 py-2 hover:bg-accent/30 rounded-md\",\n      content: \"px-2 py-2\",\n    },\n  };\n\n  const styles = variantStyles[variant];\n\n  // If children are provided, use them directly (custom implementation)\n  if (children && !trigger && !content) {\n    return (\n      <SCollapsible\n        ref={ref}\n        open={isOpen}\n        onOpenChange={handleOpenChange}\n        className={cn(styles.root, className)}\n        {...rest}\n      >\n        {children}\n      </SCollapsible>\n    );\n  }\n\n  // Default implementation with trigger and content\n  return (\n    <SCollapsible\n      ref={ref}\n      open={isOpen}\n      onOpenChange={handleOpenChange}\n      className={cn(styles.root, className)}\n      {...rest}\n    >\n      <CollapsibleTrigger\n        className={cn(\n          \"flex w-full items-center justify-between transition-colors\",\n          styles.trigger,\n          triggerClassName\n        )}\n      >\n        {iconPosition === \"left\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n        <span className=\"flex-1 text-left\">{trigger}</span>\n        {iconPosition === \"right\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n      </CollapsibleTrigger>\n      <CollapsibleContent className={cn(styles.content, contentClassName)}>\n        {content}\n      </CollapsibleContent>\n    </SCollapsible>\n  );\n});\n\nCollapsible.displayName = \"Collapsible\";\n\nexport default Collapsible;\nexport { CollapsibleTrigger, CollapsibleContent };\n"],"names":["Collapsible","React","props","ref","trigger","content","showIcon","iconPosition","iconRotation","triggerClassName","contentClassName","variant","className","open","defaultOpen","onOpenChange","children","rest","isOpen","setIsOpen","handleOpenChange","newOpen","styles","jsx","SCollapsible","cn","jsxs","CollapsibleTrigger","ChevronDown","CollapsibleContent"],"mappings":"6SAwBMA,EAAcC,EAAM,WAGxB,CAACC,EAAOC,IAAQ,CAChB,KAAM,CACJ,QAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,aAAAC,EAAe,QACf,aAAAC,EAAe,GACf,iBAAAC,EACA,iBAAAC,EACA,QAAAC,EAAU,UACV,UAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EACDf,EAEE,CAACgB,EAAQC,CAAS,EAAIlB,EAAM,SAASa,GAAe,EAAK,EAE/Db,EAAM,UAAU,IAAM,CAChBY,IAAS,QACXM,EAAUN,CAAI,CAElB,EAAG,CAACA,CAAI,CAAC,EAET,MAAMO,EAAoBC,GAAqB,CAC7CF,EAAUE,CAAO,EACjBN,IAAeM,CAAO,CACxB,EAoBMC,EAlBgB,CACpB,QAAS,CACP,KAAM,4BACN,QAAS,+BACT,QAAS,oBAAA,EAEX,SAAU,CACR,KAAM,sBACN,QAAS,0CACT,QAAS,sBAAA,EAEX,MAAO,CACL,KAAM,GACN,QAAS,0CACT,QAAS,WAAA,CACX,EAG2BX,CAAO,EAGpC,OAAIK,GAAY,CAACZ,GAAW,CAACC,EAEzBkB,EAAAA,IAACC,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEH,SAAAD,CAAA,CAAA,EAOLU,EAAAA,KAACF,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEJ,SAAA,CAAAS,EAAAA,KAACC,EAAAA,mBAAA,CACC,UAAWF,EAAAA,GACT,6DACAH,EAAO,QACPb,CAAA,EAGD,SAAA,CAAAF,IAAiB,QAAUD,GAC1BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,EAGJK,EAAAA,IAAC,OAAA,CAAK,UAAU,mBAAoB,SAAAnB,EAAQ,EAC3CG,IAAiB,SAAWD,GAC3BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,CACF,CAAA,CAAA,EAGJK,MAACM,EAAAA,oBAAmB,UAAWJ,EAAAA,GAAGH,EAAO,QAASZ,CAAgB,EAC/D,SAAAL,CAAA,CACH,CAAA,CAAA,CAAA,CAGN,CAAC,EAEDL,EAAY,YAAc"}
+{"version":3,"file":"Collapsible.cjs","sources":["../../../../src/components/Collapsible/Collapsible.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Collapsible as SCollapsible,\n  CollapsibleTrigger,\n  CollapsibleContent,\n} from \"@dsui/ui/components/collapsible\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { ChevronDown } from \"lucide-react\";\n\nexport type CollapsibleProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SCollapsible>,\n  \"children\" | \"content\" | \"open\" | \"defaultOpen\" | \"onOpenChange\"\n> & {\n  open?: boolean;\n  defaultOpen?: boolean;\n  onOpenChange?: (open: boolean) => void;\n  trigger?: React.ReactNode;\n  content?: React.ReactNode;\n  showIcon?: boolean;\n  iconPosition?: \"left\" | \"right\";\n  iconRotation?: boolean;\n  triggerClassName?: string;\n  contentClassName?: string;\n  variant?: \"default\" | \"bordered\" | \"ghost\";\n  children?: React.ReactNode;\n};\n\nconst Collapsible = React.forwardRef<\n  React.ElementRef<typeof SCollapsible>,\n  CollapsibleProps\n>((props, ref) => {\n  const {\n    trigger,\n    content,\n    showIcon = true,\n    iconPosition = \"right\",\n    iconRotation = true,\n    triggerClassName,\n    contentClassName,\n    variant = \"default\",\n    className,\n    open,\n    defaultOpen,\n    onOpenChange,\n    children,\n    ...rest\n  } = props;\n\n  const [isOpen, setIsOpen] = React.useState(defaultOpen ?? false);\n\n  React.useEffect(() => {\n    if (open !== undefined) {\n      setIsOpen(open);\n    }\n  }, [open]);\n\n  const handleOpenChange = (newOpen: boolean) => {\n    setIsOpen(newOpen);\n    onOpenChange?.(newOpen);\n  };\n\n  const variantStyles = {\n    default: {\n      root: \"rounded-lg border bg-card\",\n      trigger: \"px-4 py-3 hover:bg-accent/50\",\n      content: \"px-4 py-3 border-t\",\n    },\n    bordered: {\n      root: \"rounded-lg border-2\",\n      trigger: \"px-4 py-3 font-semibold hover:bg-accent\",\n      content: \"px-4 py-3 border-t-2\",\n    },\n    ghost: {\n      root: \"\",\n      trigger: \"px-2 py-2 hover:bg-accent/30 rounded-md\",\n      content: \"px-2 py-2\",\n    },\n  };\n\n  const styles = variantStyles[variant];\n\n  // If children are provided, use them directly (custom implementation)\n  if (children && !trigger && !content) {\n    return (\n      <SCollapsible\n        ref={ref}\n        open={isOpen}\n        onOpenChange={handleOpenChange}\n        className={cn(styles.root, className)}\n        {...rest}\n      >\n        {children}\n      </SCollapsible>\n    );\n  }\n\n  // Default implementation with trigger and content\n  return (\n    <SCollapsible\n      ref={ref}\n      open={isOpen}\n      onOpenChange={handleOpenChange}\n      className={cn(styles.root, className)}\n      {...rest}\n    >\n      <CollapsibleTrigger\n        className={cn(\n          \"flex w-full items-center justify-between transition-colors\",\n          styles.trigger,\n          triggerClassName\n        )}\n      >\n        {iconPosition === \"left\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n        <span className=\"flex-1 text-left\">{trigger}</span>\n        {iconPosition === \"right\" && showIcon && (\n          <ChevronDown\n            className={cn(\n              \"size-4 transition-transform duration-200\",\n              iconRotation && isOpen && \"rotate-180\"\n            )}\n          />\n        )}\n      </CollapsibleTrigger>\n      <CollapsibleContent className={cn(styles.content, contentClassName)}>\n        {content}\n      </CollapsibleContent>\n    </SCollapsible>\n  );\n});\n\nCollapsible.displayName = \"Collapsible\";\n\nexport default Collapsible;\nexport { CollapsibleTrigger, CollapsibleContent };\n"],"names":["Collapsible","React","props","ref","trigger","content","showIcon","iconPosition","iconRotation","triggerClassName","contentClassName","variant","className","open","defaultOpen","onOpenChange","children","rest","isOpen","setIsOpen","handleOpenChange","newOpen","styles","jsx","SCollapsible","cn","jsxs","CollapsibleTrigger","ChevronDown","CollapsibleContent"],"mappings":"6SA2BMA,EAAcC,EAAM,WAGxB,CAACC,EAAOC,IAAQ,CAChB,KAAM,CACJ,QAAAC,EACA,QAAAC,EACA,SAAAC,EAAW,GACX,aAAAC,EAAe,QACf,aAAAC,EAAe,GACf,iBAAAC,EACA,iBAAAC,EACA,QAAAC,EAAU,UACV,UAAAC,EACA,KAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,GAAGC,CAAA,EACDf,EAEE,CAACgB,EAAQC,CAAS,EAAIlB,EAAM,SAASa,GAAe,EAAK,EAE/Db,EAAM,UAAU,IAAM,CAChBY,IAAS,QACXM,EAAUN,CAAI,CAElB,EAAG,CAACA,CAAI,CAAC,EAET,MAAMO,EAAoBC,GAAqB,CAC7CF,EAAUE,CAAO,EACjBN,IAAeM,CAAO,CACxB,EAoBMC,EAlBgB,CACpB,QAAS,CACP,KAAM,4BACN,QAAS,+BACT,QAAS,oBAAA,EAEX,SAAU,CACR,KAAM,sBACN,QAAS,0CACT,QAAS,sBAAA,EAEX,MAAO,CACL,KAAM,GACN,QAAS,0CACT,QAAS,WAAA,CACX,EAG2BX,CAAO,EAGpC,OAAIK,GAAY,CAACZ,GAAW,CAACC,EAEzBkB,EAAAA,IAACC,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEH,SAAAD,CAAA,CAAA,EAOLU,EAAAA,KAACF,EAAAA,YAAA,CACC,IAAArB,EACA,KAAMe,EACN,aAAcE,EACd,UAAWK,EAAAA,GAAGH,EAAO,KAAMV,CAAS,EACnC,GAAGK,EAEJ,SAAA,CAAAS,EAAAA,KAACC,EAAAA,mBAAA,CACC,UAAWF,EAAAA,GACT,6DACAH,EAAO,QACPb,CAAA,EAGD,SAAA,CAAAF,IAAiB,QAAUD,GAC1BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,EAGJK,EAAAA,IAAC,OAAA,CAAK,UAAU,mBAAoB,SAAAnB,EAAQ,EAC3CG,IAAiB,SAAWD,GAC3BiB,EAAAA,IAACK,EAAAA,YAAA,CACC,UAAWH,EAAAA,GACT,2CACAjB,GAAgBU,GAAU,YAAA,CAC5B,CAAA,CACF,CAAA,CAAA,EAGJK,MAACM,EAAAA,oBAAmB,UAAWJ,EAAAA,GAAGH,EAAO,QAASZ,CAAgB,EAC/D,SAAAL,CAAA,CACH,CAAA,CAAA,CAAA,CAGN,CAAC,EAEDL,EAAY,YAAc"}

package/dist/cjs/components/Input/Input.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),a=require("react"),K=require("../../packages/ui/src/components/input.cjs"),l=require("../../packages/ui/src/lib/utils.cjs"),Q=require("../FloatLabel.cjs"),m=require("lucide-react"),W=require("use-mask-input"),Y=require("../Tooltip/Tooltip.cjs"),I=a.forwardRef(({className:D,label:x,helperText:p,state:v,size:i,isFloatLabel:u,type:s,mask:f,maskOptions:S,maxLength:h,showCharCount:E,infoTooltip:N,clearable:b,onClear:M,prefixIcon:o,suffixIcon:c,placeholder:_=" ",...t},B)=>{const[g,P]=a.useState(()=>typeof t.value=="string"?t.value.length:typeof t.defaultValue=="string"?t.defaultValue.length:0),H=e=>{P(e.target.value.length),t.onChange&&t.onChange(e)},O=()=>{if(r.current){r.current.value="",P(0);const e={target:r.current,currentTarget:r.current};t.onChange?.(e),M&&M()}},j=a.useId(),r=a.useRef(null),T=a.useCallback(e=>{if(r&&(r.current=e),f&&e){const d=W.withMask(f,S);typeof d=="function"&&d(e)}},[f,S]);a.useImperativeHandle(B,()=>r.current);const[R,U]=a.useState(!1),X={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"},w=u?i==="xl"||i==="lg"?i:"xl":i||"normal",q=(()=>{const e={xs:{prefix:"pl-8",suffix:"pr-8"},sm:{prefix:"pl-9",suffix:"pr-9"},normal:{prefix:"pl-10",suffix:"pr-10"},lg:{prefix:"pl-11",suffix:"pr-11"},xl:{prefix:"pl-12",suffix:"pr-12"}};return e[w]||e.normal})(),V={xs:"size-3",sm:"size-3.5",normal:"size-4",lg:"size-4",xl:"size-4"}[w]||"size-4",A=()=>{const e=s==="number"||s==="password"||s==="datetime"||b&&(g>0||t?.value);return e&&c?s==="password"&&b&&(g>0||t?.value)?"pr-20":"pr-16":e?s==="password"&&b&&(g>0||t?.value)?"pr-16":"pr-10":c?q.suffix:""},k=(()=>{const e={xs:{left:"left-2.5",right:"right-2.5"},sm:{left:"left-3",right:"right-3"},normal:{left:"left-3",right:"right-3"},lg:{left:"left-3.5",right:"right-3.5"},xl:{left:"left-4",right:"right-4"}};return e[w]||e.normal})(),G=()=>{if(r.current){const e=Number(t.step||1),d=t.max?Number(t.max):1/0,y=Number(r.current.value||0),C=Math.min(y+e,d);r.current.value=String(C);const z=new Event("input",{bubbles:!0});r.current.dispatchEvent(z)}},J=()=>{if(r.current){const e=Number(t.step||1),d=t.min?Number(t.min):-1/0,y=Number(r.current.value||0),C=Math.max(y-e,d);r.current.value=String(C);const z=new Event("input",{bubbles:!0});r.current.dispatchEvent(z)}};return n.jsx("div",{className:D,children:n.jsxs("div",{className:l.cn("flex flex-col gap-1.5 relative flex-auto",{"floating-label relative":u}),children:[!u&&x&&n.jsxs("label",{htmlFor:j,className:"flex gap-2 text-sm font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70",children:[x,N&&n.jsx(Y.Tooltip,{content:N,children:n.jsx(m.Info,{className:"size-3.5 min-w-3.5"})})]}),n.jsxs("div",{className:"relative",children:[o&&n.jsx("div",{className:l.cn("absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0",k.left),children:a.isValidElement(o)?a.cloneElement(o,{className:l.cn(V,o.props?.className)}):o}),n.jsx(K.Input,{ref:T,id:j,className:l.cn("peer",{"pt-5 pb-1":u&&i!=="lg","[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield] pr-8":s==="number"},o&&q.prefix,f&&"placeholder:text-slate-400 placeholder:opacity-100",A()),state:v,size:u?i==="xl"||i==="lg"?i:"xl":i,type:s==="password"?R?"text":"password":s,placeholder:_,maxLength:h,onChange:H,...t}),u&&n.jsx(Q.FloatingLabel,{htmlFor:j,size:i,infoTooltip:N,children:x}),s==="number"&&n.jsxs("div",{className:"absolute right-1 top-0 h-full flex flex-col gap-0.5",children:[n.jsx("button",{type:"button",onClick:G,disabled:t.disabled,className:l.cn("h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform","disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"),tabIndex:-1,children:n.jsx(m.ChevronUp,{className:"size-3"})}),n.jsx("button",{type:"button",onClick:J,disabled:t.disabled,className:l.cn("h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform","disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"),tabIndex:-1,children:n.jsx(m.ChevronDown,{className:"size-3"})})]}),b&&(g>0||t?.value)&&!t.disabled&&s!=="number"&&n.jsx("button",{type:"button",tabIndex:-1,className:l.cn("absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors cursor-pointer",s==="password"?c?"right-14":"right-10":c?"right-10":"right-2"),onClick:O,disabled:t.disabled,children:n.jsx(m.X,{className:"size-4"})}),s==="password"&&n.jsx("button",{type:"button",tabIndex:-1,className:l.cn("absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors",c?"right-10":"right-2"),onClick:()=>U(e=>!e),disabled:t.disabled,children:R?n.jsx(m.EyeOff,{className:"size-4"}):n.jsx(m.Eye,{className:"size-4"})}),c&&n.jsx("div",{className:l.cn("absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0",k.right),children:a.isValidElement(c)?a.cloneElement(c,{className:l.cn(V,c.props?.className)}):c})]}),(p||E&&typeof h=="number")&&n.jsxs("div",{className:"flex items-center justify-between text-xs gap-2",children:[p&&n.jsx("p",{className:l.cn("text-xs",v?X?.[v]:""),children:p}),E&&typeof h=="number"&&n.jsxs("span",{className:"ml-auto text-muted-foreground",children:[g," / ",h]})]})]})})});I.displayName="Input";exports.default=I;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const n=require("react/jsx-runtime"),a=require("react"),K=require("../../packages/ui/src/components/input.cjs"),l=require("../../packages/ui/src/lib/utils.cjs"),Q=require("../FloatLabel.cjs"),m=require("lucide-react"),W=require("use-mask-input"),Y=require("../Tooltip/Tooltip.cjs"),Z=require("../../packages/ui/src/components/label.cjs"),I=a.forwardRef(({className:D,label:x,helperText:p,state:v,size:i,isFloatLabel:u,type:s,mask:f,maskOptions:S,maxLength:h,showCharCount:E,infoTooltip:N,clearable:b,onClear:M,prefixIcon:o,suffixIcon:c,placeholder:_=" ",...t},B)=>{const[g,q]=a.useState(()=>typeof t.value=="string"?t.value.length:typeof t.defaultValue=="string"?t.defaultValue.length:0),H=e=>{q(e.target.value.length),t.onChange&&t.onChange(e)},O=()=>{if(r.current){r.current.value="",q(0);const e={target:r.current,currentTarget:r.current};t.onChange?.(e),M&&M()}},j=a.useId(),r=a.useRef(null),T=a.useCallback(e=>{if(r&&(r.current=e),f&&e){const d=W.withMask(f,S);typeof d=="function"&&d(e)}},[f,S]);a.useImperativeHandle(B,()=>r.current);const[P,U]=a.useState(!1),X={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"},w=u?i==="xl"||i==="lg"?i:"xl":i||"normal",R=(()=>{const e={xs:{prefix:"pl-8",suffix:"pr-8"},sm:{prefix:"pl-9",suffix:"pr-9"},normal:{prefix:"pl-10",suffix:"pr-10"},lg:{prefix:"pl-11",suffix:"pr-11"},xl:{prefix:"pl-12",suffix:"pr-12"}};return e[w]||e.normal})(),V={xs:"size-3",sm:"size-3.5",normal:"size-4",lg:"size-4",xl:"size-4"}[w]||"size-4",A=()=>{const e=s==="number"||s==="password"||s==="datetime"||b&&(g>0||t?.value);return e&&c?s==="password"&&b&&(g>0||t?.value)?"pr-20":"pr-16":e?s==="password"&&b&&(g>0||t?.value)?"pr-16":"pr-10":c?R.suffix:""},k=(()=>{const e={xs:{left:"left-2.5",right:"right-2.5"},sm:{left:"left-3",right:"right-3"},normal:{left:"left-3",right:"right-3"},lg:{left:"left-3.5",right:"right-3.5"},xl:{left:"left-4",right:"right-4"}};return e[w]||e.normal})(),G=()=>{if(r.current){const e=Number(t.step||1),d=t.max?Number(t.max):1/0,y=Number(r.current.value||0),C=Math.min(y+e,d);r.current.value=String(C);const z=new Event("input",{bubbles:!0});r.current.dispatchEvent(z)}},J=()=>{if(r.current){const e=Number(t.step||1),d=t.min?Number(t.min):-1/0,y=Number(r.current.value||0),C=Math.max(y-e,d);r.current.value=String(C);const z=new Event("input",{bubbles:!0});r.current.dispatchEvent(z)}};return n.jsx("div",{className:D,children:n.jsxs("div",{className:l.cn("flex flex-col gap-1.5 relative flex-auto",{"floating-label relative":u}),children:[!u&&x&&n.jsxs(Z.Label,{htmlFor:j,className:"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",children:[x,N&&n.jsx(Y.Tooltip,{content:N,children:n.jsx(m.Info,{className:"size-3.5 min-w-3.5"})})]}),n.jsxs("div",{className:"relative",children:[o&&n.jsx("div",{className:l.cn("absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0",k.left),children:a.isValidElement(o)?a.cloneElement(o,{className:l.cn(V,o.props?.className)}):o}),n.jsx(K.Input,{ref:T,id:j,className:l.cn("peer",{"pt-5 pb-1":u&&i!=="lg","[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield] pr-8":s==="number"},o&&R.prefix,f&&"placeholder:text-slate-400 placeholder:opacity-100",A()),state:v,size:u?i==="xl"||i==="lg"?i:"xl":i,type:s==="password"?P?"text":"password":s,placeholder:_,maxLength:h,onChange:H,...t}),u&&n.jsx(Q.FloatingLabel,{htmlFor:j,size:i,infoTooltip:N,children:x}),s==="number"&&n.jsxs("div",{className:"absolute right-1 top-0 h-full flex flex-col gap-0.5",children:[n.jsx("button",{type:"button",onClick:G,disabled:t.disabled,className:l.cn("h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform","disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"),tabIndex:-1,children:n.jsx(m.ChevronUp,{className:"size-3"})}),n.jsx("button",{type:"button",onClick:J,disabled:t.disabled,className:l.cn("h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform","disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent"),tabIndex:-1,children:n.jsx(m.ChevronDown,{className:"size-3"})})]}),b&&(g>0||t?.value)&&!t.disabled&&s!=="number"&&n.jsx("button",{type:"button",tabIndex:-1,className:l.cn("absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors cursor-pointer",s==="password"?c?"right-14":"right-10":c?"right-10":"right-2"),onClick:O,disabled:t.disabled,children:n.jsx(m.X,{className:"size-4"})}),s==="password"&&n.jsx("button",{type:"button",tabIndex:-1,className:l.cn("absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors",c?"right-10":"right-2"),onClick:()=>U(e=>!e),disabled:t.disabled,children:P?n.jsx(m.EyeOff,{className:"size-4"}):n.jsx(m.Eye,{className:"size-4"})}),c&&n.jsx("div",{className:l.cn("absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0",k.right),children:a.isValidElement(c)?a.cloneElement(c,{className:l.cn(V,c.props?.className)}):c})]}),(p||E&&typeof h=="number")&&n.jsxs("div",{className:"flex items-center justify-between text-xs gap-2",children:[p&&n.jsx("p",{className:l.cn("text-xs",v?X?.[v]:""),children:p}),E&&typeof h=="number"&&n.jsxs("span",{className:"ml-auto text-muted-foreground",children:[g," / ",h]})]})]})})});I.displayName="Input";exports.default=I;
 //# sourceMappingURL=Input.cjs.map

package/dist/cjs/components/Input/Input.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Input as SInput,\n  type InputProps as SInputProps,\n} from \"@dsui/ui/components/input\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\nimport { Eye, EyeOff, ChevronDown, ChevronUp, Info, X } from \"lucide-react\";\nimport { withMask, type Options } from \"use-mask-input\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\n\n// Re-export base input props to avoid external dependency issues\nexport type BaseInputProps = Omit<React.ComponentProps<\"input\">, \"size\"> & {\n  size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n  state?: \"default\" | \"success\" | \"error\" | \"warning\";\n};\n\nexport type InputProps = BaseInputProps & {\n  label?: string;\n  helperText?: React.ReactNode;\n  isFloatLabel?: boolean;\n  mask?: string;\n  maskOptions?: {\n    placeholder?: string;\n    inputFormat?: string;\n    outputFormat?: string;\n    showMaskOnHover?: boolean;\n    showMaskOnFocus?: boolean;\n    separate?: boolean;\n  } & Options;\n  maxLength?: number;\n  showCharCount?: boolean;\n  infoTooltip?: React.ReactNode;\n  clearable?: boolean;\n  onClear?: () => void;\n  prefixIcon?: React.ReactNode;\n  suffixIcon?: React.ReactNode;\n};\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      label,\n      helperText,\n      state,\n      size,\n      isFloatLabel,\n      type,\n      mask,\n      maskOptions,\n      maxLength,\n      showCharCount,\n      infoTooltip,\n      clearable,\n      onClear,\n      prefixIcon,\n      suffixIcon,\n      placeholder = \" \",\n      ...props\n    },\n    ref\n  ) => {\n    // Character count state\n    const [charCount, setCharCount] = React.useState(() => {\n      if (typeof props.value === \"string\") return props.value.length;\n      if (typeof props.defaultValue === \"string\")\n        return props.defaultValue.length;\n      return 0;\n    });\n\n    const handleInput = (e: React.ChangeEvent<HTMLInputElement>) => {\n      setCharCount(e.target.value.length);\n      if (props.onChange) props.onChange(e);\n    };\n\n    const handleClear = () => {\n      if (innerRef.current) {\n        innerRef.current.value = \"\";\n        setCharCount(0);\n        const event = {\n          target: innerRef.current,\n          currentTarget: innerRef.current,\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange?.(event);\n        if (onClear) onClear();\n      }\n    };\n\n    const inputId = React.useId();\n    const innerRef = React.useRef<HTMLInputElement>(null);\n\n    // Combine refs\n    const combinedRef = React.useCallback(\n      (element: HTMLInputElement | null) => {\n        // Set innerRef\n        if (innerRef) {\n          (\n            innerRef as React.MutableRefObject<HTMLInputElement | null>\n          ).current = element;\n        }\n\n        // Apply mask if provided\n        if (mask && element) {\n          const maskRefCallback = withMask(mask, maskOptions);\n          if (typeof maskRefCallback === \"function\") {\n            maskRefCallback(element);\n          }\n        }\n      },\n      [mask, maskOptions]\n    );\n\n    // Expose ref to parent\n    React.useImperativeHandle(ref, () => innerRef.current!);\n\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    // State\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    // Calculate current size\n    const currentSize = isFloatLabel\n      ? size === \"xl\" || size === \"lg\"\n        ? size\n        : \"xl\"\n      : size || \"normal\";\n\n    // Calculate padding based on size and icons\n    const getPadding = () => {\n      const sizeMap = {\n        xs: { prefix: \"pl-8\", suffix: \"pr-8\" },\n        sm: { prefix: \"pl-9\", suffix: \"pr-9\" },\n        normal: { prefix: \"pl-10\", suffix: \"pr-10\" },\n        lg: { prefix: \"pl-11\", suffix: \"pr-11\" },\n        xl: { prefix: \"pl-12\", suffix: \"pr-12\" },\n      };\n\n      return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n    };\n\n    const padding = getPadding();\n\n    // Get icon size class based on current size\n    const getIconSizeClass = () => {\n      const sizeMap = {\n        xs: \"size-3\",\n        sm: \"size-3.5\",\n        normal: \"size-4\",\n        lg: \"size-4\",\n        xl: \"size-4\",\n      };\n      return sizeMap[currentSize as keyof typeof sizeMap] || \"size-4\";\n    };\n\n    const iconSizeClass = getIconSizeClass();\n\n    // Calculate right padding considering built-in icons\n    const getRightPadding = () => {\n      const hasBuiltInSuffix =\n        type === \"number\" ||\n        type === \"password\" ||\n        type === \"datetime\" ||\n        (clearable && (charCount > 0 || props?.value));\n\n      if (hasBuiltInSuffix && suffixIcon) {\n        return type === \"password\" &&\n          clearable &&\n          (charCount > 0 || props?.value)\n          ? \"pr-20\" // password + clear + custom icon\n          : \"pr-16\"; // one built-in + custom icon\n      }\n\n      if (hasBuiltInSuffix) {\n        return type === \"password\" &&\n          clearable &&\n          (charCount > 0 || props?.value)\n          ? \"pr-16\" // password + clear\n          : \"pr-10\"; // single built-in icon\n      }\n\n      if (suffixIcon) {\n        return padding.suffix;\n      }\n\n      return \"\";\n    };\n\n    // Icon position calculations\n    const getIconPosition = () => {\n      const sizeMap = {\n        xs: { left: \"left-2.5\", right: \"right-2.5\" },\n        sm: { left: \"left-3\", right: \"right-3\" },\n        normal: { left: \"left-3\", right: \"right-3\" },\n        lg: { left: \"left-3.5\", right: \"right-3.5\" },\n        xl: { left: \"left-4\", right: \"right-4\" },\n      };\n\n      return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n    };\n\n    const iconPosition = getIconPosition();\n\n    /* Spinner Button Handlers */\n    const handleIncrement = () => {\n      if (innerRef.current) {\n        const step = Number(props.step || 1);\n        const max = props.max ? Number(props.max) : Infinity;\n        const currentValue = Number(innerRef.current.value || 0);\n        const newValue = Math.min(currentValue + step, max);\n\n        innerRef.current.value = String(newValue);\n        const event = new Event(\"input\", { bubbles: true });\n        innerRef.current.dispatchEvent(event);\n      }\n    };\n\n    const handleDecrement = () => {\n      if (innerRef.current) {\n        const step = Number(props.step || 1);\n        const min = props.min ? Number(props.min) : -Infinity;\n        const currentValue = Number(innerRef.current.value || 0);\n        const newValue = Math.max(currentValue - step, min);\n\n        innerRef.current.value = String(newValue);\n        const event = new Event(\"input\", { bubbles: true });\n        innerRef.current.dispatchEvent(event);\n      }\n    };\n    /* End Spinner Button Handlers */\n\n    return (\n      <div className={className}>\n        <div\n          className={cn(\"flex flex-col gap-1.5 relative flex-auto\", {\n            \"floating-label relative\": isFloatLabel,\n          })}\n        >\n          {!isFloatLabel && label && (\n            <label\n              htmlFor={inputId}\n              className=\"flex gap-2 text-sm font-medium peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n            >\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"size-3.5 min-w-3.5\" />\n                </Tooltip>\n              )}\n            </label>\n          )}\n\n          <div className=\"relative\">\n            {/* Prefix Icon */}\n            {prefixIcon && (\n              <div\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0\",\n                  iconPosition.left\n                )}\n              >\n                {React.isValidElement(prefixIcon)\n                  ? React.cloneElement(prefixIcon, {\n                      className: cn(\n                        iconSizeClass,\n                        (prefixIcon.props as any)?.className\n                      ),\n                    } as Partial<unknown>)\n                  : prefixIcon}\n              </div>\n            )}\n\n            <SInput\n              ref={combinedRef}\n              id={inputId}\n              className={cn(\n                \"peer\",\n                {\n                  \"pt-5 pb-1\": isFloatLabel && size !== \"lg\",\n                  \"[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield] pr-8\":\n                    type === \"number\",\n                  // \"[-webkit-text-fill-color:var(--foreground)]\": mask,\n                },\n                prefixIcon && padding.prefix,\n                mask && \"placeholder:text-slate-400 placeholder:opacity-100\",\n                getRightPadding()\n                // className,\n              )}\n              state={state}\n              size={\n                isFloatLabel\n                  ? size === \"xl\" || size === \"lg\"\n                    ? size\n                    : \"xl\"\n                  : size\n              }\n              type={\n                type === \"password\"\n                  ? showPassword\n                    ? \"text\"\n                    : \"password\"\n                  : type\n              }\n              placeholder={placeholder}\n              maxLength={maxLength}\n              onChange={handleInput}\n              {...props}\n            />\n            {isFloatLabel && (\n              <FloatingLabel\n                htmlFor={inputId}\n                size={size}\n                infoTooltip={infoTooltip}\n              >\n                {label}\n              </FloatingLabel>\n            )}\n\n            {/* Spinner Buttons */}\n            {type === \"number\" && (\n              <div className=\"absolute right-1 top-0 h-full flex flex-col gap-0.5\">\n                <button\n                  type=\"button\"\n                  onClick={handleIncrement}\n                  disabled={props.disabled}\n                  className={cn(\n                    \"h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform\",\n                    \"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent\"\n                  )}\n                  tabIndex={-1}\n                >\n                  <ChevronUp className=\"size-3\" />\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={handleDecrement}\n                  disabled={props.disabled}\n                  className={cn(\n                    \"h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform\",\n                    \"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent\"\n                  )}\n                  tabIndex={-1}\n                >\n                  <ChevronDown className=\"size-3\" />\n                </button>\n              </div>\n            )}\n\n            {/* Clear Button */}\n            {clearable &&\n              (charCount > 0 || props?.value) &&\n              !props.disabled &&\n              type !== \"number\" && (\n                <button\n                  type=\"button\"\n                  tabIndex={-1}\n                  className={cn(\n                    \"absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors cursor-pointer\",\n                    type === \"password\"\n                      ? suffixIcon\n                        ? \"right-14\"\n                        : \"right-10\"\n                      : suffixIcon\n                        ? \"right-10\"\n                        : \"right-2\"\n                  )}\n                  onClick={handleClear}\n                  disabled={props.disabled}\n                >\n                  <X className=\"size-4\" />\n                </button>\n              )}\n\n            {/* Show/Hide Password Button */}\n            {type === \"password\" && (\n              <button\n                type=\"button\"\n                tabIndex={-1}\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors\",\n                  suffixIcon ? \"right-10\" : \"right-2\"\n                )}\n                onClick={() => setShowPassword((prev) => !prev)}\n                disabled={props.disabled}\n              >\n                {showPassword ? (\n                  <EyeOff className=\"size-4\" />\n                ) : (\n                  <Eye className=\"size-4\" />\n                )}\n              </button>\n            )}\n\n            {/* Suffix Icon */}\n            {suffixIcon && (\n              <div\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0\",\n                  iconPosition.right\n                )}\n              >\n                {React.isValidElement(suffixIcon)\n                  ? React.cloneElement(suffixIcon, {\n                      className: cn(\n                        iconSizeClass,\n                        (suffixIcon.props as any)?.className\n                      ),\n                    } as Partial<unknown>)\n                  : suffixIcon}\n              </div>\n            )}\n          </div>\n\n          {(helperText || (showCharCount && typeof maxLength === \"number\")) && (\n            <div className=\"flex items-center justify-between text-xs gap-2\">\n              {helperText && (\n                <p\n                  className={cn(\n                    \"text-xs\",\n                    state ? helperTextStyles?.[state] : \"\"\n                  )}\n                >\n                  {helperText}\n                </p>\n              )}\n              {showCharCount && typeof maxLength === \"number\" && (\n                <span className=\"ml-auto text-muted-foreground\">\n                  {charCount} / {maxLength}\n                </span>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\nInput.displayName = \"Input\";\nexport default Input;\n"],"names":["Input","React","className","label","helperText","state","size","isFloatLabel","type","mask","maskOptions","maxLength","showCharCount","infoTooltip","clearable","onClear","prefixIcon","suffixIcon","placeholder","props","ref","charCount","setCharCount","handleInput","handleClear","innerRef","event","inputId","combinedRef","element","maskRefCallback","withMask","showPassword","setShowPassword","helperTextStyles","currentSize","padding","sizeMap","iconSizeClass","getRightPadding","hasBuiltInSuffix","iconPosition","handleIncrement","step","max","currentValue","newValue","handleDecrement","min","jsx","jsxs","cn","Tooltip","Info","SInput","FloatingLabel","ChevronUp","ChevronDown","X","prev","EyeOff","Eye"],"mappings":"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"}
+{"version":3,"file":"Input.cjs","sources":["../../../../src/components/Input/Input.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  Input as SInput,\n  type InputProps as SInputProps,\n} from \"@dsui/ui/components/input\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { FloatingLabel } from \"@/components/FloatLabel\";\nimport { Eye, EyeOff, ChevronDown, ChevronUp, Info, X } from \"lucide-react\";\nimport { withMask, type Options } from \"use-mask-input\";\nimport { Tooltip } from \"../Tooltip/Tooltip\";\nimport { Label } from \"../Label\";\n\n// Re-export base input props to avoid external dependency issues\nexport type BaseInputProps = Omit<React.ComponentProps<\"input\">, \"size\"> & {\n  size?: \"normal\" | \"sm\" | \"xs\" | \"lg\" | \"xl\";\n  state?: \"default\" | \"success\" | \"error\" | \"warning\";\n};\n\nexport type InputProps = BaseInputProps & {\n  label?: string;\n  helperText?: React.ReactNode;\n  isFloatLabel?: boolean;\n  mask?: string;\n  maskOptions?: {\n    placeholder?: string;\n    inputFormat?: string;\n    outputFormat?: string;\n    showMaskOnHover?: boolean;\n    showMaskOnFocus?: boolean;\n    separate?: boolean;\n  } & Options;\n  maxLength?: number;\n  showCharCount?: boolean;\n  infoTooltip?: React.ReactNode;\n  clearable?: boolean;\n  onClear?: () => void;\n  prefixIcon?: React.ReactNode;\n  suffixIcon?: React.ReactNode;\n};\n\nconst Input = React.forwardRef<HTMLInputElement, InputProps>(\n  (\n    {\n      className,\n      label,\n      helperText,\n      state,\n      size,\n      isFloatLabel,\n      type,\n      mask,\n      maskOptions,\n      maxLength,\n      showCharCount,\n      infoTooltip,\n      clearable,\n      onClear,\n      prefixIcon,\n      suffixIcon,\n      placeholder = \" \",\n      ...props\n    },\n    ref\n  ) => {\n    // Character count state\n    const [charCount, setCharCount] = React.useState(() => {\n      if (typeof props.value === \"string\") return props.value.length;\n      if (typeof props.defaultValue === \"string\")\n        return props.defaultValue.length;\n      return 0;\n    });\n\n    const handleInput = (e: React.ChangeEvent<HTMLInputElement>) => {\n      setCharCount(e.target.value.length);\n      if (props.onChange) props.onChange(e);\n    };\n\n    const handleClear = () => {\n      if (innerRef.current) {\n        innerRef.current.value = \"\";\n        setCharCount(0);\n        const event = {\n          target: innerRef.current,\n          currentTarget: innerRef.current,\n        } as React.ChangeEvent<HTMLInputElement>;\n        props.onChange?.(event);\n        if (onClear) onClear();\n      }\n    };\n\n    const inputId = React.useId();\n    const innerRef = React.useRef<HTMLInputElement>(null);\n\n    // Combine refs\n    const combinedRef = React.useCallback(\n      (element: HTMLInputElement | null) => {\n        // Set innerRef\n        if (innerRef) {\n          (\n            innerRef as React.MutableRefObject<HTMLInputElement | null>\n          ).current = element;\n        }\n\n        // Apply mask if provided\n        if (mask && element) {\n          const maskRefCallback = withMask(mask, maskOptions);\n          if (typeof maskRefCallback === \"function\") {\n            maskRefCallback(element);\n          }\n        }\n      },\n      [mask, maskOptions]\n    );\n\n    // Expose ref to parent\n    React.useImperativeHandle(ref, () => innerRef.current!);\n\n    const [showPassword, setShowPassword] = React.useState(false);\n\n    // State\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    // Calculate current size\n    const currentSize = isFloatLabel\n      ? size === \"xl\" || size === \"lg\"\n        ? size\n        : \"xl\"\n      : size || \"normal\";\n\n    // Calculate padding based on size and icons\n    const getPadding = () => {\n      const sizeMap = {\n        xs: { prefix: \"pl-8\", suffix: \"pr-8\" },\n        sm: { prefix: \"pl-9\", suffix: \"pr-9\" },\n        normal: { prefix: \"pl-10\", suffix: \"pr-10\" },\n        lg: { prefix: \"pl-11\", suffix: \"pr-11\" },\n        xl: { prefix: \"pl-12\", suffix: \"pr-12\" },\n      };\n\n      return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n    };\n\n    const padding = getPadding();\n\n    // Get icon size class based on current size\n    const getIconSizeClass = () => {\n      const sizeMap = {\n        xs: \"size-3\",\n        sm: \"size-3.5\",\n        normal: \"size-4\",\n        lg: \"size-4\",\n        xl: \"size-4\",\n      };\n      return sizeMap[currentSize as keyof typeof sizeMap] || \"size-4\";\n    };\n\n    const iconSizeClass = getIconSizeClass();\n\n    // Calculate right padding considering built-in icons\n    const getRightPadding = () => {\n      const hasBuiltInSuffix =\n        type === \"number\" ||\n        type === \"password\" ||\n        type === \"datetime\" ||\n        (clearable && (charCount > 0 || props?.value));\n\n      if (hasBuiltInSuffix && suffixIcon) {\n        return type === \"password\" &&\n          clearable &&\n          (charCount > 0 || props?.value)\n          ? \"pr-20\" // password + clear + custom icon\n          : \"pr-16\"; // one built-in + custom icon\n      }\n\n      if (hasBuiltInSuffix) {\n        return type === \"password\" &&\n          clearable &&\n          (charCount > 0 || props?.value)\n          ? \"pr-16\" // password + clear\n          : \"pr-10\"; // single built-in icon\n      }\n\n      if (suffixIcon) {\n        return padding.suffix;\n      }\n\n      return \"\";\n    };\n\n    // Icon position calculations\n    const getIconPosition = () => {\n      const sizeMap = {\n        xs: { left: \"left-2.5\", right: \"right-2.5\" },\n        sm: { left: \"left-3\", right: \"right-3\" },\n        normal: { left: \"left-3\", right: \"right-3\" },\n        lg: { left: \"left-3.5\", right: \"right-3.5\" },\n        xl: { left: \"left-4\", right: \"right-4\" },\n      };\n\n      return sizeMap[currentSize as keyof typeof sizeMap] || sizeMap.normal;\n    };\n\n    const iconPosition = getIconPosition();\n\n    /* Spinner Button Handlers */\n    const handleIncrement = () => {\n      if (innerRef.current) {\n        const step = Number(props.step || 1);\n        const max = props.max ? Number(props.max) : Infinity;\n        const currentValue = Number(innerRef.current.value || 0);\n        const newValue = Math.min(currentValue + step, max);\n\n        innerRef.current.value = String(newValue);\n        const event = new Event(\"input\", { bubbles: true });\n        innerRef.current.dispatchEvent(event);\n      }\n    };\n\n    const handleDecrement = () => {\n      if (innerRef.current) {\n        const step = Number(props.step || 1);\n        const min = props.min ? Number(props.min) : -Infinity;\n        const currentValue = Number(innerRef.current.value || 0);\n        const newValue = Math.max(currentValue - step, min);\n\n        innerRef.current.value = String(newValue);\n        const event = new Event(\"input\", { bubbles: true });\n        innerRef.current.dispatchEvent(event);\n      }\n    };\n    /* End Spinner Button Handlers */\n\n    return (\n      <div className={className}>\n        <div\n          className={cn(\"flex flex-col gap-1.5 relative flex-auto\", {\n            \"floating-label relative\": isFloatLabel,\n          })}\n        >\n          {!isFloatLabel && label && (\n            <Label\n              htmlFor={inputId}\n              className=\"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n            >\n              {label}\n              {infoTooltip && (\n                <Tooltip content={infoTooltip}>\n                  <Info className=\"size-3.5 min-w-3.5\" />\n                </Tooltip>\n              )}\n            </Label>\n          )}\n\n          <div className=\"relative\">\n            {/* Prefix Icon */}\n            {prefixIcon && (\n              <div\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0\",\n                  iconPosition.left\n                )}\n              >\n                {React.isValidElement(prefixIcon)\n                  ? React.cloneElement(prefixIcon, {\n                      className: cn(\n                        iconSizeClass,\n                        (prefixIcon.props as any)?.className\n                      ),\n                    } as Partial<unknown>)\n                  : prefixIcon}\n              </div>\n            )}\n\n            <SInput\n              ref={combinedRef}\n              id={inputId}\n              className={cn(\n                \"peer\",\n                {\n                  \"pt-5 pb-1\": isFloatLabel && size !== \"lg\",\n                  \"[&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none [-moz-appearance:textfield] pr-8\":\n                    type === \"number\",\n                  // \"[-webkit-text-fill-color:var(--foreground)]\": mask,\n                },\n                prefixIcon && padding.prefix,\n                mask && \"placeholder:text-slate-400 placeholder:opacity-100\",\n                getRightPadding()\n                // className,\n              )}\n              state={state}\n              size={\n                isFloatLabel\n                  ? size === \"xl\" || size === \"lg\"\n                    ? size\n                    : \"xl\"\n                  : size\n              }\n              type={\n                type === \"password\"\n                  ? showPassword\n                    ? \"text\"\n                    : \"password\"\n                  : type\n              }\n              placeholder={placeholder}\n              maxLength={maxLength}\n              onChange={handleInput}\n              {...props}\n            />\n            {isFloatLabel && (\n              <FloatingLabel\n                htmlFor={inputId}\n                size={size}\n                infoTooltip={infoTooltip}\n              >\n                {label}\n              </FloatingLabel>\n            )}\n\n            {/* Spinner Buttons */}\n            {type === \"number\" && (\n              <div className=\"absolute right-1 top-0 h-full flex flex-col gap-0.5\">\n                <button\n                  type=\"button\"\n                  onClick={handleIncrement}\n                  disabled={props.disabled}\n                  className={cn(\n                    \"h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform\",\n                    \"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent\"\n                  )}\n                  tabIndex={-1}\n                >\n                  <ChevronUp className=\"size-3\" />\n                </button>\n                <button\n                  type=\"button\"\n                  onClick={handleDecrement}\n                  disabled={props.disabled}\n                  className={cn(\n                    \"h-1/2 w-6 flex items-center justify-center rounded cursor-pointer hover:scale-150 transition-transform\",\n                    \"disabled:opacity-50 disabled:cursor-not-allowed disabled:hover:bg-transparent\"\n                  )}\n                  tabIndex={-1}\n                >\n                  <ChevronDown className=\"size-3\" />\n                </button>\n              </div>\n            )}\n\n            {/* Clear Button */}\n            {clearable &&\n              (charCount > 0 || props?.value) &&\n              !props.disabled &&\n              type !== \"number\" && (\n                <button\n                  type=\"button\"\n                  tabIndex={-1}\n                  className={cn(\n                    \"absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors cursor-pointer\",\n                    type === \"password\"\n                      ? suffixIcon\n                        ? \"right-14\"\n                        : \"right-10\"\n                      : suffixIcon\n                        ? \"right-10\"\n                        : \"right-2\"\n                  )}\n                  onClick={handleClear}\n                  disabled={props.disabled}\n                >\n                  <X className=\"size-4\" />\n                </button>\n              )}\n\n            {/* Show/Hide Password Button */}\n            {type === \"password\" && (\n              <button\n                type=\"button\"\n                tabIndex={-1}\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 p-1 rounded hover:bg-accent transition-colors\",\n                  suffixIcon ? \"right-10\" : \"right-2\"\n                )}\n                onClick={() => setShowPassword((prev) => !prev)}\n                disabled={props.disabled}\n              >\n                {showPassword ? (\n                  <EyeOff className=\"size-4\" />\n                ) : (\n                  <Eye className=\"size-4\" />\n                )}\n              </button>\n            )}\n\n            {/* Suffix Icon */}\n            {suffixIcon && (\n              <div\n                className={cn(\n                  \"absolute top-1/2 -translate-y-1/2 text-muted-foreground leading-0\",\n                  iconPosition.right\n                )}\n              >\n                {React.isValidElement(suffixIcon)\n                  ? React.cloneElement(suffixIcon, {\n                      className: cn(\n                        iconSizeClass,\n                        (suffixIcon.props as any)?.className\n                      ),\n                    } as Partial<unknown>)\n                  : suffixIcon}\n              </div>\n            )}\n          </div>\n\n          {(helperText || (showCharCount && typeof maxLength === \"number\")) && (\n            <div className=\"flex items-center justify-between text-xs gap-2\">\n              {helperText && (\n                <p\n                  className={cn(\n                    \"text-xs\",\n                    state ? helperTextStyles?.[state] : \"\"\n                  )}\n                >\n                  {helperText}\n                </p>\n              )}\n              {showCharCount && typeof maxLength === \"number\" && (\n                <span className=\"ml-auto text-muted-foreground\">\n                  {charCount} / {maxLength}\n                </span>\n              )}\n            </div>\n          )}\n        </div>\n      </div>\n    );\n  }\n);\n\nInput.displayName = \"Input\";\nexport default Input;\n"],"names":["Input","React","className","label","helperText","state","size","isFloatLabel","type","mask","maskOptions","maxLength","showCharCount","infoTooltip","clearable","onClear","prefixIcon","suffixIcon","placeholder","props","ref","charCount","setCharCount","handleInput","handleClear","innerRef","event","inputId","combinedRef","element","maskRefCallback","withMask","showPassword","setShowPassword","helperTextStyles","currentSize","padding","sizeMap","iconSizeClass","getRightPadding","hasBuiltInSuffix","iconPosition","handleIncrement","step","max","currentValue","newValue","handleDecrement","min","jsx","jsxs","cn","Label","Tooltip","Info","SInput","FloatingLabel","ChevronUp","ChevronDown","X","prev","EyeOff","Eye"],"mappings":"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"}

package/dist/cjs/components/InputOTP/InputOTP.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"InputOTP.cjs","sources":["../../../../src/components/InputOTP/InputOTP.tsx"],"sourcesContent":["import React, { useId } from \"react\";\n\nimport {\n  InputOTP as SInputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  type InputOTPProps as SInputOTPProps,\n  REGEXP_ONLY_DIGITS,\n  REGEXP_ONLY_CHARS,\n  REGEXP_ONLY_DIGITS_AND_CHARS,\n  inputOTPSlotVariants,\n} from \"@dsui/ui/components/input-otp\";\nimport { Label } from \"@dsui/ui/components/label\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@dsui/ui/index\";\n\ntype InputOTPProps = Omit<SInputOTPProps, \"size\" | \"render\" | \"maxLength\"> & {\n  label?: React.ReactNode;\n  length?: number;\n  inputType?: \"digits\" | \"chars\" | \"digits-and-chars\";\n  size?: VariantProps<typeof inputOTPSlotVariants>[\"size\"];\n  state?: VariantProps<typeof inputOTPSlotVariants>[\"state\"];\n  variant?: VariantProps<typeof inputOTPSlotVariants>[\"variant\"];\n  regexPattern?: string;\n  helperText?: React.ReactNode;\n  gapSize?: number;\n  className?: string;\n  rootClassName?: string;\n  childClassName?: string;\n};\n\nconst InputOTP = React.forwardRef<\n  React.ElementRef<typeof SInputOTP>,\n  InputOTPProps\n>(\n  (\n    {\n      label,\n      inputType = \"digits\",\n      regexPattern,\n      length,\n      size = \"normal\",\n      state = \"default\",\n      helperText,\n      gapSize = 4,\n      variant = \"outlined\",\n      className,\n      rootClassName,\n      childClassName,\n      ...rest\n    },\n    ref\n  ) => {\n    const id = useId();\n\n    const pattern =\n      inputType === \"digits\"\n        ? REGEXP_ONLY_DIGITS\n        : inputType === \"chars\"\n          ? REGEXP_ONLY_CHARS\n          : inputType === \"digits-and-chars\"\n            ? REGEXP_ONLY_DIGITS_AND_CHARS\n            : undefined;\n\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    return (\n      <div className={cn(\"flex flex-col gap-1.5 relative\", rootClassName)}>\n        <Label htmlFor={id}>{label}</Label>\n        <SInputOTP\n          id={id}\n          maxLength={length ?? 4}\n          pattern={regexPattern ?? pattern}\n          ref={ref}\n          {...rest}\n        >\n          <InputOTPGroup\n            className={cn(\n              {\n                \"gap-2 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border\":\n                  variant === \"outlined\" && gapSize > 0,\n              },\n              className\n            )}\n            style={gapSize > 0 ? { gap: `${gapSize}px` } : undefined}\n          >\n            {Array.from({ length: length ?? 4 }).map((_, index) => (\n              <InputOTPSlot\n                key={index}\n                index={index}\n                size={size}\n                state={state ?? undefined}\n                variant={variant}\n                className={childClassName}\n              />\n            ))}\n          </InputOTPGroup>\n        </SInputOTP>\n        {helperText && (\n          <p className={cn(\"text-xs\", state ? helperTextStyles?.[state] : \"\")}>\n            {helperText}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default InputOTP;\n"],"names":["InputOTP","React","label","inputType","regexPattern","length","size","state","helperText","gapSize","variant","className","rootClassName","childClassName","rest","ref","id","useId","pattern","REGEXP_ONLY_DIGITS","REGEXP_ONLY_CHARS","REGEXP_ONLY_DIGITS_AND_CHARS","helperTextStyles","cn","jsx","Label","SInputOTP","InputOTPGroup","_","index","InputOTPSlot"],"mappings":"wnDA+BMA,EAAWC,EAAM,WAIrB,CACE,CAAA,MACEC,EACA,UAAAC,EAAY,SACZ,aAAAC,EACA,OAAAC,EACA,KAAAC,EAAO,SACP,MAAAC,EAAQ,UACR,WAAAC,EACA,QAAAC,EAAU,EACV,QAAAC,EAAU,WACV,UAAAC,EACA,cAAAC,EACA,eAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAKC,EAAAA,MAAA,EAELC,EACJf,IAAc,SACVgB,qBACAhB,IAAc,QACZiB,oBACAjB,IAAc,mBACZkB,EAAAA,6BACA,OAEJC,EAAmB,CACvB,QAAS,wBACT,QAAS,eACT,QAAS,eACT,MAAO,YAAA,EAGT,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,iCAAkCX,CAAa,EAChE,SAAA,CAAAY,EAAAA,IAACC,EAAAA,MAAA,CAAM,QAAST,EAAK,SAAAd,EAAM,EAC3BsB,EAAAA,IAACE,EAAAA,SAAA,CACC,GAAAV,EACA,UAAWX,GAAU,EACrB,QAASD,GAAgBc,EACzB,IAAAH,EACC,GAAGD,EAEJ,SAAAU,EAAAA,IAACG,EAAAA,cAAA,CACC,UAAWJ,EAAAA,GACT,CACE,oFACEb,IAAY,YAAcD,EAAU,CAAA,EAExCE,CAAA,EAEF,MAAOF,EAAU,EAAI,CAAE,IAAK,GAAGA,CAAO,MAAS,OAE9C,SAAA,MAAM,KAAK,CAAE,OAAQJ,GAAU,CAAA,CAAG,EAAE,IAAI,CAACuB,EAAGC,IAC3CL,EAAAA,IAACM,EAAAA,aAAA,CAEC,MAAAD,EACA,KAAAvB,EACA,MAAOC,GAAS,OAChB,QAAAG,EACA,UAAWG,CAAA,EALNgB,CAAA,CAOR,CAAA,CAAA,CACH,CAAA,EAEDrB,GACCgB,EAAAA,IAAC,IAAA,CAAE,UAAWD,EAAAA,GAAG,UAAWhB,EAAQe,IAAmBf,CAAK,EAAI,EAAE,EAC/D,SAAAC,CAAA,CACH,CAAA,EAEJ,CAEJ,CACF"}
+{"version":3,"file":"InputOTP.cjs","sources":["../../../../src/components/InputOTP/InputOTP.tsx"],"sourcesContent":["import React, { useId } from \"react\";\n\nimport {\n  InputOTP as SInputOTP,\n  InputOTPGroup,\n  InputOTPSlot,\n  type InputOTPProps as SInputOTPProps,\n  REGEXP_ONLY_DIGITS,\n  REGEXP_ONLY_CHARS,\n  REGEXP_ONLY_DIGITS_AND_CHARS,\n  inputOTPSlotVariants,\n} from \"@dsui/ui/components/input-otp\";\nimport { Label } from \"@dsui/ui/components/label\";\nimport type { VariantProps } from \"class-variance-authority\";\nimport { cn } from \"@dsui/ui/index\";\n\nexport type InputOTPProps = Omit<\n  SInputOTPProps,\n  \"size\" | \"render\" | \"maxLength\"\n> & {\n  label?: React.ReactNode;\n  length?: number;\n  inputType?: \"digits\" | \"chars\" | \"digits-and-chars\";\n  size?: VariantProps<typeof inputOTPSlotVariants>[\"size\"];\n  state?: VariantProps<typeof inputOTPSlotVariants>[\"state\"];\n  variant?: VariantProps<typeof inputOTPSlotVariants>[\"variant\"];\n  regexPattern?: string;\n  helperText?: React.ReactNode;\n  gapSize?: number;\n  className?: string;\n  rootClassName?: string;\n  childClassName?: string;\n};\n\nconst InputOTP = React.forwardRef<\n  React.ElementRef<typeof SInputOTP>,\n  InputOTPProps\n>(\n  (\n    {\n      label,\n      inputType = \"digits\",\n      regexPattern,\n      length,\n      size = \"normal\",\n      state = \"default\",\n      helperText,\n      gapSize = 4,\n      variant = \"outlined\",\n      className,\n      rootClassName,\n      childClassName,\n      ...rest\n    },\n    ref\n  ) => {\n    const id = useId();\n\n    const pattern =\n      inputType === \"digits\"\n        ? REGEXP_ONLY_DIGITS\n        : inputType === \"chars\"\n          ? REGEXP_ONLY_CHARS\n          : inputType === \"digits-and-chars\"\n            ? REGEXP_ONLY_DIGITS_AND_CHARS\n            : undefined;\n\n    const helperTextStyles = {\n      default: \"text-muted-foreground\",\n      success: \"text-success\",\n      warning: \"text-warning\",\n      error: \"text-error\",\n    };\n\n    return (\n      <div className={cn(\"flex flex-col gap-1.5 relative\", rootClassName)}>\n        <Label htmlFor={id}>{label}</Label>\n        <SInputOTP\n          id={id}\n          maxLength={length ?? 4}\n          pattern={regexPattern ?? pattern}\n          ref={ref}\n          {...rest}\n        >\n          <InputOTPGroup\n            className={cn(\n              {\n                \"gap-2 *:data-[slot=input-otp-slot]:rounded-md *:data-[slot=input-otp-slot]:border\":\n                  variant === \"outlined\" && gapSize > 0,\n              },\n              className\n            )}\n            style={gapSize > 0 ? { gap: `${gapSize}px` } : undefined}\n          >\n            {Array.from({ length: length ?? 4 }).map((_, index) => (\n              <InputOTPSlot\n                key={index}\n                index={index}\n                size={size}\n                state={state ?? undefined}\n                variant={variant}\n                className={childClassName}\n              />\n            ))}\n          </InputOTPGroup>\n        </SInputOTP>\n        {helperText && (\n          <p className={cn(\"text-xs\", state ? helperTextStyles?.[state] : \"\")}>\n            {helperText}\n          </p>\n        )}\n      </div>\n    );\n  }\n);\n\nexport default InputOTP;\n"],"names":["InputOTP","React","label","inputType","regexPattern","length","size","state","helperText","gapSize","variant","className","rootClassName","childClassName","rest","ref","id","useId","pattern","REGEXP_ONLY_DIGITS","REGEXP_ONLY_CHARS","REGEXP_ONLY_DIGITS_AND_CHARS","helperTextStyles","cn","jsx","Label","SInputOTP","InputOTPGroup","_","index","InputOTPSlot"],"mappings":"wnDAkCMA,EAAWC,EAAM,WAIrB,CACE,CAAA,MACEC,EACA,UAAAC,EAAY,SACZ,aAAAC,EACA,OAAAC,EACA,KAAAC,EAAO,SACP,MAAAC,EAAQ,UACR,WAAAC,EACA,QAAAC,EAAU,EACV,QAAAC,EAAU,WACV,UAAAC,EACA,cAAAC,EACA,eAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAKC,EAAAA,MAAA,EAELC,EACJf,IAAc,SACVgB,qBACAhB,IAAc,QACZiB,oBACAjB,IAAc,mBACZkB,EAAAA,6BACA,OAEJC,EAAmB,CACvB,QAAS,wBACT,QAAS,eACT,QAAS,eACT,MAAO,YAAA,EAGT,cACG,MAAA,CAAI,UAAWC,EAAAA,GAAG,iCAAkCX,CAAa,EAChE,SAAA,CAAAY,EAAAA,IAACC,EAAAA,MAAA,CAAM,QAAST,EAAK,SAAAd,EAAM,EAC3BsB,EAAAA,IAACE,EAAAA,SAAA,CACC,GAAAV,EACA,UAAWX,GAAU,EACrB,QAASD,GAAgBc,EACzB,IAAAH,EACC,GAAGD,EAEJ,SAAAU,EAAAA,IAACG,EAAAA,cAAA,CACC,UAAWJ,EAAAA,GACT,CACE,oFACEb,IAAY,YAAcD,EAAU,CAAA,EAExCE,CAAA,EAEF,MAAOF,EAAU,EAAI,CAAE,IAAK,GAAGA,CAAO,MAAS,OAE9C,SAAA,MAAM,KAAK,CAAE,OAAQJ,GAAU,CAAA,CAAG,EAAE,IAAI,CAACuB,EAAGC,IAC3CL,EAAAA,IAACM,EAAAA,aAAA,CAEC,MAAAD,EACA,KAAAvB,EACA,MAAOC,GAAS,OAChB,QAAAG,EACA,UAAWG,CAAA,EALNgB,CAAA,CAOR,CAAA,CAAA,CACH,CAAA,EAEDrB,GACCgB,EAAAA,IAAC,IAAA,CAAE,UAAWD,EAAAA,GAAG,UAAWhB,EAAQe,IAAmBf,CAAK,EAAI,EAAE,EAC/D,SAAAC,CAAA,CACH,CAAA,EAEJ,CAEJ,CACF"}

package/dist/cjs/components/Radio/Radio.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  RadioGroupItem as SRadioGroupItem,\n  RadioGroup as SRadioGroup,\n  type RadioGroupProps,\n  type RadioGroupItemProps,\n} from \"@dsui/ui/components/radio-group\";\nimport { cn } from \"@dsui/ui/index\";\n\ntype RadioItemProps = RadioGroupItemProps & {\n  label?: React.ReactNode;\n  variant?: \"option\" | \"button-group\";\n  size?: \"default\" | \"sm\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  rootClassName?: string;\n};\n\nconst RadioItem = React.forwardRef<HTMLButtonElement, RadioItemProps>(\n  (props, ref) => {\n    const { label, variant = \"option\", rootClassName, ...itemProps } = props;\n    const id = React.useId();\n\n    return (\n      <div className={cn(\"flex items-center space-x-2\", rootClassName)}>\n        <SRadioGroupItem ref={ref} id={id} {...itemProps} />\n        {variant === \"option\" && label && (\n          <label\n            htmlFor={id}\n            className=\"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n          >\n            {label}\n          </label>\n        )}\n        {variant === \"button-group\" && label && (\n          <span className=\"sr-only\">{label}</span>\n        )}\n      </div>\n    );\n  }\n);\n\nRadioItem.displayName = \"RadioItem\";\n\ntype RadioProps = {\n  options?: Array<{\n    label: React.ReactNode;\n    value: string;\n    disabled?: boolean;\n  }>;\n  label?: React.ReactNode;\n  helperText?: React.ReactNode;\n  variant?: \"option\" | \"button-group\";\n  size?: \"default\" | \"sm\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  value?: string;\n  onValueChange?: (value: string) => void;\n  children?: React.ReactNode;\n  className?: string;\n  rootClassName?: string;\n  disabled?: boolean;\n} & RadioGroupProps;\n\nconst Radio = React.forwardRef<HTMLDivElement, RadioProps>((props, ref) => {\n  const {\n    options,\n    label,\n    helperText,\n    variant = \"option\",\n    size = \"default\",\n    color,\n    value,\n    onValueChange,\n    children,\n    className,\n    rootClassName,\n    disabled,\n  } = props;\n\n  return (\n    <div className={cn(\"flex flex-col gap-1.5\", rootClassName)}>\n      {label && <label className=\"text-sm font-medium\">{label}</label>}\n\n      <SRadioGroup\n        ref={ref}\n        value={value}\n        onValueChange={onValueChange}\n        variant={variant}\n        className={cn(className)}\n      >\n        {options &&\n          options.map((option) => (\n            <RadioItem\n              key={option.value}\n              value={option.value}\n              label={option.label}\n              disabled={disabled || option.disabled}\n              variant={variant}\n              size={size}\n              color={color}\n            />\n          ))}\n        {children}\n      </SRadioGroup>\n\n      {helperText && (\n        <p className=\"text-xs text-muted-foreground\">{helperText}</p>\n      )}\n    </div>\n  );\n}) as React.ForwardRefExoticComponent<\n  RadioProps & React.RefAttributes<HTMLDivElement>\n> & {\n  Group: typeof SRadioGroup;\n  Item: typeof RadioItem;\n};\n\nRadio.displayName = \"Radio\";\n\nRadio.Group = SRadioGroup;\nRadio.Item = RadioItem;\n\nexport default Radio;\nexport { type RadioProps, type RadioGroupProps, type RadioGroupItemProps };\n"],"names":["RadioItem","React","props","ref","label","variant","rootClassName","itemProps","id","cn","jsx","SRadioGroupItem","Radio","options","helperText","size","color","value","onValueChange","children","className","disabled","jsxs","SRadioGroup","option"],"mappings":"okDAyBA,MAAMA,EAAYC,EAAM,WACtB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAU,SAAU,cAAAC,EAAe,GAAGC,GAAcL,EAC7DM,EAAKP,EAAM,MAAA,EAEjB,cACG,MAAA,CAAI,UAAWQ,EAAAA,GAAG,8BAA+BH,CAAa,EAC7D,SAAA,CAAAI,EAAAA,IAACC,EAAAA,eAAA,CAAgB,IAAAR,EAAU,GAAAK,EAAS,GAAGD,CAAA,CAAW,EACjDF,IAAY,UAAYD,GACvBM,EAAAA,IAAC,QAAA,CACC,QAASF,EACT,UAAU,6FAET,SAAAJ,CAAA,CAAA,EAGJC,IAAY,gBAAkBD,SAC5B,OAAA,CAAK,UAAU,UAAW,SAAAA,CAAA,CAAM,CAAA,EAErC,CAEJ,CACF,EAEAJ,EAAU,YAAc,YA6BxB,MAAMY,EAAQX,EAAM,WAAuC,CAACC,EAAOC,IAAQ,CACzE,KAAM,CACJ,QAAAU,EACA,MAAAT,EACA,WAAAU,EACA,QAAAT,EAAU,SACV,KAAAU,EAAO,UACP,MAAAC,EACA,MAAAC,EACA,cAAAC,EACA,SAAAC,EACA,UAAAC,EACA,cAAAd,EACA,SAAAe,CAAA,EACEnB,EAEJ,cACG,MAAA,CAAI,UAAWO,EAAAA,GAAG,wBAAyBH,CAAa,EACtD,SAAA,CAAAF,GAASM,EAAAA,IAAC,QAAA,CAAM,UAAU,sBAAuB,SAAAN,EAAM,EAExDkB,EAAAA,KAACC,EAAAA,WAAA,CACC,IAAApB,EACA,MAAAc,EACA,cAAAC,EACA,QAAAb,EACA,UAAWI,EAAAA,GAAGW,CAAS,EAEtB,SAAA,CAAAP,GACCA,EAAQ,IAAKW,GACXd,EAAAA,IAACV,EAAA,CAEC,MAAOwB,EAAO,MACd,MAAOA,EAAO,MACd,SAAUH,GAAYG,EAAO,SAC7B,QAAAnB,EACA,KAAAU,EACA,MAAAC,CAAA,EANKQ,EAAO,KAAA,CAQf,EACFL,CAAA,CAAA,CAAA,EAGFL,GACCJ,EAAAA,IAAC,IAAA,CAAE,UAAU,gCAAiC,SAAAI,CAAA,CAAW,CAAA,EAE7D,CAEJ,CAAC,EAODF,EAAM,YAAc,QAEpBA,EAAM,MAAQW,EAAAA,WACdX,EAAM,KAAOZ"}
+{"version":3,"file":"Radio.cjs","sources":["../../../../src/components/Radio/Radio.tsx"],"sourcesContent":["import React from \"react\";\nimport {\n  RadioGroupItem as SRadioGroupItem,\n  RadioGroup as SRadioGroup,\n  type RadioGroupProps,\n  type RadioGroupItemProps,\n} from \"@dsui/ui/components/radio-group\";\nimport { cn } from \"@dsui/ui/index\";\n\nexport type RadioItemProps = RadioGroupItemProps & {\n  label?: React.ReactNode;\n  variant?: \"option\" | \"button-group\";\n  size?: \"default\" | \"sm\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  rootClassName?: string;\n};\n\nconst RadioItem = React.forwardRef<HTMLButtonElement, RadioItemProps>(\n  (props, ref) => {\n    const { label, variant = \"option\", rootClassName, ...itemProps } = props;\n    const id = React.useId();\n\n    return (\n      <div className={cn(\"flex items-center space-x-2\", rootClassName)}>\n        <SRadioGroupItem ref={ref} id={id} {...itemProps} />\n        {variant === \"option\" && label && (\n          <label\n            htmlFor={id}\n            className=\"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\"\n          >\n            {label}\n          </label>\n        )}\n        {variant === \"button-group\" && label && (\n          <span className=\"sr-only\">{label}</span>\n        )}\n      </div>\n    );\n  }\n);\n\nRadioItem.displayName = \"RadioItem\";\n\nexport type RadioProps = {\n  options?: Array<{\n    label: React.ReactNode;\n    value: string;\n    disabled?: boolean;\n  }>;\n  label?: React.ReactNode;\n  helperText?: React.ReactNode;\n  variant?: \"option\" | \"button-group\";\n  size?: \"default\" | \"sm\" | \"lg\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  value?: string;\n  onValueChange?: (value: string) => void;\n  children?: React.ReactNode;\n  className?: string;\n  rootClassName?: string;\n  disabled?: boolean;\n} & RadioGroupProps;\n\nconst Radio = React.forwardRef<HTMLDivElement, RadioProps>((props, ref) => {\n  const {\n    options,\n    label,\n    helperText,\n    variant = \"option\",\n    size = \"default\",\n    color,\n    value,\n    onValueChange,\n    children,\n    className,\n    rootClassName,\n    disabled,\n  } = props;\n\n  return (\n    <div className={cn(\"flex flex-col gap-1.5\", rootClassName)}>\n      {label && <label className=\"text-sm font-medium\">{label}</label>}\n\n      <SRadioGroup\n        ref={ref}\n        value={value}\n        onValueChange={onValueChange}\n        variant={variant}\n        className={cn(className)}\n      >\n        {options &&\n          options.map((option) => (\n            <RadioItem\n              key={option.value}\n              value={option.value}\n              label={option.label}\n              disabled={disabled || option.disabled}\n              variant={variant}\n              size={size}\n              color={color}\n            />\n          ))}\n        {children}\n      </SRadioGroup>\n\n      {helperText && (\n        <p className=\"text-xs text-muted-foreground\">{helperText}</p>\n      )}\n    </div>\n  );\n}) as React.ForwardRefExoticComponent<\n  RadioProps & React.RefAttributes<HTMLDivElement>\n> & {\n  Group: typeof SRadioGroup;\n  Item: typeof RadioItem;\n};\n\nRadio.displayName = \"Radio\";\n\nRadio.Group = SRadioGroup;\nRadio.Item = RadioItem;\n\nexport default Radio;\nexport { type RadioGroupProps, type RadioGroupItemProps };\n"],"names":["RadioItem","React","props","ref","label","variant","rootClassName","itemProps","id","cn","jsx","SRadioGroupItem","Radio","options","helperText","size","color","value","onValueChange","children","className","disabled","jsxs","SRadioGroup","option"],"mappings":"okDAyBA,MAAMA,EAAYC,EAAM,WACtB,CAACC,EAAOC,IAAQ,CACd,KAAM,CAAE,MAAAC,EAAO,QAAAC,EAAU,SAAU,cAAAC,EAAe,GAAGC,GAAcL,EAC7DM,EAAKP,EAAM,MAAA,EAEjB,cACG,MAAA,CAAI,UAAWQ,EAAAA,GAAG,8BAA+BH,CAAa,EAC7D,SAAA,CAAAI,EAAAA,IAACC,EAAAA,eAAA,CAAgB,IAAAR,EAAU,GAAAK,EAAS,GAAGD,CAAA,CAAW,EACjDF,IAAY,UAAYD,GACvBM,EAAAA,IAAC,QAAA,CACC,QAASF,EACT,UAAU,6FAET,SAAAJ,CAAA,CAAA,EAGJC,IAAY,gBAAkBD,SAC5B,OAAA,CAAK,UAAU,UAAW,SAAAA,CAAA,CAAM,CAAA,EAErC,CAEJ,CACF,EAEAJ,EAAU,YAAc,YA6BxB,MAAMY,EAAQX,EAAM,WAAuC,CAACC,EAAOC,IAAQ,CACzE,KAAM,CACJ,QAAAU,EACA,MAAAT,EACA,WAAAU,EACA,QAAAT,EAAU,SACV,KAAAU,EAAO,UACP,MAAAC,EACA,MAAAC,EACA,cAAAC,EACA,SAAAC,EACA,UAAAC,EACA,cAAAd,EACA,SAAAe,CAAA,EACEnB,EAEJ,cACG,MAAA,CAAI,UAAWO,EAAAA,GAAG,wBAAyBH,CAAa,EACtD,SAAA,CAAAF,GAASM,EAAAA,IAAC,QAAA,CAAM,UAAU,sBAAuB,SAAAN,EAAM,EAExDkB,EAAAA,KAACC,EAAAA,WAAA,CACC,IAAApB,EACA,MAAAc,EACA,cAAAC,EACA,QAAAb,EACA,UAAWI,EAAAA,GAAGW,CAAS,EAEtB,SAAA,CAAAP,GACCA,EAAQ,IAAKW,GACXd,EAAAA,IAACV,EAAA,CAEC,MAAOwB,EAAO,MACd,MAAOA,EAAO,MACd,SAAUH,GAAYG,EAAO,SAC7B,QAAAnB,EACA,KAAAU,EACA,MAAAC,CAAA,EANKQ,EAAO,KAAA,CAQf,EACFL,CAAA,CAAA,CAAA,EAGFL,GACCJ,EAAAA,IAAC,IAAA,CAAE,UAAU,gCAAiC,SAAAI,CAAA,CAAW,CAAA,EAE7D,CAEJ,CAAC,EAODF,EAAM,YAAc,QAEpBA,EAAM,MAAQW,EAAAA,WACdX,EAAM,KAAOZ"}

package/dist/cjs/components/Slider/Slider.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Slider.cjs","sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport * as SliderPrimitive from \"@radix-ui/react-slider\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { motion, useMotionValue, useSpring, useTransform } from \"motion/react\";\nimport NumberFlow from \"@number-flow/react\";\nimport type { BasicColor } from \"@/types/variables\";\nimport Badge from \"../Badge/Badge\";\n\ntype LabelAnimation = \"number-flow\" | \"spec\" | \"none\";\ntype LabelDisplay = false | \"hover\" | \"always\";\ntype SliderColor = BasicColor | \"muted\" | \"accent\";\ntype SliderSize = \"sm\" | \"md\" | \"lg\";\ntype LabelPosition = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport type SliderProps = React.ComponentProps<typeof SliderPrimitive.Root> & {\n  color?: SliderColor;\n  size?: SliderSize;\n  showLabel?: LabelDisplay;\n  labelArrow?: boolean;\n  labelAnimation?: LabelAnimation;\n  labelFormatter?: (value: number) => string;\n  labelPosition?: LabelPosition;\n  labelColor?: string; // Custom label background color (e.g., \"bg-yellow-500\")\n  labelTextColor?: string; // Custom label text color (e.g., \"text-yellow-950\")\n  labelArrowColor?: string; // Custom label arrow color (e.g., \"border-t-yellow-500\")\n  sliderColor?: string; // Custom slider track color (e.g., \"bg-pink-500\")\n  thumbBorderColor?: string; // Custom thumb border color (e.g., \"border-pink-500/50\")\n};\n\n// Color mapping configuration\nconst COLOR_CONFIG: Record<\n  SliderColor,\n  {\n    range: string;\n    thumb: string;\n    labelBg: string;\n    labelText: string;\n  }\n> = {\n  primary: {\n    range: \"bg-primary\",\n    thumb: \"border-primary/50\",\n    labelBg: \"bg-primary\",\n    labelText: \"text-primary-foreground\",\n  },\n  secondary: {\n    range: \"bg-secondary\",\n    thumb: \"border-secondary/50\",\n    labelBg: \"bg-secondary\",\n    labelText: \"text-secondary-foreground\",\n  },\n  success: {\n    range: \"bg-success\",\n    thumb: \"border-success/50\",\n    labelBg: \"bg-success\",\n    labelText: \"text-success-foreground\",\n  },\n  warning: {\n    range: \"bg-warning\",\n    thumb: \"border-warning/50\",\n    labelBg: \"bg-warning\",\n    labelText: \"text-warning-foreground\",\n  },\n  error: {\n    range: \"bg-error\",\n    thumb: \"border-error/50\",\n    labelBg: \"bg-error\",\n    labelText: \"text-error-foreground\",\n  },\n  glass: {\n    range: \"bg-white/30 backdrop-blur-sm\",\n    thumb: \"border-white/30 backdrop-blur-sm\",\n    labelBg: \"bg-white/15\",\n    labelText: \"text-foreground\",\n  },\n  muted: {\n    range: \"bg-muted-foreground\",\n    thumb: \"border-muted-foreground/50\",\n    labelBg: \"bg-muted\",\n    labelText: \"text-muted-foreground\",\n  },\n  accent: {\n    range: \"bg-accent\",\n    thumb: \"border-accent/50\",\n    labelBg: \"bg-accent\",\n    labelText: \"text-accent-foreground\",\n  },\n};\n\n// Size configuration\nconst SIZE_CONFIG: Record<\n  SliderSize,\n  {\n    track: string;\n    thumb: string;\n  }\n> = {\n  sm: {\n    track: \"data-[orientation=horizontal]:h-1 data-[orientation=vertical]:w-1\",\n    thumb: \"size-3\",\n  },\n  md: {\n    track:\n      \"data-[orientation=horizontal]:h-1.5 data-[orientation=vertical]:w-1.5\",\n    thumb: \"size-4\",\n  },\n  lg: {\n    track: \"data-[orientation=horizontal]:h-2 data-[orientation=vertical]:w-2\",\n    thumb: \"size-5\",\n  },\n};\n\n// Helper to get arrow direction based on orientation and position\nconst getArrowDirection = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): \"top\" | \"bottom\" | \"left\" | \"right\" => {\n  if (orientation === \"horizontal\") {\n    if (position === \"bottom\") return \"bottom\";\n    if (position === \"left\") return \"left\";\n    if (position === \"right\") return \"right\";\n    return \"top\";\n  }\n  // vertical\n  if (position === \"right\") return \"right\";\n  if (position === \"top\") return \"top\";\n  if (position === \"bottom\") return \"bottom\";\n  return \"left\";\n};\n\n// Helper to get arrow color class\nconst getArrowColorClass = (\n  color: SliderColor,\n  direction: \"top\" | \"bottom\" | \"left\" | \"right\"\n): string => {\n  // Generate full border class (e.g., \"border-t-primary\")\n  const prefix =\n    direction === \"top\"\n      ? \"t\"\n      : direction === \"bottom\"\n        ? \"b\"\n        : direction === \"left\"\n          ? \"l\"\n          : \"r\";\n  const colorMap: Record<SliderColor, string> = {\n    primary: `border-${prefix}-primary`,\n    secondary: `border-${prefix}-secondary`,\n    success: `border-${prefix}-success`,\n    warning: `border-${prefix}-warning`,\n    error: `border-${prefix}-error`,\n    glass: `border-${prefix}-white/15`,\n    muted: `border-${prefix}-muted`,\n    accent: `border-${prefix}-accent`,\n  };\n\n  return colorMap[color];\n};\n\n// Helper to get label position classes\nconst getLabelPositionClasses = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): { badge: string; arrow: string } => {\n  const positions: Record<string, { badge: string; arrow: string }> = {\n    \"horizontal-top\": {\n      badge: \"left-1/2 -translate-x-1/2 bottom-full -translate-y-1/2\",\n      arrow:\n        \"top-full left-1/2 -translate-x-1/2 border-t-[6px] border-l-[6px] border-r-[6px] border-b-0 border-l-transparent border-r-transparent\",\n    },\n    \"horizontal-bottom\": {\n      badge: \"left-1/2 -translate-x-1/2 top-full translate-y-1/2\",\n      arrow:\n        \"bottom-full left-1/2 -translate-x-1/2 border-b-[6px] border-l-[6px] border-r-[6px] border-t-0 border-l-transparent border-r-transparent\",\n    },\n    \"horizontal-left\": {\n      badge: \"top-1/2 -translate-y-1/2 right-full -translate-x-1/2\",\n      arrow:\n        \"left-full top-1/2 -translate-y-1/2 border-l-[6px] border-t-[6px] border-b-[6px] border-r-0 border-t-transparent border-b-transparent\",\n    },\n    \"horizontal-right\": {\n      badge: \"top-1/2 -translate-y-1/2 left-full translate-x-1/2\",\n      arrow:\n        \"right-full top-1/2 -translate-y-1/2 border-r-[6px] border-t-[6px] border-b-[6px] border-l-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-left\": {\n      badge: \"top-1/2 -translate-y-1/2 right-full -translate-x-1/2\",\n      arrow:\n        \"left-full top-1/2 -translate-y-1/2 border-l-[6px] border-t-[6px] border-b-[6px] border-r-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-right\": {\n      badge: \"top-1/2 -translate-y-1/2 left-full translate-x-1/2\",\n      arrow:\n        \"right-full top-1/2 -translate-y-1/2 border-r-[6px] border-t-[6px] border-b-[6px] border-l-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-top\": {\n      badge: \"left-1/2 -translate-x-1/2 bottom-full -translate-y-1/2\",\n      arrow:\n        \"top-full left-1/2 -translate-x-1/2 border-t-[6px] border-l-[6px] border-r-[6px] border-b-0 border-l-transparent border-r-transparent\",\n    },\n    \"vertical-bottom\": {\n      badge: \"left-1/2 -translate-x-1/2 top-full translate-y-1/2\",\n      arrow:\n        \"bottom-full left-1/2 -translate-x-1/2 border-b-[6px] border-l-[6px] border-r-[6px] border-t-0 border-l-transparent border-r-transparent\",\n    },\n  };\n\n  return positions[`${orientation}-${position}`];\n};\n\n// Helper to get spec label position classes\nconst getSpecLabelPositionClass = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): string => {\n  const positions: Record<string, string> = {\n    \"horizontal-top\":\n      \"data-[orientation=horizontal]:bottom-full data-[orientation=horizontal]:left-1/2 data-[orientation=horizontal]:-translate-x-1/2 data-[orientation=horizontal]:-translate-y-1/2\",\n    \"horizontal-bottom\":\n      \"data-[orientation=horizontal]:top-full data-[orientation=horizontal]:left-1/2 data-[orientation=horizontal]:-translate-x-1/2 data-[orientation=horizontal]:translate-y-1/2\",\n    \"horizontal-left\":\n      \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:right-full data-[orientation=horizontal]:-translate-y-1/2 data-[orientation=horizontal]:-translate-x-1/2\",\n    \"horizontal-right\":\n      \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-full data-[orientation=horizontal]:-translate-y-1/2 data-[orientation=horizontal]:translate-x-1/2\",\n    \"vertical-left\":\n      \"data-[orientation=vertical]:right-full data-[orientation=vertical]:top-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-right\":\n      \"data-[orientation=vertical]:left-full data-[orientation=vertical]:top-1/2 data-[orientation=vertical]:translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-top\":\n      \"data-[orientation=vertical]:bottom-full data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-bottom\":\n      \"data-[orientation=vertical]:top-full data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:translate-y-1/2\",\n  };\n\n  return positions[`${orientation}-${position}`];\n};\n\nconst Slider = React.forwardRef<HTMLSpanElement, SliderProps>(\n  (\n    {\n      className,\n      color = \"primary\",\n      size = \"md\",\n      showLabel = false,\n      labelArrow = false,\n      labelAnimation = \"none\",\n      labelFormatter = (value) => `${value}`,\n      labelPosition = \"top\",\n      labelColor,\n      labelTextColor,\n      labelArrowColor,\n      sliderColor,\n      thumbBorderColor,\n      defaultValue,\n      value,\n      min = 0,\n      max = 100,\n      ...props\n    },\n    ref\n  ) => {\n    const _values = React.useMemo(\n      () =>\n        Array.isArray(value)\n          ? value\n          : Array.isArray(defaultValue)\n            ? defaultValue\n            : [min, max],\n      [value, defaultValue, min, max]\n    );\n\n    // State for hover detection\n    const [isHovered, setIsHovered] = React.useState(false);\n    React.useEffect(() => {\n      if (value !== undefined && !Array.isArray(value)) {\n        console.error(\n          \"[Slider] value prop must be an array of numbers, e.g., [50] or [25, 75]\"\n        );\n      }\n      if (defaultValue !== undefined && !Array.isArray(defaultValue)) {\n        console.error(\n          \"[Slider] defaultValue prop must be an array of numbers, e.g., [50] or [25, 75]\"\n        );\n      }\n    }, [value, defaultValue]);\n\n    const orientation = props.orientation || \"horizontal\";\n\n    // For spec animation - track thumb position and velocity\n    const thumbPosition = useMotionValue(0);\n    const thumbVelocity = useMotionValue(0);\n    const prevThumbPosition = React.useRef(0);\n\n    // Spring physics for label following effect - more dramatic\n    const springConfig = { stiffness: 150, damping: 15, mass: 1 };\n    const labelOffset = useSpring(0, springConfig);\n    const labelRotate = useSpring(0, springConfig);\n\n    // Track value changes to calculate velocity\n    React.useEffect(() => {\n      if (labelAnimation === \"spec\" && _values.length > 0) {\n        const currentPos = _values[0];\n        const velocity = currentPos - prevThumbPosition.current;\n\n        // Cap velocity to prevent large jumps (e.g., on click or initial load)\n        const maxVelocity = 5; // Maximum velocity threshold\n        const cappedVelocity = Math.max(\n          -maxVelocity,\n          Math.min(maxVelocity, velocity)\n        );\n\n        // Update velocity and position\n        thumbVelocity.set(cappedVelocity);\n        thumbPosition.set(currentPos);\n\n        // Calculate offset and rotation based on capped velocity\n        // Negative velocity (moving left) -> positive offset (label lags behind to the right)\n        const offsetAmount = -cappedVelocity * 12;\n        const rotateAmount = -cappedVelocity * 20;\n\n        labelOffset.set(offsetAmount);\n        labelRotate.set(rotateAmount);\n\n        // Reset to center when stopped\n        setTimeout(() => {\n          labelOffset.set(0);\n          labelRotate.set(0);\n        }, 100);\n\n        prevThumbPosition.current = currentPos;\n      }\n    }, [\n      _values,\n      labelAnimation,\n      thumbVelocity,\n      thumbPosition,\n      labelOffset,\n      labelRotate,\n    ]);\n\n    // Memoized computed values\n    const sliderColorClass = useMemo(() => {\n      if (sliderColor || thumbBorderColor) {\n        return {\n          range: sliderColor || \"bg-primary\",\n          thumb: thumbBorderColor || \"border-primary/50\",\n        };\n      }\n      const config = COLOR_CONFIG[color];\n      return {\n        range: config.range,\n        thumb: config.thumb,\n      };\n    }, [color, sliderColor, thumbBorderColor]);\n\n    const sliderSizeClass = useMemo(() => SIZE_CONFIG[size], [size]);\n\n    const labelColorClass = useMemo(() => {\n      if (labelColor || labelTextColor) {\n        return cn(labelColor, labelTextColor);\n      }\n\n      const config = COLOR_CONFIG[color];\n      const direction = getArrowDirection(orientation, labelPosition);\n      const arrowColor = getArrowColorClass(color, direction);\n\n      if (color === \"glass\") {\n        return `${config.labelBg} ${config.labelText} backdrop-blur-sm shadow-lg [&>div.arrow]:${arrowColor}`;\n      }\n\n      return `${config.labelBg} ${config.labelText} [&>div.arrow]:${arrowColor}`;\n    }, [color, labelPosition, orientation, labelColor, labelTextColor]);\n\n    const arrowColorClass = useMemo(() => {\n      if (labelArrowColor) return labelArrowColor;\n      const direction = getArrowDirection(orientation, labelPosition);\n      return getArrowColorClass(color, direction);\n    }, [color, labelPosition, orientation, labelArrowColor]);\n\n    const labelVisibilityClass = useMemo(() => {\n      if (showLabel === \"hover\") return \"scale-0 group-hover:scale-100\";\n      if (showLabel === \"always\") return \"scale-100\";\n      return \"hidden\";\n    }, [showLabel]);\n\n    const labelPositionClass = useMemo(\n      () => getLabelPositionClasses(orientation, labelPosition),\n      [labelPosition, orientation]\n    );\n\n    const labelPositionClassSpec = useMemo(\n      () => getSpecLabelPositionClass(orientation, labelPosition),\n      [labelPosition, orientation]\n    );\n\n    // Render label based on animation type\n    const renderLabel = React.useCallback(\n      (index: number) => {\n        if (labelAnimation === \"spec\") {\n          return (\n            <motion.div\n              className={cn(\n                \"pointer-events-none absolute z-50 flex flex-col items-center justify-center rounded-md px-3 py-1.5 text-xs shadow-xl\",\n                labelPositionClassSpec,\n                labelColor && labelColor,\n                labelTextColor && labelTextColor,\n                !labelColor && !labelTextColor && labelColorClass\n              )}\n              data-orientation={orientation}\n              initial={\n                showLabel === \"always\"\n                  ? { opacity: 1, y: -5, scale: 1 }\n                  : { opacity: 0, y: 20, scale: 0 }\n              }\n              animate={\n                (isHovered && showLabel === \"hover\") || showLabel === \"always\"\n                  ? {\n                      opacity: 1,\n                      y: -5,\n                      scale: 1,\n                    }\n                  : {\n                      opacity: 0,\n                      y: 20,\n                      scale: 0,\n                    }\n              }\n              transition={{\n                type: \"tween\",\n                duration: 0.2,\n                ease: \"easeOut\",\n              }}\n              style={{\n                x: labelOffset,\n                rotate: labelRotate,\n                whiteSpace: \"nowrap\",\n              }}\n            >\n              <div className=\"relative z-1\">\n                <NumberFlow\n                  value={_values[index]}\n                  format={{ notation: \"standard\" }}\n                  isolate\n                />\n              </div>\n              {labelArrow && (\n                <div\n                  className={cn(\n                    \"arrow absolute border-transparent\",\n                    labelPositionClass.arrow,\n                    arrowColorClass\n                  )}\n                />\n              )}\n            </motion.div>\n          );\n        }\n\n        // Standard or number-flow animation\n        return (\n          <Badge\n            size=\"lg\"\n            color={\n              labelColor || labelTextColor\n                ? \"custom\"\n                : color === \"glass\"\n                  ? \"custom\"\n                  : color === \"muted\"\n                    ? \"muted\"\n                    : color === \"accent\"\n                      ? \"accent\"\n                      : color\n            }\n            variant=\"solid\"\n            className={cn(\n              \"transition-transform absolute px-3 rounded-md\",\n              labelPositionClass.badge,\n              labelVisibilityClass,\n              labelColor && labelColor,\n              labelTextColor && labelTextColor,\n              !labelColor &&\n                !labelTextColor &&\n                color === \"glass\" &&\n                \"bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>div.arrow]:border-t-white/15\"\n            )}\n          >\n            {labelAnimation === \"number-flow\" ? (\n              <NumberFlow\n                value={_values[index]}\n                format={{ notation: \"standard\" }}\n                isolate\n              />\n            ) : (\n              <span>{labelFormatter(_values[index])}</span>\n            )}\n            {labelArrow && (\n              <div\n                className={cn(\n                  \"arrow absolute border-transparent\",\n                  labelPositionClass.arrow,\n                  arrowColorClass\n                )}\n              />\n            )}\n          </Badge>\n        );\n      },\n      [\n        labelAnimation,\n        labelPositionClassSpec,\n        labelColor,\n        labelTextColor,\n        labelColorClass,\n        orientation,\n        showLabel,\n        labelOffset,\n        labelRotate,\n        labelFormatter,\n        _values,\n        color,\n        labelPositionClass,\n        labelVisibilityClass,\n        labelArrow,\n        arrowColorClass,\n        isHovered,\n      ]\n    );\n\n    // Render without label - use custom slider with color\n    if (!showLabel) {\n      return (\n        <SliderPrimitive.Root\n          ref={ref}\n          data-slot=\"slider\"\n          defaultValue={defaultValue}\n          value={value}\n          min={min}\n          max={max}\n          className={cn(\n            \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n            className\n          )}\n          {...props}\n        >\n          <SliderPrimitive.Track\n            data-slot=\"slider-track\"\n            className={cn(\n              \"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n              sliderSizeClass.track\n            )}\n          >\n            <SliderPrimitive.Range\n              data-slot=\"slider-range\"\n              className={cn(\n                \"absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\",\n                sliderColorClass.range\n              )}\n            />\n          </SliderPrimitive.Track>\n          {Array.from({ length: _values.length }, (_, index) => (\n            <SliderPrimitive.Thumb\n              key={index}\n              data-slot=\"slider-thumb\"\n              className={cn(\n                \"block shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50 ring-ring/50\",\n                sliderColorClass.thumb,\n                sliderSizeClass.thumb\n              )}\n            />\n          ))}\n        </SliderPrimitive.Root>\n      );\n    }\n\n    // Render with label (standard, number-flow, or spec animation)\n    return (\n      <SliderPrimitive.Root\n        ref={ref}\n        data-slot=\"slider\"\n        defaultValue={defaultValue}\n        value={value}\n        min={min}\n        max={max}\n        className={cn(\n          \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n          className\n        )}\n        {...props}\n      >\n        <SliderPrimitive.Track\n          data-slot=\"slider-track\"\n          className={cn(\n            \"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n            sliderSizeClass.track\n          )}\n        >\n          <SliderPrimitive.Range\n            data-slot=\"slider-range\"\n            className={cn(\n              \"absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\",\n              sliderColorClass.range\n            )}\n          />\n        </SliderPrimitive.Track>\n        {Array.from({ length: _values.length }, (_, index) => (\n          <SliderPrimitive.Thumb\n            key={index}\n            data-slot=\"slider-thumb\"\n            className={cn(\n              \"group block shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50 ring-ring/50\",\n              sliderColorClass.thumb,\n              sliderSizeClass.thumb\n            )}\n            onMouseEnter={() => setIsHovered(true)}\n            onMouseLeave={() => setIsHovered(false)}\n          >\n            {renderLabel(index)}\n          </SliderPrimitive.Thumb>\n        ))}\n      </SliderPrimitive.Root>\n    );\n  }\n);\n\nSlider.displayName = \"Slider\";\n\nexport default Slider;\n"],"names":["COLOR_CONFIG","SIZE_CONFIG","getArrowDirection","orientation","position","getArrowColorClass","color","direction","prefix","getLabelPositionClasses","getSpecLabelPositionClass","Slider","React","className","size","showLabel","labelArrow","labelAnimation","labelFormatter","value","labelPosition","labelColor","labelTextColor","labelArrowColor","sliderColor","thumbBorderColor","defaultValue","min","max","props","ref","_values","isHovered","setIsHovered","thumbPosition","useMotionValue","thumbVelocity","prevThumbPosition","springConfig","labelOffset","useSpring","labelRotate","currentPos","velocity","maxVelocity","cappedVelocity","offsetAmount","rotateAmount","sliderColorClass","useMemo","config","sliderSizeClass","labelColorClass","cn","arrowColor","arrowColorClass","labelVisibilityClass","labelPositionClass","labelPositionClassSpec","renderLabel","index","jsxs","motion","jsx","NumberFlow","Badge","SliderPrimitive","_"],"mappings":"gnBA8BMA,EAQF,CACF,QAAS,CACP,MAAO,aACP,MAAO,oBACP,QAAS,aACT,UAAW,yBAAA,EAEb,UAAW,CACT,MAAO,eACP,MAAO,sBACP,QAAS,eACT,UAAW,2BAAA,EAEb,QAAS,CACP,MAAO,aACP,MAAO,oBACP,QAAS,aACT,UAAW,yBAAA,EAEb,QAAS,CACP,MAAO,aACP,MAAO,oBACP,QAAS,aACT,UAAW,yBAAA,EAEb,MAAO,CACL,MAAO,WACP,MAAO,kBACP,QAAS,WACT,UAAW,uBAAA,EAEb,MAAO,CACL,MAAO,+BACP,MAAO,mCACP,QAAS,cACT,UAAW,iBAAA,EAEb,MAAO,CACL,MAAO,sBACP,MAAO,6BACP,QAAS,WACT,UAAW,uBAAA,EAEb,OAAQ,CACN,MAAO,YACP,MAAO,mBACP,QAAS,YACT,UAAW,wBAAA,CAEf,EAGMC,GAMF,CACF,GAAI,CACF,MAAO,oEACP,MAAO,QAAA,EAET,GAAI,CACF,MACE,wEACF,MAAO,QAAA,EAET,GAAI,CACF,MAAO,oEACP,MAAO,QAAA,CAEX,EAGMC,EAAoB,CACxBC,EACAC,IAEID,IAAgB,aACdC,IAAa,SAAiB,SAC9BA,IAAa,OAAe,OAC5BA,IAAa,QAAgB,QAC1B,MAGLA,IAAa,QAAgB,QAC7BA,IAAa,MAAc,MAC3BA,IAAa,SAAiB,SAC3B,OAIHC,EAAqB,CACzBC,EACAC,IACW,CAEX,MAAMC,EACJD,IAAc,MACV,IACAA,IAAc,SACZ,IACAA,IAAc,OACZ,IACA,IAYV,MAX8C,CAC5C,QAAS,UAAUC,CAAM,WACzB,UAAW,UAAUA,CAAM,aAC3B,QAAS,UAAUA,CAAM,WACzB,QAAS,UAAUA,CAAM,WACzB,MAAO,UAAUA,CAAM,SACvB,MAAO,UAAUA,CAAM,YACvB,MAAO,UAAUA,CAAM,SACvB,OAAQ,UAAUA,CAAM,SAAA,EAGVF,CAAK,CACvB,EAGMG,GAA0B,CAC9BN,EACAC,KAEoE,CAClE,iBAAkB,CAChB,MAAO,yDACP,MACE,sIAAA,EAEJ,oBAAqB,CACnB,MAAO,qDACP,MACE,yIAAA,EAEJ,kBAAmB,CACjB,MAAO,uDACP,MACE,sIAAA,EAEJ,mBAAoB,CAClB,MAAO,qDACP,MACE,uIAAA,EAEJ,gBAAiB,CACf,MAAO,uDACP,MACE,sIAAA,EAEJ,iBAAkB,CAChB,MAAO,qDACP,MACE,uIAAA,EAEJ,eAAgB,CACd,MAAO,yDACP,MACE,sIAAA,EAEJ,kBAAmB,CACjB,MAAO,qDACP,MACE,yIAAA,CACJ,GAGe,GAAGD,CAAW,IAAIC,CAAQ,EAAE,EAIzCM,GAA4B,CAChCP,EACAC,KAE0C,CACxC,iBACE,iLACF,oBACE,6KACF,kBACE,+KACF,mBACE,6KACF,gBACE,uKACF,iBACE,qKACF,eACE,yKACF,kBACE,oKAAA,GAGa,GAAGD,CAAW,IAAIC,CAAQ,EAAE,EAGzCO,EAASC,EAAM,WACnB,CACE,CACE,UAAAC,EACA,MAAAP,EAAQ,UACR,KAAAQ,EAAO,KACP,UAAAC,EAAY,GACZ,WAAAC,EAAa,GACb,eAAAC,EAAiB,OACjB,eAAAC,EAAkBC,GAAU,GAAGA,CAAK,GACpC,cAAAC,EAAgB,MAChB,WAAAC,EACA,eAAAC,EACA,gBAAAC,EACA,YAAAC,EACA,iBAAAC,EACA,aAAAC,EACA,MAAAP,EACA,IAAAQ,EAAM,EACN,IAAAC,EAAM,IACN,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAUnB,EAAM,QACpB,IACE,MAAM,QAAQO,CAAK,EACfA,EACA,MAAM,QAAQO,CAAY,EACxBA,EACA,CAACC,EAAKC,CAAG,EACjB,CAACT,EAAOO,EAAcC,EAAKC,CAAG,CAAA,EAI1B,CAACI,EAAWC,CAAY,EAAIrB,EAAM,SAAS,EAAK,EACtDA,EAAM,UAAU,IAAM,CAChBO,IAAU,QAAa,CAAC,MAAM,QAAQA,CAAK,GAC7C,QAAQ,MACN,yEAAA,EAGAO,IAAiB,QAAa,CAAC,MAAM,QAAQA,CAAY,GAC3D,QAAQ,MACN,gFAAA,CAGN,EAAG,CAACP,EAAOO,CAAY,CAAC,EAExB,MAAMvB,EAAc0B,EAAM,aAAe,aAGnCK,EAAgBC,EAAAA,eAAe,CAAC,EAChCC,EAAgBD,EAAAA,eAAe,CAAC,EAChCE,EAAoBzB,EAAM,OAAO,CAAC,EAGlC0B,EAAe,CAAE,UAAW,IAAK,QAAS,GAAI,KAAM,CAAA,EACpDC,EAAcC,EAAAA,UAAU,EAAGF,CAAY,EACvCG,EAAcD,EAAAA,UAAU,EAAGF,CAAY,EAG7C1B,EAAM,UAAU,IAAM,CACpB,GAAIK,IAAmB,QAAUc,EAAQ,OAAS,EAAG,CACnD,MAAMW,EAAaX,EAAQ,CAAC,EACtBY,EAAWD,EAAaL,EAAkB,QAG1CO,EAAc,EACdC,EAAiB,KAAK,IAC1B,CAACD,EACD,KAAK,IAAIA,EAAaD,CAAQ,CAAA,EAIhCP,EAAc,IAAIS,CAAc,EAChCX,EAAc,IAAIQ,CAAU,EAI5B,MAAMI,EAAe,CAACD,EAAiB,GACjCE,EAAe,CAACF,EAAiB,GAEvCN,EAAY,IAAIO,CAAY,EAC5BL,EAAY,IAAIM,CAAY,EAG5B,WAAW,IAAM,CACfR,EAAY,IAAI,CAAC,EACjBE,EAAY,IAAI,CAAC,CACnB,EAAG,GAAG,EAENJ,EAAkB,QAAUK,CAC9B,CACF,EAAG,CACDX,EACAd,EACAmB,EACAF,EACAK,EACAE,CAAA,CACD,EAGD,MAAMO,EAAmBC,EAAAA,QAAQ,IAAM,CACrC,GAAIzB,GAAeC,EACjB,MAAO,CACL,MAAOD,GAAe,aACtB,MAAOC,GAAoB,mBAAA,EAG/B,MAAMyB,EAASlD,EAAaM,CAAK,EACjC,MAAO,CACL,MAAO4C,EAAO,MACd,MAAOA,EAAO,KAAA,CAElB,EAAG,CAAC5C,EAAOkB,EAAaC,CAAgB,CAAC,EAEnC0B,EAAkBF,EAAAA,QAAQ,IAAMhD,GAAYa,CAAI,EAAG,CAACA,CAAI,CAAC,EAEzDsC,EAAkBH,EAAAA,QAAQ,IAAM,CACpC,GAAI5B,GAAcC,EAChB,OAAO+B,EAAAA,GAAGhC,EAAYC,CAAc,EAGtC,MAAM4B,EAASlD,EAAaM,CAAK,EAC3BC,EAAYL,EAAkBC,EAAaiB,CAAa,EACxDkC,EAAajD,EAAmBC,EAAOC,CAAS,EAEtD,OAAID,IAAU,QACL,GAAG4C,EAAO,OAAO,IAAIA,EAAO,SAAS,6CAA6CI,CAAU,GAG9F,GAAGJ,EAAO,OAAO,IAAIA,EAAO,SAAS,kBAAkBI,CAAU,EAC1E,EAAG,CAAChD,EAAOc,EAAejB,EAAakB,EAAYC,CAAc,CAAC,EAE5DiC,EAAkBN,EAAAA,QAAQ,IAAM,CACpC,GAAI1B,EAAiB,OAAOA,EAC5B,MAAMhB,EAAYL,EAAkBC,EAAaiB,CAAa,EAC9D,OAAOf,EAAmBC,EAAOC,CAAS,CAC5C,EAAG,CAACD,EAAOc,EAAejB,EAAaoB,CAAe,CAAC,EAEjDiC,EAAuBP,EAAAA,QAAQ,IAC/BlC,IAAc,QAAgB,gCAC9BA,IAAc,SAAiB,YAC5B,SACN,CAACA,CAAS,CAAC,EAER0C,EAAqBR,EAAAA,QACzB,IAAMxC,GAAwBN,EAAaiB,CAAa,EACxD,CAACA,EAAejB,CAAW,CAAA,EAGvBuD,EAAyBT,EAAAA,QAC7B,IAAMvC,GAA0BP,EAAaiB,CAAa,EAC1D,CAACA,EAAejB,CAAW,CAAA,EAIvBwD,EAAc/C,EAAM,YACvBgD,GACK3C,IAAmB,OAEnB4C,EAAAA,KAACC,EAAAA,OAAO,IAAP,CACC,UAAWT,EAAAA,GACT,uHACAK,EACArC,GAAcA,EACdC,GAAkBA,EAClB,CAACD,GAAc,CAACC,GAAkB8B,CAAA,EAEpC,mBAAkBjD,EAClB,QACEY,IAAc,SACV,CAAE,QAAS,EAAG,EAAG,GAAI,MAAO,CAAA,EAC5B,CAAE,QAAS,EAAG,EAAG,GAAI,MAAO,CAAA,EAElC,QACGiB,GAAajB,IAAc,SAAYA,IAAc,SAClD,CACE,QAAS,EACT,EAAG,GACH,MAAO,CAAA,EAET,CACE,QAAS,EACT,EAAG,GACH,MAAO,CAAA,EAGf,WAAY,CACV,KAAM,QACN,SAAU,GACV,KAAM,SAAA,EAER,MAAO,CACLwB,EACA,OAAQE,EACR,WAAY,QAAA,EAGd,SAAA,CAAAsB,EAAAA,IAAC,MAAA,CAAI,UAAU,eACb,SAAAA,EAAAA,IAACC,EAAA,CACC,MAAOjC,EAAQ6B,CAAK,EACpB,OAAQ,CAAE,SAAU,UAAA,EACpB,QAAO,EAAA,CAAA,EAEX,EACC5C,GACC+C,EAAAA,IAAC,MAAA,CACC,UAAWV,EAAAA,GACT,oCACAI,EAAmB,MACnBF,CAAA,CACF,CAAA,CACF,CAAA,CAAA,EAQNM,EAAAA,KAACI,GAAAA,QAAA,CACC,KAAK,KACL,MACE5C,GAAcC,GAEVhB,IAAU,QADV,SAGEA,IAAU,QACR,QACAA,IAAU,SACR,SACAA,EAEZ,QAAQ,QACR,UAAW+C,EAAAA,GACT,gDACAI,EAAmB,MACnBD,EACAnC,GAAcA,EACdC,GAAkBA,EAClB,CAACD,GACC,CAACC,GACDhB,IAAU,SACV,wFAAA,EAGH,SAAA,CAAAW,IAAmB,cAClB8C,EAAAA,IAACC,EAAA,CACC,MAAOjC,EAAQ6B,CAAK,EACpB,OAAQ,CAAE,SAAU,UAAA,EACpB,QAAO,EAAA,CAAA,EAGTG,EAAAA,IAAC,OAAA,CAAM,WAAehC,EAAQ6B,CAAK,CAAC,EAAE,EAEvC5C,GACC+C,EAAAA,IAAC,MAAA,CACC,UAAWV,EAAAA,GACT,oCACAI,EAAmB,MACnBF,CAAA,CACF,CAAA,CACF,CAAA,CAAA,EAKR,CACEtC,EACAyC,EACArC,EACAC,EACA8B,EACAjD,EACAY,EACAwB,EACAE,EACAvB,EACAa,EACAzB,EACAmD,EACAD,EACAxC,EACAuC,EACAvB,CAAA,CACF,EAIF,OAAKjB,EA+CH8C,EAAAA,KAACK,EAAgB,KAAhB,CACC,IAAApC,EACA,YAAU,SACV,aAAAJ,EACA,MAAAP,EACA,IAAAQ,EACA,IAAAC,EACA,UAAWyB,EAAAA,GACT,oOACAxC,CAAA,EAED,GAAGgB,EAEJ,SAAA,CAAAkC,EAAAA,IAACG,EAAgB,MAAhB,CACC,YAAU,eACV,UAAWb,EAAAA,GACT,8HACAF,EAAgB,KAAA,EAGlB,SAAAY,EAAAA,IAACG,EAAgB,MAAhB,CACC,YAAU,eACV,UAAWb,EAAAA,GACT,mFACAL,EAAiB,KAAA,CACnB,CAAA,CACF,CAAA,EAED,MAAM,KAAK,CAAE,OAAQjB,EAAQ,QAAU,CAACoC,EAAGP,IAC1CG,EAAAA,IAACG,EAAgB,MAAhB,CAEC,YAAU,eACV,UAAWb,EAAAA,GACT,yNACAL,EAAiB,MACjBG,EAAgB,KAAA,EAElB,aAAc,IAAMlB,EAAa,EAAI,EACrC,aAAc,IAAMA,EAAa,EAAK,EAErC,WAAY2B,CAAK,CAAA,EAVbA,CAAA,CAYR,CAAA,CAAA,CAAA,EAvFDC,EAAAA,KAACK,EAAgB,KAAhB,CACC,IAAApC,EACA,YAAU,SACV,aAAAJ,EACA,MAAAP,EACA,IAAAQ,EACA,IAAAC,EACA,UAAWyB,EAAAA,GACT,oOACAxC,CAAA,EAED,GAAGgB,EAEJ,SAAA,CAAAkC,EAAAA,IAACG,EAAgB,MAAhB,CACC,YAAU,eACV,UAAWb,EAAAA,GACT,8HACAF,EAAgB,KAAA,EAGlB,SAAAY,EAAAA,IAACG,EAAgB,MAAhB,CACC,YAAU,eACV,UAAWb,EAAAA,GACT,mFACAL,EAAiB,KAAA,CACnB,CAAA,CACF,CAAA,EAED,MAAM,KAAK,CAAE,OAAQjB,EAAQ,QAAU,CAACoC,EAAGP,IAC1CG,EAAAA,IAACG,EAAgB,MAAhB,CAEC,YAAU,eACV,UAAWb,EAAAA,GACT,mNACAL,EAAiB,MACjBG,EAAgB,KAAA,CAClB,EANKS,CAAA,CAQR,CAAA,CAAA,CAAA,CAoDT,CACF,EAEAjD,EAAO,YAAc"}
+{"version":3,"file":"Slider.cjs","sources":["../../../../src/components/Slider/Slider.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport * as SliderPrimitive from \"@radix-ui/react-slider\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport { motion, useMotionValue, useSpring, useTransform } from \"motion/react\";\nimport NumberFlow from \"@number-flow/react\";\nimport type { BasicColor } from \"@/types/variables\";\nimport Badge from \"../Badge/Badge\";\n\ntype LabelAnimation = \"number-flow\" | \"spec\" | \"none\";\ntype LabelDisplay = false | \"hover\" | \"always\";\ntype SliderColor = BasicColor | \"muted\" | \"accent\";\ntype SliderSize = \"sm\" | \"md\" | \"lg\";\ntype LabelPosition = \"top\" | \"bottom\" | \"left\" | \"right\";\n\nexport type SliderProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>,\n  \"color\" | \"defaultValue\" | \"value\" | \"min\" | \"max\"\n> & {\n  color?: SliderColor;\n  size?: SliderSize;\n  showLabel?: LabelDisplay;\n  labelArrow?: boolean;\n  labelAnimation?: LabelAnimation;\n  labelFormatter?: (value: number) => string;\n  labelPosition?: LabelPosition;\n  labelColor?: string;\n  labelTextColor?: string;\n  labelArrowColor?: string;\n  sliderColor?: string;\n  thumbBorderColor?: string;\n  defaultValue?: number[];\n  value?: number[];\n  min?: number;\n  max?: number;\n};\n\n// Color mapping configuration\nconst COLOR_CONFIG: Record<\n  SliderColor,\n  {\n    range: string;\n    thumb: string;\n    labelBg: string;\n    labelText: string;\n  }\n> = {\n  primary: {\n    range: \"bg-primary\",\n    thumb: \"border-primary/50\",\n    labelBg: \"bg-primary\",\n    labelText: \"text-primary-foreground\",\n  },\n  secondary: {\n    range: \"bg-secondary\",\n    thumb: \"border-secondary/50\",\n    labelBg: \"bg-secondary\",\n    labelText: \"text-secondary-foreground\",\n  },\n  success: {\n    range: \"bg-success\",\n    thumb: \"border-success/50\",\n    labelBg: \"bg-success\",\n    labelText: \"text-success-foreground\",\n  },\n  warning: {\n    range: \"bg-warning\",\n    thumb: \"border-warning/50\",\n    labelBg: \"bg-warning\",\n    labelText: \"text-warning-foreground\",\n  },\n  error: {\n    range: \"bg-error\",\n    thumb: \"border-error/50\",\n    labelBg: \"bg-error\",\n    labelText: \"text-error-foreground\",\n  },\n  glass: {\n    range: \"bg-white/30 backdrop-blur-sm\",\n    thumb: \"border-white/30 backdrop-blur-sm\",\n    labelBg: \"bg-white/15\",\n    labelText: \"text-foreground\",\n  },\n  muted: {\n    range: \"bg-muted-foreground\",\n    thumb: \"border-muted-foreground/50\",\n    labelBg: \"bg-muted\",\n    labelText: \"text-muted-foreground\",\n  },\n  accent: {\n    range: \"bg-accent\",\n    thumb: \"border-accent/50\",\n    labelBg: \"bg-accent\",\n    labelText: \"text-accent-foreground\",\n  },\n};\n\n// Size configuration\nconst SIZE_CONFIG: Record<\n  SliderSize,\n  {\n    track: string;\n    thumb: string;\n  }\n> = {\n  sm: {\n    track: \"data-[orientation=horizontal]:h-1 data-[orientation=vertical]:w-1\",\n    thumb: \"size-3\",\n  },\n  md: {\n    track:\n      \"data-[orientation=horizontal]:h-1.5 data-[orientation=vertical]:w-1.5\",\n    thumb: \"size-4\",\n  },\n  lg: {\n    track: \"data-[orientation=horizontal]:h-2 data-[orientation=vertical]:w-2\",\n    thumb: \"size-5\",\n  },\n};\n\n// Helper to get arrow direction based on orientation and position\nconst getArrowDirection = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): \"top\" | \"bottom\" | \"left\" | \"right\" => {\n  if (orientation === \"horizontal\") {\n    if (position === \"bottom\") return \"bottom\";\n    if (position === \"left\") return \"left\";\n    if (position === \"right\") return \"right\";\n    return \"top\";\n  }\n  // vertical\n  if (position === \"right\") return \"right\";\n  if (position === \"top\") return \"top\";\n  if (position === \"bottom\") return \"bottom\";\n  return \"left\";\n};\n\n// Helper to get arrow color class\nconst getArrowColorClass = (\n  color: SliderColor,\n  direction: \"top\" | \"bottom\" | \"left\" | \"right\"\n): string => {\n  // Generate full border class (e.g., \"border-t-primary\")\n  const prefix =\n    direction === \"top\"\n      ? \"t\"\n      : direction === \"bottom\"\n        ? \"b\"\n        : direction === \"left\"\n          ? \"l\"\n          : \"r\";\n  const colorMap: Record<SliderColor, string> = {\n    primary: `border-${prefix}-primary`,\n    secondary: `border-${prefix}-secondary`,\n    success: `border-${prefix}-success`,\n    warning: `border-${prefix}-warning`,\n    error: `border-${prefix}-error`,\n    glass: `border-${prefix}-white/15`,\n    muted: `border-${prefix}-muted`,\n    accent: `border-${prefix}-accent`,\n  };\n\n  return colorMap[color];\n};\n\n// Helper to get label position classes\nconst getLabelPositionClasses = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): { badge: string; arrow: string } => {\n  const positions: Record<string, { badge: string; arrow: string }> = {\n    \"horizontal-top\": {\n      badge: \"left-1/2 -translate-x-1/2 bottom-full -translate-y-1/2\",\n      arrow:\n        \"top-full left-1/2 -translate-x-1/2 border-t-[6px] border-l-[6px] border-r-[6px] border-b-0 border-l-transparent border-r-transparent\",\n    },\n    \"horizontal-bottom\": {\n      badge: \"left-1/2 -translate-x-1/2 top-full translate-y-1/2\",\n      arrow:\n        \"bottom-full left-1/2 -translate-x-1/2 border-b-[6px] border-l-[6px] border-r-[6px] border-t-0 border-l-transparent border-r-transparent\",\n    },\n    \"horizontal-left\": {\n      badge: \"top-1/2 -translate-y-1/2 right-full -translate-x-1/2\",\n      arrow:\n        \"left-full top-1/2 -translate-y-1/2 border-l-[6px] border-t-[6px] border-b-[6px] border-r-0 border-t-transparent border-b-transparent\",\n    },\n    \"horizontal-right\": {\n      badge: \"top-1/2 -translate-y-1/2 left-full translate-x-1/2\",\n      arrow:\n        \"right-full top-1/2 -translate-y-1/2 border-r-[6px] border-t-[6px] border-b-[6px] border-l-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-left\": {\n      badge: \"top-1/2 -translate-y-1/2 right-full -translate-x-1/2\",\n      arrow:\n        \"left-full top-1/2 -translate-y-1/2 border-l-[6px] border-t-[6px] border-b-[6px] border-r-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-right\": {\n      badge: \"top-1/2 -translate-y-1/2 left-full translate-x-1/2\",\n      arrow:\n        \"right-full top-1/2 -translate-y-1/2 border-r-[6px] border-t-[6px] border-b-[6px] border-l-0 border-t-transparent border-b-transparent\",\n    },\n    \"vertical-top\": {\n      badge: \"left-1/2 -translate-x-1/2 bottom-full -translate-y-1/2\",\n      arrow:\n        \"top-full left-1/2 -translate-x-1/2 border-t-[6px] border-l-[6px] border-r-[6px] border-b-0 border-l-transparent border-r-transparent\",\n    },\n    \"vertical-bottom\": {\n      badge: \"left-1/2 -translate-x-1/2 top-full translate-y-1/2\",\n      arrow:\n        \"bottom-full left-1/2 -translate-x-1/2 border-b-[6px] border-l-[6px] border-r-[6px] border-t-0 border-l-transparent border-r-transparent\",\n    },\n  };\n\n  return positions[`${orientation}-${position}`];\n};\n\n// Helper to get spec label position classes\nconst getSpecLabelPositionClass = (\n  orientation: \"horizontal\" | \"vertical\",\n  position: LabelPosition\n): string => {\n  const positions: Record<string, string> = {\n    \"horizontal-top\":\n      \"data-[orientation=horizontal]:bottom-full data-[orientation=horizontal]:left-1/2 data-[orientation=horizontal]:-translate-x-1/2 data-[orientation=horizontal]:-translate-y-1/2\",\n    \"horizontal-bottom\":\n      \"data-[orientation=horizontal]:top-full data-[orientation=horizontal]:left-1/2 data-[orientation=horizontal]:-translate-x-1/2 data-[orientation=horizontal]:translate-y-1/2\",\n    \"horizontal-left\":\n      \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:right-full data-[orientation=horizontal]:-translate-y-1/2 data-[orientation=horizontal]:-translate-x-1/2\",\n    \"horizontal-right\":\n      \"data-[orientation=horizontal]:top-1/2 data-[orientation=horizontal]:left-full data-[orientation=horizontal]:-translate-y-1/2 data-[orientation=horizontal]:translate-x-1/2\",\n    \"vertical-left\":\n      \"data-[orientation=vertical]:right-full data-[orientation=vertical]:top-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-right\":\n      \"data-[orientation=vertical]:left-full data-[orientation=vertical]:top-1/2 data-[orientation=vertical]:translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-top\":\n      \"data-[orientation=vertical]:bottom-full data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:-translate-y-1/2\",\n    \"vertical-bottom\":\n      \"data-[orientation=vertical]:top-full data-[orientation=vertical]:left-1/2 data-[orientation=vertical]:-translate-x-1/2 data-[orientation=vertical]:translate-y-1/2\",\n  };\n\n  return positions[`${orientation}-${position}`];\n};\n\nconst Slider = React.forwardRef<HTMLSpanElement, SliderProps>(\n  (\n    {\n      className,\n      color = \"primary\",\n      size = \"md\",\n      showLabel = false,\n      labelArrow = false,\n      labelAnimation = \"none\",\n      labelFormatter = (value) => `${value}`,\n      labelPosition = \"top\",\n      labelColor,\n      labelTextColor,\n      labelArrowColor,\n      sliderColor,\n      thumbBorderColor,\n      defaultValue,\n      value,\n      min = 0,\n      max = 100,\n      ...props\n    },\n    ref\n  ) => {\n    const _values = React.useMemo(\n      () =>\n        Array.isArray(value)\n          ? value\n          : Array.isArray(defaultValue)\n            ? defaultValue\n            : [min, max],\n      [value, defaultValue, min, max]\n    );\n\n    // State for hover detection\n    const [isHovered, setIsHovered] = React.useState(false);\n    React.useEffect(() => {\n      if (value !== undefined && !Array.isArray(value)) {\n        console.error(\n          \"[Slider] value prop must be an array of numbers, e.g., [50] or [25, 75]\"\n        );\n      }\n      if (defaultValue !== undefined && !Array.isArray(defaultValue)) {\n        console.error(\n          \"[Slider] defaultValue prop must be an array of numbers, e.g., [50] or [25, 75]\"\n        );\n      }\n    }, [value, defaultValue]);\n\n    const orientation = props.orientation || \"horizontal\";\n\n    // For spec animation - track thumb position and velocity\n    const thumbPosition = useMotionValue(0);\n    const thumbVelocity = useMotionValue(0);\n    const prevThumbPosition = React.useRef(0);\n\n    // Spring physics for label following effect - more dramatic\n    const springConfig = { stiffness: 150, damping: 15, mass: 1 };\n    const labelOffset = useSpring(0, springConfig);\n    const labelRotate = useSpring(0, springConfig);\n\n    // Track value changes to calculate velocity\n    React.useEffect(() => {\n      if (labelAnimation === \"spec\" && _values.length > 0) {\n        const currentPos = _values[0];\n        const velocity = currentPos - prevThumbPosition.current;\n\n        // Cap velocity to prevent large jumps (e.g., on click or initial load)\n        const maxVelocity = 5; // Maximum velocity threshold\n        const cappedVelocity = Math.max(\n          -maxVelocity,\n          Math.min(maxVelocity, velocity)\n        );\n\n        // Update velocity and position\n        thumbVelocity.set(cappedVelocity);\n        thumbPosition.set(currentPos);\n\n        // Calculate offset and rotation based on capped velocity\n        // Negative velocity (moving left) -> positive offset (label lags behind to the right)\n        const offsetAmount = -cappedVelocity * 12;\n        const rotateAmount = -cappedVelocity * 20;\n\n        labelOffset.set(offsetAmount);\n        labelRotate.set(rotateAmount);\n\n        // Reset to center when stopped\n        setTimeout(() => {\n          labelOffset.set(0);\n          labelRotate.set(0);\n        }, 100);\n\n        prevThumbPosition.current = currentPos;\n      }\n    }, [\n      _values,\n      labelAnimation,\n      thumbVelocity,\n      thumbPosition,\n      labelOffset,\n      labelRotate,\n    ]);\n\n    // Memoized computed values\n    const sliderColorClass = useMemo(() => {\n      if (sliderColor || thumbBorderColor) {\n        return {\n          range: sliderColor || \"bg-primary\",\n          thumb: thumbBorderColor || \"border-primary/50\",\n        };\n      }\n      const config = COLOR_CONFIG[color];\n      return {\n        range: config.range,\n        thumb: config.thumb,\n      };\n    }, [color, sliderColor, thumbBorderColor]);\n\n    const sliderSizeClass = useMemo(() => SIZE_CONFIG[size], [size]);\n\n    const labelColorClass = useMemo(() => {\n      if (labelColor || labelTextColor) {\n        return cn(labelColor, labelTextColor);\n      }\n\n      const config = COLOR_CONFIG[color];\n      const direction = getArrowDirection(orientation, labelPosition);\n      const arrowColor = getArrowColorClass(color, direction);\n\n      if (color === \"glass\") {\n        return `${config.labelBg} ${config.labelText} backdrop-blur-sm shadow-lg [&>div.arrow]:${arrowColor}`;\n      }\n\n      return `${config.labelBg} ${config.labelText} [&>div.arrow]:${arrowColor}`;\n    }, [color, labelPosition, orientation, labelColor, labelTextColor]);\n\n    const arrowColorClass = useMemo(() => {\n      if (labelArrowColor) return labelArrowColor;\n      const direction = getArrowDirection(orientation, labelPosition);\n      return getArrowColorClass(color, direction);\n    }, [color, labelPosition, orientation, labelArrowColor]);\n\n    const labelVisibilityClass = useMemo(() => {\n      if (showLabel === \"hover\") return \"scale-0 group-hover:scale-100\";\n      if (showLabel === \"always\") return \"scale-100\";\n      return \"hidden\";\n    }, [showLabel]);\n\n    const labelPositionClass = useMemo(\n      () => getLabelPositionClasses(orientation, labelPosition),\n      [labelPosition, orientation]\n    );\n\n    const labelPositionClassSpec = useMemo(\n      () => getSpecLabelPositionClass(orientation, labelPosition),\n      [labelPosition, orientation]\n    );\n\n    // Render label based on animation type\n    const renderLabel = React.useCallback(\n      (index: number) => {\n        if (labelAnimation === \"spec\") {\n          return (\n            <motion.div\n              className={cn(\n                \"pointer-events-none absolute z-50 flex flex-col items-center justify-center rounded-md px-3 py-1.5 text-xs shadow-xl\",\n                labelPositionClassSpec,\n                labelColor && labelColor,\n                labelTextColor && labelTextColor,\n                !labelColor && !labelTextColor && labelColorClass\n              )}\n              data-orientation={orientation}\n              initial={\n                showLabel === \"always\"\n                  ? { opacity: 1, y: -5, scale: 1 }\n                  : { opacity: 0, y: 20, scale: 0 }\n              }\n              animate={\n                (isHovered && showLabel === \"hover\") || showLabel === \"always\"\n                  ? {\n                      opacity: 1,\n                      y: -5,\n                      scale: 1,\n                    }\n                  : {\n                      opacity: 0,\n                      y: 20,\n                      scale: 0,\n                    }\n              }\n              transition={{\n                type: \"tween\",\n                duration: 0.2,\n                ease: \"easeOut\",\n              }}\n              style={{\n                x: labelOffset,\n                rotate: labelRotate,\n                whiteSpace: \"nowrap\",\n              }}\n            >\n              <div className=\"relative z-1\">\n                <NumberFlow\n                  value={_values[index]}\n                  format={{ notation: \"standard\" }}\n                  isolate\n                />\n              </div>\n              {labelArrow && (\n                <div\n                  className={cn(\n                    \"arrow absolute border-transparent\",\n                    labelPositionClass.arrow,\n                    arrowColorClass\n                  )}\n                />\n              )}\n            </motion.div>\n          );\n        }\n\n        // Standard or number-flow animation\n        return (\n          <Badge\n            size=\"lg\"\n            color={\n              labelColor || labelTextColor\n                ? \"custom\"\n                : color === \"glass\"\n                  ? \"custom\"\n                  : color === \"muted\"\n                    ? \"muted\"\n                    : color === \"accent\"\n                      ? \"accent\"\n                      : color\n            }\n            variant=\"solid\"\n            className={cn(\n              \"transition-transform absolute px-3 rounded-md\",\n              labelPositionClass.badge,\n              labelVisibilityClass,\n              labelColor && labelColor,\n              labelTextColor && labelTextColor,\n              !labelColor &&\n                !labelTextColor &&\n                color === \"glass\" &&\n                \"bg-white/15 text-foreground backdrop-blur-sm shadow-lg [&>div.arrow]:border-t-white/15\"\n            )}\n          >\n            {labelAnimation === \"number-flow\" ? (\n              <NumberFlow\n                value={_values[index]}\n                format={{ notation: \"standard\" }}\n                isolate\n              />\n            ) : (\n              <span>{labelFormatter(_values[index])}</span>\n            )}\n            {labelArrow && (\n              <div\n                className={cn(\n                  \"arrow absolute border-transparent\",\n                  labelPositionClass.arrow,\n                  arrowColorClass\n                )}\n              />\n            )}\n          </Badge>\n        );\n      },\n      [\n        labelAnimation,\n        labelPositionClassSpec,\n        labelColor,\n        labelTextColor,\n        labelColorClass,\n        orientation,\n        showLabel,\n        labelOffset,\n        labelRotate,\n        labelFormatter,\n        _values,\n        color,\n        labelPositionClass,\n        labelVisibilityClass,\n        labelArrow,\n        arrowColorClass,\n        isHovered,\n      ]\n    );\n\n    // Render without label - use custom slider with color\n    if (!showLabel) {\n      return (\n        <SliderPrimitive.Root\n          ref={ref}\n          data-slot=\"slider\"\n          defaultValue={defaultValue}\n          value={value}\n          min={min}\n          max={max}\n          className={cn(\n            \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n            className\n          )}\n          {...props}\n        >\n          <SliderPrimitive.Track\n            data-slot=\"slider-track\"\n            className={cn(\n              \"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n              sliderSizeClass.track\n            )}\n          >\n            <SliderPrimitive.Range\n              data-slot=\"slider-range\"\n              className={cn(\n                \"absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\",\n                sliderColorClass.range\n              )}\n            />\n          </SliderPrimitive.Track>\n          {Array.from({ length: _values.length }, (_, index) => (\n            <SliderPrimitive.Thumb\n              key={index}\n              data-slot=\"slider-thumb\"\n              className={cn(\n                \"block shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50 ring-ring/50\",\n                sliderColorClass.thumb,\n                sliderSizeClass.thumb\n              )}\n            />\n          ))}\n        </SliderPrimitive.Root>\n      );\n    }\n\n    // Render with label (standard, number-flow, or spec animation)\n    return (\n      <SliderPrimitive.Root\n        ref={ref}\n        data-slot=\"slider\"\n        defaultValue={defaultValue}\n        value={value}\n        min={min}\n        max={max}\n        className={cn(\n          \"relative flex w-full touch-none items-center select-none data-disabled:opacity-50 data-[orientation=vertical]:h-full data-[orientation=vertical]:min-h-44 data-[orientation=vertical]:w-auto data-[orientation=vertical]:flex-col\",\n          className\n        )}\n        {...props}\n      >\n        <SliderPrimitive.Track\n          data-slot=\"slider-track\"\n          className={cn(\n            \"bg-muted relative grow overflow-hidden rounded-full data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full\",\n            sliderSizeClass.track\n          )}\n        >\n          <SliderPrimitive.Range\n            data-slot=\"slider-range\"\n            className={cn(\n              \"absolute data-[orientation=horizontal]:h-full data-[orientation=vertical]:w-full\",\n              sliderColorClass.range\n            )}\n          />\n        </SliderPrimitive.Track>\n        {Array.from({ length: _values.length }, (_, index) => (\n          <SliderPrimitive.Thumb\n            key={index}\n            data-slot=\"slider-thumb\"\n            className={cn(\n              \"group block shrink-0 rounded-full border bg-white shadow-sm transition-[color,box-shadow] hover:ring-4 focus-visible:ring-4 focus-visible:outline-hidden disabled:pointer-events-none disabled:opacity-50 ring-ring/50\",\n              sliderColorClass.thumb,\n              sliderSizeClass.thumb\n            )}\n            onMouseEnter={() => setIsHovered(true)}\n            onMouseLeave={() => setIsHovered(false)}\n          >\n            {renderLabel(index)}\n          </SliderPrimitive.Thumb>\n        ))}\n      </SliderPrimitive.Root>\n    );\n  }\n);\n\nSlider.displayName = \"Slider\";\n\nexport default Slider;\n"],"names":["COLOR_CONFIG","SIZE_CONFIG","getArrowDirection","orientation","position","getArrowColorClass","color","direction","prefix","getLabelPositionClasses","getSpecLabelPositionClass","Slider","React","className","size","showLabel","labelArrow","labelAnimation","labelFormatter","value","labelPosition","labelColor","labelTextColor","labelArrowColor","sliderColor","thumbBorderColor","defaultValue","min","max","props","ref","_values","isHovered","setIsHovered","thumbPosition","useMotionValue","thumbVelocity","prevThumbPosition","springConfig","labelOffset","useSpring","labelRotate","currentPos","velocity","maxVelocity","cappedVelocity","offsetAmount","rotateAmount","sliderColorClass","useMemo","config","sliderSizeClass","labelColorClass","cn","arrowColor","arrowColorClass","labelVisibilityClass","labelPositionClass","labelPositionClassSpec","renderLabel","index","jsxs","motion","jsx","NumberFlow","Badge","SliderPrimitive","_"],"mappings":"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"}

package/dist/cjs/components/Switch/Switch.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport {\n  Switch as SSwitch,\n  switchVariants,\n  type SwitchVariant,\n} from \"@dsui/ui/components/switch\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport type { SwitchAnimation } from \"@/types/variables\";\nimport { animationEffect } from \"@/utils/animations\";\nimport Glass from \"../Glass/Glass\";\n\nexport type SwitchProps = React.ComponentProps<typeof SSwitch> & {\n  animation?: SwitchAnimation;\n  label?: React.ReactNode;\n  labelPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n  offLabel?: React.ReactNode;\n  onLabel?: React.ReactNode;\n  showLabels?: \"outside\" | \"inside\" | \"none\";\n};\n\ntype AnimResult = {\n  className?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n  variant?: SwitchVariant[\"variant\"];\n  isGlass?: boolean; // Flag for glass effect\n};\n\nconst Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  (props, ref) => {\n    const {\n      animation,\n      label,\n      labelPosition = \"right\",\n      offLabel,\n      onLabel,\n      showLabels = \"none\",\n      checked = false,\n      onCheckedChange,\n      className,\n      variant = \"default\",\n      size = \"normal\",\n      color,\n      ...rest\n    } = props;\n    const id = React.useId();\n\n    const [isChecked, setIsChecked] = React.useState(checked);\n\n    React.useEffect(() => {\n      setIsChecked(checked as boolean);\n    }, [checked]);\n\n    const handleCheckedChange = (newChecked: boolean) => {\n      setIsChecked(newChecked);\n      onCheckedChange?.(newChecked);\n    };\n\n    const switchAnimation = useMemo<AnimResult | null>(() => {\n      if (!animation) return null;\n\n      // Handle glass animation separately for Switch (don't affect other components)\n      if (animation === \"glass\") {\n        return {\n          className: \"!bg-transparent !shadow-none !border-none\",\n          isGlass: true, // Custom flag for glass effect\n          variant: \"default\",\n        };\n      }\n\n      return animationEffect<SwitchAnimation, SwitchVariant[\"variant\"]>({\n        animation,\n        children: null,\n        className,\n        rootClassName: switchVariants({\n          variant: variant,\n          size: size,\n          color: color,\n        }),\n        variantType: variant,\n      });\n    }, [animation, className, variant, size, color]);\n\n    const switchElement = (switchClassName?: string) => {\n      const baseSwitchElement = (\n        <SSwitch\n          ref={ref}\n          id={id}\n          checked={isChecked}\n          onCheckedChange={handleCheckedChange}\n          className={cn(className, switchClassName, switchAnimation?.className)}\n          variant={variant}\n          size={size}\n          color={color}\n          style={{ ...(rest.style || {}), ...(switchAnimation?.style || {}) }}\n          {...rest}\n        />\n      );\n\n      // If animation is glass effect, wrap the switch in Glass component\n      if (animation === \"glass\" && switchAnimation?.isGlass) {\n        const roundedMatches = switchVariants({\n          variant: variant,\n          size: size,\n          color: color,\n        })?.match(/((?:!)?rounded-\\S+)/g);\n        const roundedClass = roundedMatches\n          ? roundedMatches[roundedMatches.length - 1]\n          : \"rounded-full\";\n\n        return (\n          <Glass\n            className={cn(\"hover:scale-110 [&_span]:opacity-80\", roundedClass)}\n          >\n            {baseSwitchElement}\n          </Glass>\n        );\n      }\n\n      // If animation returns children wrapper, use it\n      if (\n        switchAnimation?.children &&\n        React.isValidElement(switchAnimation.children)\n      ) {\n        return React.cloneElement(switchAnimation.children, baseSwitchElement);\n      }\n\n      return baseSwitchElement;\n    };\n\n    // Render with inside labels (icons inside thumb position)\n    if (showLabels === \"inside\" && (offLabel || onLabel)) {\n      return (\n        <div className=\"relative inline-grid h-7 w-fit grid-cols-[1fr_1fr] items-center text-sm font-medium\">\n          {switchElement(\n            \"peer data-[state=unchecked]:bg-input/50 absolute inset-0 h-[inherit] w-14 [&_span]:z-10 [&_span]:size-6.5 [&_span]:transition-transform [&_span]:duration-300 [&_span]:ease-[cubic-bezier(0.16,1,0.3,1)] [&_span]:data-[state=checked]:translate-x-7 [&_span]:data-[state=checked]:rtl:-translate-x-7\"\n          )}\n          <span className=\"pointer-events-none relative ml-0.5 flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:invisible peer-data-[state=unchecked]:translate-x-6 peer-data-[state=unchecked]:rtl:-translate-x-6\">\n            {offLabel}\n          </span>\n          <span className=\"peer-data-[state=checked]:text-background pointer-events-none relative flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:-translate-x-full peer-data-[state=unchecked]:invisible peer-data-[state=checked]:rtl:translate-x-full\">\n            {onLabel}\n          </span>\n        </div>\n      );\n    }\n\n    // Render with outside labels\n    if (showLabels === \"outside\" && (offLabel || onLabel)) {\n      return (\n        <div\n          className=\"group inline-flex items-center gap-2\"\n          data-state={isChecked ? \"checked\" : \"unchecked\"}\n        >\n          {offLabel && (\n            <span\n              className=\"flex-1 cursor-pointer text-sm font-medium group-data-[state=checked]:text-muted-foreground/70\"\n              onClick={() => handleCheckedChange(false)}\n            >\n              {offLabel}\n            </span>\n          )}\n          {switchElement()}\n          {onLabel && (\n            <span\n              className=\"flex-1 cursor-pointer text-sm font-medium group-data-[state=unchecked]:text-muted-foreground/70\"\n              onClick={() => handleCheckedChange(true)}\n            >\n              {onLabel}\n            </span>\n          )}\n        </div>\n      );\n    }\n\n    // Render with label (outside wrap)\n    if (label) {\n      const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n      const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n      const alignItems = isVertical ? \"items-start\" : \"items-center\";\n      const labelFirst = labelPosition === \"left\" || labelPosition === \"top\";\n\n      return (\n        <div className={cn(\"flex gap-2\", flexDirection, alignItems)}>\n          {labelFirst && <label htmlFor={id}>{label}</label>}\n          {switchElement()}\n          {!labelFirst && <label htmlFor={id}>{label}</label>}\n        </div>\n      );\n    }\n\n    // Default render\n    return switchElement();\n  }\n);\n\nSwitch.displayName = \"Switch\";\nexport default Switch;\n"],"names":["Switch","React","props","ref","animation","label","labelPosition","offLabel","onLabel","showLabels","checked","onCheckedChange","className","variant","size","color","rest","id","isChecked","setIsChecked","handleCheckedChange","newChecked","switchAnimation","useMemo","animationEffect","switchVariants","switchElement","switchClassName","baseSwitchElement","jsx","SSwitch","cn","roundedMatches","roundedClass","Glass","jsxs","isVertical","flexDirection","alignItems","labelFirst"],"mappings":"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"}
+{"version":3,"file":"Switch.cjs","sources":["../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport {\n  Switch as SSwitch,\n  switchVariants,\n  type SwitchVariant,\n} from \"@dsui/ui/components/switch\";\nimport { cn } from \"@dsui/ui/lib/utils\";\nimport type { SwitchAnimation } from \"@/types/variables\";\nimport { animationEffect } from \"@/utils/animations\";\nimport Glass from \"../Glass/Glass\";\n\nexport type SwitchProps = Omit<\n  React.ComponentPropsWithoutRef<typeof SSwitch>,\n  \"onCheckedChange\" | \"variant\" | \"size\" | \"color\"\n> & {\n  onCheckedChange?: (checked: boolean) => void;\n  variant?: \"default\" | \"square1\" | \"square2\" | \"mini\";\n  size?: \"xs\" | \"sm\" | \"normal\" | \"lg\" | \"xl\";\n  color?:\n    | \"primary\"\n    | \"secondary\"\n    | \"accent\"\n    | \"destructive\"\n    | \"muted\"\n    | \"success\"\n    | \"error\"\n    | \"warning\";\n  animation?: SwitchAnimation;\n  label?: React.ReactNode;\n  labelPosition?: \"left\" | \"right\" | \"top\" | \"bottom\";\n  offLabel?: React.ReactNode;\n  onLabel?: React.ReactNode;\n  showLabels?: \"outside\" | \"inside\" | \"none\";\n};\n\ntype AnimResult = {\n  className?: string;\n  style?: React.CSSProperties;\n  children?: React.ReactNode;\n  variant?: SwitchVariant[\"variant\"];\n  isGlass?: boolean; // Flag for glass effect\n};\n\nconst Switch = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  (props, ref) => {\n    const {\n      animation,\n      label,\n      labelPosition = \"right\",\n      offLabel,\n      onLabel,\n      showLabels = \"none\",\n      checked = false,\n      onCheckedChange,\n      className,\n      variant = \"default\",\n      size = \"normal\",\n      color,\n      ...rest\n    } = props;\n    const id = React.useId();\n\n    const [isChecked, setIsChecked] = React.useState(checked);\n\n    React.useEffect(() => {\n      setIsChecked(checked as boolean);\n    }, [checked]);\n\n    const handleCheckedChange = (newChecked: boolean) => {\n      setIsChecked(newChecked);\n      onCheckedChange?.(newChecked);\n    };\n\n    const switchAnimation = useMemo<AnimResult | null>(() => {\n      if (!animation) return null;\n\n      // Handle glass animation separately for Switch (don't affect other components)\n      if (animation === \"glass\") {\n        return {\n          className: \"!bg-transparent !shadow-none !border-none\",\n          isGlass: true, // Custom flag for glass effect\n          variant: \"default\",\n        };\n      }\n\n      return animationEffect<SwitchAnimation, SwitchVariant[\"variant\"]>({\n        animation,\n        children: null,\n        className,\n        rootClassName: switchVariants({\n          variant: variant,\n          size: size,\n          color: color,\n        }),\n        variantType: variant,\n      });\n    }, [animation, className, variant, size, color]);\n\n    const switchElement = (switchClassName?: string) => {\n      const baseSwitchElement = (\n        <SSwitch\n          ref={ref}\n          id={id}\n          checked={isChecked}\n          onCheckedChange={handleCheckedChange}\n          className={cn(className, switchClassName, switchAnimation?.className)}\n          variant={variant}\n          size={size}\n          color={color}\n          style={{ ...(rest.style || {}), ...(switchAnimation?.style || {}) }}\n          {...rest}\n        />\n      );\n\n      // If animation is glass effect, wrap the switch in Glass component\n      if (animation === \"glass\" && switchAnimation?.isGlass) {\n        const roundedMatches = switchVariants({\n          variant: variant,\n          size: size,\n          color: color,\n        })?.match(/((?:!)?rounded-\\S+)/g);\n        const roundedClass = roundedMatches\n          ? roundedMatches[roundedMatches.length - 1]\n          : \"rounded-full\";\n\n        return (\n          <Glass\n            className={cn(\"hover:scale-110 [&_span]:opacity-80\", roundedClass)}\n          >\n            {baseSwitchElement}\n          </Glass>\n        );\n      }\n\n      // If animation returns children wrapper, use it\n      if (\n        switchAnimation?.children &&\n        React.isValidElement(switchAnimation.children)\n      ) {\n        return React.cloneElement(switchAnimation.children, baseSwitchElement);\n      }\n\n      return baseSwitchElement;\n    };\n\n    // Render with inside labels (icons inside thumb position)\n    if (showLabels === \"inside\" && (offLabel || onLabel)) {\n      return (\n        <div className=\"relative inline-grid h-7 w-fit grid-cols-[1fr_1fr] items-center text-sm font-medium\">\n          {switchElement(\n            \"peer data-[state=unchecked]:bg-input/50 absolute inset-0 h-[inherit] w-14 [&_span]:z-10 [&_span]:size-6.5 [&_span]:transition-transform [&_span]:duration-300 [&_span]:ease-[cubic-bezier(0.16,1,0.3,1)] [&_span]:data-[state=checked]:translate-x-7 [&_span]:data-[state=checked]:rtl:-translate-x-7\"\n          )}\n          <span className=\"pointer-events-none relative ml-0.5 flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:invisible peer-data-[state=unchecked]:translate-x-6 peer-data-[state=unchecked]:rtl:-translate-x-6\">\n            {offLabel}\n          </span>\n          <span className=\"peer-data-[state=checked]:text-background pointer-events-none relative flex min-w-8 items-center justify-center text-center transition-transform duration-300 ease-[cubic-bezier(0.16,1,0.3,1)] peer-data-[state=checked]:-translate-x-full peer-data-[state=unchecked]:invisible peer-data-[state=checked]:rtl:translate-x-full\">\n            {onLabel}\n          </span>\n        </div>\n      );\n    }\n\n    // Render with outside labels\n    if (showLabels === \"outside\" && (offLabel || onLabel)) {\n      return (\n        <div\n          className=\"group inline-flex items-center gap-2\"\n          data-state={isChecked ? \"checked\" : \"unchecked\"}\n        >\n          {offLabel && (\n            <span\n              className=\"flex-1 cursor-pointer text-sm font-medium group-data-[state=checked]:text-muted-foreground/70\"\n              onClick={() => handleCheckedChange(false)}\n            >\n              {offLabel}\n            </span>\n          )}\n          {switchElement()}\n          {onLabel && (\n            <span\n              className=\"flex-1 cursor-pointer text-sm font-medium group-data-[state=unchecked]:text-muted-foreground/70\"\n              onClick={() => handleCheckedChange(true)}\n            >\n              {onLabel}\n            </span>\n          )}\n        </div>\n      );\n    }\n\n    // Render with label (outside wrap)\n    if (label) {\n      const isVertical = labelPosition === \"top\" || labelPosition === \"bottom\";\n      const flexDirection = isVertical ? \"flex-col\" : \"flex-row\";\n      const alignItems = isVertical ? \"items-start\" : \"items-center\";\n      const labelFirst = labelPosition === \"left\" || labelPosition === \"top\";\n\n      return (\n        <div className={cn(\"flex gap-2\", flexDirection, alignItems)}>\n          {labelFirst && <label htmlFor={id}>{label}</label>}\n          {switchElement()}\n          {!labelFirst && <label htmlFor={id}>{label}</label>}\n        </div>\n      );\n    }\n\n    // Default render\n    return switchElement();\n  }\n);\n\nSwitch.displayName = \"Switch\";\nexport default Switch;\n"],"names":["Switch","React","props","ref","animation","label","labelPosition","offLabel","onLabel","showLabels","checked","onCheckedChange","className","variant","size","color","rest","id","isChecked","setIsChecked","handleCheckedChange","newChecked","switchAnimation","useMemo","animationEffect","switchVariants","switchElement","switchClassName","baseSwitchElement","jsx","SSwitch","cn","roundedMatches","roundedClass","Glass","jsxs","isVertical","flexDirection","alignItems","labelFirst"],"mappings":"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"}

package/dist/cjs/components/Textarea/Textarea.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),C=require("../../packages/ui/src/components/textarea.cjs"),u=require("../../packages/ui/src/lib/utils.cjs"),b=require("lucide-react"),S=require("../Tooltip/Tooltip.cjs"),T=require("../FloatLabel.cjs"),p=l.forwardRef(({className:N,label:d,helperText:i,state:o,size:t="normal",isFloatLabel:r,maxLength:a,showCharCount:g,infoTooltip:x,clearable:h,onClear:v,placeholder:y=" ",...n},q)=>{const[f,j]=l.useState(()=>typeof n.value=="string"?n.value.length:typeof n.defaultValue=="string"?n.defaultValue.length:0),w=c=>{j(c.target.value.length),n.onChange&&n.onChange(c)},m=l.useId(),s=l.useRef(null);l.useImperativeHandle(q,()=>s.current);const I=()=>{if(s.current){s.current.value="",j(0);const c=new Event("input",{bubbles:!0});s.current.dispatchEvent(c),v&&v()}},R={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"};return e.jsx("div",{className:N,children:e.jsxs("div",{className:u.cn("flex flex-col gap-1.5 relative",{"floating-label":r}),children:[!r&&d&&e.jsxs("label",{htmlFor:m,className:"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",children:[d,x&&e.jsx(S.Tooltip,{content:x,children:e.jsx(b.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative",children:[e.jsx(C.Textarea,{ref:s,id:m,className:u.cn("peer resize-y",{"pt-6 pb-2":r&&(t==="lg"||t==="xl"),"pt-6 pb-1":r&&t!=="lg"&&t!=="xl","text-lg":(t==="xl"||t==="lg")&&!r},h&&f>0&&"pr-10"),placeholder:y,maxLength:a,onChange:w,state:o,size:r?t==="xl"||t==="lg"?t:"xl":t,...n}),r&&e.jsx(T.FloatingLabel,{htmlFor:m,size:t,infoTooltip:x,className:"peer-placeholder-shown:items-start",children:d}),h&&f>0&&e.jsx("button",{type:"button",tabIndex:-1,className:u.cn("absolute top-2 right-2 p-1 rounded hover:bg-accent transition-colors"),onClick:I,disabled:n.disabled,children:e.jsx(b.X,{className:"size-4"})})]}),(i||g&&typeof a=="number")&&e.jsxs("div",{className:"flex items-center justify-between text-xs gap-2",children:[i&&e.jsx("p",{className:u.cn("text-xs",o?R?.[o]:""),children:i}),g&&typeof a=="number"&&e.jsxs("span",{className:"ml-auto text-muted-foreground",children:[f," / ",a]})]})]})})});p.displayName="Textarea";exports.default=p;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),l=require("react"),C=require("../../packages/ui/src/components/textarea.cjs"),u=require("../../packages/ui/src/lib/utils.cjs"),b=require("lucide-react"),T=require("../Tooltip/Tooltip.cjs"),E=require("../FloatLabel.cjs"),M=require("../../packages/ui/src/components/label.cjs"),j=l.forwardRef(({className:N,label:d,helperText:i,state:o,size:t="normal",isFloatLabel:r,maxLength:a,showCharCount:g,infoTooltip:x,clearable:h,onClear:p,placeholder:y=" ",onChange:q,...n},w)=>{const[f,v]=l.useState(()=>typeof n.value=="string"?n.value.length:typeof n.defaultValue=="string"?n.defaultValue.length:0),I=c=>{v(c.target.value.length),q?.(c)},m=l.useId(),s=l.useRef(null);l.useImperativeHandle(w,()=>s.current);const R=()=>{if(s.current){s.current.value="",v(0);const c=new Event("input",{bubbles:!0});s.current.dispatchEvent(c),p&&p()}},S={default:"text-muted-foreground",success:"text-success",warning:"text-warning",error:"text-error"};return e.jsx("div",{className:N,children:e.jsxs("div",{className:u.cn("flex flex-col gap-1.5 relative",{"floating-label":r}),children:[!r&&d&&e.jsxs(M.Label,{htmlFor:m,className:"flex gap-2 text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70",children:[d,x&&e.jsx(T.Tooltip,{content:x,children:e.jsx(b.Info,{className:"size-3.5 min-w-3.5"})})]}),e.jsxs("div",{className:"relative",children:[e.jsx(C.Textarea,{ref:s,id:m,className:u.cn("peer resize-y",{"pt-6 pb-2":r&&(t==="lg"||t==="xl"),"pt-6 pb-1":r&&t!=="lg"&&t!=="xl","text-lg":(t==="xl"||t==="lg")&&!r},h&&f>0&&"pr-10"),placeholder:y,maxLength:a,onChange:I,state:o,size:r?t==="xl"||t==="lg"?t:"xl":t,...n}),r&&e.jsx(E.FloatingLabel,{htmlFor:m,size:t,infoTooltip:x,className:"peer-placeholder-shown:items-start",children:d}),h&&f>0&&e.jsx("button",{type:"button",tabIndex:-1,className:u.cn("absolute top-2 right-2 p-1 rounded hover:bg-accent transition-colors"),onClick:R,disabled:n.disabled,children:e.jsx(b.X,{className:"size-4"})})]}),(i||g&&typeof a=="number")&&e.jsxs("div",{className:"flex items-center justify-between text-xs gap-2",children:[i&&e.jsx("p",{className:u.cn("text-xs",o?S?.[o]:""),children:i}),g&&typeof a=="number"&&e.jsxs("span",{className:"ml-auto text-muted-foreground",children:[f," / ",a]})]})]})})});j.displayName="Textarea";exports.default=j;
 //# sourceMappingURL=Textarea.cjs.map