geoiq-frontend-ui-kit 1.1.5 → 1.1.6

package/dist/components/molecules/multi-combobox/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-combobox/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,iBAAS,aAAa,CAAC,EACrB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,gBAAgB,+CAoHlB;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-combobox/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAEhE,iBAAS,aAAa,CAAC,EACrB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,gBAAgB,+CA+HlB;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}

package/dist/components/molecules/multi-combobox/multi-select-combobox.types.d.ts

@@ -7,5 +7,6 @@ export interface MultiSelectProps {
 export type OptionType = {
     label: string;
     value: string;
+    icon?: React.ReactElement;
 };
 //# sourceMappingURL=multi-select-combobox.types.d.ts.map

package/dist/components/molecules/multi-combobox/multi-select-combobox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select-combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-combobox/multi-select-combobox.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AACD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,CAAA"}
+{"version":3,"file":"multi-select-combobox.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-combobox/multi-select-combobox.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AACD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAA;CAC1B,CAAA"}

package/dist/components/molecules/multi-select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-select/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAEvD,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,gBAAgB,+CAyHlB;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-select/index.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,gBAAgB,EAAE,MAAM,sBAAsB,CAAA;AAEvD,iBAAS,WAAW,CAAC,EACnB,OAAO,EACP,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,gBAAgB,+CAoIlB;AAED,OAAO,EAAE,WAAW,EAAE,CAAA"}

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

@@ -7,5 +7,7 @@ export interface MultiSelectProps {
 export type OptionType = {
     label: string;
     value: string;
+    icon?: React.ReactElement;
+    disabled?: boolean;
 };
 //# sourceMappingURL=multi-select.types.d.ts.map

package/dist/components/molecules/multi-select/multi-select.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-select/multi-select.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AACD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;CACd,CAAA"}
+{"version":3,"file":"multi-select.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/multi-select/multi-select.types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,UAAU,EAAE,CAAA;IACrB,QAAQ,EAAE,MAAM,EAAE,CAAA;IAClB,QAAQ,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,cAAc,CAAC,MAAM,EAAE,CAAC,CAAC,CAAA;IACxD,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AACD,MAAM,MAAM,UAAU,GAAG;IACvB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,MAAM,CAAA;IACb,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAA;IACzB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA"}

package/dist/components/molecules/single-combobox/single-combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"single-combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-combobox/single-combobox.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAA;AAMjE,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,WAAqB,EACrB,iBAA4B,EAC5B,YAA2B,EAC3B,QAAQ,GACT,EAAE,uBAAuB,+CA2EzB"}
+{"version":3,"file":"single-combobox.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-combobox/single-combobox.tsx"],"names":[],"mappings":"AAoBA,OAAO,EAAE,uBAAuB,EAAE,MAAM,yBAAyB,CAAA;AAMjE,wBAAgB,cAAc,CAAC,EAC7B,OAAO,EACP,KAAK,EACL,WAAqB,EACrB,iBAA4B,EAC5B,YAA2B,EAC3B,QAAQ,GACT,EAAE,uBAAuB,+CAmFzB"}

package/dist/components/molecules/single-select/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAYnD,QAAA,MAAM,YAAY,2EA8DjB,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAA;AAYnD,QAAA,MAAM,YAAY,2EAkEjB,CAAA;AAED,OAAO,EAAE,YAAY,EAAE,CAAA"}

package/dist/components/molecules/single-select/single-select.types.d.ts

@@ -4,6 +4,7 @@ export interface SelectProps extends React.ComponentPropsWithoutRef<typeof Selec
         label: string;
         value: string;
         disabled?: boolean;
+        icon?: React.ReactElement;
     }[];
     placeholder?: string;
     onValueChange: (value: string) => void;

package/dist/components/molecules/single-select/single-select.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"single-select.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-select/single-select.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAEzD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC;IACnE,KAAK,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAE,EAAE,CAAA;IAC7D,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,CAAA;CAC9E"}
+{"version":3,"file":"single-select.types.d.ts","sourceRoot":"","sources":["../../../../src/components/molecules/single-select/single-select.types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,eAAe,MAAM,wBAAwB,CAAA;AAEzD,MAAM,WAAW,WACf,SAAQ,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,IAAI,CAAC;IACnE,KAAK,EAAE;QACL,KAAK,EAAE,MAAM,CAAA;QACb,KAAK,EAAE,MAAM,CAAA;QACb,QAAQ,CAAC,EAAE,OAAO,CAAA;QAClB,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,CAAA;KAC1B,EAAE,CAAA;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACtC,KAAK,EAAE,MAAM,CAAA;IACb,YAAY,CAAC,EAAE,KAAK,CAAC,wBAAwB,CAAC,OAAO,eAAe,CAAC,OAAO,CAAC,CAAA;CAC9E"}

package/dist/index.es10.js

@@ -1,7 +1,7 @@
 import * as o from "@radix-ui/react-slider";
 import * as e from "react";
 import { cn as i } from "./index.es48.js";
-import { SliderVariants as t } from "./index.es66.js";
+import { SliderVariants as t } from "./index.es59.js";
 const s = e.forwardRef(({ className: r, ...l }, a) => (
   // <div className='bg-light-3 h-[100px] w-full flex'>
   /* @__PURE__ */ e.createElement(

package/dist/index.es11.js

@@ -1,7 +1,7 @@
 import { cn as s } from "./index.es48.js";
 import { useRanger as b } from "@tanstack/react-ranger";
 import e from "react";
-import { SliderBgColorVariants as a } from "./index.es60.js";
+import { SliderBgColorVariants as a } from "./index.es62.js";
 const w = ({ left: t = 0, width: o = 0, index: l = -1 }) => /* @__PURE__ */ e.createElement(
   "div",
   {

package/dist/index.es15.js

@@ -1,6 +1,6 @@
 import * as e from "react";
 import { cn as r } from "./index.es48.js";
-import { AlertVariants as f, AlertContentVariants as d, AlertButtonVariants as g } from "./index.es62.js";
+import { AlertVariants as f, AlertContentVariants as d, AlertButtonVariants as g } from "./index.es61.js";
 import { Button as p } from "./index.es2.js";
 const c = e.forwardRef(({ className: t, ...a }, s) => /* @__PURE__ */ e.createElement(
   "h5",

package/dist/index.es18.js

@@ -1,5 +1,5 @@
 import e from "react";
-import { DropdownMenu as m, DropdownMenuTrigger as u, DropdownMenuContent as b, DropdownMenuLabel as i, DropdownMenuSeparator as n, DropdownMenuGroup as p, DropdownMenuSub as g, DropdownMenuSubTrigger as h, DropdownMenuPortal as E, DropdownMenuSubContent as w, DropdownMenuItem as d, DropdownMenuShortcut as x } from "./index.es59.js";
+import { DropdownMenu as m, DropdownMenuTrigger as u, DropdownMenuContent as b, DropdownMenuLabel as i, DropdownMenuSeparator as n, DropdownMenuGroup as p, DropdownMenuSub as g, DropdownMenuSubTrigger as h, DropdownMenuPortal as E, DropdownMenuSubContent as w, DropdownMenuItem as d, DropdownMenuShortcut as x } from "./index.es63.js";
 function N({
   trigger: o,
   optionGroups: r,

package/dist/index.es19.js

@@ -1,5 +1,5 @@
 import t from "react";
-import { Carousel as l, CarouselContent as s, CarouselItem as m, CarouselPrevious as r, CarouselNext as n } from "./index.es63.js";
+import { Carousel as l, CarouselContent as s, CarouselItem as m, CarouselPrevious as r, CarouselNext as n } from "./index.es64.js";
 const o = (e) => /* @__PURE__ */ t.createElement(
   l,
   {

package/dist/index.es21.js

@@ -1,5 +1,5 @@
 import e from "react";
-import { Dialog as g, DialogTrigger as s, DialogContent as p, DialogHeader as u, DialogTitle as E, DialogDescription as D, DialogFooter as d } from "./index.es64.js";
+import { Dialog as g, DialogTrigger as s, DialogContent as p, DialogHeader as u, DialogTitle as E, DialogDescription as D, DialogFooter as d } from "./index.es66.js";
 import { Typography as r } from "./index.es7.js";
 import { cn as m } from "./index.es48.js";
 function N({

package/dist/index.es22.js

@@ -1,44 +1,44 @@
 import * as e from "react";
-import { ChevronUp as g, ChevronDown as p, Check as f } from "lucide-react";
+import { ChevronUp as f, ChevronDown as E, Check as x } from "lucide-react";
 import { cn as r } from "./index.es48.js";
-import { Button as E } from "./index.es2.js";
-import { Command as u, CommandInput as x, CommandEmpty as b, CommandGroup as C, CommandList as N, CommandItem as y } from "./index.es49.js";
-import { Popover as w, PopoverTrigger as v, PopoverContent as k } from "./index.es50.js";
-import { ComboBoxStates as S } from "./index.es65.js";
-import { Typography as O } from "./index.es7.js";
-function L({
-  options: l,
+import { Button as u } from "./index.es2.js";
+import { Command as b, CommandInput as C, CommandEmpty as N, CommandGroup as y, CommandList as v, CommandItem as w } from "./index.es49.js";
+import { Popover as k, PopoverTrigger as S, PopoverContent as O } from "./index.es50.js";
+import { ComboBoxStates as P } from "./index.es65.js";
+import { Typography as s } from "./index.es7.js";
+function R({
+  options: n,
   value: a,
-  placeholder: o = "Empty",
-  searchPlaceholder: s = "Search",
-  emptyMessage: c = "No results",
-  onChange: i
+  placeholder: c = "Empty",
+  searchPlaceholder: i = "Search",
+  emptyMessage: d = "No results",
+  onChange: g
 }) {
-  const [m, n] = e.useState(!1), d = (t) => {
-    i(t), n(!1);
-  };
-  return /* @__PURE__ */ e.createElement(w, { open: m, onOpenChange: n }, /* @__PURE__ */ e.createElement(v, { asChild: !0 }, /* @__PURE__ */ e.createElement(
-    E,
+  const [l, o] = e.useState(!1), h = (t) => {
+    g(t), o(!1);
+  }, m = n.find((t) => t.id === a);
+  return /* @__PURE__ */ e.createElement(k, { open: l, onOpenChange: o }, /* @__PURE__ */ e.createElement(S, { asChild: !0 }, /* @__PURE__ */ e.createElement(
+    u,
     {
       variant: "secondary",
       role: "combobox",
-      "aria-expanded": m,
+      "aria-expanded": l,
       className: r(
-        S({ isOpen: m, isValue: !!a }),
+        P({ isOpen: l, isValue: !!a }),
         "w-full justify-between px-3 py-2"
       )
     },
-    /* @__PURE__ */ e.createElement(
-      O,
+    m ? /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-2" }, m.icon, /* @__PURE__ */ e.createElement(
+      s,
       {
         variant: "body2",
         className: a ? "text-light-2" : "text-light-4"
       },
-      a ? l.find((t) => t.id === a)?.name : o
-    ),
-    m ? /* @__PURE__ */ e.createElement(g, { className: "w-4 h-4 ml-2 stroke-light-2" }) : /* @__PURE__ */ e.createElement(p, { className: "w-4 h-4 ml-2 stroke-light-2" })
-  )), /* @__PURE__ */ e.createElement(k, { className: "w-[200px] p-0 bg-light-1 mt-1 rounded-lg" }, /* @__PURE__ */ e.createElement(u, null, /* @__PURE__ */ e.createElement(x, { placeholder: s, className: "" }), /* @__PURE__ */ e.createElement(b, { className: "text-light-4" }, c), /* @__PURE__ */ e.createElement(C, null, /* @__PURE__ */ e.createElement(N, null, l.map((t) => /* @__PURE__ */ e.createElement(
-    y,
+      m?.name
+    )) : /* @__PURE__ */ e.createElement(s, { variant: "body2", className: "text-light-4" }, c),
+    l ? /* @__PURE__ */ e.createElement(f, { className: "w-4 h-4 ml-2 stroke-light-2" }) : /* @__PURE__ */ e.createElement(E, { className: "w-4 h-4 ml-2 stroke-light-2" })
+  )), /* @__PURE__ */ e.createElement(O, { className: "w-[200px] p-0 bg-light-1 mt-1 rounded-lg" }, /* @__PURE__ */ e.createElement(b, null, /* @__PURE__ */ e.createElement(C, { placeholder: i, className: "" }), /* @__PURE__ */ e.createElement(N, { className: "text-light-4" }, d), /* @__PURE__ */ e.createElement(y, null, /* @__PURE__ */ e.createElement(v, null, n.map((t) => /* @__PURE__ */ e.createElement(
+    w,
     {
       key: t.id,
       value: t.id,
@@ -48,15 +48,15 @@ function L({
         t.disabled ? "text-light-4" : "text-light-2",
         a === t.id ? "bg-light-2" : ""
       ),
-      onSelect: (h) => {
-        d(h);
+      onSelect: (p) => {
+        h(p);
       }
     },
     /* @__PURE__ */ e.createElement("div", { className: "flex flex-row gap-2 " }, t.icon, t.name),
-    a === t.id ? /* @__PURE__ */ e.createElement(f, { className: r("h-4 w-4 stroke-brand") }) : /* @__PURE__ */ e.createElement("div", null)
+    a === t.id ? /* @__PURE__ */ e.createElement(x, { className: r("h-4 w-4 stroke-brand") }) : /* @__PURE__ */ e.createElement("div", null)
   )))))));
 }
 export {
-  L as SingleCombobox
+  R as SingleCombobox
 };
 //# sourceMappingURL=index.es22.js.map

package/dist/index.es22.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es22.js","sources":["../src/components/molecules/single-combobox/single-combobox.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Check, ChevronDown, ChevronUp } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\nimport { Button } from '../../atoms/button'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../../unstyled/command/command'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../unstyled/popover/popover-components'\nimport { SingleComboboxPropsType } from './single-combobox.types'\nimport { ComboBoxStates } from './single-combobox.styles'\nimport { Typography } from '../../atoms/typography'\n\n// const frameworks =\n\nexport function SingleCombobox({\n  options,\n  value,\n  placeholder = 'Empty',\n  searchPlaceholder = 'Search',\n  emptyMessage = 'No results',\n  onChange,\n}: SingleComboboxPropsType) {\n  const [open, setOpen] = React.useState(false)\n\n  const handleChange = (newValue: string) => {\n    onChange(newValue)\n    setOpen(false)\n  }\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"secondary\"\n          role=\"combobox\"\n          aria-expanded={open}\n          //   className=\"w-[200px] justify-between\"\n          className={cn(\n            ComboBoxStates({ isOpen: open, isValue: !!value }),\n            'w-full justify-between px-3 py-2'\n          )}\n        >\n          <Typography\n            variant={'body2'}\n            className={value ? 'text-light-2' : 'text-light-4'}\n          >\n            {value\n              ? options.find((option) => option.id === value)?.name\n              : placeholder}\n          </Typography>\n          {open ? (\n            <ChevronUp className=\"w-4 h-4 ml-2 stroke-light-2\" />\n          ) : (\n            <ChevronDown className=\"w-4 h-4 ml-2 stroke-light-2\" />\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[200px] p-0 bg-light-1 mt-1 rounded-lg\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} className=\"\" />\n          <CommandEmpty className=\"text-light-4\">{emptyMessage}</CommandEmpty>\n          <CommandGroup>\n            <CommandList>\n              {options.map((option) => {\n                return (\n                  <CommandItem\n                    key={option.id}\n                    value={option.id}\n                    disabled={option.disabled}\n                    className={cn(\n                      'justify-between gap-2 text-light-2 hover:bg-light-2 hover:text-light-1 focus:bg-light-2 focus:text-accent-foreground',\n                      option.disabled ? 'text-light-4' : 'text-light-2',\n                      value === option.id ? 'bg-light-2' : ''\n                    )}\n                    onSelect={(currentValue) => {\n                      handleChange(currentValue)\n                    }}\n                  >\n                    <div className=\"flex flex-row gap-2 \">\n                      {option.icon}\n                      {option.name}\n                    </div>\n                    {value === option.id ? (\n                      <Check className={cn('h-4 w-4 stroke-brand')} />\n                    ) : (\n                      <div />\n                    )}\n                  </CommandItem>\n                )\n              })}\n            </CommandList>\n          </CommandGroup>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  )\n}\n"],"names":["SingleCombobox","options","value","placeholder","searchPlaceholder","emptyMessage","onChange","open","setOpen","React","handleChange","newValue","Popover","PopoverTrigger","Button","cn","ComboBoxStates","Typography","option","ChevronUp","ChevronDown","PopoverContent","Command","CommandInput","CommandEmpty","CommandGroup","CommandList","CommandItem","currentValue","Check"],"mappings":";;;;;;;;AA0BO,SAASA,EAAe;AAAA,EAC7B,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,mBAAAC,IAAoB;AAAA,EACpB,cAAAC,IAAe;AAAA,EACf,UAAAC;AACF,GAA4B;AAC1B,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAM,SAAS,EAAK,GAEtCC,IAAe,CAACC,MAAqB;AACzC,IAAAL,EAASK,CAAQ,GACjBH,EAAQ,EAAK;AAAA,EAAA;AAIb,SAAA,gBAAAC,EAAA,cAACG,KAAQ,MAAAL,GAAY,cAAcC,KAChC,gBAAAC,EAAA,cAAAI,GAAA,EAAe,SAAO,GACrB,GAAA,gBAAAJ,EAAA;AAAA,IAACK;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,iBAAeP;AAAA,MAEf,WAAWQ;AAAA,QACTC,EAAe,EAAE,QAAQT,GAAM,SAAS,CAAC,CAACL,GAAO;AAAA,QACjD;AAAA,MACF;AAAA,IAAA;AAAA,IAEA,gBAAAO,EAAA;AAAA,MAACQ;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWf,IAAQ,iBAAiB;AAAA,MAAA;AAAA,MAEnCA,IACGD,EAAQ,KAAK,CAACiB,MAAWA,EAAO,OAAOhB,CAAK,GAAG,OAC/CC;AAAA,IACN;AAAA,IACCI,oCACEY,GAAU,EAAA,WAAU,+BAA8B,IAEnD,gBAAAV,EAAA,cAACW,GAAY,EAAA,WAAU,8BAA8B,CAAA;AAAA,EAAA,CAG3D,GACC,gBAAAX,EAAA,cAAAY,GAAA,EAAe,WAAU,2CAAA,GACvB,gBAAAZ,EAAA,cAAAa,GAAA,MACE,gBAAAb,EAAA,cAAAc,GAAA,EAAa,aAAanB,GAAmB,WAAU,GAAG,CAAA,GAC3D,gBAAAK,EAAA,cAACe,GAAa,EAAA,WAAU,eAAgB,GAAAnB,CAAa,GACrD,gBAAAI,EAAA,cAACgB,GACC,MAAA,gBAAAhB,EAAA,cAACiB,GACE,MAAAzB,EAAQ,IAAI,CAACiB,MAEV,gBAAAT,EAAA;AAAA,IAACkB;AAAA,IAAA;AAAA,MACC,KAAKT,EAAO;AAAA,MACZ,OAAOA,EAAO;AAAA,MACd,UAAUA,EAAO;AAAA,MACjB,WAAWH;AAAA,QACT;AAAA,QACAG,EAAO,WAAW,iBAAiB;AAAA,QACnChB,MAAUgB,EAAO,KAAK,eAAe;AAAA,MACvC;AAAA,MACA,UAAU,CAACU,MAAiB;AAC1B,QAAAlB,EAAakB,CAAY;AAAA,MAC3B;AAAA,IAAA;AAAA,oCAEC,OAAI,EAAA,WAAU,0BACZV,EAAO,MACPA,EAAO,IACV;AAAA,IACChB,MAAUgB,EAAO,KACf,gBAAAT,EAAA,cAAAoB,GAAA,EAAM,WAAWd,EAAG,sBAAsB,EAAA,CAAG,IAE9C,gBAAAN,EAAA,cAAC,OAAI,IAAA;AAAA,EAAA,CAIZ,CACH,CACF,CACF,CACF,CACF;AAEJ;"}
+{"version":3,"file":"index.es22.js","sources":["../src/components/molecules/single-combobox/single-combobox.tsx"],"sourcesContent":["'use client'\n\nimport * as React from 'react'\nimport { Check, ChevronDown, ChevronUp } from 'lucide-react'\n\nimport { cn } from '@/lib/utils'\nimport { Button } from '../../atoms/button'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../../unstyled/command/command'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '../../unstyled/popover/popover-components'\nimport { SingleComboboxPropsType } from './single-combobox.types'\nimport { ComboBoxStates } from './single-combobox.styles'\nimport { Typography } from '../../atoms/typography'\n\n// const frameworks =\n\nexport function SingleCombobox({\n  options,\n  value,\n  placeholder = 'Empty',\n  searchPlaceholder = 'Search',\n  emptyMessage = 'No results',\n  onChange,\n}: SingleComboboxPropsType) {\n  const [open, setOpen] = React.useState(false)\n\n  const handleChange = (newValue: string) => {\n    onChange(newValue)\n    setOpen(false)\n  }\n  const selectedOption = options.find((option) => option.id === value)\n\n  return (\n    <Popover open={open} onOpenChange={setOpen}>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"secondary\"\n          role=\"combobox\"\n          aria-expanded={open}\n          //   className=\"w-[200px] justify-between\"\n          className={cn(\n            ComboBoxStates({ isOpen: open, isValue: !!value }),\n            'w-full justify-between px-3 py-2'\n          )}\n        >\n          {selectedOption ? (\n            <div className=\"flex items-center gap-2\">\n              {selectedOption.icon}\n              <Typography\n                variant={'body2'}\n                className={value ? 'text-light-2' : 'text-light-4'}\n              >\n                {selectedOption?.name}\n              </Typography>\n            </div>\n          ) : (\n            <Typography variant={'body2'} className=\"text-light-4\">\n              {placeholder}\n            </Typography>\n          )}\n          {open ? (\n            <ChevronUp className=\"w-4 h-4 ml-2 stroke-light-2\" />\n          ) : (\n            <ChevronDown className=\"w-4 h-4 ml-2 stroke-light-2\" />\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-[200px] p-0 bg-light-1 mt-1 rounded-lg\">\n        <Command>\n          <CommandInput placeholder={searchPlaceholder} className=\"\" />\n          <CommandEmpty className=\"text-light-4\">{emptyMessage}</CommandEmpty>\n          <CommandGroup>\n            <CommandList>\n              {options.map((option) => {\n                return (\n                  <CommandItem\n                    key={option.id}\n                    value={option.id}\n                    disabled={option.disabled}\n                    className={cn(\n                      'justify-between gap-2 text-light-2 hover:bg-light-2 hover:text-light-1 focus:bg-light-2 focus:text-accent-foreground',\n                      option.disabled ? 'text-light-4' : 'text-light-2',\n                      value === option.id ? 'bg-light-2' : ''\n                    )}\n                    onSelect={(currentValue) => {\n                      handleChange(currentValue)\n                    }}\n                  >\n                    <div className=\"flex flex-row gap-2 \">\n                      {option.icon}\n                      {option.name}\n                    </div>\n                    {value === option.id ? (\n                      <Check className={cn('h-4 w-4 stroke-brand')} />\n                    ) : (\n                      <div />\n                    )}\n                  </CommandItem>\n                )\n              })}\n            </CommandList>\n          </CommandGroup>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  )\n}\n"],"names":["SingleCombobox","options","value","placeholder","searchPlaceholder","emptyMessage","onChange","open","setOpen","React","handleChange","newValue","selectedOption","option","Popover","PopoverTrigger","Button","cn","ComboBoxStates","Typography","ChevronUp","ChevronDown","PopoverContent","Command","CommandInput","CommandEmpty","CommandGroup","CommandList","CommandItem","currentValue","Check"],"mappings":";;;;;;;;AA0BO,SAASA,EAAe;AAAA,EAC7B,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC,IAAc;AAAA,EACd,mBAAAC,IAAoB;AAAA,EACpB,cAAAC,IAAe;AAAA,EACf,UAAAC;AACF,GAA4B;AAC1B,QAAM,CAACC,GAAMC,CAAO,IAAIC,EAAM,SAAS,EAAK,GAEtCC,IAAe,CAACC,MAAqB;AACzC,IAAAL,EAASK,CAAQ,GACjBH,EAAQ,EAAK;AAAA,EAAA,GAETI,IAAiBX,EAAQ,KAAK,CAACY,MAAWA,EAAO,OAAOX,CAAK;AAGjE,SAAA,gBAAAO,EAAA,cAACK,KAAQ,MAAAP,GAAY,cAAcC,KAChC,gBAAAC,EAAA,cAAAM,GAAA,EAAe,SAAO,GACrB,GAAA,gBAAAN,EAAA;AAAA,IAACO;AAAA,IAAA;AAAA,MACC,SAAQ;AAAA,MACR,MAAK;AAAA,MACL,iBAAeT;AAAA,MAEf,WAAWU;AAAA,QACTC,EAAe,EAAE,QAAQX,GAAM,SAAS,CAAC,CAACL,GAAO;AAAA,QACjD;AAAA,MACF;AAAA,IAAA;AAAA,IAECU,IACE,gBAAAH,EAAA,cAAA,OAAA,EAAI,WAAU,0BAAA,GACZG,EAAe,MAChB,gBAAAH,EAAA;AAAA,MAACU;AAAA,MAAA;AAAA,QACC,SAAS;AAAA,QACT,WAAWjB,IAAQ,iBAAiB;AAAA,MAAA;AAAA,MAEnCU,GAAgB;AAAA,IAAA,CAErB,IAEC,gBAAAH,EAAA,cAAAU,GAAA,EAAW,SAAS,SAAS,WAAU,kBACrChB,CACH;AAAA,IAEDI,oCACEa,GAAU,EAAA,WAAU,+BAA8B,IAEnD,gBAAAX,EAAA,cAACY,GAAY,EAAA,WAAU,8BAA8B,CAAA;AAAA,EAAA,CAG3D,GACC,gBAAAZ,EAAA,cAAAa,GAAA,EAAe,WAAU,2CAAA,GACvB,gBAAAb,EAAA,cAAAc,GAAA,MACE,gBAAAd,EAAA,cAAAe,GAAA,EAAa,aAAapB,GAAmB,WAAU,GAAG,CAAA,GAC3D,gBAAAK,EAAA,cAACgB,GAAa,EAAA,WAAU,eAAgB,GAAApB,CAAa,GACrD,gBAAAI,EAAA,cAACiB,GACC,MAAA,gBAAAjB,EAAA,cAACkB,GACE,MAAA1B,EAAQ,IAAI,CAACY,MAEV,gBAAAJ,EAAA;AAAA,IAACmB;AAAA,IAAA;AAAA,MACC,KAAKf,EAAO;AAAA,MACZ,OAAOA,EAAO;AAAA,MACd,UAAUA,EAAO;AAAA,MACjB,WAAWI;AAAA,QACT;AAAA,QACAJ,EAAO,WAAW,iBAAiB;AAAA,QACnCX,MAAUW,EAAO,KAAK,eAAe;AAAA,MACvC;AAAA,MACA,UAAU,CAACgB,MAAiB;AAC1B,QAAAnB,EAAamB,CAAY;AAAA,MAC3B;AAAA,IAAA;AAAA,oCAEC,OAAI,EAAA,WAAU,0BACZhB,EAAO,MACPA,EAAO,IACV;AAAA,IACCX,MAAUW,EAAO,KACf,gBAAAJ,EAAA,cAAAqB,GAAA,EAAM,WAAWb,EAAG,sBAAsB,EAAA,CAAG,IAE9C,gBAAAR,EAAA,cAAC,OAAI,IAAA;AAAA,EAAA,CAIZ,CACH,CACF,CACF,CACF,CACF;AAEJ;"}

package/dist/index.es23.js

@@ -6,7 +6,7 @@ import "lucide-react";
 import "./index.es49.js";
 import "./index.es50.js";
 import "./index.es34.js";
-import { TextAreaVariants as u } from "./index.es61.js";
+import { TextAreaVariants as u } from "./index.es58.js";
 const m = e.forwardRef(
   ({
     className: o,

package/dist/index.es25.js

@@ -1,52 +1,51 @@
 import e from "react";
-import * as p from "@radix-ui/react-select";
-import { SelectTrigger as f, SelectValue as g, SelectContent as S, SelectGroup as d, SelectItem as u } from "./index.es46.js";
+import * as f from "@radix-ui/react-select";
+import { SelectTrigger as g, SelectValue as d, SelectContent as S, SelectGroup as E, SelectItem as u } from "./index.es46.js";
 import { Typography as n } from "./index.es7.js";
-import { SelectStates as E } from "./index.es47.js";
-import { cn as b } from "./index.es48.js";
+import { SelectStates as b } from "./index.es47.js";
+import { cn as N } from "./index.es48.js";
 const O = e.forwardRef(
   ({
     // className,
     // children,
-    placeholder: c,
-    onValueChange: m,
+    placeholder: m,
+    onValueChange: s,
     items: l,
     value: a,
     // defaultValue,
     ...r
   }) => {
-    const [o, i] = e.useState(!1);
+    const c = l.find((t) => t.value === a), [o, i] = e.useState(!1);
     return /* @__PURE__ */ e.createElement(
-      p.Root,
+      f.Root,
       {
-        onValueChange: m,
+        onValueChange: s,
         value: a,
         onOpenChange: i,
         ...r
       },
       /* @__PURE__ */ e.createElement(
-        f,
+        g,
         {
-          className: b(E({ isOpen: o, isValue: !!a })),
+          className: N(b({ isOpen: o, isValue: !!a })),
           ...r.triggerProps
         },
-        /* @__PURE__ */ e.createElement(g, { placeholder: c }, /* @__PURE__ */ e.createElement(
+        /* @__PURE__ */ e.createElement(d, { placeholder: m }, /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-2" }, c?.icon, /* @__PURE__ */ e.createElement(
           n,
           {
             variant: "body2",
             className: a ? "text-light-2" : "text-light-4"
           },
-          l.find((t) => t.value === a)?.label
-        ))
+          c?.label
+        )))
       ),
-      /* @__PURE__ */ e.createElement(S, { className: "bg-light-1" }, /* @__PURE__ */ e.createElement(d, null, l.map((t, s) => /* @__PURE__ */ e.createElement(
+      /* @__PURE__ */ e.createElement(S, { className: "bg-light-1" }, /* @__PURE__ */ e.createElement(E, null, l.map((t, p) => /* @__PURE__ */ e.createElement(
         u,
         {
-          key: s,
           value: t.value,
           disabled: t.disabled ?? !1
         },
-        /* @__PURE__ */ e.createElement(n, { variant: "body2", className: "capitalize" }, t.label)
+        /* @__PURE__ */ e.createElement("div", { key: p, className: "flex items-center gap-2" }, t.icon, /* @__PURE__ */ e.createElement(n, { variant: "body2", className: "capitalize" }, t.label))
       ))))
     );
   }

package/dist/index.es25.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es25.js","sources":["../src/components/molecules/single-select/index.tsx"],"sourcesContent":["import React from 'react'\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { SelectProps } from './single-select.types'\nimport {\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from './single-select-components'\nimport { Typography } from '../../atoms/typography'\nimport { SelectStates } from './single-select-styles'\nimport { cn } from '@/lib/utils'\n\nconst SingleSelect = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Root>,\n  SelectProps\n>(\n  ({\n    // className,\n    // children,\n    placeholder,\n    onValueChange,\n    items,\n    value,\n\n    // defaultValue,\n    ...props\n  }) => {\n    const [isOpen, setIsOpen] = React.useState(false)\n    return (\n      <SelectPrimitive.Root\n        onValueChange={onValueChange}\n        value={value}\n        onOpenChange={setIsOpen}\n        {...props}\n      >\n        <SelectTrigger\n          className={cn(SelectStates({ isOpen, isValue: !!value }))}\n          {...props.triggerProps}\n        >\n          <SelectValue placeholder={placeholder}>\n            <Typography\n              variant={'body2'}\n              className={value ? 'text-light-2' : 'text-light-4'}\n            >\n              {\n                items.find((item) => {\n                  return item.value === value\n                })?.label\n              }\n            </Typography>\n          </SelectValue>\n        </SelectTrigger>\n        <SelectContent className=\"bg-light-1\">\n          <SelectGroup>\n            {/* <ScrollArea className=\"h-72 border overflow-y-scroll\"> */}\n            {items.map((item, index) => {\n              return (\n                <SelectItem\n                  key={index}\n                  value={item.value}\n                  disabled={item.disabled ?? false}\n                >\n                  <Typography variant={'body2'} className=\"capitalize\">\n                    {item.label}\n                  </Typography>\n                </SelectItem>\n              )\n            })}\n            {/* </ScrollArea> */}\n          </SelectGroup>\n        </SelectContent>\n      </SelectPrimitive.Root>\n    )\n  }\n)\n\nexport { SingleSelect }\n"],"names":["SingleSelect","React","placeholder","onValueChange","items","value","props","isOpen","setIsOpen","SelectPrimitive","SelectTrigger","cn","SelectStates","SelectValue","Typography","item","SelectContent","SelectGroup","index","SelectItem"],"mappings":";;;;;;AAcA,MAAMA,IAAeC,EAAM;AAAA,EAIzB,CAAC;AAAA;AAAA;AAAA,IAGC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA;AAAA,IAGA,GAAGC;AAAA,EAAA,MACC;AACJ,UAAM,CAACC,GAAQC,CAAS,IAAIP,EAAM,SAAS,EAAK;AAE9C,WAAAA,gBAAAA,EAAA;AAAA,MAACQ,EAAgB;AAAA,MAAhB;AAAA,QACC,eAAAN;AAAA,QACA,OAAAE;AAAA,QACA,cAAcG;AAAA,QACb,GAAGF;AAAA,MAAA;AAAA,MAEJL,gBAAAA,EAAA;AAAA,QAACS;AAAA,QAAA;AAAA,UACC,WAAWC,EAAGC,EAAa,EAAE,QAAAL,GAAQ,SAAS,CAAC,CAACF,EAAM,CAAC,CAAC;AAAA,UACvD,GAAGC,EAAM;AAAA,QAAA;AAAA,QAEVL,gBAAAA,EAAA,cAACY,KAAY,aAAAX,EACX,GAAAD,gBAAAA,EAAA;AAAA,UAACa;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,WAAWT,IAAQ,iBAAiB;AAAA,UAAA;AAAA,UAGlCD,EAAM,KAAK,CAACW,MACHA,EAAK,UAAUV,CACvB,GAAG;AAAA,QAAA,CAGV;AAAA,MACF;AAAA,MACAJ,gBAAAA,EAAA,cAACe,GAAc,EAAA,WAAU,aACvB,GAAAf,gBAAAA,EAAA,cAACgB,SAEEb,EAAM,IAAI,CAACW,GAAMG,MAEdjB,gBAAAA,EAAA;AAAA,QAACkB;AAAA,QAAA;AAAA,UACC,KAAKD;AAAA,UACL,OAAOH,EAAK;AAAA,UACZ,UAAUA,EAAK,YAAY;AAAA,QAAA;AAAA,wCAE1BD,GAAW,EAAA,SAAS,SAAS,WAAU,aAAA,GACrCC,EAAK,KACR;AAAA,MAAA,CAGL,CAEH,CACF;AAAA,IAAA;AAAA,EAGN;AACF;"}
+{"version":3,"file":"index.es25.js","sources":["../src/components/molecules/single-select/index.tsx"],"sourcesContent":["import React from 'react'\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { SelectProps } from './single-select.types'\nimport {\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from './single-select-components'\nimport { Typography } from '../../atoms/typography'\nimport { SelectStates } from './single-select-styles'\nimport { cn } from '@/lib/utils'\n\nconst SingleSelect = React.forwardRef<\n  React.ElementRef<typeof SelectPrimitive.Root>,\n  SelectProps\n>(\n  ({\n    // className,\n    // children,\n    placeholder,\n    onValueChange,\n    items,\n    value,\n\n    // defaultValue,\n    ...props\n  }) => {\n    const selectedItem = items.find((item) => {\n      return item.value === value\n    })\n    const [isOpen, setIsOpen] = React.useState(false)\n    return (\n      <SelectPrimitive.Root\n        onValueChange={onValueChange}\n        value={value}\n        onOpenChange={setIsOpen}\n        {...props}\n      >\n        <SelectTrigger\n          className={cn(SelectStates({ isOpen, isValue: !!value }))}\n          {...props.triggerProps}\n        >\n          <SelectValue placeholder={placeholder}>\n            <div className=\"flex items-center gap-2\">\n              {selectedItem?.icon}\n              <Typography\n                variant={'body2'}\n                className={value ? 'text-light-2' : 'text-light-4'}\n              >\n                {selectedItem?.label}\n              </Typography>\n            </div>\n          </SelectValue>\n        </SelectTrigger>\n        <SelectContent className=\"bg-light-1\">\n          <SelectGroup>\n            {/* <ScrollArea className=\"h-72 border overflow-y-scroll\"> */}\n            {items.map((item, index) => {\n              return (\n                <SelectItem\n                  value={item.value}\n                  disabled={item.disabled ?? false}\n                >\n                  <div key={index} className=\"flex items-center gap-2\">\n                    {item.icon}\n                    <Typography variant={'body2'} className=\"capitalize\">\n                      {item.label}\n                    </Typography>\n                  </div>\n                </SelectItem>\n              )\n            })}\n            {/* </ScrollArea> */}\n          </SelectGroup>\n        </SelectContent>\n      </SelectPrimitive.Root>\n    )\n  }\n)\n\nexport { SingleSelect }\n"],"names":["SingleSelect","React","placeholder","onValueChange","items","value","props","selectedItem","item","isOpen","setIsOpen","SelectPrimitive","SelectTrigger","cn","SelectStates","SelectValue","Typography","SelectContent","SelectGroup","index","SelectItem"],"mappings":";;;;;;AAcA,MAAMA,IAAeC,EAAM;AAAA,EAIzB,CAAC;AAAA;AAAA;AAAA,IAGC,aAAAC;AAAA,IACA,eAAAC;AAAA,IACA,OAAAC;AAAA,IACA,OAAAC;AAAA;AAAA,IAGA,GAAGC;AAAA,EAAA,MACC;AACJ,UAAMC,IAAeH,EAAM,KAAK,CAACI,MACxBA,EAAK,UAAUH,CACvB,GACK,CAACI,GAAQC,CAAS,IAAIT,EAAM,SAAS,EAAK;AAE9C,WAAAA,gBAAAA,EAAA;AAAA,MAACU,EAAgB;AAAA,MAAhB;AAAA,QACC,eAAAR;AAAA,QACA,OAAAE;AAAA,QACA,cAAcK;AAAA,QACb,GAAGJ;AAAA,MAAA;AAAA,MAEJL,gBAAAA,EAAA;AAAA,QAACW;AAAA,QAAA;AAAA,UACC,WAAWC,EAAGC,EAAa,EAAE,QAAAL,GAAQ,SAAS,CAAC,CAACJ,EAAM,CAAC,CAAC;AAAA,UACvD,GAAGC,EAAM;AAAA,QAAA;AAAA,QAEVL,gBAAAA,EAAA,cAACc,KAAY,aAAAb,EACX,GAAAD,gBAAAA,EAAA,cAAC,SAAI,WAAU,0BAAA,GACZM,GAAc,MACfN,gBAAAA,EAAA;AAAA,UAACe;AAAA,UAAA;AAAA,YACC,SAAS;AAAA,YACT,WAAWX,IAAQ,iBAAiB;AAAA,UAAA;AAAA,UAEnCE,GAAc;AAAA,QAAA,CAEnB,CACF;AAAA,MACF;AAAA,MACAN,gBAAAA,EAAA,cAACgB,GAAc,EAAA,WAAU,aACvB,GAAAhB,gBAAAA,EAAA,cAACiB,SAEEd,EAAM,IAAI,CAACI,GAAMW,MAEdlB,gBAAAA,EAAA;AAAA,QAACmB;AAAA,QAAA;AAAA,UACC,OAAOZ,EAAK;AAAA,UACZ,UAAUA,EAAK,YAAY;AAAA,QAAA;AAAA,wCAE1B,OAAI,EAAA,KAAKW,GAAO,WAAU,6BACxBX,EAAK,MACLP,gBAAAA,EAAA,cAAAe,GAAA,EAAW,SAAS,SAAS,WAAU,aACrC,GAAAR,EAAK,KACR,CACF;AAAA,MAAA,CAGL,CAEH,CACF;AAAA,IAAA;AAAA,EAGN;AACF;"}

package/dist/index.es26.js

@@ -1,103 +1,108 @@
 import * as e from "react";
-import { cn as f } from "./index.es48.js";
-import { X as d, ChevronDown as h, ChevronUp as g, Check as y } from "lucide-react";
-import { Button as E } from "./index.es2.js";
-import { Command as v, CommandInput as b, CommandList as w, CommandEmpty as x, CommandGroup as N, CommandItem as C } from "./index.es49.js";
-import { Popover as k, PopoverTrigger as D, PopoverContent as P } from "./index.es50.js";
-import { Badge as S } from "./index.es12.js";
-import { Typography as m } from "./index.es7.js";
-function T({
-  options: c,
-  selected: t,
-  onChange: s,
-  className: u,
-  ...p
+import { cn as d } from "./index.es48.js";
+import { X as g, ChevronDown as h, ChevronUp as y, Check as E } from "lucide-react";
+import { Button as v } from "./index.es2.js";
+import { Command as b, CommandInput as w, CommandList as x, CommandEmpty as N, CommandGroup as C, CommandItem as k } from "./index.es49.js";
+import { Popover as D, PopoverTrigger as P, PopoverContent as S } from "./index.es50.js";
+import { Badge as I } from "./index.es12.js";
+import { Typography as c } from "./index.es7.js";
+function U({
+  options: s,
+  selected: a,
+  onChange: i,
+  className: p,
+  ...f
 }) {
-  const [n, o] = e.useState(!1), i = e.useRef(null), l = (a) => {
-    s(t.filter((r) => r !== a));
+  const [o, l] = e.useState(!1), u = e.useRef(null), m = (t) => {
+    i(a.filter((n) => n !== t));
   };
-  return /* @__PURE__ */ e.createElement(k, { open: n, onOpenChange: o, ...p }, /* @__PURE__ */ e.createElement(
-    D,
+  return /* @__PURE__ */ e.createElement(D, { open: o, onOpenChange: l, ...f }, /* @__PURE__ */ e.createElement(
+    P,
     {
-      className: `min-h-[40px] h-fit px-3 py-2 
-        ${n ? "border-primary-2 ring-4 ring-primary-1" : "border-neutral-2"}
+      className: `min-h-[40px] h-fit px-3 py-2
+        ${o ? "border-primary-2 ring-4 ring-primary-1" : "border-neutral-2"}
         focus:border-primary-2 focus:ring-0 focus:ring-primary-1`,
-      ref: i,
+      ref: u,
       asChild: !0
     },
     /* @__PURE__ */ e.createElement(
-      E,
+      v,
       {
         variant: "secondary",
         role: "combobox",
-        "aria-expanded": n,
+        "aria-expanded": o,
         className: "w-full justify-between focus:ring-0 ",
-        onClick: () => o(!n)
+        onClick: () => l(!o)
       },
-      /* @__PURE__ */ e.createElement("div", { className: "flex gap-1 flex-wrap" }, t.length > 0 ? t.map((a) => /* @__PURE__ */ e.createElement(
-        S,
-        {
-          variant: "default",
-          key: a,
-          size: "sm",
-          showBorder: !0,
-          onClick: () => l(a)
-        },
-        c.find((r) => r.value === a)?.label,
-        /* @__PURE__ */ e.createElement(
-          "button",
+      /* @__PURE__ */ e.createElement("div", { className: "flex gap-1 flex-wrap" }, a.length > 0 ? a.map((t) => {
+        const n = s.find(
+          (r) => r.value === t
+        );
+        return /* @__PURE__ */ e.createElement(
+          I,
           {
-            className: "ml-1 ring-offset-background rounded-full outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
-            onKeyDown: (r) => {
-              r.key === "Enter" && l(a);
-            },
-            onMouseDown: (r) => {
-              r.preventDefault(), r.stopPropagation();
-            },
-            onClick: (r) => {
-              r.stopPropagation(), l(a);
-            }
+            variant: "default",
+            key: t,
+            size: "sm",
+            showBorder: !0,
+            onClick: () => m(t)
           },
-          /* @__PURE__ */ e.createElement(d, { className: "h-3 w-3 text-muted-foreground hover:text-foreground" })
-        )
-      )) : /* @__PURE__ */ e.createElement(m, { variant: "body2", className: "text-light-4" }, "Select option")),
-      n ? /* @__PURE__ */ e.createElement(g, { className: "h-4 w-4 shrink-0 opacity-50" }) : /* @__PURE__ */ e.createElement(h, { className: "h-4 w-4 shrink-0 opacity-50" })
+          /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-1" }, n?.icon, n?.label),
+          /* @__PURE__ */ e.createElement(
+            "button",
+            {
+              className: "ml-1 ring-offset-background rounded-full outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+              onKeyDown: (r) => {
+                r.key === "Enter" && m(t);
+              },
+              onMouseDown: (r) => {
+                r.preventDefault(), r.stopPropagation();
+              },
+              onClick: (r) => {
+                r.stopPropagation(), m(t);
+              }
+            },
+            /* @__PURE__ */ e.createElement(g, { className: "h-3 w-3 text-muted-foreground hover:text-foreground" })
+          )
+        );
+      }) : /* @__PURE__ */ e.createElement(c, { variant: "body2", className: "text-light-4" }, "Select option")),
+      o ? /* @__PURE__ */ e.createElement(y, { className: "h-4 w-4 shrink-0 opacity-50" }) : /* @__PURE__ */ e.createElement(h, { className: "h-4 w-4 shrink-0 opacity-50" })
     )
   ), /* @__PURE__ */ e.createElement(
-    P,
+    S,
     {
       style: {
-        width: i.current?.clientWidth
+        width: u.current?.clientWidth
       },
       className: "w-full p-0 bg-light-1",
-      onEscapeKeyDown: () => o(!1)
+      onEscapeKeyDown: () => l(!1)
     },
-    /* @__PURE__ */ e.createElement(v, { className: u }, /* @__PURE__ */ e.createElement(
-      b,
+    /* @__PURE__ */ e.createElement(b, { className: p }, /* @__PURE__ */ e.createElement(
+      w,
       {
         showIcon: !1,
         inputMode: "none",
         className: "caret-transparent opacity-0 h-0 w-0 p-0 m-0",
         placeholder: "Search ..."
       }
-    ), /* @__PURE__ */ e.createElement(w, null, /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement(m, { variant: "body3" }, "No items found")), /* @__PURE__ */ e.createElement(N, { className: "max-h-64 px-0 my-1 overflow-y-auto custom-scrollbar" }, c.map((a) => /* @__PURE__ */ e.createElement("div", { className: "py-0.5 px-1.5 bg-white" }, /* @__PURE__ */ e.createElement(
-      C,
+    ), /* @__PURE__ */ e.createElement(x, null, /* @__PURE__ */ e.createElement(N, null, /* @__PURE__ */ e.createElement(c, { variant: "body3" }, "No items found")), /* @__PURE__ */ e.createElement(C, { className: "max-h-64 px-0 my-1 overflow-y-auto custom-scrollbar" }, s.map((t) => /* @__PURE__ */ e.createElement("div", { className: "py-0.5 px-1.5 bg-white" }, /* @__PURE__ */ e.createElement(
+      k,
       {
-        key: a.value,
-        className: `justify-between p-2 rounded-md text-light-2 ${t.indexOf(a.value) !== -1 ? "bg-light-2" : ""}`,
+        key: t.value,
+        className: `justify-between p-2 rounded-md text-light-2 ${a.indexOf(t.value) !== -1 ? "bg-light-2" : ""}`,
         onSelect: () => {
-          s(
-            t.includes(a.value) ? t.filter((r) => r !== a.value) : [...t, a.value]
-          ), o(!0);
+          i(
+            a.includes(t.value) ? a.filter((n) => n !== t.value) : [...a, t.value]
+          ), l(!0);
         }
       },
-      /* @__PURE__ */ e.createElement(m, { variant: "body2" }, a.label),
+      /* @__PURE__ */ e.createElement("div", { className: "flex items-center gap-1" }, t.icon, /* @__PURE__ */ e.createElement(c, { variant: "body2" }, t.label)),
       /* @__PURE__ */ e.createElement(
-        y,
+        E,
         {
-          className: f(
+          className: d(
             "h-5 w-5 stroke-brand",
-            t.includes(a.value) ? "opacity-100" : "opacity-0"
+            a.includes(t.value) ? "opacity-100" : "opacity-0"
           )
         }
       )
@@ -105,6 +110,6 @@ function T({
   ));
 }
 export {
-  T as MultiSelect
+  U as MultiSelect
 };
 //# sourceMappingURL=index.es26.js.map

package/dist/index.es26.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.es26.js","sources":["../src/components/molecules/multi-select/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '@/lib/utils'\n\nimport { Check, X, ChevronDown, ChevronUp } from 'lucide-react'\nimport { Button } from '@/components/atoms/button'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '@/components/unstyled/command/command'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '@/components/unstyled/popover/popover-components'\nimport { Badge } from '@/components/atoms/badge'\nimport { Typography } from '../../atoms/typography'\nimport { MultiSelectProps } from './multi-select.types'\n\nfunction MultiSelect({\n  options,\n  selected,\n  onChange,\n  className,\n  ...props\n}: MultiSelectProps) {\n  const [open, setOpen] = React.useState(false)\n  const popoverRef = React.useRef<HTMLButtonElement>(null)\n\n  const handleUnselect = (item: string) => {\n    onChange(selected.filter((i) => i !== item))\n  }\n\n  return (\n    <Popover open={open} onOpenChange={setOpen} {...props}>\n      <PopoverTrigger\n        className={`min-h-[40px] h-fit px-3 py-2 \n        ${open ? 'border-primary-2 ring-4 ring-primary-1' : 'border-neutral-2'}\n        focus:border-primary-2 focus:ring-0 focus:ring-primary-1`}\n        ref={popoverRef}\n        asChild\n      >\n        <Button\n          variant=\"secondary\"\n          role=\"combobox\"\n          aria-expanded={open}\n          className={`w-full justify-between focus:ring-0 `}\n          onClick={() => setOpen(!open)}\n        >\n          <div className=\"flex gap-1 flex-wrap\">\n            {selected.length > 0 ? (\n              selected.map((item) => (\n                <Badge\n                  variant=\"default\"\n                  key={item}\n                  size={'sm'}\n                  //   className=\"mr-1 mb-1\"\n                  showBorder\n                  onClick={() => handleUnselect(item)}\n                >\n                  {options.find((option) => option.value === item)?.label}\n                  <button\n                    className=\"ml-1 ring-offset-background rounded-full outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n                    onKeyDown={(e) => {\n                      if (e.key === 'Enter') {\n                        handleUnselect(item)\n                      }\n                    }}\n                    onMouseDown={(e) => {\n                      e.preventDefault()\n                      e.stopPropagation()\n                    }}\n                    onClick={(e) => {\n                      e.stopPropagation()\n                      handleUnselect(item)\n                    }}\n                  >\n                    <X className=\"h-3 w-3 text-muted-foreground hover:text-foreground\" />\n                  </button>\n                </Badge>\n              ))\n            ) : (\n              <Typography variant=\"body2\" className=\"text-light-4\">\n                Select option\n              </Typography>\n            )}\n          </div>\n          {!open ? (\n            <ChevronDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          ) : (\n            <ChevronUp className=\"h-4 w-4 shrink-0 opacity-50\" />\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent\n        style={{\n          width: popoverRef.current?.clientWidth,\n        }}\n        className=\"w-full p-0 bg-light-1\"\n        onEscapeKeyDown={() => setOpen(false)}\n      >\n        <Command className={className}>\n          <CommandInput\n            showIcon={false}\n            inputMode={'none'}\n            className={'caret-transparent opacity-0 h-0 w-0 p-0 m-0'}\n            placeholder=\"Search ...\"\n          />\n\n          <CommandList>\n            <CommandEmpty>\n              <Typography variant={'body3'}>No items found</Typography>\n            </CommandEmpty>\n            <CommandGroup className=\"max-h-64 px-0 my-1 overflow-y-auto custom-scrollbar\">\n              {options.map((option) => (\n                <div className=\"py-0.5 px-1.5 bg-white\">\n                  <CommandItem\n                    key={option.value}\n                    className={`justify-between p-2 rounded-md text-light-2 ${selected.indexOf(option.value) !== -1 ? 'bg-light-2' : ''}`}\n                    onSelect={() => {\n                      onChange(\n                        selected.includes(option.value)\n                          ? selected.filter((item) => item !== option.value)\n                          : [...selected, option.value]\n                      )\n                      setOpen(true)\n                    }}\n                  >\n                    <Typography variant={'body2'}>{option.label}</Typography>\n                    <Check\n                      className={cn(\n                        'h-5 w-5 stroke-brand',\n                        selected.includes(option.value)\n                          ? 'opacity-100'\n                          : 'opacity-0'\n                      )}\n                    />\n                  </CommandItem>\n                </div>\n              ))}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nexport { MultiSelect }\n"],"names":["MultiSelect","options","selected","onChange","className","props","open","setOpen","React","popoverRef","handleUnselect","item","i","Popover","PopoverTrigger","Button","Badge","option","e","X","Typography","ChevronUp","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandEmpty","CommandGroup","CommandItem","Check","cn"],"mappings":"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"}
+{"version":3,"file":"index.es26.js","sources":["../src/components/molecules/multi-select/index.tsx"],"sourcesContent":["import * as React from 'react'\nimport { cn } from '@/lib/utils'\n\nimport { Check, X, ChevronDown, ChevronUp } from 'lucide-react'\nimport { Button } from '@/components/atoms/button'\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '@/components/unstyled/command/command'\nimport {\n  Popover,\n  PopoverContent,\n  PopoverTrigger,\n} from '@/components/unstyled/popover/popover-components'\nimport { Badge } from '@/components/atoms/badge'\nimport { Typography } from '../../atoms/typography'\nimport { MultiSelectProps } from './multi-select.types'\n\nfunction MultiSelect({\n  options,\n  selected,\n  onChange,\n  className,\n  ...props\n}: MultiSelectProps) {\n  const [open, setOpen] = React.useState(false)\n  const popoverRef = React.useRef<HTMLButtonElement>(null)\n\n  const handleUnselect = (item: string) => {\n    onChange(selected.filter((i) => i !== item))\n  }\n\n  return (\n    <Popover open={open} onOpenChange={setOpen} {...props}>\n      <PopoverTrigger\n        className={`min-h-[40px] h-fit px-3 py-2\n        ${open ? 'border-primary-2 ring-4 ring-primary-1' : 'border-neutral-2'}\n        focus:border-primary-2 focus:ring-0 focus:ring-primary-1`}\n        ref={popoverRef}\n        asChild\n      >\n        <Button\n          variant=\"secondary\"\n          role=\"combobox\"\n          aria-expanded={open}\n          className={`w-full justify-between focus:ring-0 `}\n          onClick={() => setOpen(!open)}\n        >\n          <div className=\"flex gap-1 flex-wrap\">\n            {selected.length > 0 ? (\n              selected.map((item) => {\n                const selectedItem = options.find(\n                  (option) => option.value === item\n                )\n                return (\n                  <Badge\n                    variant=\"default\"\n                    key={item}\n                    size={'sm'}\n                    //   className=\"mr-1 mb-1\"\n                    showBorder\n                    onClick={() => handleUnselect(item)}\n                  >\n                    <div className=\"flex items-center gap-1\">\n                      {selectedItem?.icon}\n                      {selectedItem?.label}\n                    </div>\n                    <button\n                      className=\"ml-1 ring-offset-background rounded-full outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\"\n                      onKeyDown={(e) => {\n                        if (e.key === 'Enter') {\n                          handleUnselect(item)\n                        }\n                      }}\n                      onMouseDown={(e) => {\n                        e.preventDefault()\n                        e.stopPropagation()\n                      }}\n                      onClick={(e) => {\n                        e.stopPropagation()\n                        handleUnselect(item)\n                      }}\n                    >\n                      <X className=\"h-3 w-3 text-muted-foreground hover:text-foreground\" />\n                    </button>\n                  </Badge>\n                )\n              })\n            ) : (\n              <Typography variant=\"body2\" className=\"text-light-4\">\n                Select option\n              </Typography>\n            )}\n          </div>\n          {!open ? (\n            <ChevronDown className=\"h-4 w-4 shrink-0 opacity-50\" />\n          ) : (\n            <ChevronUp className=\"h-4 w-4 shrink-0 opacity-50\" />\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent\n        style={{\n          width: popoverRef.current?.clientWidth,\n        }}\n        className=\"w-full p-0 bg-light-1\"\n        onEscapeKeyDown={() => setOpen(false)}\n      >\n        <Command className={className}>\n          <CommandInput\n            showIcon={false}\n            inputMode={'none'}\n            className={'caret-transparent opacity-0 h-0 w-0 p-0 m-0'}\n            placeholder=\"Search ...\"\n          />\n\n          <CommandList>\n            <CommandEmpty>\n              <Typography variant={'body3'}>No items found</Typography>\n            </CommandEmpty>\n            <CommandGroup className=\"max-h-64 px-0 my-1 overflow-y-auto custom-scrollbar\">\n              {options.map((option) => (\n                <div className=\"py-0.5 px-1.5 bg-white\">\n                  <CommandItem\n                    key={option.value}\n                    className={`justify-between p-2 rounded-md text-light-2 ${selected.indexOf(option.value) !== -1 ? 'bg-light-2' : ''}`}\n                    onSelect={() => {\n                      onChange(\n                        selected.includes(option.value)\n                          ? selected.filter((item) => item !== option.value)\n                          : [...selected, option.value]\n                      )\n                      setOpen(true)\n                    }}\n                  >\n                    <div className=\"flex items-center gap-1\">\n                      {option.icon}\n                      <Typography variant={'body2'}>{option.label}</Typography>\n                    </div>\n                    <Check\n                      className={cn(\n                        'h-5 w-5 stroke-brand',\n                        selected.includes(option.value)\n                          ? 'opacity-100'\n                          : 'opacity-0'\n                      )}\n                    />\n                  </CommandItem>\n                </div>\n              ))}\n            </CommandGroup>\n          </CommandList>\n        </Command>\n      </PopoverContent>\n    </Popover>\n  )\n}\n\nexport { MultiSelect }\n"],"names":["MultiSelect","options","selected","onChange","className","props","open","setOpen","React","popoverRef","handleUnselect","item","i","Popover","PopoverTrigger","Button","selectedItem","option","Badge","e","X","Typography","ChevronUp","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandEmpty","CommandGroup","CommandItem","Check","cn"],"mappings":"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"}