@iclips/ui 2.0.2 → 3.0.0

package/dist/components/ui/forms/calendar.js

@@ -1,21 +1,21 @@
 "use client";
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as r } from "react/jsx-runtime";
 import { DayPicker as m } from "react-day-picker";
 import { ptBR as l } from "date-fns/locale";
 import { ChevronLeft as u, ChevronRight as f } from "lucide-react";
 import { cn as e } from "../utils.js";
-import { buttonVariants as r } from "../primitives/button.js";
+import { buttonVariants as t } from "../primitives/button.js";
 function g({
   className: a,
-  classNames: n,
-  showOutsideDays: d = !0,
+  classNames: d,
+  showOutsideDays: n = !0,
   locale: i = l,
-  ...c
+  ...s
 }) {
-  return /* @__PURE__ */ t(
+  return /* @__PURE__ */ r(
     m,
     {
-      showOutsideDays: d,
+      showOutsideDays: n,
       locale: i,
       className: e("p-3 relative", a),
       classNames: {
@@ -25,36 +25,36 @@ function g({
         caption_label: "text-sm font-medium",
         nav: "absolute top-3 inset-x-3 flex items-center justify-between z-10",
         button_previous: e(
-          r({ variant: "outline" }),
+          t({ variant: "outline" }),
           "size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border"
         ),
         button_next: e(
-          r({ variant: "outline" }),
+          t({ variant: "outline" }),
           "size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border"
         ),
         month_grid: "w-full border-collapse space-y-1",
         weekdays: "flex",
         weekday: "text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]",
         week: "flex w-full mt-2",
-        day: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 rounded-md",
+        day: "h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].outside)]:bg-secondary/50 [&:has([aria-selected])]:bg-secondary first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 rounded-md",
         day_button: e(
-          r({ variant: "ghost" }),
+          t({ variant: "ghost" }),
           "h-9 w-9 p-0 font-normal aria-selected:opacity-100 rounded-md"
         ),
         range_end: "range-end",
         range_start: "range-start",
         selected: "bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground rounded-md",
         today: "bg-accent text-accent-foreground rounded-md",
-        outside: "outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground",
+        outside: "outside text-muted-foreground aria-selected:bg-secondary/50 aria-selected:text-muted-foreground",
         disabled: "text-muted-foreground opacity-50",
-        range_middle: "aria-selected:bg-accent aria-selected:text-accent-foreground",
+        range_middle: "aria-selected:bg-secondary aria-selected:text-secondary-foreground",
         hidden: "invisible",
-        ...n
+        ...d
       },
       components: {
-        Chevron: ({ orientation: s, ...o }) => s === "left" ? /* @__PURE__ */ t(u, { className: "h-4 w-4", ...o }) : /* @__PURE__ */ t(f, { className: "h-4 w-4", ...o })
+        Chevron: ({ orientation: c, ...o }) => c === "left" ? /* @__PURE__ */ r(u, { className: "h-4 w-4", ...o }) : /* @__PURE__ */ r(f, { className: "h-4 w-4", ...o })
       },
-      ...c
+      ...s
     }
   );
 }

package/dist/components/ui/forms/calendar.js.map

@@ -1 +1 @@
-{"version":3,"file":"calendar.js","sources":["../../../../src/components/ui/forms/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { DayPicker } from \"react-day-picker\";\nimport { ptBR } from \"date-fns/locale\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nimport { cn } from \"../utils\";\nimport { buttonVariants } from \"../primitives/button\";\n\nexport type CalendarProps = React.ComponentProps<typeof DayPicker>;\n\n/**\n * Calendar - Componente base de calendário\n *\n * Grid de dias para seleção de datas. Usado internamente pelo DatePicker\n * e DateRangePicker, mas também pode ser usado standalone.\n *\n * @example\n * // Seleção única\n * <Calendar\n *   mode=\"single\"\n *   selected={date}\n *   onSelect={setDate}\n * />\n *\n * @example\n * // Seleção de intervalo\n * <Calendar\n *   mode=\"range\"\n *   selected={dateRange}\n *   onSelect={setDateRange}\n * />\n */\n// react-day-picker's DayPicker is a plain function with no ref support -- cannot be forwardRef'd.\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  locale = ptBR,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      locale={locale}\n      className={cn(\"p-3 relative\", className)}\n      classNames={{\n        months: \"flex flex-col sm:flex-row gap-4\",\n        month: \"flex flex-col gap-4\",\n        month_caption: \"flex justify-center pt-1 relative items-center\",\n        caption_label: \"text-sm font-medium\",\n        nav: \"absolute top-3 inset-x-3 flex items-center justify-between z-10\",\n        button_previous: cn(\n          buttonVariants({ variant: \"outline\" }),\n          \"size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border\"\n        ),\n        button_next: cn(\n          buttonVariants({ variant: \"outline\" }),\n          \"size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border\"\n        ),\n        month_grid: \"w-full border-collapse space-y-1\",\n        weekdays: \"flex\",\n        weekday: \"text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]\",\n        week: \"flex w-full mt-2\",\n        day: \"h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].outside)]:bg-accent/50 [&:has([aria-selected])]:bg-accent first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 rounded-md\",\n        day_button: cn(\n          buttonVariants({ variant: \"ghost\" }),\n          \"h-9 w-9 p-0 font-normal aria-selected:opacity-100 rounded-md\"\n        ),\n        range_end: \"range-end\",\n        range_start: \"range-start\",\n        selected:\n          \"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground rounded-md\",\n        today: \"bg-accent text-accent-foreground rounded-md\",\n        outside:\n          \"outside text-muted-foreground aria-selected:bg-accent/50 aria-selected:text-muted-foreground\",\n        disabled: \"text-muted-foreground opacity-50\",\n        range_middle:\n          \"aria-selected:bg-accent aria-selected:text-accent-foreground\",\n        hidden: \"invisible\",\n        ...classNames,\n      }}\n      components={{\n        Chevron: ({ orientation, ...rest }) =>\n          orientation === \"left\" ? (\n            <ChevronLeft className=\"h-4 w-4\" {...rest} />\n          ) : (\n            <ChevronRight className=\"h-4 w-4\" {...rest} />\n          ),\n      }}\n      {...props}\n    />\n  );\n}\n\nCalendar.displayName = \"Calendar\";\n\nexport { Calendar };\n"],"names":["Calendar","className","classNames","showOutsideDays","locale","ptBR","props","jsx","DayPicker","cn","buttonVariants","orientation","rest","ChevronLeft","ChevronRight"],"mappings":";;;;;;;AAmCA,SAASA,EAAS;AAAA,EAChB,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAASC;AAAA,EACT,GAAGC;AACL,GAAkB;AAChB,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,iBAAAL;AAAA,MACA,QAAAC;AAAA,MACA,WAAWK,EAAG,gBAAgBR,CAAS;AAAA,MACvC,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,eAAe;AAAA,QACf,eAAe;AAAA,QACf,KAAK;AAAA,QACL,iBAAiBQ;AAAA,UACfC,EAAe,EAAE,SAAS,WAAW;AAAA,UACrC;AAAA,QAAA;AAAA,QAEF,aAAaD;AAAA,UACXC,EAAe,EAAE,SAAS,WAAW;AAAA,UACrC;AAAA,QAAA;AAAA,QAEF,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,MAAM;AAAA,QACN,KAAK;AAAA,QACL,YAAYD;AAAA,UACVC,EAAe,EAAE,SAAS,SAAS;AAAA,UACnC;AAAA,QAAA;AAAA,QAEF,WAAW;AAAA,QACX,aAAa;AAAA,QACb,UACE;AAAA,QACF,OAAO;AAAA,QACP,SACE;AAAA,QACF,UAAU;AAAA,QACV,cACE;AAAA,QACF,QAAQ;AAAA,QACR,GAAGR;AAAA,MAAA;AAAA,MAEL,YAAY;AAAA,QACV,SAAS,CAAC,EAAE,aAAAS,GAAa,GAAGC,EAAA,MAC1BD,MAAgB,SACd,gBAAAJ,EAACM,KAAY,WAAU,WAAW,GAAGD,EAAA,CAAM,sBAE1CE,GAAA,EAAa,WAAU,WAAW,GAAGF,EAAA,CAAM;AAAA,MAAA;AAAA,MAGjD,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAN,EAAS,cAAc;"}
+{"version":3,"file":"calendar.js","sources":["../../../../src/components/ui/forms/calendar.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { DayPicker } from \"react-day-picker\";\nimport { ptBR } from \"date-fns/locale\";\nimport { ChevronLeft, ChevronRight } from \"lucide-react\";\n\nimport { cn } from \"../utils\";\nimport { buttonVariants } from \"../primitives/button\";\n\nexport type CalendarProps = React.ComponentProps<typeof DayPicker>;\n\n/**\n * Calendar - Componente base de calendário\n *\n * Grid de dias para seleção de datas. Usado internamente pelo DatePicker\n * e DateRangePicker, mas também pode ser usado standalone.\n *\n * @example\n * // Seleção única\n * <Calendar\n *   mode=\"single\"\n *   selected={date}\n *   onSelect={setDate}\n * />\n *\n * @example\n * // Seleção de intervalo\n * <Calendar\n *   mode=\"range\"\n *   selected={dateRange}\n *   onSelect={setDateRange}\n * />\n */\n// react-day-picker's DayPicker is a plain function with no ref support -- cannot be forwardRef'd.\nfunction Calendar({\n  className,\n  classNames,\n  showOutsideDays = true,\n  locale = ptBR,\n  ...props\n}: CalendarProps) {\n  return (\n    <DayPicker\n      showOutsideDays={showOutsideDays}\n      locale={locale}\n      className={cn(\"p-3 relative\", className)}\n      classNames={{\n        months: \"flex flex-col sm:flex-row gap-4\",\n        month: \"flex flex-col gap-4\",\n        month_caption: \"flex justify-center pt-1 relative items-center\",\n        caption_label: \"text-sm font-medium\",\n        nav: \"absolute top-3 inset-x-3 flex items-center justify-between z-10\",\n        button_previous: cn(\n          buttonVariants({ variant: \"outline\" }),\n          \"size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border\"\n        ),\n        button_next: cn(\n          buttonVariants({ variant: \"outline\" }),\n          \"size-7 bg-background p-1.5 hover:bg-accent hover:text-accent-foreground rounded-md border-border\"\n        ),\n        month_grid: \"w-full border-collapse space-y-1\",\n        weekdays: \"flex\",\n        weekday: \"text-muted-foreground rounded-md w-9 font-normal text-[0.8rem]\",\n        week: \"flex w-full mt-2\",\n        day: \"h-9 w-9 text-center text-sm p-0 relative [&:has([aria-selected].outside)]:bg-secondary/50 [&:has([aria-selected])]:bg-secondary first:[&:has([aria-selected])]:rounded-l-md last:[&:has([aria-selected])]:rounded-r-md focus-within:relative focus-within:z-20 rounded-md\",\n        day_button: cn(\n          buttonVariants({ variant: \"ghost\" }),\n          \"h-9 w-9 p-0 font-normal aria-selected:opacity-100 rounded-md\"\n        ),\n        range_end: \"range-end\",\n        range_start: \"range-start\",\n        selected:\n          \"bg-primary text-primary-foreground hover:bg-primary hover:text-primary-foreground focus:bg-primary focus:text-primary-foreground rounded-md\",\n        today: \"bg-accent text-accent-foreground rounded-md\",\n        outside:\n          \"outside text-muted-foreground aria-selected:bg-secondary/50 aria-selected:text-muted-foreground\",\n        disabled: \"text-muted-foreground opacity-50\",\n        range_middle:\n          \"aria-selected:bg-secondary aria-selected:text-secondary-foreground\",\n        hidden: \"invisible\",\n        ...classNames,\n      }}\n      components={{\n        Chevron: ({ orientation, ...rest }) =>\n          orientation === \"left\" ? (\n            <ChevronLeft className=\"h-4 w-4\" {...rest} />\n          ) : (\n            <ChevronRight className=\"h-4 w-4\" {...rest} />\n          ),\n      }}\n      {...props}\n    />\n  );\n}\n\nCalendar.displayName = \"Calendar\";\n\nexport { Calendar };\n"],"names":["Calendar","className","classNames","showOutsideDays","locale","ptBR","props","jsx","DayPicker","cn","buttonVariants","orientation","rest","ChevronLeft","ChevronRight"],"mappings":";;;;;;;AAmCA,SAASA,EAAS;AAAA,EAChB,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,iBAAAC,IAAkB;AAAA,EAClB,QAAAC,IAASC;AAAA,EACT,GAAGC;AACL,GAAkB;AAChB,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,iBAAAL;AAAA,MACA,QAAAC;AAAA,MACA,WAAWK,EAAG,gBAAgBR,CAAS;AAAA,MACvC,YAAY;AAAA,QACV,QAAQ;AAAA,QACR,OAAO;AAAA,QACP,eAAe;AAAA,QACf,eAAe;AAAA,QACf,KAAK;AAAA,QACL,iBAAiBQ;AAAA,UACfC,EAAe,EAAE,SAAS,WAAW;AAAA,UACrC;AAAA,QAAA;AAAA,QAEF,aAAaD;AAAA,UACXC,EAAe,EAAE,SAAS,WAAW;AAAA,UACrC;AAAA,QAAA;AAAA,QAEF,YAAY;AAAA,QACZ,UAAU;AAAA,QACV,SAAS;AAAA,QACT,MAAM;AAAA,QACN,KAAK;AAAA,QACL,YAAYD;AAAA,UACVC,EAAe,EAAE,SAAS,SAAS;AAAA,UACnC;AAAA,QAAA;AAAA,QAEF,WAAW;AAAA,QACX,aAAa;AAAA,QACb,UACE;AAAA,QACF,OAAO;AAAA,QACP,SACE;AAAA,QACF,UAAU;AAAA,QACV,cACE;AAAA,QACF,QAAQ;AAAA,QACR,GAAGR;AAAA,MAAA;AAAA,MAEL,YAAY;AAAA,QACV,SAAS,CAAC,EAAE,aAAAS,GAAa,GAAGC,EAAA,MAC1BD,MAAgB,SACd,gBAAAJ,EAACM,KAAY,WAAU,WAAW,GAAGD,EAAA,CAAM,sBAE1CE,GAAA,EAAa,WAAU,WAAW,GAAGF,EAAA,CAAM;AAAA,MAAA;AAAA,MAGjD,GAAGN;AAAA,IAAA;AAAA,EAAA;AAGV;AAEAN,EAAS,cAAc;"}

package/dist/components/ui/forms/combobox.cjs

@@ -1,2 +1,2 @@
-"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),A=require("react"),b=require("lucide-react"),i=require("../utils.cjs"),g=require("../primitives/button.cjs"),h=require("../overlays/popover.cjs"),E=require("./input.cjs");function H(s){const c=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(s){for(const r in s)if(r!=="default"){const a=Object.getOwnPropertyDescriptor(s,r);Object.defineProperty(c,r,a.get?a:{enumerable:!0,get:()=>s[r]})}}return c.default=s,Object.freeze(c)}const d=H(A),O=d.forwardRef(({value:s,onValueChange:c,options:r,groups:a,placeholder:R="Selecionar...",searchPlaceholder:S="Buscar...",emptyMessage:L="Nenhum resultado encontrado",disabled:M=!1,loading:x=!1,className:P,popoverWidth:q,maxHeight:T="300px",align:F="start",clearable:B=!1,filterFn:D,"aria-label":_,"aria-labelledby":W},v)=>{var C;const[p,w]=d.useState(!1),[o,j]=d.useState(""),y=d.useRef(null),z=d.useMemo(()=>i.mergeRefs(y,v),[v]),m=D||((e,l)=>{const n=l.toLowerCase();return e.label.toLowerCase().includes(n)||e.value.toLowerCase().includes(n)}),N=d.useMemo(()=>r?o?r.filter(e=>m(e,o)):r:[],[r,o,m]),u=d.useMemo(()=>{if(!a)return;if(!o)return a;const e=o.toLowerCase();return a.map(l=>l.label.toLowerCase().includes(e)?l:{...l,options:l.options.filter(n=>m(n,o))}).filter(l=>l.options.length>0||l.label.toLowerCase().includes(e))},[a,o,m]),k=d.useMemo(()=>a?a.flatMap(e=>[...e.value?[{value:e.value,label:e.label}]:[],...e.options]):r??[],[r,a]).find(e=>e.value===s),I=a?((u==null?void 0:u.length)??0)>0:N.length>0,U=e=>{w(e),e||j("")},f=e=>{s===e&&B?c==null||c(""):c==null||c(e),w(!1)};return t.jsxs(h.Popover,{open:p,onOpenChange:U,children:[t.jsx(h.PopoverTrigger,{asChild:!0,children:t.jsxs(g.Button,{ref:z,variant:"outline",role:"combobox","aria-expanded":p,"aria-label":_,"aria-labelledby":W,className:i.cn("w-full justify-between font-normal",!s&&"text-muted-foreground",P),disabled:M||x,children:[t.jsx("span",{className:"truncate",children:x?"Carregando...":k?k.label:R}),t.jsx(b.ChevronsUpDown,{className:"ml-2 h-4 w-4 shrink-0 opacity-50"})]})}),t.jsx(h.PopoverContent,{className:"overflow-hidden p-0",style:{width:q||((C=y.current)==null?void 0:C.offsetWidth)||"auto"},align:F,children:t.jsxs("div",{className:"flex flex-col overflow-hidden",children:[t.jsxs("div",{className:"flex items-center border-b px-3",children:[t.jsx(b.Search,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),t.jsx(E.Input,{placeholder:S,value:o,onChange:e=>j(e.target.value),className:"h-11 border-0 focus-visible:ring-0 focus-visible:ring-offset-0",autoFocus:!0})]}),t.jsx("div",{className:"overflow-y-auto overflow-x-hidden overscroll-contain [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-primary/30 [&::-webkit-scrollbar-thumb:hover]:bg-primary/50",style:{maxHeight:T},onWheel:e=>e.stopPropagation(),onTouchMove:e=>e.stopPropagation(),children:t.jsx("div",{className:"p-1",children:I?a?u==null?void 0:u.map((e,l)=>t.jsxs("div",{className:i.cn(l>0&&"mt-1.5 border-t border-border pt-1.5"),children:[e.value?t.jsxs("button",{type:"button",onClick:()=>f(e.value),className:i.cn("flex w-full items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-sm","font-semibold uppercase tracking-wide","transition-colors duration-100 hover:bg-accent hover:text-accent-foreground",s===e.value&&"bg-accent"),children:[t.jsx("span",{className:"truncate",children:e.label}),t.jsx(b.Check,{className:i.cn("h-4 w-4 shrink-0",s===e.value?"opacity-100":"opacity-0")})]}):t.jsx("div",{className:"px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground",children:e.label}),e.options.map(n=>t.jsxs("button",{type:"button",onClick:()=>f(n.value),disabled:n.disabled,className:i.cn("flex w-full items-center justify-between gap-2 rounded-sm py-1.5 pl-6 pr-2 text-sm","transition-colors duration-100 hover:bg-accent hover:text-accent-foreground","disabled:pointer-events-none disabled:opacity-50",s===n.value&&"bg-accent"),children:[t.jsx("span",{className:"truncate",children:n.label}),t.jsx(b.Check,{className:i.cn("h-4 w-4 shrink-0",s===n.value?"opacity-100":"opacity-0")})]},n.value))]},e.value??e.label)):N.map(e=>t.jsxs(g.Button,{variant:"ghost",className:i.cn("w-full justify-start font-normal",s===e.value&&"bg-accent"),onClick:()=>f(e.value),disabled:e.disabled,children:[t.jsx(b.Check,{className:i.cn("mr-2 h-4 w-4",s===e.value?"opacity-100":"opacity-0")}),t.jsx("span",{className:"truncate",children:e.label})]},e.value)):t.jsx("div",{className:"py-6 text-center text-sm text-muted-foreground",children:L})})})]})})]})});O.displayName="Combobox";exports.Combobox=O;
+"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),A=require("react"),b=require("lucide-react"),c=require("../utils.cjs"),C=require("../primitives/button.cjs"),h=require("../overlays/popover.cjs"),E=require("./input.cjs");function H(r){const o=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(r){for(const a in r)if(a!=="default"){const s=Object.getOwnPropertyDescriptor(r,a);Object.defineProperty(o,a,s.get?s:{enumerable:!0,get:()=>r[a]})}}return o.default=r,Object.freeze(o)}const d=H(A),O=d.forwardRef(({value:r,onValueChange:o,options:a,groups:s,placeholder:R="Selecionar...",searchPlaceholder:S="Buscar...",emptyMessage:L="Nenhum resultado encontrado",disabled:M=!1,loading:v=!1,className:P,popoverWidth:q,maxHeight:T="300px",align:F="start",clearable:B=!1,filterFn:D,"aria-label":_,"aria-labelledby":W},x)=>{var k;const[y,p]=d.useState(!1),[i,w]=d.useState(""),j=d.useRef(null),z=d.useMemo(()=>c.mergeRefs(j,x),[x]),f=D||((e,n)=>{const l=n.toLowerCase();return e.label.toLowerCase().includes(l)||e.value.toLowerCase().includes(l)}),g=d.useMemo(()=>a?i?a.filter(e=>f(e,i)):a:[],[a,i,f]),u=d.useMemo(()=>{if(!s)return;if(!i)return s;const e=i.toLowerCase();return s.map(n=>n.label.toLowerCase().includes(e)?n:{...n,options:n.options.filter(l=>f(l,i))}).filter(n=>n.options.length>0||n.label.toLowerCase().includes(e))},[s,i,f]),N=d.useMemo(()=>s?s.flatMap(e=>[...e.value?[{value:e.value,label:e.label}]:[],...e.options]):a??[],[a,s]).find(e=>e.value===r),I=s?((u==null?void 0:u.length)??0)>0:g.length>0,U=e=>{p(e),e||w("")},m=e=>{r===e&&B?o==null||o(""):o==null||o(e),p(!1)};return t.jsxs(h.Popover,{open:y,onOpenChange:U,children:[t.jsx(h.PopoverTrigger,{asChild:!0,children:t.jsxs(C.Button,{ref:z,variant:"outline",role:"combobox","aria-expanded":y,"aria-label":_,"aria-labelledby":W,className:c.cn("w-full justify-between font-normal",!r&&"text-muted-foreground",P),disabled:M||v,children:[t.jsx("span",{className:"truncate",children:v?"Carregando...":N?N.label:R}),t.jsx(b.ChevronsUpDown,{className:"ml-2 h-4 w-4 shrink-0 opacity-50"})]})}),t.jsx(h.PopoverContent,{className:"overflow-hidden p-0",style:{width:q||((k=j.current)==null?void 0:k.offsetWidth)||"auto"},align:F,children:t.jsxs("div",{className:"flex flex-col overflow-hidden",children:[t.jsxs("div",{className:"flex items-center border-b px-3",children:[t.jsx(b.Search,{className:"mr-2 h-4 w-4 shrink-0 opacity-50"}),t.jsx(E.Input,{placeholder:S,value:i,onChange:e=>w(e.target.value),className:"h-11 border-0 focus-visible:ring-0 focus-visible:ring-offset-0",autoFocus:!0})]}),t.jsx("div",{className:"overflow-y-auto overflow-x-hidden overscroll-contain [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-primary/30 [&::-webkit-scrollbar-thumb:hover]:bg-primary/50",style:{maxHeight:T},onWheel:e=>e.stopPropagation(),onTouchMove:e=>e.stopPropagation(),children:t.jsx("div",{className:"p-1",children:I?s?u==null?void 0:u.map((e,n)=>t.jsxs("div",{className:c.cn(n>0&&"mt-1.5 border-t border-border pt-1.5"),children:[e.value?t.jsxs("button",{type:"button",onClick:()=>m(e.value),className:c.cn("flex w-full items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-sm","font-semibold uppercase tracking-wide","transition-colors duration-100 hover:bg-accent hover:text-accent-foreground","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",r===e.value&&"bg-secondary text-secondary-foreground hover:bg-secondary hover:text-secondary-foreground"),children:[t.jsx("span",{className:"truncate",children:e.label}),t.jsx(b.Check,{className:c.cn("h-4 w-4 shrink-0",r===e.value?"opacity-100":"opacity-0")})]}):t.jsx("div",{className:"px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground",children:e.label}),e.options.map(l=>t.jsxs("button",{type:"button",onClick:()=>m(l.value),disabled:l.disabled,className:c.cn("flex w-full items-center justify-between gap-2 rounded-sm py-1.5 pl-6 pr-2 text-sm","transition-colors duration-100 hover:bg-accent hover:text-accent-foreground","disabled:pointer-events-none disabled:opacity-50","focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",r===l.value&&"bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground"),children:[t.jsx("span",{className:"truncate",children:l.label}),t.jsx(b.Check,{className:c.cn("h-4 w-4 shrink-0",r===l.value?"opacity-100":"opacity-0")})]},l.value))]},e.value??e.label)):g.map(e=>t.jsxs(C.Button,{variant:"ghost",className:c.cn("w-full justify-start font-normal",r===e.value&&"bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground dark:hover:bg-secondary"),onClick:()=>m(e.value),disabled:e.disabled,children:[t.jsx(b.Check,{className:c.cn("mr-2 h-4 w-4",r===e.value?"opacity-100":"opacity-0")}),t.jsx("span",{className:"truncate",children:e.label})]},e.value)):t.jsx("div",{className:"py-6 text-center text-sm text-muted-foreground",children:L})})})]})})]})});O.displayName="Combobox";exports.Combobox=O;
 //# sourceMappingURL=combobox.cjs.map

package/dist/components/ui/forms/combobox.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.cjs","sources":["../../../../src/components/ui/forms/combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Check, ChevronsUpDown, Search } from \"lucide-react\";\nimport { cn, mergeRefs } from \"../utils\";\nimport { Button } from \"../primitives/button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../overlays/popover\";\nimport { Input } from \"./input\";\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\nexport interface ComboboxGroup {\n  /**\n   * Rótulo do grupo — renderizado em negrito e caixa alta\n   */\n  label: string;\n\n  /**\n   * Quando presente, o cabeçalho do grupo é selecionável e representa o próprio grupo.\n   * Sem `value`, o cabeçalho é apenas um rótulo visual não clicável.\n   */\n  value?: string;\n\n  /**\n   * Opções pertencentes ao grupo — renderizadas indentadas, em peso normal\n   */\n  options: ComboboxOption[];\n}\n\nexport interface ComboboxProps {\n  /** Rótulo acessível do gatilho quando não há `<Label>` associado */\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n\n  /**\n   * Valor selecionado atual\n   */\n  value?: string;\n\n  /**\n   * Callback quando o valor muda\n   */\n  onValueChange?: (value: string) => void;\n\n  /**\n   * Lista de opções disponíveis.\n   * Use `options` OU `groups` — nunca os dois ao mesmo tempo.\n   */\n  options?: ComboboxOption[];\n\n  /**\n   * Opções agrupadas hierarquicamente.\n   * Use `options` OU `groups` — nunca os dois ao mesmo tempo.\n   */\n  groups?: ComboboxGroup[];\n\n  /**\n   * Placeholder quando nenhum valor está selecionado\n   */\n  placeholder?: string;\n  \n  /**\n   * Placeholder do campo de busca\n   */\n  searchPlaceholder?: string;\n  \n  /**\n   * Mensagem quando não há resultados\n   */\n  emptyMessage?: string;\n  \n  /**\n   * Se o campo está desabilitado\n   */\n  disabled?: boolean;\n  \n  /**\n   * Se está carregando opções\n   */\n  loading?: boolean;\n  \n  /**\n   * Classes adicionais para o trigger\n   */\n  className?: string;\n  \n  /**\n   * Largura do popover (padrão: mesma largura do trigger)\n   */\n  popoverWidth?: string | number;\n  \n  /**\n   * Altura máxima da lista de opções\n   */\n  maxHeight?: string;\n  \n  /**\n   * Alinhamento do popover\n   */\n  align?: \"start\" | \"center\" | \"end\";\n  \n  /**\n   * Se deve permitir limpar seleção\n   */\n  clearable?: boolean;\n\n  /**\n   * Função customizada de filtro\n   */\n  filterFn?: (option: ComboboxOption, searchTerm: string) => boolean;\n}\n\n/**\n * ComboBox - Componente de seleção com busca\n * \n * Combina um Select tradicional com capacidade de pesquisa.\n * Ideal para listas grandes onde o usuário precisa buscar valores.\n *\n * @example\n * ```tsx\n * // Lista plana\n * <Combobox\n *   value={clienteId}\n *   onValueChange={setClienteId}\n *   options={clientes}\n *   placeholder=\"Selecione o cliente\"\n *   searchPlaceholder=\"Buscar cliente...\"\n * />\n *\n * // Lista hierárquica — grupos selecionáveis com seus clientes indentados\n * <Combobox\n *   value={selecao}\n *   onValueChange={setSelecao}\n *   groups={grupos.map(g => ({\n *     label: g.nomeGrupo,\n *     value: `g-${g.grupoClienteId}`,\n *     options: g.clientes.map(c => ({ value: String(c.id), label: c.nome })),\n *   }))}\n * />\n * ```\n */\nexport const Combobox = React.forwardRef<\n  React.ElementRef<typeof Button>,\n  ComboboxProps\n>(({\n  value,\n  onValueChange,\n  options,\n  groups,\n  placeholder = \"Selecionar...\",\n  searchPlaceholder = \"Buscar...\",\n  emptyMessage = \"Nenhum resultado encontrado\",\n  disabled = false,\n  loading = false,\n  className,\n  popoverWidth,\n  maxHeight = \"300px\",\n  align = \"start\",\n  clearable = false,\n  filterFn,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledby,\n}, ref) => {\n  const [open, setOpen] = React.useState(false);\n  const [searchTerm, setSearchTerm] = React.useState(\"\");\n  const triggerRef = React.useRef<HTMLButtonElement>(null);\n  const mergedTriggerRef = React.useMemo(() => mergeRefs(triggerRef, ref), [ref]);\n\n  // Função de filtro padrão\n  const defaultFilterFn = (option: ComboboxOption, term: string) => {\n    const searchLower = term.toLowerCase();\n    return (\n      option.label.toLowerCase().includes(searchLower) ||\n      option.value.toLowerCase().includes(searchLower)\n    );\n  };\n\n  const filter = filterFn || defaultFilterFn;\n\n  // Filtrar opções baseado no termo de busca\n  const filteredOptions = React.useMemo(() => {\n    if (!options) return [];\n    if (!searchTerm) return options;\n    return options.filter((option) => filter(option, searchTerm));\n  }, [options, searchTerm, filter]);\n\n  // Filtrar grupos preservando a hierarquia: um grupo permanece visível quando o próprio\n  // rótulo casa com a busca (com todas as suas opções) ou quando alguma opção casa.\n  const filteredGroups = React.useMemo(() => {\n    if (!groups) return undefined;\n    if (!searchTerm) return groups;\n\n    const termLower = searchTerm.toLowerCase();\n\n    return groups\n      .map((group) => {\n        if (group.label.toLowerCase().includes(termLower)) return group;\n        return { ...group, options: group.options.filter((o) => filter(o, searchTerm)) };\n      })\n      .filter(\n        (group) =>\n          group.options.length > 0 || group.label.toLowerCase().includes(termLower)\n      );\n  }, [groups, searchTerm, filter]);\n\n  // Todas as opções selecionáveis — inclui os cabeçalhos de grupo que têm `value`,\n  // para que o trigger consiga exibir o rótulo de um grupo selecionado.\n  const allOptions = React.useMemo<ComboboxOption[]>(() => {\n    if (groups) {\n      return groups.flatMap((group) => [\n        ...(group.value ? [{ value: group.value, label: group.label }] : []),\n        ...group.options,\n      ]);\n    }\n    return options ?? [];\n  }, [options, groups]);\n\n  // Encontrar a opção selecionada\n  const selectedOption = allOptions.find((option) => option.value === value);\n\n  const hasResults = groups\n    ? (filteredGroups?.length ?? 0) > 0\n    : filteredOptions.length > 0;\n\n  // Resetar busca ao fechar\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpen(newOpen);\n    if (!newOpen) {\n      setSearchTerm(\"\");\n    }\n  };\n\n  // Selecionar opção\n  const handleSelect = (selectedValue: string) => {\n    if (value === selectedValue && clearable) {\n      onValueChange?.(\"\");\n    } else {\n      onValueChange?.(selectedValue);\n    }\n    setOpen(false);\n  };\n\n  return (\n    <Popover open={open} onOpenChange={handleOpenChange}>\n      <PopoverTrigger asChild>\n        <Button\n          ref={mergedTriggerRef}\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={cn(\n            \"w-full justify-between font-normal\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n          disabled={disabled || loading}\n        >\n          <span className=\"truncate\">\n            {loading\n              ? \"Carregando...\"\n              : selectedOption\n              ? selectedOption.label\n              : placeholder}\n          </span>\n          <ChevronsUpDown className=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"overflow-hidden p-0\"\n        style={{\n          width: popoverWidth || triggerRef.current?.offsetWidth || 'auto',\n        }}\n        align={align}\n      >\n        <div className=\"flex flex-col overflow-hidden\">\n          {/* Search Input */}\n          <div className=\"flex items-center border-b px-3\">\n            <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n            <Input\n              placeholder={searchPlaceholder}\n              value={searchTerm}\n              onChange={(e) => setSearchTerm(e.target.value)}\n              className=\"h-11 border-0 focus-visible:ring-0 focus-visible:ring-offset-0\"\n              autoFocus\n            />\n          </div>\n\n          {/* Options List */}\n          <div\n            className=\"overflow-y-auto overflow-x-hidden overscroll-contain [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-primary/30 [&::-webkit-scrollbar-thumb:hover]:bg-primary/50\"\n            style={{ maxHeight }}\n            onWheel={(e) => e.stopPropagation()}\n            onTouchMove={(e) => e.stopPropagation()}\n          >\n            <div className=\"p-1\">\n              {!hasResults ? (\n                <div className=\"py-6 text-center text-sm text-muted-foreground\">\n                  {emptyMessage}\n                </div>\n              ) : groups ? (\n                // Itens de grupo usam <button> nativo, não o componente Button: a variante\n                // `has-[>svg]:px-3` do Button entra em conflito com o recuo dos filhos e\n                // anula a indentação. Mesmo padrão adotado no MultiSelect.\n                filteredGroups?.map((group, groupIndex) => (\n                  <div\n                    key={group.value ?? group.label}\n                    className={cn(\n                      // Separador entre blocos de grupo\n                      groupIndex > 0 && \"mt-1.5 border-t border-border pt-1.5\"\n                    )}\n                  >\n                    {group.value ? (\n                      // Cabeçalho selecionável — representa o próprio grupo\n                      <button\n                        type=\"button\"\n                        onClick={() => handleSelect(group.value!)}\n                        className={cn(\n                          \"flex w-full items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                          \"font-semibold uppercase tracking-wide\",\n                          \"transition-colors duration-100 hover:bg-accent hover:text-accent-foreground\",\n                          value === group.value && \"bg-accent\"\n                        )}\n                      >\n                        <span className=\"truncate\">{group.label}</span>\n                        <Check\n                          className={cn(\n                            \"h-4 w-4 shrink-0\",\n                            value === group.value ? \"opacity-100\" : \"opacity-0\"\n                          )}\n                        />\n                      </button>\n                    ) : (\n                      // Cabeçalho apenas visual\n                      <div className=\"px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n                        {group.label}\n                      </div>\n                    )}\n                    {group.options.map((option) => (\n                      <button\n                        key={option.value}\n                        type=\"button\"\n                        onClick={() => handleSelect(option.value)}\n                        disabled={option.disabled}\n                        className={cn(\n                          \"flex w-full items-center justify-between gap-2 rounded-sm py-1.5 pl-6 pr-2 text-sm\",\n                          \"transition-colors duration-100 hover:bg-accent hover:text-accent-foreground\",\n                          \"disabled:pointer-events-none disabled:opacity-50\",\n                          value === option.value && \"bg-accent\"\n                        )}\n                      >\n                        <span className=\"truncate\">{option.label}</span>\n                        <Check\n                          className={cn(\n                            \"h-4 w-4 shrink-0\",\n                            value === option.value ? \"opacity-100\" : \"opacity-0\"\n                          )}\n                        />\n                      </button>\n                    ))}\n                  </div>\n                ))\n              ) : (\n                filteredOptions.map((option) => (\n                  <Button\n                    key={option.value}\n                    variant=\"ghost\"\n                    className={cn(\n                      \"w-full justify-start font-normal\",\n                      value === option.value && \"bg-accent\"\n                    )}\n                    onClick={() => handleSelect(option.value)}\n                    disabled={option.disabled}\n                  >\n                    <Check\n                      className={cn(\n                        \"mr-2 h-4 w-4\",\n                        value === option.value ? \"opacity-100\" : \"opacity-0\"\n                      )}\n                    />\n                    <span className=\"truncate\">{option.label}</span>\n                  </Button>\n                ))\n              )}\n            </div>\n          </div>\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n});\nCombobox.displayName = \"Combobox\";\n"],"names":["Combobox","React","value","onValueChange","options","groups","placeholder","searchPlaceholder","emptyMessage","disabled","loading","className","popoverWidth","maxHeight","align","clearable","filterFn","ariaLabel","ariaLabelledby","ref","open","setOpen","searchTerm","setSearchTerm","triggerRef","mergedTriggerRef","mergeRefs","filter","option","term","searchLower","filteredOptions","filteredGroups","termLower","group","o","selectedOption","hasResults","handleOpenChange","newOpen","handleSelect","selectedValue","jsxs","Popover","jsx","PopoverTrigger","Button","cn","ChevronsUpDown","PopoverContent","_a","Search","Input","groupIndex","Check"],"mappings":"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"}
+{"version":3,"file":"combobox.cjs","sources":["../../../../src/components/ui/forms/combobox.tsx"],"sourcesContent":["\"use client\";\n\nimport * as React from \"react\";\nimport { Check, ChevronsUpDown, Search } from \"lucide-react\";\nimport { cn, mergeRefs } from \"../utils\";\nimport { Button } from \"../primitives/button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"../overlays/popover\";\nimport { Input } from \"./input\";\n\nexport interface ComboboxOption {\n  value: string;\n  label: string;\n  disabled?: boolean;\n}\n\nexport interface ComboboxGroup {\n  /**\n   * Rótulo do grupo — renderizado em negrito e caixa alta\n   */\n  label: string;\n\n  /**\n   * Quando presente, o cabeçalho do grupo é selecionável e representa o próprio grupo.\n   * Sem `value`, o cabeçalho é apenas um rótulo visual não clicável.\n   */\n  value?: string;\n\n  /**\n   * Opções pertencentes ao grupo — renderizadas indentadas, em peso normal\n   */\n  options: ComboboxOption[];\n}\n\nexport interface ComboboxProps {\n  /** Rótulo acessível do gatilho quando não há `<Label>` associado */\n  \"aria-label\"?: string;\n  \"aria-labelledby\"?: string;\n\n  /**\n   * Valor selecionado atual\n   */\n  value?: string;\n\n  /**\n   * Callback quando o valor muda\n   */\n  onValueChange?: (value: string) => void;\n\n  /**\n   * Lista de opções disponíveis.\n   * Use `options` OU `groups` — nunca os dois ao mesmo tempo.\n   */\n  options?: ComboboxOption[];\n\n  /**\n   * Opções agrupadas hierarquicamente.\n   * Use `options` OU `groups` — nunca os dois ao mesmo tempo.\n   */\n  groups?: ComboboxGroup[];\n\n  /**\n   * Placeholder quando nenhum valor está selecionado\n   */\n  placeholder?: string;\n  \n  /**\n   * Placeholder do campo de busca\n   */\n  searchPlaceholder?: string;\n  \n  /**\n   * Mensagem quando não há resultados\n   */\n  emptyMessage?: string;\n  \n  /**\n   * Se o campo está desabilitado\n   */\n  disabled?: boolean;\n  \n  /**\n   * Se está carregando opções\n   */\n  loading?: boolean;\n  \n  /**\n   * Classes adicionais para o trigger\n   */\n  className?: string;\n  \n  /**\n   * Largura do popover (padrão: mesma largura do trigger)\n   */\n  popoverWidth?: string | number;\n  \n  /**\n   * Altura máxima da lista de opções\n   */\n  maxHeight?: string;\n  \n  /**\n   * Alinhamento do popover\n   */\n  align?: \"start\" | \"center\" | \"end\";\n  \n  /**\n   * Se deve permitir limpar seleção\n   */\n  clearable?: boolean;\n\n  /**\n   * Função customizada de filtro\n   */\n  filterFn?: (option: ComboboxOption, searchTerm: string) => boolean;\n}\n\n/**\n * ComboBox - Componente de seleção com busca\n * \n * Combina um Select tradicional com capacidade de pesquisa.\n * Ideal para listas grandes onde o usuário precisa buscar valores.\n *\n * @example\n * ```tsx\n * // Lista plana\n * <Combobox\n *   value={clienteId}\n *   onValueChange={setClienteId}\n *   options={clientes}\n *   placeholder=\"Selecione o cliente\"\n *   searchPlaceholder=\"Buscar cliente...\"\n * />\n *\n * // Lista hierárquica — grupos selecionáveis com seus clientes indentados\n * <Combobox\n *   value={selecao}\n *   onValueChange={setSelecao}\n *   groups={grupos.map(g => ({\n *     label: g.nomeGrupo,\n *     value: `g-${g.grupoClienteId}`,\n *     options: g.clientes.map(c => ({ value: String(c.id), label: c.nome })),\n *   }))}\n * />\n * ```\n */\nexport const Combobox = React.forwardRef<\n  React.ElementRef<typeof Button>,\n  ComboboxProps\n>(({\n  value,\n  onValueChange,\n  options,\n  groups,\n  placeholder = \"Selecionar...\",\n  searchPlaceholder = \"Buscar...\",\n  emptyMessage = \"Nenhum resultado encontrado\",\n  disabled = false,\n  loading = false,\n  className,\n  popoverWidth,\n  maxHeight = \"300px\",\n  align = \"start\",\n  clearable = false,\n  filterFn,\n  \"aria-label\": ariaLabel,\n  \"aria-labelledby\": ariaLabelledby,\n}, ref) => {\n  const [open, setOpen] = React.useState(false);\n  const [searchTerm, setSearchTerm] = React.useState(\"\");\n  const triggerRef = React.useRef<HTMLButtonElement>(null);\n  const mergedTriggerRef = React.useMemo(() => mergeRefs(triggerRef, ref), [ref]);\n\n  // Função de filtro padrão\n  const defaultFilterFn = (option: ComboboxOption, term: string) => {\n    const searchLower = term.toLowerCase();\n    return (\n      option.label.toLowerCase().includes(searchLower) ||\n      option.value.toLowerCase().includes(searchLower)\n    );\n  };\n\n  const filter = filterFn || defaultFilterFn;\n\n  // Filtrar opções baseado no termo de busca\n  const filteredOptions = React.useMemo(() => {\n    if (!options) return [];\n    if (!searchTerm) return options;\n    return options.filter((option) => filter(option, searchTerm));\n  }, [options, searchTerm, filter]);\n\n  // Filtrar grupos preservando a hierarquia: um grupo permanece visível quando o próprio\n  // rótulo casa com a busca (com todas as suas opções) ou quando alguma opção casa.\n  const filteredGroups = React.useMemo(() => {\n    if (!groups) return undefined;\n    if (!searchTerm) return groups;\n\n    const termLower = searchTerm.toLowerCase();\n\n    return groups\n      .map((group) => {\n        if (group.label.toLowerCase().includes(termLower)) return group;\n        return { ...group, options: group.options.filter((o) => filter(o, searchTerm)) };\n      })\n      .filter(\n        (group) =>\n          group.options.length > 0 || group.label.toLowerCase().includes(termLower)\n      );\n  }, [groups, searchTerm, filter]);\n\n  // Todas as opções selecionáveis — inclui os cabeçalhos de grupo que têm `value`,\n  // para que o trigger consiga exibir o rótulo de um grupo selecionado.\n  const allOptions = React.useMemo<ComboboxOption[]>(() => {\n    if (groups) {\n      return groups.flatMap((group) => [\n        ...(group.value ? [{ value: group.value, label: group.label }] : []),\n        ...group.options,\n      ]);\n    }\n    return options ?? [];\n  }, [options, groups]);\n\n  // Encontrar a opção selecionada\n  const selectedOption = allOptions.find((option) => option.value === value);\n\n  const hasResults = groups\n    ? (filteredGroups?.length ?? 0) > 0\n    : filteredOptions.length > 0;\n\n  // Resetar busca ao fechar\n  const handleOpenChange = (newOpen: boolean) => {\n    setOpen(newOpen);\n    if (!newOpen) {\n      setSearchTerm(\"\");\n    }\n  };\n\n  // Selecionar opção\n  const handleSelect = (selectedValue: string) => {\n    if (value === selectedValue && clearable) {\n      onValueChange?.(\"\");\n    } else {\n      onValueChange?.(selectedValue);\n    }\n    setOpen(false);\n  };\n\n  return (\n    <Popover open={open} onOpenChange={handleOpenChange}>\n      <PopoverTrigger asChild>\n        <Button\n          ref={mergedTriggerRef}\n          variant=\"outline\"\n          role=\"combobox\"\n          aria-expanded={open}\n          aria-label={ariaLabel}\n          aria-labelledby={ariaLabelledby}\n          className={cn(\n            \"w-full justify-between font-normal\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n          disabled={disabled || loading}\n        >\n          <span className=\"truncate\">\n            {loading\n              ? \"Carregando...\"\n              : selectedOption\n              ? selectedOption.label\n              : placeholder}\n          </span>\n          <ChevronsUpDown className=\"ml-2 h-4 w-4 shrink-0 opacity-50\" />\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"overflow-hidden p-0\"\n        style={{\n          width: popoverWidth || triggerRef.current?.offsetWidth || 'auto',\n        }}\n        align={align}\n      >\n        <div className=\"flex flex-col overflow-hidden\">\n          {/* Search Input */}\n          <div className=\"flex items-center border-b px-3\">\n            <Search className=\"mr-2 h-4 w-4 shrink-0 opacity-50\" />\n            <Input\n              placeholder={searchPlaceholder}\n              value={searchTerm}\n              onChange={(e) => setSearchTerm(e.target.value)}\n              className=\"h-11 border-0 focus-visible:ring-0 focus-visible:ring-offset-0\"\n              autoFocus\n            />\n          </div>\n\n          {/* Options List */}\n          <div\n            className=\"overflow-y-auto overflow-x-hidden overscroll-contain [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-primary/30 [&::-webkit-scrollbar-thumb:hover]:bg-primary/50\"\n            style={{ maxHeight }}\n            onWheel={(e) => e.stopPropagation()}\n            onTouchMove={(e) => e.stopPropagation()}\n          >\n            <div className=\"p-1\">\n              {!hasResults ? (\n                <div className=\"py-6 text-center text-sm text-muted-foreground\">\n                  {emptyMessage}\n                </div>\n              ) : groups ? (\n                // Itens de grupo usam <button> nativo, não o componente Button: a variante\n                // `has-[>svg]:px-3` do Button entra em conflito com o recuo dos filhos e\n                // anula a indentação. Mesmo padrão adotado no MultiSelect.\n                filteredGroups?.map((group, groupIndex) => (\n                  <div\n                    key={group.value ?? group.label}\n                    className={cn(\n                      // Separador entre blocos de grupo\n                      groupIndex > 0 && \"mt-1.5 border-t border-border pt-1.5\"\n                    )}\n                  >\n                    {group.value ? (\n                      // Cabeçalho selecionável — representa o próprio grupo\n                      <button\n                        type=\"button\"\n                        onClick={() => handleSelect(group.value!)}\n                        className={cn(\n                          \"flex w-full items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-sm\",\n                          \"font-semibold uppercase tracking-wide\",\n                          \"transition-colors duration-100 hover:bg-accent hover:text-accent-foreground\",\n                          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset\",\n                          value === group.value && \"bg-secondary text-secondary-foreground hover:bg-secondary hover:text-secondary-foreground\"\n                        )}\n                      >\n                        <span className=\"truncate\">{group.label}</span>\n                        <Check\n                          className={cn(\n                            \"h-4 w-4 shrink-0\",\n                            value === group.value ? \"opacity-100\" : \"opacity-0\"\n                          )}\n                        />\n                      </button>\n                    ) : (\n                      // Cabeçalho apenas visual\n                      <div className=\"px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n                        {group.label}\n                      </div>\n                    )}\n                    {group.options.map((option) => (\n                      <button\n                        key={option.value}\n                        type=\"button\"\n                        onClick={() => handleSelect(option.value)}\n                        disabled={option.disabled}\n                        className={cn(\n                          \"flex w-full items-center justify-between gap-2 rounded-sm py-1.5 pl-6 pr-2 text-sm\",\n                          \"transition-colors duration-100 hover:bg-accent hover:text-accent-foreground\",\n                          \"disabled:pointer-events-none disabled:opacity-50\",\n                          \"focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset\",\n                          value === option.value && \"bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground\"\n                        )}\n                      >\n                        <span className=\"truncate\">{option.label}</span>\n                        <Check\n                          className={cn(\n                            \"h-4 w-4 shrink-0\",\n                            value === option.value ? \"opacity-100\" : \"opacity-0\"\n                          )}\n                        />\n                      </button>\n                    ))}\n                  </div>\n                ))\n              ) : (\n                filteredOptions.map((option) => (\n                  <Button\n                    key={option.value}\n                    variant=\"ghost\"\n                    className={cn(\n                      \"w-full justify-start font-normal\",\n                      value === option.value && \"bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground dark:hover:bg-secondary\"\n                    )}\n                    onClick={() => handleSelect(option.value)}\n                    disabled={option.disabled}\n                  >\n                    <Check\n                      className={cn(\n                        \"mr-2 h-4 w-4\",\n                        value === option.value ? \"opacity-100\" : \"opacity-0\"\n                      )}\n                    />\n                    <span className=\"truncate\">{option.label}</span>\n                  </Button>\n                ))\n              )}\n            </div>\n          </div>\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n});\nCombobox.displayName = \"Combobox\";\n"],"names":["Combobox","React","value","onValueChange","options","groups","placeholder","searchPlaceholder","emptyMessage","disabled","loading","className","popoverWidth","maxHeight","align","clearable","filterFn","ariaLabel","ariaLabelledby","ref","open","setOpen","searchTerm","setSearchTerm","triggerRef","mergedTriggerRef","mergeRefs","filter","option","term","searchLower","filteredOptions","filteredGroups","termLower","group","o","selectedOption","hasResults","handleOpenChange","newOpen","handleSelect","selectedValue","jsxs","Popover","jsx","PopoverTrigger","Button","cn","ChevronsUpDown","PopoverContent","_a","Search","Input","groupIndex","Check"],"mappings":"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"}

package/dist/components/ui/forms/combobox.js

@@ -1,22 +1,22 @@
 "use client";
-import { jsxs as c, jsx as t } from "react/jsx-runtime";
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
 import * as i from "react";
 import { ChevronsUpDown as A, Search as E, Check as h } from "lucide-react";
-import { mergeRefs as H, cn as o } from "../utils.js";
-import { Button as R } from "../primitives/button.js";
+import { mergeRefs as H, cn as c } from "../utils.js";
+import { Button as L } from "../primitives/button.js";
 import { Popover as J, PopoverTrigger as K, PopoverContent as Q } from "../overlays/popover.js";
 import { Input as X } from "./input.js";
 const Y = i.forwardRef(({
-  value: l,
+  value: s,
   onValueChange: d,
   options: m,
-  groups: s,
-  placeholder: j = "Selecionar...",
-  searchPlaceholder: M = "Buscar...",
-  emptyMessage: O = "Nenhum resultado encontrado",
-  disabled: S = !1,
+  groups: l,
+  placeholder: R = "Selecionar...",
+  searchPlaceholder: j = "Buscar...",
+  emptyMessage: M = "Nenhum resultado encontrado",
+  disabled: O = !1,
   loading: v = !1,
-  className: g,
+  className: S,
   popoverWidth: F,
   maxHeight: P = "300px",
   align: T = "start",
@@ -24,110 +24,111 @@ const Y = i.forwardRef(({
   filterFn: W,
   "aria-label": D,
   "aria-labelledby": I
-}, w) => {
-  var L;
-  const [p, x] = i.useState(!1), [n, y] = i.useState(""), N = i.useRef(null), U = i.useMemo(() => H(N, w), [w]), f = W || ((e, a) => {
-    const r = a.toLowerCase();
-    return e.label.toLowerCase().includes(r) || e.value.toLowerCase().includes(r);
-  }), k = i.useMemo(() => m ? n ? m.filter((e) => f(e, n)) : m : [], [m, n, f]), b = i.useMemo(() => {
-    if (!s) return;
-    if (!n) return s;
-    const e = n.toLowerCase();
-    return s.map((a) => a.label.toLowerCase().includes(e) ? a : { ...a, options: a.options.filter((r) => f(r, n)) }).filter(
-      (a) => a.options.length > 0 || a.label.toLowerCase().includes(e)
+}, y) => {
+  var C;
+  const [w, x] = i.useState(!1), [o, p] = i.useState(""), N = i.useRef(null), U = i.useMemo(() => H(N, y), [y]), b = W || ((e, t) => {
+    const a = t.toLowerCase();
+    return e.label.toLowerCase().includes(a) || e.value.toLowerCase().includes(a);
+  }), g = i.useMemo(() => m ? o ? m.filter((e) => b(e, o)) : m : [], [m, o, b]), f = i.useMemo(() => {
+    if (!l) return;
+    if (!o) return l;
+    const e = o.toLowerCase();
+    return l.map((t) => t.label.toLowerCase().includes(e) ? t : { ...t, options: t.options.filter((a) => b(a, o)) }).filter(
+      (t) => t.options.length > 0 || t.label.toLowerCase().includes(e)
     );
-  }, [s, n, f]), C = i.useMemo(() => s ? s.flatMap((e) => [
+  }, [l, o, b]), k = i.useMemo(() => l ? l.flatMap((e) => [
     ...e.value ? [{ value: e.value, label: e.label }] : [],
     ...e.options
-  ]) : m ?? [], [m, s]).find((e) => e.value === l), q = s ? ((b == null ? void 0 : b.length) ?? 0) > 0 : k.length > 0, z = (e) => {
-    x(e), e || y("");
+  ]) : m ?? [], [m, l]).find((e) => e.value === s), q = l ? ((f == null ? void 0 : f.length) ?? 0) > 0 : g.length > 0, z = (e) => {
+    x(e), e || p("");
   }, u = (e) => {
-    l === e && B ? d == null || d("") : d == null || d(e), x(!1);
+    s === e && B ? d == null || d("") : d == null || d(e), x(!1);
   };
-  return /* @__PURE__ */ c(J, { open: p, onOpenChange: z, children: [
-    /* @__PURE__ */ t(K, { asChild: !0, children: /* @__PURE__ */ c(
-      R,
+  return /* @__PURE__ */ n(J, { open: w, onOpenChange: z, children: [
+    /* @__PURE__ */ r(K, { asChild: !0, children: /* @__PURE__ */ n(
+      L,
       {
         ref: U,
         variant: "outline",
         role: "combobox",
-        "aria-expanded": p,
+        "aria-expanded": w,
         "aria-label": D,
         "aria-labelledby": I,
-        className: o(
+        className: c(
           "w-full justify-between font-normal",
-          !l && "text-muted-foreground",
-          g
+          !s && "text-muted-foreground",
+          S
         ),
-        disabled: S || v,
+        disabled: O || v,
         children: [
-          /* @__PURE__ */ t("span", { className: "truncate", children: v ? "Carregando..." : C ? C.label : j }),
-          /* @__PURE__ */ t(A, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
+          /* @__PURE__ */ r("span", { className: "truncate", children: v ? "Carregando..." : k ? k.label : R }),
+          /* @__PURE__ */ r(A, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })
         ]
       }
     ) }),
-    /* @__PURE__ */ t(
+    /* @__PURE__ */ r(
       Q,
       {
         className: "overflow-hidden p-0",
         style: {
-          width: F || ((L = N.current) == null ? void 0 : L.offsetWidth) || "auto"
+          width: F || ((C = N.current) == null ? void 0 : C.offsetWidth) || "auto"
         },
         align: T,
-        children: /* @__PURE__ */ c("div", { className: "flex flex-col overflow-hidden", children: [
-          /* @__PURE__ */ c("div", { className: "flex items-center border-b px-3", children: [
-            /* @__PURE__ */ t(E, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
-            /* @__PURE__ */ t(
+        children: /* @__PURE__ */ n("div", { className: "flex flex-col overflow-hidden", children: [
+          /* @__PURE__ */ n("div", { className: "flex items-center border-b px-3", children: [
+            /* @__PURE__ */ r(E, { className: "mr-2 h-4 w-4 shrink-0 opacity-50" }),
+            /* @__PURE__ */ r(
               X,
               {
-                placeholder: M,
-                value: n,
-                onChange: (e) => y(e.target.value),
+                placeholder: j,
+                value: o,
+                onChange: (e) => p(e.target.value),
                 className: "h-11 border-0 focus-visible:ring-0 focus-visible:ring-offset-0",
                 autoFocus: !0
               }
             )
           ] }),
-          /* @__PURE__ */ t(
+          /* @__PURE__ */ r(
             "div",
             {
               className: "overflow-y-auto overflow-x-hidden overscroll-contain [&::-webkit-scrollbar]:w-2.5 [&::-webkit-scrollbar-track]:bg-transparent [&::-webkit-scrollbar-thumb]:rounded-full [&::-webkit-scrollbar-thumb]:bg-primary/30 [&::-webkit-scrollbar-thumb:hover]:bg-primary/50",
               style: { maxHeight: P },
               onWheel: (e) => e.stopPropagation(),
               onTouchMove: (e) => e.stopPropagation(),
-              children: /* @__PURE__ */ t("div", { className: "p-1", children: q ? s ? (
+              children: /* @__PURE__ */ r("div", { className: "p-1", children: q ? l ? (
                 // Itens de grupo usam <button> nativo, não o componente Button: a variante
                 // `has-[>svg]:px-3` do Button entra em conflito com o recuo dos filhos e
                 // anula a indentação. Mesmo padrão adotado no MultiSelect.
-                b == null ? void 0 : b.map((e, a) => /* @__PURE__ */ c(
+                f == null ? void 0 : f.map((e, t) => /* @__PURE__ */ n(
                   "div",
                   {
-                    className: o(
+                    className: c(
                       // Separador entre blocos de grupo
-                      a > 0 && "mt-1.5 border-t border-border pt-1.5"
+                      t > 0 && "mt-1.5 border-t border-border pt-1.5"
                     ),
                     children: [
                       e.value ? (
                         // Cabeçalho selecionável — representa o próprio grupo
-                        /* @__PURE__ */ c(
+                        /* @__PURE__ */ n(
                           "button",
                           {
                             type: "button",
                             onClick: () => u(e.value),
-                            className: o(
+                            className: c(
                               "flex w-full items-center justify-between gap-2 rounded-sm px-2 py-1.5 text-sm",
                               "font-semibold uppercase tracking-wide",
                               "transition-colors duration-100 hover:bg-accent hover:text-accent-foreground",
-                              l === e.value && "bg-accent"
+                              "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
+                              s === e.value && "bg-secondary text-secondary-foreground hover:bg-secondary hover:text-secondary-foreground"
                             ),
                             children: [
-                              /* @__PURE__ */ t("span", { className: "truncate", children: e.label }),
-                              /* @__PURE__ */ t(
+                              /* @__PURE__ */ r("span", { className: "truncate", children: e.label }),
+                              /* @__PURE__ */ r(
                                 h,
                                 {
-                                  className: o(
+                                  className: c(
                                     "h-4 w-4 shrink-0",
-                                    l === e.value ? "opacity-100" : "opacity-0"
+                                    s === e.value ? "opacity-100" : "opacity-0"
                                   )
                                 }
                               )
@@ -136,64 +137,65 @@ const Y = i.forwardRef(({
                         )
                       ) : (
                         // Cabeçalho apenas visual
-                        /* @__PURE__ */ t("div", { className: "px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: e.label })
+                        /* @__PURE__ */ r("div", { className: "px-2 py-1.5 text-xs font-semibold uppercase tracking-wide text-muted-foreground", children: e.label })
                       ),
-                      e.options.map((r) => /* @__PURE__ */ c(
+                      e.options.map((a) => /* @__PURE__ */ n(
                         "button",
                         {
                           type: "button",
-                          onClick: () => u(r.value),
-                          disabled: r.disabled,
-                          className: o(
+                          onClick: () => u(a.value),
+                          disabled: a.disabled,
+                          className: c(
                             "flex w-full items-center justify-between gap-2 rounded-sm py-1.5 pl-6 pr-2 text-sm",
                             "transition-colors duration-100 hover:bg-accent hover:text-accent-foreground",
                             "disabled:pointer-events-none disabled:opacity-50",
-                            l === r.value && "bg-accent"
+                            "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-inset",
+                            s === a.value && "bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground"
                           ),
                           children: [
-                            /* @__PURE__ */ t("span", { className: "truncate", children: r.label }),
-                            /* @__PURE__ */ t(
+                            /* @__PURE__ */ r("span", { className: "truncate", children: a.label }),
+                            /* @__PURE__ */ r(
                               h,
                               {
-                                className: o(
+                                className: c(
                                   "h-4 w-4 shrink-0",
-                                  l === r.value ? "opacity-100" : "opacity-0"
+                                  s === a.value ? "opacity-100" : "opacity-0"
                                 )
                               }
                             )
                           ]
                         },
-                        r.value
+                        a.value
                       ))
                     ]
                   },
                   e.value ?? e.label
                 ))
-              ) : k.map((e) => /* @__PURE__ */ c(
-                R,
+              ) : g.map((e) => /* @__PURE__ */ n(
+                L,
                 {
                   variant: "ghost",
-                  className: o(
+                  className: c(
                     "w-full justify-start font-normal",
-                    l === e.value && "bg-accent"
+                    s === e.value && "bg-secondary text-secondary-foreground font-medium hover:bg-secondary hover:text-secondary-foreground dark:hover:bg-secondary"
                   ),
                   onClick: () => u(e.value),
                   disabled: e.disabled,
                   children: [
-                    /* @__PURE__ */ t(
+                    /* @__PURE__ */ r(
                       h,
                       {
-                        className: o(
+                        className: c(
                           "mr-2 h-4 w-4",
-                          l === e.value ? "opacity-100" : "opacity-0"
+                          s === e.value ? "opacity-100" : "opacity-0"
                         )
                       }
                     ),
-                    /* @__PURE__ */ t("span", { className: "truncate", children: e.label })
+                    /* @__PURE__ */ r("span", { className: "truncate", children: e.label })
                   ]
                 },
                 e.value
-              )) : /* @__PURE__ */ t("div", { className: "py-6 text-center text-sm text-muted-foreground", children: O }) })
+              )) : /* @__PURE__ */ r("div", { className: "py-6 text-center text-sm text-muted-foreground", children: M }) })
             }
           )
         ] })