@clasing/ui 2.0.7 → 2.0.9

package/dist/{badge-B4oRxQ-G.js → badge-Ds17GJH4.js}

@@ -1,8 +1,8 @@
-import { j as e, c as h } from "./index-DBpnlzOP.js";
+import { j as e, c as v } from "./index-DBpnlzOP.js";
 import { Slot as c } from "@radix-ui/react-slot";
-import { c as f } from "./index-CwXB7YIx.js";
+import { c as x } from "./index-CwXB7YIx.js";
 import { I as o } from "./icon-component-DGImZz3K.js";
-const x = f(
+const f = x(
   "focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-2 overflow-hidden border font-semibold whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none",
   {
     variants: {
@@ -19,10 +19,18 @@ const x = f(
         primary: "bg-primary-600 [a&]:hover:bg-primary-600/90 border-transparent text-white",
         yellow: "border-transparent bg-yellow-600 text-white [a&]:hover:bg-yellow-600/90",
         blue: "border-transparent bg-blue-600 text-white [a&]:hover:bg-blue-600/90",
-        violet: "border-transparent bg-violet-600 text-white [a&]:hover:bg-violet-600/90"
+        violet: "border-transparent bg-violet-600 text-white [a&]:hover:bg-violet-600/90",
+        "not-started": "text-neutral-1000 border-transparent bg-neutral-100 [a&]:hover:bg-neutral-100/90",
+        "in-progress": "bg-blue-050 text-neutral-1000 [a&]:hover:bg-blue-050/90 border-transparent",
+        completed: "bg-success-light text-neutral-1000 [a&]:hover:bg-success-light/90 border-transparent",
+        blocked: "text-neutral-1000 border-transparent bg-neutral-100 [a&]:hover:bg-neutral-100/90",
+        paused: "bg-warning-light text-neutral-1000 [a&]:hover:bg-warning-light/90 border-transparent",
+        failed: "bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent",
+        expired: "bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent",
+        cancelled: "bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent"
       },
       size: {
-        xs: "paragraph-xs px-3 py-px [&>svg]:size-3",
+        xs: "paragraph-xs h-6.5 px-3 py-px [&>svg]:size-3.5",
         sm: "paragraph-xs px-4 py-1 [&>svg]:size-4",
         md: "paragraph-sm px-4 py-2 [&>svg]:size-4",
         lg: "paragraph-md px-4 py-2 [&>svg]:size-5"
@@ -48,32 +56,32 @@ const x = f(
 );
 function j({
   className: s,
-  variant: n,
+  variant: i,
   size: g,
-  weight: d,
-  rounded: l,
+  weight: l,
+  rounded: b,
   iconName: r,
   iconPosition: t = "left",
-  iconStroke: a,
-  iconOnly: i,
-  asChild: b = !1,
-  children: p,
-  ...u
+  iconStroke: a = "1",
+  iconOnly: n,
+  asChild: d = !1,
+  children: u,
+  ...h
 }) {
-  const v = b ? c : "span";
+  const p = d ? c : "span";
   return /* @__PURE__ */ e.jsxs(
-    v,
+    p,
     {
       "data-slot": "badge",
-      className: h(
-        x({ variant: n, size: g, weight: d, rounded: l }),
-        i && "px-2.5 py-2",
+      className: v(
+        f({ variant: i, size: g, weight: l, rounded: b }),
+        n && "px-2.5 py-2",
         s
       ),
-      ...u,
+      ...h,
       children: [
         r && t === "left" && /* @__PURE__ */ e.jsx(o, { iconName: r, stroke: a }),
-        !i && p,
+        !n && u,
         r && t === "right" && /* @__PURE__ */ e.jsx(o, { iconName: r, stroke: a })
       ]
     }

package/dist/badge-oQqEF2X5.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("./index-DSjHHn1r.cjs"),c=require("@radix-ui/react-slot"),v=require("./index-BVmT9wZC.cjs"),o=require("./icon-component-DTlgy__B.cjs"),x=v.cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-2 overflow-hidden border font-semibold whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none",{variants:{variant:{default:"bg-muted text-muted-foreground [a&]:hover:bg-muted/90 border-transparent",secondary:"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent",destructive:"bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 border-transparent text-white",outline:"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",error:"bg-error-light text-error-main [a&]:hover:bg-error-light/90 border-transparent",warning:"bg-warning-light text-warning-main [a&]:hover:bg-warning-light/90 border-transparent",success:"bg-success-light text-success-main [a&]:hover:bg-success-light/90 border-transparent",info:"bg-info-light text-info-main [a&]:hover:bg-info-light/90 border-transparent",neutral:"border-transparent bg-black text-white [a&]:hover:bg-black/90",primary:"bg-primary-600 [a&]:hover:bg-primary-600/90 border-transparent text-white",yellow:"border-transparent bg-yellow-600 text-white [a&]:hover:bg-yellow-600/90",blue:"border-transparent bg-blue-600 text-white [a&]:hover:bg-blue-600/90",violet:"border-transparent bg-violet-600 text-white [a&]:hover:bg-violet-600/90","not-started":"text-neutral-1000 border-transparent bg-neutral-100 [a&]:hover:bg-neutral-100/90","in-progress":"bg-blue-050 text-neutral-1000 [a&]:hover:bg-blue-050/90 border-transparent",completed:"bg-success-light text-neutral-1000 [a&]:hover:bg-success-light/90 border-transparent",blocked:"text-neutral-1000 border-transparent bg-neutral-100 [a&]:hover:bg-neutral-100/90",paused:"bg-warning-light text-neutral-1000 [a&]:hover:bg-warning-light/90 border-transparent",failed:"bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent",expired:"bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent",cancelled:"bg-error-light text-neutral-1000 [a&]:hover:bg-error-light/90 border-transparent"},size:{xs:"paragraph-xs h-6.5 px-3 py-px [&>svg]:size-3.5",sm:"paragraph-xs px-4 py-1 [&>svg]:size-4",md:"paragraph-sm px-4 py-2 [&>svg]:size-4",lg:"paragraph-md px-4 py-2 [&>svg]:size-5"},weight:{light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},rounded:{default:"rounded-2xl",full:"rounded-full"}},defaultVariants:{variant:"default",size:"xs",weight:"semibold",rounded:"full"}});function f({className:i,variant:s,size:g,weight:l,rounded:b,iconName:r,iconPosition:t="left",iconStroke:a="1",iconOnly:n,asChild:d=!1,children:u,...h}){const p=d?c.Slot:"span";return e.jsxRuntimeExports.jsxs(p,{"data-slot":"badge",className:e.cn(x({variant:s,size:g,weight:l,rounded:b}),n&&"px-2.5 py-2",i),...h,children:[r&&t==="left"&&e.jsxRuntimeExports.jsx(o.IconComponent,{iconName:r,stroke:a}),!n&&u,r&&t==="right"&&e.jsxRuntimeExports.jsx(o.IconComponent,{iconName:r,stroke:a})]})}exports.Badge=f;

package/dist/components/badge.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../badge-CS2XfLYQ.cjs");exports.Badge=e.Badge;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../badge-oQqEF2X5.cjs");exports.Badge=e.Badge;

package/dist/components/badge.d.ts

@@ -2,7 +2,7 @@ import { type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
 import { TablerIconName } from './icon-component';
 declare const badgeVariants: (props?: ({
-    variant?: "default" | "error" | "outline" | "primary" | "secondary" | "destructive" | "info" | "success" | "warning" | "neutral" | "yellow" | "blue" | "violet" | null | undefined;
+    variant?: "default" | "error" | "outline" | "primary" | "secondary" | "destructive" | "info" | "success" | "warning" | "neutral" | "yellow" | "blue" | "violet" | "not-started" | "in-progress" | "completed" | "blocked" | "paused" | "failed" | "expired" | "cancelled" | null | undefined;
     size?: "lg" | "md" | "sm" | "xs" | null | undefined;
     weight?: "bold" | "light" | "regular" | "semibold" | null | undefined;
     rounded?: "default" | "full" | null | undefined;

package/dist/components/badge.es.js

@@ -1,4 +1,4 @@
-import { B as o } from "../badge-B4oRxQ-G.js";
+import { B as o } from "../badge-Ds17GJH4.js";
 export {
   o as Badge
 };

package/dist/components/blocks/interactive-card.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../index-DSjHHn1r.cjs"),I=require("../../badge-CS2XfLYQ.cjs"),l=require("../../card-Dj2wgH-P.cjs"),p=require("../../icon-component-DTlgy__B.cjs"),x=require("../../tooltip-BvdeurjC.cjs"),q=require("../../index-BVmT9wZC.cjs"),w=require("react"),y=q.cva("focus-visible:border-ring focus-visible:ring-ring/50 transition-[color,box-shadow] focus-visible:ring-[3px]"),j=w.forwardRef(({className:g,isActive:n,title:u,text:m,helperText:d,badgeText:t,disabled:r,badgeVariant:h,badgeSize:f="xs",iconName:i,iconText:a,tooltipIconName:R="IconHelpCircleFilled",tooltipText:s,tooltipTitle:o,tooltipSide:b,tooltipSideOffset:C,tooltipAlign:E,children:N,...c},v)=>e.jsxRuntimeExports.jsxs(l.Card,{ref:v,className:e.cn(y({className:g}),{"bg-blue-050 border-blue-950":n,"border-neutral-100 bg-neutral-100":r,"cursor-pointer lg:active:bg-blue-100":c.onClick&&n&&!r,"lg:active:bg-blue-050 cursor-pointer":c.onClick&&!n&&!r}),role:"button",tabIndex:0,...c,children:[t||i||a?e.jsxRuntimeExports.jsxs(l.CardHeader,{className:"flex items-center justify-between gap-2",children:[i||a?e.jsxRuntimeExports.jsx("div",{className:e.cn("rounded-full p-1",{"bg-neutral-000 text-muted-foreground":!n,"bg-white text-blue-800":n,"bg-white text-neutral-700":r}),children:e.jsxRuntimeExports.jsx(p.IconComponent,{iconName:i,iconText:a,size:20})}):null,(t||s)&&e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-2",children:[t?e.jsxRuntimeExports.jsx(I.Badge,{variant:h,size:f,weight:"semibold",className:e.cn({"opacity-50":r}),children:t}):null,s&&e.jsxRuntimeExports.jsxs(x.Tooltip,{children:[e.jsxRuntimeExports.jsx(x.TooltipTrigger,{children:e.jsxRuntimeExports.jsx(p.IconComponent,{iconName:R??"IconHelpCircleFilled",size:20,className:"z-10 min-h-5 min-w-5"})}),e.jsxRuntimeExports.jsx(x.TooltipContent,{side:b,sideOffset:C,align:E,children:o||s&&e.jsxRuntimeExports.jsxs("div",{className:"text-neutral-1000 flex flex-col gap-1",children:[o&&e.jsxRuntimeExports.jsx("p",{className:"paragraph-md font-semibold",children:o}),s&&e.jsxRuntimeExports.jsx("p",{className:"paragraph-md",children:s})]})})]})]})]}):null,e.jsxRuntimeExports.jsxs(l.CardContent,{className:"flex flex-col gap-1",children:[u?e.jsxRuntimeExports.jsx("p",{className:e.cn("text-foreground label-xl font-semibold",{"text-neutral-700":r}),children:u}):null,m?e.jsxRuntimeExports.jsx("p",{className:e.cn("text-muted-foreground paragraph-md",{"text-neutral-700":r}),children:m}):null,N]}),d?e.jsxRuntimeExports.jsx(l.CardFooter,{children:e.jsxRuntimeExports.jsx("p",{className:e.cn("paragraph-sm text-neutral-800",{"text-neutral-700":r}),children:d})}):null]}));j.displayName="InteractiveCard";const z=j;exports.InteractiveCard=z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../index-DSjHHn1r.cjs"),I=require("../../badge-oQqEF2X5.cjs"),l=require("../../card-Dj2wgH-P.cjs"),p=require("../../icon-component-DTlgy__B.cjs"),x=require("../../tooltip-BvdeurjC.cjs"),q=require("../../index-BVmT9wZC.cjs"),w=require("react"),y=q.cva("focus-visible:border-ring focus-visible:ring-ring/50 transition-[color,box-shadow] focus-visible:ring-[3px]"),j=w.forwardRef(({className:g,isActive:n,title:u,text:m,helperText:d,badgeText:t,disabled:r,badgeVariant:h,badgeSize:f="xs",iconName:i,iconText:a,tooltipIconName:R="IconHelpCircleFilled",tooltipText:s,tooltipTitle:o,tooltipSide:b,tooltipSideOffset:C,tooltipAlign:E,children:N,...c},v)=>e.jsxRuntimeExports.jsxs(l.Card,{ref:v,className:e.cn(y({className:g}),{"bg-blue-050 border-blue-950":n,"border-neutral-100 bg-neutral-100":r,"cursor-pointer lg:active:bg-blue-100":c.onClick&&n&&!r,"lg:active:bg-blue-050 cursor-pointer":c.onClick&&!n&&!r}),role:"button",tabIndex:0,...c,children:[t||i||a?e.jsxRuntimeExports.jsxs(l.CardHeader,{className:"flex items-center justify-between gap-2",children:[i||a?e.jsxRuntimeExports.jsx("div",{className:e.cn("rounded-full p-1",{"bg-neutral-000 text-muted-foreground":!n,"bg-white text-blue-800":n,"bg-white text-neutral-700":r}),children:e.jsxRuntimeExports.jsx(p.IconComponent,{iconName:i,iconText:a,size:20})}):null,(t||s)&&e.jsxRuntimeExports.jsxs("div",{className:"flex items-center gap-2",children:[t?e.jsxRuntimeExports.jsx(I.Badge,{variant:h,size:f,weight:"semibold",className:e.cn({"opacity-50":r}),children:t}):null,s&&e.jsxRuntimeExports.jsxs(x.Tooltip,{children:[e.jsxRuntimeExports.jsx(x.TooltipTrigger,{children:e.jsxRuntimeExports.jsx(p.IconComponent,{iconName:R??"IconHelpCircleFilled",size:20,className:"z-10 min-h-5 min-w-5"})}),e.jsxRuntimeExports.jsx(x.TooltipContent,{side:b,sideOffset:C,align:E,children:o||s&&e.jsxRuntimeExports.jsxs("div",{className:"text-neutral-1000 flex flex-col gap-1",children:[o&&e.jsxRuntimeExports.jsx("p",{className:"paragraph-md font-semibold",children:o}),s&&e.jsxRuntimeExports.jsx("p",{className:"paragraph-md",children:s})]})})]})]})]}):null,e.jsxRuntimeExports.jsxs(l.CardContent,{className:"flex flex-col gap-1",children:[u?e.jsxRuntimeExports.jsx("p",{className:e.cn("text-foreground label-xl font-semibold",{"text-neutral-700":r}),children:u}):null,m?e.jsxRuntimeExports.jsx("p",{className:e.cn("text-muted-foreground paragraph-md",{"text-neutral-700":r}),children:m}):null,N]}),d?e.jsxRuntimeExports.jsx(l.CardFooter,{children:e.jsxRuntimeExports.jsx("p",{className:e.cn("paragraph-sm text-neutral-800",{"text-neutral-700":r}),children:d})}):null]}));j.displayName="InteractiveCard";const z=j;exports.InteractiveCard=z;

package/dist/components/blocks/interactive-card.es.js

@@ -1,5 +1,5 @@
 import { j as e, c as a } from "../../index-DBpnlzOP.js";
-import { B as w } from "../../badge-B4oRxQ-G.js";
+import { B as w } from "../../badge-Ds17GJH4.js";
 import { C as y, e as z, b as F, d as H } from "../../card-BNTyYiyA.js";
 import { I as x } from "../../icon-component-DGImZz3K.js";
 import { T as k, c as B, a as R } from "../../tooltip-CUaxcngn.js";

package/dist/components/multi-select.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-DSjHHn1r.cjs"),C=require("../badge-CS2XfLYQ.cjs"),x=require("../command-CHisYTN-.cjs"),b=require("../popover-BnLx2OY6.cjs"),s=require("react"),w=require("../icon-component-DTlgy__B.cjs"),M=s.createContext(null);function N({children:t,values:n,defaultValues:r,onValuesChange:o}){const[m,p]=s.useState(!1),[h,f]=s.useState(new Set(n??r)),[y,j]=s.useState(new Map);function E(c){const i=u=>{const a=new Set(u);return a.has(c)?a.delete(c):a.add(c),a};f(i),o?.([...i(h)])}const g=s.useCallback((c,i)=>{j(u=>u.get(c)===i?u:new Map(u).set(c,i))},[]);return e.jsxRuntimeExports.jsx(M,{value:{open:m,setOpen:p,selectedValues:n?new Set(n):h,toggleValue:E,items:y,onItemAdded:g},children:e.jsxRuntimeExports.jsx(b.Popover,{open:m,onOpenChange:p,children:t})})}function k({className:t,children:n,size:r="md",...o}){const{open:m}=R();return e.jsxRuntimeExports.jsx(b.PopoverTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsxs("button",{...o,role:o.role??"combobox","aria-expanded":o["aria-expanded"]??m,"data-size":r,className:e.cn("border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='text-'])]:text-muted-foreground flex w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",r==="xs"&&'label-sm h-7 px-2 py-1 [&_svg:not([class*="size-"])]:size-3.5',r==="sm"&&"label-md h-8 px-2 py-1",r==="md"&&"label-lg h-12 px-3 py-1",r==="lg"&&"label-xl h-16 px-4 py-2",t),children:[n,e.jsxRuntimeExports.jsx(w.IconComponent,{iconName:"IconSelector",className:"size-4 shrink-0 opacity-50"})]})})}function V({placeholder:t,clickToRemove:n=!0,className:r,overflowBehavior:o="wrap-when-open",...m}){const{selectedValues:p,toggleValue:h,items:f,open:y}=R(),[j,E]=s.useState(0),g=s.useRef(null),c=s.useRef(null),i=s.useRef(new Set),u=o==="wrap"||o==="wrap-when-open"&&y;s.useEffect(()=>{u&&i.current.forEach(l=>l.style.removeProperty("display"))},[u]);const a=s.useCallback(()=>{if(g.current==null)return;const l=g.current,d=c.current;d!=null&&(d.style.display="none"),i.current.forEach(S=>S.style.removeProperty("display"));let v=0;for(let S=i.current.size-1;S>=0;S--){const I=[...i.current][S];if(l.scrollWidth<=l.clientWidth)break;v=i.current.size-S,I.style.display="none",d?.style.removeProperty("display")}E(v)},[]);return s.useEffect(()=>{if(g.current==null)return;const l=new ResizeObserver(a);return l.observe(g.current),()=>l.disconnect()},[a]),s.useLayoutEffect(()=>{a()},[p,a]),p.size===0&&t?e.jsxRuntimeExports.jsx("span",{className:"text-muted-foreground font-normal",children:t}):e.jsxRuntimeExports.jsxs("div",{...m,ref:g,className:e.cn("flex min-h-[1.75rem] w-full gap-1.5 overflow-hidden",u&&"flex-wrap",r),children:[[...p].filter(l=>f.has(l)).map(l=>e.jsxRuntimeExports.jsxs(C.Badge,{ref:d=>{if(d!=null)return i.current.add(d),()=>{i.current.delete(d)}},variant:"outline",className:"group flex items-center gap-1",onClick:n?d=>{d.stopPropagation(),h(l)}:void 0,children:[f.get(l),n&&e.jsxRuntimeExports.jsx(w.IconComponent,{iconName:"IconX",className:"text-muted-foreground group-hover:text-destructive size-2"})]},l)),e.jsxRuntimeExports.jsxs(C.Badge,{style:{display:j>0&&!u?"block":"none"},variant:"outline",ref:c,children:["+",j]})]})}function z({search:t=!0,children:n,...r}){const o=typeof t=="object"?!0:t;return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",{style:{display:"none"},children:e.jsxRuntimeExports.jsx(x.Command,{children:e.jsxRuntimeExports.jsx(x.CommandList,{children:n})})}),e.jsxRuntimeExports.jsx(b.PopoverContent,{className:"min-w-[var(--radix-popover-trigger-width)] p-0",children:e.jsxRuntimeExports.jsxs(x.Command,{...r,children:[o?e.jsxRuntimeExports.jsx(x.CommandInput,{placeholder:typeof t=="object"?t.placeholder:void 0}):e.jsxRuntimeExports.jsx("button",{autoFocus:!0,"aria-hidden":"true",className:"sr-only"}),e.jsxRuntimeExports.jsxs(x.CommandList,{children:[o&&e.jsxRuntimeExports.jsx(x.CommandEmpty,{children:typeof t=="object"?t.emptyMessage:void 0}),n]})]})})]})}function P({value:t,children:n,badgeLabel:r,onSelect:o,...m}){const{toggleValue:p,selectedValues:h,onItemAdded:f}=R(),y=h.has(t);return s.useEffect(()=>{f(t,r??n)},[t,n,f,r]),e.jsxRuntimeExports.jsxs(x.CommandItem,{...m,value:t,onSelect:j=>{p(j),o?.(j)},children:[e.jsxRuntimeExports.jsx(w.IconComponent,{iconName:"IconCheck",className:e.cn("mr-2 size-4",y?"opacity-100":"opacity-0")}),n]})}function q(t){return e.jsxRuntimeExports.jsx(x.CommandGroup,{...t})}function O(t){return e.jsxRuntimeExports.jsx(x.CommandSeparator,{...t})}function R(){const t=s.useContext(M);if(t==null)throw new Error("useMultiSelectContext must be used within a MultiSelectContext");return t}exports.MultiSelect=N;exports.MultiSelectContent=z;exports.MultiSelectGroup=q;exports.MultiSelectItem=P;exports.MultiSelectSeparator=O;exports.MultiSelectTrigger=k;exports.MultiSelectValue=V;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-DSjHHn1r.cjs"),I=require("../badge-oQqEF2X5.cjs"),m=require("../command-CHisYTN-.cjs"),N=require("../popover-BnLx2OY6.cjs"),n=require("react"),v=require("../icon-component-DTlgy__B.cjs"),V=n.createContext(null);function k({children:t,values:r,defaultValues:i,onValuesChange:u,isLoading:d,onSearchChange:c,loadingText:f="Loading...",noResultsText:a="No results found"}){const[h,p]=n.useState(!1),[y,j]=n.useState(new Set(r??i)),[b,x]=n.useState(new Map),[S,E]=n.useState("");function o(s){const g=R=>{const C=new Set(R);return C.has(s)?C.delete(s):C.add(s),C};j(g),u?.([...g(y)])}const l=n.useCallback((s,g)=>{x(R=>R.get(s)===g?R:new Map(R).set(s,g))},[]),w=n.useCallback(s=>{E(s),c?.(s)},[c]);return e.jsxRuntimeExports.jsx(V,{value:{open:h,setOpen:p,selectedValues:r?new Set(r):y,toggleValue:o,items:b,onItemAdded:l,isLoading:d,searchValue:S,onSearchChange:w,loadingText:f,noResultsText:a},children:e.jsxRuntimeExports.jsx(N.Popover,{open:h,onOpenChange:p,children:t})})}function z({className:t,children:r,size:i="md",...u}){const{open:d}=M();return e.jsxRuntimeExports.jsx(N.PopoverTrigger,{asChild:!0,children:e.jsxRuntimeExports.jsxs("button",{...u,role:u.role??"combobox","aria-expanded":u["aria-expanded"]??d,"data-size":i,className:e.cn("border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='text-'])]:text-muted-foreground flex w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",i==="xs"&&'label-sm h-7 px-2 py-1 [&_svg:not([class*="size-"])]:size-3.5',i==="sm"&&"label-md h-8 px-2 py-1",i==="md"&&"label-lg h-12 px-3 py-1",i==="lg"&&"label-xl h-16 px-4 py-2",t),children:[r,e.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconSelector",className:"size-4 shrink-0 opacity-50"})]})})}function P({placeholder:t,clickToRemove:r=!0,className:i,overflowBehavior:u="wrap-when-open",...d}){const{selectedValues:c,toggleValue:f,items:a,open:h}=M(),[p,y]=n.useState(0),j=n.useRef(null),b=n.useRef(null),x=n.useRef(new Set),S=u==="wrap"||u==="wrap-when-open"&&h;n.useEffect(()=>{S&&x.current.forEach(o=>o.style.removeProperty("display"))},[S]);const E=n.useCallback(()=>{if(j.current==null)return;const o=j.current,l=b.current;l!=null&&(l.style.display="none"),x.current.forEach(s=>s.style.removeProperty("display"));let w=0;for(let s=x.current.size-1;s>=0;s--){const g=[...x.current][s];if(o.scrollWidth<=o.clientWidth)break;w=x.current.size-s,g.style.display="none",l?.style.removeProperty("display")}y(w)},[]);return n.useEffect(()=>{if(j.current==null)return;const o=new ResizeObserver(E);return o.observe(j.current),()=>o.disconnect()},[E]),n.useLayoutEffect(()=>{E()},[c,E]),c.size===0&&t?e.jsxRuntimeExports.jsx("span",{className:"text-muted-foreground font-normal",children:t}):e.jsxRuntimeExports.jsxs("div",{...d,ref:j,className:e.cn("flex min-h-[1.75rem] w-full gap-1.5 overflow-hidden",S&&"flex-wrap",i),children:[[...c].filter(o=>a.has(o)).map(o=>e.jsxRuntimeExports.jsxs(I.Badge,{ref:l=>{if(l!=null)return x.current.add(l),()=>{x.current.delete(l)}},variant:"outline",className:"group flex items-center gap-1",onClick:r?l=>{l.stopPropagation(),f(o)}:void 0,children:[a.get(o),r&&e.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconX",className:"text-muted-foreground group-hover:text-destructive size-2"})]},o)),e.jsxRuntimeExports.jsxs(I.Badge,{style:{display:p>0&&!S?"block":"none"},variant:"outline",ref:b,children:["+",p]})]})}function q({search:t=!0,children:r,...i}){const{isLoading:u,onSearchChange:d,searchValue:c,noResultsText:f}=M(),a=typeof t=="object"?!0:t;return e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[e.jsxRuntimeExports.jsx("div",{style:{display:"none"},children:e.jsxRuntimeExports.jsx(m.Command,{children:e.jsxRuntimeExports.jsx(m.CommandList,{children:r})})}),e.jsxRuntimeExports.jsx(N.PopoverContent,{className:"min-w-[var(--radix-popover-trigger-width)] p-0",children:e.jsxRuntimeExports.jsxs(m.Command,{...i,children:[a?e.jsxRuntimeExports.jsx(m.CommandInput,{placeholder:typeof t=="object"?t.placeholder:void 0,value:c,onValueChange:d}):e.jsxRuntimeExports.jsx("button",{autoFocus:!0,"aria-hidden":"true",className:"sr-only"}),e.jsxRuntimeExports.jsx(m.CommandList,{children:u?e.jsxRuntimeExports.jsxs("div",{className:"flex items-center justify-center py-6",children:[e.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconLoader2",className:"text-muted-foreground size-4 animate-spin"}),e.jsxRuntimeExports.jsx("span",{className:"text-muted-foreground ml-2 text-sm",children:u})]}):e.jsxRuntimeExports.jsxs(e.jsxRuntimeExports.Fragment,{children:[a&&e.jsxRuntimeExports.jsx(m.CommandEmpty,{children:f}),r]})})]})})]})}function O({value:t,children:r,badgeLabel:i,onSelect:u,...d}){const{toggleValue:c,selectedValues:f,onItemAdded:a}=M(),h=f.has(t);return n.useEffect(()=>{a(t,i??r)},[t,r,a,i]),e.jsxRuntimeExports.jsxs(m.CommandItem,{...d,value:t,onSelect:p=>{c(p),u?.(p)},children:[e.jsxRuntimeExports.jsx(v.IconComponent,{iconName:"IconCheck",className:e.cn("mr-2 size-4",h?"opacity-100":"opacity-0")}),r]})}function L(t){return e.jsxRuntimeExports.jsx(m.CommandGroup,{...t})}function _(t){return e.jsxRuntimeExports.jsx(m.CommandSeparator,{...t})}function M(){const t=n.useContext(V);if(t==null)throw new Error("useMultiSelectContext must be used within a MultiSelectContext");return t}exports.MultiSelect=k;exports.MultiSelectContent=q;exports.MultiSelectGroup=L;exports.MultiSelectItem=O;exports.MultiSelectSeparator=_;exports.MultiSelectTrigger=z;exports.MultiSelectValue=P;

package/dist/components/multi-select.d.ts

@@ -1,11 +1,15 @@
 import { Button } from '@/components/button';
 import { Command, CommandGroup, CommandItem, CommandSeparator } from '@/components/command';
 import { type ComponentPropsWithoutRef, type ReactNode } from 'react';
-declare function MultiSelect({ children, values, defaultValues, onValuesChange, }: {
+declare function MultiSelect({ children, values, defaultValues, onValuesChange, isLoading, onSearchChange, loadingText, noResultsText, }: {
     children: ReactNode;
     values?: string[];
     defaultValues?: string[];
     onValuesChange?: (values: string[]) => void;
+    isLoading?: boolean;
+    onSearchChange?: (value: string) => void;
+    loadingText?: string;
+    noResultsText?: string;
 }): import("react/jsx-runtime").JSX.Element;
 declare function MultiSelectTrigger({ className, children, size, ...props }: {
     className?: string;

package/dist/components/multi-select.es.js

@@ -1,70 +1,84 @@
-import { j as t, c as S } from "../index-DBpnlzOP.js";
-import { B as I } from "../badge-B4oRxQ-G.js";
-import { C as k, f as E, d as O, b as R, c as _, e as A, g as W } from "../command-CGUB58ej.js";
-import { P as F, b as G, c as B } from "../popover-C6pozFVL.js";
-import { createContext as L, useState as y, useCallback as V, useEffect as v, useRef as j, useLayoutEffect as T, useContext as X } from "react";
-import { I as C } from "../icon-component-DGImZz3K.js";
-const z = L(null);
-function U({
-  children: e,
-  values: n,
-  defaultValues: r,
-  onValuesChange: o
+import { j as e, c as z } from "../index-DBpnlzOP.js";
+import { B as E } from "../badge-Ds17GJH4.js";
+import { C as P, f as R, d as _, b as A, c as L, e as F, g as W } from "../command-CGUB58ej.js";
+import { P as G, b as T, c as B } from "../popover-C6pozFVL.js";
+import { createContext as X, useState as y, useCallback as I, useEffect as k, useRef as V, useLayoutEffect as q, useContext as D } from "react";
+import { I as N } from "../icon-component-DGImZz3K.js";
+const O = X(null);
+function Z({
+  children: t,
+  values: r,
+  defaultValues: o,
+  onValuesChange: a,
+  isLoading: u,
+  onSearchChange: l,
+  loadingText: p = "Loading...",
+  noResultsText: c = "No results found"
 }) {
-  const [d, m] = y(!1), [g, p] = y(
-    new Set(n ?? r)
-  ), [w, f] = y(/* @__PURE__ */ new Map());
-  function b(a) {
-    const s = (l) => {
-      const c = new Set(l);
-      return c.has(a) ? c.delete(a) : c.add(a), c;
+  const [h, m] = y(!1), [b, f] = y(
+    new Set(r ?? o)
+  ), [v, d] = y(/* @__PURE__ */ new Map()), [g, j] = y("");
+  function s(n) {
+    const x = (w) => {
+      const C = new Set(w);
+      return C.has(n) ? C.delete(n) : C.add(n), C;
     };
-    p(s), o?.([...s(g)]);
+    f(x), a?.([...x(b)]);
   }
-  const x = V((a, s) => {
-    f((l) => l.get(a) === s ? l : new Map(l).set(a, s));
-  }, []);
-  return /* @__PURE__ */ t.jsx(
-    z,
+  const i = I((n, x) => {
+    d((w) => w.get(n) === x ? w : new Map(w).set(n, x));
+  }, []), S = I(
+    (n) => {
+      j(n), l?.(n);
+    },
+    [l]
+  );
+  return /* @__PURE__ */ e.jsx(
+    O,
     {
       value: {
-        open: d,
+        open: h,
         setOpen: m,
-        selectedValues: n ? new Set(n) : g,
-        toggleValue: b,
-        items: w,
-        onItemAdded: x
+        selectedValues: r ? new Set(r) : b,
+        toggleValue: s,
+        items: v,
+        onItemAdded: i,
+        isLoading: u,
+        searchValue: g,
+        onSearchChange: S,
+        loadingText: p,
+        noResultsText: c
       },
-      children: /* @__PURE__ */ t.jsx(F, { open: d, onOpenChange: m, children: e })
+      children: /* @__PURE__ */ e.jsx(G, { open: h, onOpenChange: m, children: t })
     }
   );
 }
-function Y({
-  className: e,
-  children: n,
-  size: r = "md",
-  ...o
+function $({
+  className: t,
+  children: r,
+  size: o = "md",
+  ...a
 }) {
-  const { open: d } = M();
-  return /* @__PURE__ */ t.jsx(B, { asChild: !0, children: /* @__PURE__ */ t.jsxs(
+  const { open: u } = M();
+  return /* @__PURE__ */ e.jsx(B, { asChild: !0, children: /* @__PURE__ */ e.jsxs(
     "button",
     {
-      ...o,
-      role: o.role ?? "combobox",
-      "aria-expanded": o["aria-expanded"] ?? d,
-      "data-size": r,
-      className: S(
+      ...a,
+      role: a.role ?? "combobox",
+      "aria-expanded": a["aria-expanded"] ?? u,
+      "data-size": o,
+      className: z(
         "border-input focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:border-destructive aria-invalid:ring-destructive/20 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:ring-destructive/40 [&_svg:not([class*='text-'])]:text-muted-foreground flex w-fit items-center justify-between gap-2 overflow-hidden rounded-md border bg-transparent whitespace-nowrap transition-[color,box-shadow] outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4",
-        r === "xs" && 'label-sm h-7 px-2 py-1 [&_svg:not([class*="size-"])]:size-3.5',
-        r === "sm" && "label-md h-8 px-2 py-1",
-        r === "md" && "label-lg h-12 px-3 py-1",
-        r === "lg" && "label-xl h-16 px-4 py-2",
-        e
+        o === "xs" && 'label-sm h-7 px-2 py-1 [&_svg:not([class*="size-"])]:size-3.5',
+        o === "sm" && "label-md h-8 px-2 py-1",
+        o === "md" && "label-lg h-12 px-3 py-1",
+        o === "lg" && "label-xl h-16 px-4 py-2",
+        t
       ),
       children: [
-        n,
-        /* @__PURE__ */ t.jsx(
-          C,
+        r,
+        /* @__PURE__ */ e.jsx(
+          N,
           {
             iconName: "IconSelector",
             className: "size-4 shrink-0 opacity-50"
@@ -74,65 +88,65 @@ function Y({
     }
   ) });
 }
-function Z({
-  placeholder: e,
-  clickToRemove: n = !0,
-  className: r,
-  overflowBehavior: o = "wrap-when-open",
-  ...d
+function ee({
+  placeholder: t,
+  clickToRemove: r = !0,
+  className: o,
+  overflowBehavior: a = "wrap-when-open",
+  ...u
 }) {
-  const { selectedValues: m, toggleValue: g, items: p, open: w } = M(), [f, b] = y(0), x = j(null), a = j(null), s = j(/* @__PURE__ */ new Set()), l = o === "wrap" || o === "wrap-when-open" && w;
-  v(() => {
-    l && s.current.forEach((i) => i.style.removeProperty("display"));
-  }, [l]);
-  const c = V(() => {
-    if (x.current == null) return;
-    const i = x.current, u = a.current;
-    u != null && (u.style.display = "none"), s.current.forEach((h) => h.style.removeProperty("display"));
-    let N = 0;
-    for (let h = s.current.size - 1; h >= 0; h--) {
-      const P = [...s.current][h];
-      if (i.scrollWidth <= i.clientWidth)
+  const { selectedValues: l, toggleValue: p, items: c, open: h } = M(), [m, b] = y(0), f = V(null), v = V(null), d = V(/* @__PURE__ */ new Set()), g = a === "wrap" || a === "wrap-when-open" && h;
+  k(() => {
+    g && d.current.forEach((s) => s.style.removeProperty("display"));
+  }, [g]);
+  const j = I(() => {
+    if (f.current == null) return;
+    const s = f.current, i = v.current;
+    i != null && (i.style.display = "none"), d.current.forEach((n) => n.style.removeProperty("display"));
+    let S = 0;
+    for (let n = d.current.size - 1; n >= 0; n--) {
+      const x = [...d.current][n];
+      if (s.scrollWidth <= s.clientWidth)
         break;
-      N = s.current.size - h, P.style.display = "none", u?.style.removeProperty("display");
+      S = d.current.size - n, x.style.display = "none", i?.style.removeProperty("display");
     }
-    b(N);
+    b(S);
   }, []);
-  return v(() => {
-    if (x.current == null) return;
-    const i = new ResizeObserver(c);
-    return i.observe(x.current), () => i.disconnect();
-  }, [c]), T(() => {
-    c();
-  }, [m, c]), m.size === 0 && e ? /* @__PURE__ */ t.jsx("span", { className: "text-muted-foreground font-normal", children: e }) : /* @__PURE__ */ t.jsxs(
+  return k(() => {
+    if (f.current == null) return;
+    const s = new ResizeObserver(j);
+    return s.observe(f.current), () => s.disconnect();
+  }, [j]), q(() => {
+    j();
+  }, [l, j]), l.size === 0 && t ? /* @__PURE__ */ e.jsx("span", { className: "text-muted-foreground font-normal", children: t }) : /* @__PURE__ */ e.jsxs(
     "div",
     {
-      ...d,
-      ref: x,
-      className: S(
+      ...u,
+      ref: f,
+      className: z(
         "flex min-h-[1.75rem] w-full gap-1.5 overflow-hidden",
-        l && "flex-wrap",
-        r
+        g && "flex-wrap",
+        o
       ),
       children: [
-        [...m].filter((i) => p.has(i)).map((i) => /* @__PURE__ */ t.jsxs(
-          I,
+        [...l].filter((s) => c.has(s)).map((s) => /* @__PURE__ */ e.jsxs(
+          E,
           {
-            ref: (u) => {
-              if (u != null)
-                return s.current.add(u), () => {
-                  s.current.delete(u);
+            ref: (i) => {
+              if (i != null)
+                return d.current.add(i), () => {
+                  d.current.delete(i);
                 };
             },
             variant: "outline",
             className: "group flex items-center gap-1",
-            onClick: n ? (u) => {
-              u.stopPropagation(), g(i);
+            onClick: r ? (i) => {
+              i.stopPropagation(), p(s);
             } : void 0,
             children: [
-              p.get(i),
-              n && /* @__PURE__ */ t.jsx(
-                C,
+              c.get(s),
+              r && /* @__PURE__ */ e.jsx(
+                N,
                 {
                   iconName: "IconX",
                   className: "text-muted-foreground group-hover:text-destructive size-2"
@@ -140,19 +154,19 @@ function Z({
               )
             ]
           },
-          i
+          s
         )),
-        /* @__PURE__ */ t.jsxs(
-          I,
+        /* @__PURE__ */ e.jsxs(
+          E,
           {
             style: {
-              display: f > 0 && !l ? "block" : "none"
+              display: m > 0 && !g ? "block" : "none"
             },
             variant: "outline",
-            ref: a,
+            ref: v,
             children: [
               "+",
-              f
+              m
             ]
           }
         )
@@ -160,79 +174,90 @@ function Z({
     }
   );
 }
-function $({
-  search: e = !0,
-  children: n,
-  ...r
+function te({
+  search: t = !0,
+  children: r,
+  ...o
 }) {
-  const o = typeof e == "object" ? !0 : e;
-  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
-    /* @__PURE__ */ t.jsx("div", { style: { display: "none" }, children: /* @__PURE__ */ t.jsx(k, { children: /* @__PURE__ */ t.jsx(E, { children: n }) }) }),
-    /* @__PURE__ */ t.jsx(G, { className: "min-w-[var(--radix-popover-trigger-width)] p-0", children: /* @__PURE__ */ t.jsxs(k, { ...r, children: [
-      o ? /* @__PURE__ */ t.jsx(
-        O,
+  const { isLoading: a, onSearchChange: u, searchValue: l, noResultsText: p } = M(), c = typeof t == "object" ? !0 : t;
+  return /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+    /* @__PURE__ */ e.jsx("div", { style: { display: "none" }, children: /* @__PURE__ */ e.jsx(P, { children: /* @__PURE__ */ e.jsx(R, { children: r }) }) }),
+    /* @__PURE__ */ e.jsx(T, { className: "min-w-[var(--radix-popover-trigger-width)] p-0", children: /* @__PURE__ */ e.jsxs(P, { ...o, children: [
+      c ? /* @__PURE__ */ e.jsx(
+        _,
         {
-          placeholder: typeof e == "object" ? e.placeholder : void 0
+          placeholder: typeof t == "object" ? t.placeholder : void 0,
+          value: l,
+          onValueChange: u
         }
-      ) : /* @__PURE__ */ t.jsx("button", { autoFocus: !0, "aria-hidden": "true", className: "sr-only" }),
-      /* @__PURE__ */ t.jsxs(E, { children: [
-        o && /* @__PURE__ */ t.jsx(R, { children: typeof e == "object" ? e.emptyMessage : void 0 }),
-        n
-      ] })
+      ) : /* @__PURE__ */ e.jsx("button", { autoFocus: !0, "aria-hidden": "true", className: "sr-only" }),
+      /* @__PURE__ */ e.jsx(R, { children: a ? /* @__PURE__ */ e.jsxs("div", { className: "flex items-center justify-center py-6", children: [
+        /* @__PURE__ */ e.jsx(
+          N,
+          {
+            iconName: "IconLoader2",
+            className: "text-muted-foreground size-4 animate-spin"
+          }
+        ),
+        /* @__PURE__ */ e.jsx("span", { className: "text-muted-foreground ml-2 text-sm", children: a })
+      ] }) : /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
+        c && /* @__PURE__ */ e.jsx(A, { children: p }),
+        r
+      ] }) })
     ] }) })
   ] });
 }
-function ee({
-  value: e,
-  children: n,
-  badgeLabel: r,
-  onSelect: o,
-  ...d
+function ne({
+  value: t,
+  children: r,
+  badgeLabel: o,
+  onSelect: a,
+  ...u
 }) {
-  const { toggleValue: m, selectedValues: g, onItemAdded: p } = M(), w = g.has(e);
-  return v(() => {
-    p(e, r ?? n);
-  }, [e, n, p, r]), /* @__PURE__ */ t.jsxs(
-    A,
+  const { toggleValue: l, selectedValues: p, onItemAdded: c } = M(), h = p.has(t);
+  return k(() => {
+    c(t, o ?? r);
+  }, [t, r, c, o]), /* @__PURE__ */ e.jsxs(
+    F,
     {
-      ...d,
-      value: e,
-      onSelect: (f) => {
-        m(f), o?.(f);
+      ...u,
+      value: t,
+      onSelect: (m) => {
+        l(m), a?.(m);
       },
       children: [
-        /* @__PURE__ */ t.jsx(
-          C,
+        /* @__PURE__ */ e.jsx(
+          N,
           {
             iconName: "IconCheck",
-            className: S("mr-2 size-4", w ? "opacity-100" : "opacity-0")
+            className: z("mr-2 size-4", h ? "opacity-100" : "opacity-0")
           }
         ),
-        n
+        r
       ]
     }
   );
 }
-function te(e) {
-  return /* @__PURE__ */ t.jsx(_, { ...e });
+function re(t) {
+  return /* @__PURE__ */ e.jsx(L, { ...t });
 }
-function ne(e) {
-  return /* @__PURE__ */ t.jsx(W, { ...e });
+function se(t) {
+  return /* @__PURE__ */ e.jsx(W, { ...t });
 }
 function M() {
-  const e = X(z);
-  if (e == null)
+  const t = D(O);
+  if (t == null)
     throw new Error(
       "useMultiSelectContext must be used within a MultiSelectContext"
     );
-  return e;
+  return t;
 }
 export {
-  U as MultiSelect,
-  $ as MultiSelectContent,
-  te as MultiSelectGroup,
-  ee as MultiSelectItem,
-  ne as MultiSelectSeparator,
-  Y as MultiSelectTrigger,
-  Z as MultiSelectValue
+  Z as MultiSelect,
+  te as MultiSelectContent,
+  re as MultiSelectGroup,
+  ne as MultiSelectItem,
+  se as MultiSelectSeparator,
+  $ as MultiSelectTrigger,
+  ee as MultiSelectValue
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clasing/ui",
-  "version": "2.0.7",
+  "version": "2.0.9",
   "type": "module",
   "main": "./dist/index.umd.js",
   "module": "./dist/index.es.js",

package/dist/badge-CS2XfLYQ.cjs

@@ -1 +0,0 @@
-"use strict";const r=require("./index-DSjHHn1r.cjs"),v=require("@radix-ui/react-slot"),h=require("./index-BVmT9wZC.cjs"),i=require("./icon-component-DTlgy__B.cjs"),x=h.cva("focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-2 overflow-hidden border font-semibold whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none",{variants:{variant:{default:"bg-muted text-muted-foreground [a&]:hover:bg-muted/90 border-transparent",secondary:"bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent",destructive:"bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60 border-transparent text-white",outline:"text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",error:"bg-error-light text-error-main [a&]:hover:bg-error-light/90 border-transparent",warning:"bg-warning-light text-warning-main [a&]:hover:bg-warning-light/90 border-transparent",success:"bg-success-light text-success-main [a&]:hover:bg-success-light/90 border-transparent",info:"bg-info-light text-info-main [a&]:hover:bg-info-light/90 border-transparent",neutral:"border-transparent bg-black text-white [a&]:hover:bg-black/90",primary:"bg-primary-600 [a&]:hover:bg-primary-600/90 border-transparent text-white",yellow:"border-transparent bg-yellow-600 text-white [a&]:hover:bg-yellow-600/90",blue:"border-transparent bg-blue-600 text-white [a&]:hover:bg-blue-600/90",violet:"border-transparent bg-violet-600 text-white [a&]:hover:bg-violet-600/90"},size:{xs:"paragraph-xs px-3 py-px [&>svg]:size-3",sm:"paragraph-xs px-4 py-1 [&>svg]:size-4",md:"paragraph-sm px-4 py-2 [&>svg]:size-4",lg:"paragraph-md px-4 py-2 [&>svg]:size-5"},weight:{light:"font-light",regular:"font-regular",semibold:"font-semibold",bold:"font-bold"},rounded:{default:"rounded-2xl",full:"rounded-full"}},defaultVariants:{variant:"default",size:"xs",weight:"semibold",rounded:"full"}});function f({className:o,variant:s,size:d,weight:g,rounded:l,iconName:e,iconPosition:t="left",iconStroke:a,iconOnly:n,asChild:b=!1,children:u,...p}){const c=b?v.Slot:"span";return r.jsxRuntimeExports.jsxs(c,{"data-slot":"badge",className:r.cn(x({variant:s,size:d,weight:g,rounded:l}),n&&"px-2.5 py-2",o),...p,children:[e&&t==="left"&&r.jsxRuntimeExports.jsx(i.IconComponent,{iconName:e,stroke:a}),!n&&u,e&&t==="right"&&r.jsxRuntimeExports.jsx(i.IconComponent,{iconName:e,stroke:a})]})}exports.Badge=f;