@trsys-tech/matrix-library 0.3.7 → 0.3.9

package/dist/badge.es.js

@@ -1,29 +1,34 @@
 import { jsx as o } from "react/jsx-runtime";
-import { tv as a } from "tailwind-variants";
-import { cn as t } from "./utils.es.js";
-const s = a({
-  base: "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+import { tv as t } from "tailwind-variants";
+import { cn as g } from "./utils.es.js";
+const a = t({
+  base: "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent",
   variants: {
     variant: {
-      primary: "border-transparent bg-primary text-primary-foreground hover:bg-primary-600",
-      secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary-600",
+      primary: "bg-primary text-primary-foreground hover:bg-primary-600",
+      secondary: "bg-secondary text-secondary-foreground hover:bg-secondary-600",
       outline: "border border-primary text-primary hover:bg-primary-50",
-      danger: "border-transparent bg-danger text-danger-foreground hover:bg-danger-600",
-      success: "border-transparent bg-success text-success-foreground hover:bg-success-600",
-      warning: "border-transparent bg-warning text-warning-foreground hover:bg-warning-600",
-      info: "border-transparent bg-info text-info-foreground hover:bg-info-600",
-      primaryInverse: "border-transparent bg-primary-100 text-primary-700 hover:bg-primary-50",
-      successInverse: "border-transparent bg-success-300 text-success-700 hover:bg-success-200",
-      dangerInverse: "border-transparent bg-danger-300 text-danger-700 hover:bg-danger-200",
-      warningInverse: "border-transparent bg-warning-300 text-warning-700 hover:bg-warning-200",
-      infoInverse: "border-transparent bg-info-300 text-info-700 hover:bg-info-200"
+      danger: "bg-danger text-danger-foreground hover:bg-danger-600",
+      success: "bg-success text-success-foreground hover:bg-success-600",
+      warning: "bg-warning text-warning-foreground hover:bg-warning-600",
+      info: "bg-info text-info-foreground hover:bg-info-600",
+      primaryInverse: "bg-primary-100 text-primary-700 hover:bg-primary-50",
+      successInverse: "bg-success-300 text-success-700 hover:bg-success-200",
+      dangerInverse: "bg-danger-300 text-danger-600 hover:bg-danger-200",
+      warningInverse: "bg-warning-300 text-warning-800 hover:bg-warning-200",
+      infoInverse: "bg-info-300 text-info-700 hover:bg-info-200",
+      purpleInverce: "bg-purple-200 text-purple-500 hover:bg-purple-100",
+      coralInverce: "bg-coral-300 text-coral-600 hover:bg-coral-200",
+      turquoiseInverce: "bg-turquoise-200 text-turquoise-600 hover:bg-turquoise-100",
+      limeInverce: "bg-lime-300 text-lime-700 hover:bg-lime-200",
+      grayInverce: "bg-gray-300 text-text-500 hover:bg-gray-200"
     }
   },
   defaultVariants: {
     variant: "primary"
   }
-}), d = ({ className: r, variant: e, ...n }) => /* @__PURE__ */ o("div", { className: t(s({ variant: e }), r), ...n });
+}), c = ({ className: r, variant: e, ...n }) => /* @__PURE__ */ o("div", { className: g(a({ variant: e }), r), ...n });
 export {
-  d as Badge
+  c as Badge
 };
 //# sourceMappingURL=badge.es.js.map

package/dist/badge.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"badge.es.js","sources":["../src/components/badge/Badge.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { tv, type VariantProps } from \"tailwind-variants\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nconst badgeVariants = tv({\r\n  base: \"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2\",\r\n  variants: {\r\n    variant: {\r\n      primary: \"border-transparent bg-primary text-primary-foreground hover:bg-primary-600\",\r\n      secondary: \"border-transparent bg-secondary text-secondary-foreground hover:bg-secondary-600\",\r\n      outline: \"border border-primary text-primary hover:bg-primary-50\",\r\n      danger: \"border-transparent bg-danger text-danger-foreground hover:bg-danger-600\",\r\n      success: \"border-transparent bg-success text-success-foreground hover:bg-success-600\",\r\n      warning: \"border-transparent bg-warning text-warning-foreground hover:bg-warning-600\",\r\n      info: \"border-transparent bg-info text-info-foreground hover:bg-info-600\",\r\n      primaryInverse: \"border-transparent bg-primary-100 text-primary-700 hover:bg-primary-50\",\r\n      successInverse: \"border-transparent bg-success-300 text-success-700 hover:bg-success-200\",\r\n      dangerInverse: \"border-transparent bg-danger-300 text-danger-700 hover:bg-danger-200\",\r\n      warningInverse: \"border-transparent bg-warning-300 text-warning-700 hover:bg-warning-200\",\r\n      infoInverse: \"border-transparent bg-info-300 text-info-700 hover:bg-info-200\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    variant: \"primary\",\r\n  },\r\n});\r\n\r\nexport type BadgeVariant = VariantProps<typeof badgeVariants>[\"variant\"];\r\n\r\ninterface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  variant?: BadgeVariant;\r\n}\r\n\r\nconst Badge: React.FC<BadgeProps> = ({ className, variant, ...props }) => {\r\n  return <div className={cn(badgeVariants({ variant }), className)} {...props} />;\r\n};\r\n\r\nexport { Badge, type BadgeProps };\r\n"],"names":["badgeVariants","tv","Badge","className","variant","props","jsx","cn"],"mappings":";;;AAOA,MAAMA,IAAgBC,EAAG;AAAA,EACvB,MAAM;AAAA,EACN,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,MACN,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,aAAa;AAAA,IAAA;AAAA,EAEjB;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EAAA;AAEb,CAAC,GAQKC,IAA8B,CAAC,EAAE,WAAAC,GAAW,SAAAC,GAAS,GAAGC,QACpD,gBAAAC,EAAA,OAAA,EAAI,WAAWC,EAAGP,EAAc,EAAE,SAAAI,EAAS,CAAA,GAAGD,CAAS,GAAI,GAAGE,EAAO,CAAA;"}
+{"version":3,"file":"badge.es.js","sources":["../src/components/badge/Badge.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport * as React from \"react\";\r\nimport { tv, type VariantProps } from \"tailwind-variants\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\n\r\nconst badgeVariants = tv({\r\n  base: \"inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent\",\r\n  variants: {\r\n    variant: {\r\n      primary: \"bg-primary text-primary-foreground hover:bg-primary-600\",\r\n      secondary: \"bg-secondary text-secondary-foreground hover:bg-secondary-600\",\r\n      outline: \"border border-primary text-primary hover:bg-primary-50\",\r\n      danger: \"bg-danger text-danger-foreground hover:bg-danger-600\",\r\n      success: \"bg-success text-success-foreground hover:bg-success-600\",\r\n      warning: \"bg-warning text-warning-foreground hover:bg-warning-600\",\r\n      info: \"bg-info text-info-foreground hover:bg-info-600\",\r\n      primaryInverse: \"bg-primary-100 text-primary-700 hover:bg-primary-50\",\r\n      successInverse: \"bg-success-300 text-success-700 hover:bg-success-200\",\r\n      dangerInverse: \"bg-danger-300 text-danger-600 hover:bg-danger-200\",\r\n      warningInverse: \"bg-warning-300 text-warning-800 hover:bg-warning-200\",\r\n      infoInverse: \"bg-info-300 text-info-700 hover:bg-info-200\",\r\n      purpleInverce: \"bg-purple-200 text-purple-500 hover:bg-purple-100\",\r\n      coralInverce: \"bg-coral-300 text-coral-600 hover:bg-coral-200\",\r\n      turquoiseInverce: \"bg-turquoise-200 text-turquoise-600 hover:bg-turquoise-100\",\r\n      limeInverce: \"bg-lime-300 text-lime-700 hover:bg-lime-200\",\r\n      grayInverce: \"bg-gray-300 text-text-500 hover:bg-gray-200\",\r\n    },\r\n  },\r\n  defaultVariants: {\r\n    variant: \"primary\",\r\n  },\r\n});\r\n\r\nexport type BadgeVariant = VariantProps<typeof badgeVariants>[\"variant\"];\r\n\r\ninterface BadgeProps extends React.HTMLAttributes<HTMLDivElement> {\r\n  variant?: BadgeVariant;\r\n}\r\n\r\nconst Badge: React.FC<BadgeProps> = ({ className, variant, ...props }) => {\r\n  return <div className={cn(badgeVariants({ variant }), className)} {...props} />;\r\n};\r\n\r\nexport { Badge, type BadgeProps };\r\n"],"names":["badgeVariants","tv","Badge","className","variant","props","jsx","cn"],"mappings":";;;AAOA,MAAMA,IAAgBC,EAAG;AAAA,EACvB,MAAM;AAAA,EACN,UAAU;AAAA,IACR,SAAS;AAAA,MACP,SAAS;AAAA,MACT,WAAW;AAAA,MACX,SAAS;AAAA,MACT,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,MAAM;AAAA,MACN,gBAAgB;AAAA,MAChB,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,gBAAgB;AAAA,MAChB,aAAa;AAAA,MACb,eAAe;AAAA,MACf,cAAc;AAAA,MACd,kBAAkB;AAAA,MAClB,aAAa;AAAA,MACb,aAAa;AAAA,IAAA;AAAA,EAEjB;AAAA,EACA,iBAAiB;AAAA,IACf,SAAS;AAAA,EAAA;AAEb,CAAC,GAQKC,IAA8B,CAAC,EAAE,WAAAC,GAAW,SAAAC,GAAS,GAAGC,QACpD,gBAAAC,EAAA,OAAA,EAAI,WAAWC,EAAGP,EAAc,EAAE,SAAAI,EAAS,CAAA,GAAGD,CAAS,GAAI,GAAGE,EAAO,CAAA;"}

package/dist/combobox.es.js

@@ -1,38 +1,42 @@
-import { jsxs as s, jsx as r } from "react/jsx-runtime";
-import t from "react";
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
+import t, { useEffect as E } from "react";
 import { cn as f } from "./utils.es.js";
 import { Button as j } from "./button.es.js";
-import { ChevronDown as D, Check as E } from "@trsys-tech/matrix-icons";
-import { Popover as K, PopoverTrigger as _, PopoverContent as B } from "./popover.es.js";
-import { Command as T, CommandInput as F, CommandList as G, CommandEmpty as R, CommandItem as b, CommandGroup as q } from "./command.es.js";
-const U = ({
-  onValueChange: l,
-  options: c,
-  selectedValue: i,
+import { ChevronDown as D, Check as K } from "@trsys-tech/matrix-icons";
+import { Popover as _, PopoverTrigger as B, PopoverContent as T } from "./popover.es.js";
+import { Command as F, CommandInput as G, CommandList as R, CommandEmpty as q, CommandItem as b, CommandGroup as z } from "./command.es.js";
+const W = ({
+  onValueChange: n,
+  options: i,
+  value: l,
   className: h,
-  closeOnSelect: n = !0,
-  loading: d,
-  disabled: v,
-  placeholder: w = "Select an option",
+  closeOnSelect: d = !0,
+  loading: s,
+  disabled: w,
+  placeholder: v = "Select an option",
   searchText: x = "Search...",
   noResultsText: y = "No results found",
   loadingText: g = "Loading...",
   emptyOptionsText: C = "No Items",
   ...k
 }) => {
-  const [u, o] = t.useState(!1), [a, m] = t.useState(i), N = t.useCallback(
+  const [u, o] = t.useState(!1), [a, m] = t.useState(l), N = t.useCallback(
     (e) => {
-      e.key === "Enter" ? o(!0) : e.key === "Backspace" && !e.currentTarget.value && (m(a), l?.(a), n && o(!1));
+      e.key === "Enter" ? o(!0) : e.key === "Backspace" && !e.currentTarget.value && (m(a), n?.(a), d && o(!1));
     },
-    [a, l, n]
+    [a, n, d]
   ), I = t.useCallback(
     (e) => {
-      m(e), l?.(e), n && o(!1);
+      m(e), n?.(e), d && o(!1);
     },
-    [l, n]
-  ), L = t.useCallback((e, P, S = [""]) => S.join("").toLocaleLowerCase().includes(P.toLocaleLowerCase()) ? 1 : 0, []), p = a === void 0 || a === "";
-  return /* @__PURE__ */ s(K, { open: u, onOpenChange: o, children: [
-    /* @__PURE__ */ r(_, { asChild: !0, children: /* @__PURE__ */ r(
+    [n, d]
+  ), L = t.useCallback((e, P, S = [""]) => S.join("").toLocaleLowerCase().includes(P.toLocaleLowerCase()) ? 1 : 0, []);
+  E(() => {
+    m(l);
+  }, [l]);
+  const p = a === void 0 || a === "";
+  return /* @__PURE__ */ c(_, { open: u, onOpenChange: o, children: [
+    /* @__PURE__ */ r(B, { asChild: !0, children: /* @__PURE__ */ r(
       j,
       {
         variant: "text",
@@ -45,8 +49,8 @@ const U = ({
         ),
         "data-value": a,
         "data-placeholder": p ? "" : void 0,
-        loading: d,
-        disabled: v,
+        loading: s,
+        disabled: w,
         endIcon: /* @__PURE__ */ r(
           D,
           {
@@ -56,15 +60,15 @@ const U = ({
           }
         ),
         ...k,
-        children: p ? d ? g : w : c.find((e) => e.value === a)?.label
+        children: p ? s ? g : v : i.find((e) => e.value === a)?.label
       }
     ) }),
-    /* @__PURE__ */ r(B, { className: "w-auto p-0", align: "start", onEscapeKeyDown: () => o(!1), children: /* @__PURE__ */ s(T, { className: "w-[--radix-popper-anchor-width]", filter: L, children: [
-      /* @__PURE__ */ r(F, { placeholder: x, onKeyDown: N }),
-      /* @__PURE__ */ s(G, { children: [
-        !d && /* @__PURE__ */ r(R, { children: y }),
-        !d && !c.length ? /* @__PURE__ */ r(b, { value: "8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee7564623", disabled: !0, children: C }) : null,
-        /* @__PURE__ */ r(q, { children: c.map((e) => /* @__PURE__ */ s(
+    /* @__PURE__ */ r(T, { className: "w-auto p-0", align: "start", onEscapeKeyDown: () => o(!1), children: /* @__PURE__ */ c(F, { className: "w-[--radix-popper-anchor-width]", filter: L, children: [
+      /* @__PURE__ */ r(G, { placeholder: x, onKeyDown: N }),
+      /* @__PURE__ */ c(R, { children: [
+        !s && /* @__PURE__ */ r(q, { children: y }),
+        !s && !i.length ? /* @__PURE__ */ r(b, { value: "8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee7564623", disabled: !0, children: C }) : null,
+        /* @__PURE__ */ r(z, { children: i.map((e) => /* @__PURE__ */ c(
           b,
           {
             value: e.value,
@@ -72,7 +76,7 @@ const U = ({
             onSelect: I,
             children: [
               e.label,
-              /* @__PURE__ */ r(E, { className: f("ml-auto", i === e.value ? "opacity-100" : "opacity-0") })
+              /* @__PURE__ */ r(K, { className: f("ml-auto", l === e.value ? "opacity-100" : "opacity-0") })
             ]
           },
           String(e.value)
@@ -82,6 +86,6 @@ const U = ({
   ] });
 };
 export {
-  U as Combobox
+  W as Combobox
 };
 //# sourceMappingURL=combobox.es.js.map

package/dist/combobox.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"combobox.es.js","sources":["../src/components/combobox/Combobox.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Check, ChevronDown } from \"@trsys-tech/matrix-icons\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from \"../command/Command\";\r\n\r\ntype ComboboxProps<T extends string | number> = React.HTMLAttributes<HTMLButtonElement> & {\r\n  /**\r\n   * The options to display in the combobox.\r\n   * Each option should have a label and a value.\r\n   * The label is what is displayed in the combobox.\r\n   * The value is what is returned when the option is selected.\r\n   */\r\n  options: { label: string; value: T }[];\r\n\r\n  /**\r\n   * The value of the combobox.\r\n   */\r\n  selectedValue?: T;\r\n\r\n  /**\r\n   * A function that is called when the value of the combobox changes.\r\n   */\r\n  onValueChange?: (value: T) => void;\r\n\r\n  /**\r\n   * Placeholder text to be displayed when no values are selected.\r\n   * @default \"Select an option\"\r\n   */\r\n  placeholder?: string;\r\n\r\n  /**\r\n   * The modality of the popover. When set to true, interaction with outside elements\r\n   * will be disabled and only popover content will be visible to screen readers.\r\n   * Optional\r\n   * @default false\r\n   */\r\n  modalPopover?: boolean;\r\n\r\n  /**\r\n   * The text to display in the search input.\r\n   * @default \"Search...\"\r\n   */\r\n  searchText?: string;\r\n\r\n  /**\r\n   * The text to display when no results are found.\r\n   * @default \"No results found\"\r\n   */\r\n  noResultsText?: string;\r\n\r\n  /**\r\n   * Whether the popover should close when an option is selected.\r\n   * @default true\r\n   */\r\n  closeOnSelect?: boolean;\r\n\r\n  /**\r\n   * Whether the combobox is loading.\r\n   * @default false\r\n   */\r\n  loading?: boolean;\r\n\r\n  /**\r\n   * Whether the combobox is disabled.\r\n   * @default false\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * The text to display when the combobox is loading.\r\n   * @default \"Loading...\"\r\n   */\r\n  loadingText?: string;\r\n\r\n  /**\r\n   * The text to display when there are no options.\r\n   * @default \"No Items\"\r\n   */\r\n  emptyOptionsText?: string;\r\n};\r\n\r\nconst Combobox = <T extends string | number>({\r\n  onValueChange,\r\n  options,\r\n  selectedValue,\r\n  className,\r\n  closeOnSelect = true,\r\n  loading,\r\n  disabled,\r\n  placeholder = \"Select an option\",\r\n  searchText = \"Search...\",\r\n  noResultsText = \"No results found\",\r\n  loadingText = \"Loading...\",\r\n  emptyOptionsText = \"No Items\",\r\n  ...props\r\n}: ComboboxProps<T>) => {\r\n  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);\r\n\r\n  const [currentSelectedValue, setCurrentSelectedValue] = React.useState<T | undefined>(selectedValue);\r\n\r\n  const handleInputKeyDown = React.useCallback(\r\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n      if (event.key === \"Enter\") {\r\n        setIsPopoverOpen(true);\r\n      } else if (event.key === \"Backspace\" && !event.currentTarget.value) {\r\n        setCurrentSelectedValue(currentSelectedValue);\r\n        onValueChange?.(currentSelectedValue!);\r\n        if (closeOnSelect) setIsPopoverOpen(false);\r\n      }\r\n    },\r\n    [currentSelectedValue, onValueChange, closeOnSelect],\r\n  );\r\n\r\n  const handleSelect = React.useCallback(\r\n    (currentValue: T) => {\r\n      setCurrentSelectedValue(currentValue);\r\n      onValueChange?.(currentValue);\r\n      if (closeOnSelect) setIsPopoverOpen(false);\r\n    },\r\n    [onValueChange, closeOnSelect],\r\n  );\r\n\r\n  const handleFilter = React.useCallback((value: string, search: string, keywords: string[] = [\"\"]) => {\r\n    return keywords.join(\"\").toLocaleLowerCase().includes(search.toLocaleLowerCase()) ? 1 : 0;\r\n  }, []);\r\n\r\n  const showPlaceholder = currentSelectedValue === undefined || currentSelectedValue === \"\";\r\n\r\n  return (\r\n    <Popover open={isPopoverOpen} onOpenChange={setIsPopoverOpen}>\r\n      <PopoverTrigger asChild>\r\n        <Button\r\n          variant=\"text\"\r\n          role=\"combobox\"\r\n          aria-expanded={isPopoverOpen}\r\n          className={cn(\r\n            \"group flex h-8 w-full items-center justify-between whitespace-nowrap rounded-sm border border-input bg-transparent px-3 py-1.5 text-sm ring-offset-background data-[placeholder]:text-muted-foreground hover:border hover:border-primary hover:bg-transparent focus:border focus:border-primary focus:outline-none focus:ring focus:ring-primary-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-text-300 disabled:border-gray-100 [&>span]:line-clamp-1 [&_svg]:disabled:text-text-300\",\r\n            // showPlaceholder ? \"text-muted-foreground\" : \"\",\r\n            className,\r\n          )}\r\n          data-value={currentSelectedValue}\r\n          data-placeholder={showPlaceholder ? \"\" : undefined}\r\n          loading={loading}\r\n          disabled={disabled}\r\n          endIcon={\r\n            <ChevronDown\r\n              role=\"button\"\r\n              aria-label=\"Expand dropdown\"\r\n              className=\"!h-4.5 !w-4.5 cursor-pointer group-data-[state=open]:rotate-180 transition-transform ms-auto\"\r\n            />\r\n          }\r\n          {...props}\r\n        >\r\n          {!showPlaceholder ? options.find(option => option.value === currentSelectedValue)?.label : loading ? loadingText : placeholder}\r\n        </Button>\r\n      </PopoverTrigger>\r\n      <PopoverContent className=\"w-auto p-0\" align=\"start\" onEscapeKeyDown={() => setIsPopoverOpen(false)}>\r\n        <Command className=\"w-[--radix-popper-anchor-width]\" filter={handleFilter}>\r\n          <CommandInput placeholder={searchText} onKeyDown={handleInputKeyDown} />\r\n          <CommandList>\r\n            {!loading && <CommandEmpty>{noResultsText}</CommandEmpty>}\r\n            {!loading && !options.length ? (\r\n              <CommandItem value=\"8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee7564623\" disabled>\r\n                {emptyOptionsText}\r\n              </CommandItem>\r\n            ) : null}\r\n            <CommandGroup>\r\n              {options.map(option => (\r\n                <CommandItem\r\n                  key={String(option.value)}\r\n                  value={option.value}\r\n                  keywords={[option.label]}\r\n                  onSelect={handleSelect as React.ComponentProps<typeof CommandItem>[\"onSelect\"]}\r\n                >\r\n                  {option.label}\r\n                  <Check className={cn(\"ml-auto\", selectedValue === option.value ? \"opacity-100\" : \"opacity-0\")} />\r\n                </CommandItem>\r\n              ))}\r\n            </CommandGroup>\r\n          </CommandList>\r\n        </Command>\r\n      </PopoverContent>\r\n    </Popover>\r\n  );\r\n};\r\nexport { Combobox, type ComboboxProps };\r\n"],"names":["Combobox","onValueChange","options","selectedValue","className","closeOnSelect","loading","disabled","placeholder","searchText","noResultsText","loadingText","emptyOptionsText","props","isPopoverOpen","setIsPopoverOpen","React","currentSelectedValue","setCurrentSelectedValue","handleInputKeyDown","event","handleSelect","currentValue","handleFilter","value","search","keywords","showPlaceholder","jsxs","Popover","jsx","PopoverTrigger","Button","cn","ChevronDown","option","PopoverContent","Command","CommandInput","CommandList","CommandEmpty","CommandItem","CommandGroup","Check"],"mappings":"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"}
+{"version":3,"file":"combobox.es.js","sources":["../src/components/combobox/Combobox.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { useEffect } from \"react\";\r\n\r\nimport { cn } from \"../../lib/utils\";\r\nimport { Button } from \"../button/Button\";\r\nimport { Check, ChevronDown } from \"@trsys-tech/matrix-icons\";\r\nimport { Popover, PopoverContent, PopoverTrigger } from \"../popover/Popover\";\r\nimport { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList } from \"../command/Command\";\r\n\r\ntype ComboboxProps<T extends string | number> = React.HTMLAttributes<HTMLButtonElement> & {\r\n  /**\r\n   * The options to display in the combobox.\r\n   * Each option should have a label and a value.\r\n   * The label is what is displayed in the combobox.\r\n   * The value is what is returned when the option is selected.\r\n   */\r\n  options: { label: string; value: T }[];\r\n\r\n  /**\r\n   * The value of the combobox.\r\n   */\r\n  value?: T;\r\n\r\n  /**\r\n   * A function that is called when the value of the combobox changes.\r\n   */\r\n  onValueChange?: (value: T) => void;\r\n\r\n  /**\r\n   * Placeholder text to be displayed when no values are selected.\r\n   * @default \"Select an option\"\r\n   */\r\n  placeholder?: string;\r\n\r\n  /**\r\n   * The modality of the popover. When set to true, interaction with outside elements\r\n   * will be disabled and only popover content will be visible to screen readers.\r\n   * Optional\r\n   * @default false\r\n   */\r\n  modalPopover?: boolean;\r\n\r\n  /**\r\n   * The text to display in the search input.\r\n   * @default \"Search...\"\r\n   */\r\n  searchText?: string;\r\n\r\n  /**\r\n   * The text to display when no results are found.\r\n   * @default \"No results found\"\r\n   */\r\n  noResultsText?: string;\r\n\r\n  /**\r\n   * Whether the popover should close when an option is selected.\r\n   * @default true\r\n   */\r\n  closeOnSelect?: boolean;\r\n\r\n  /**\r\n   * Whether the combobox is loading.\r\n   * @default false\r\n   */\r\n  loading?: boolean;\r\n\r\n  /**\r\n   * Whether the combobox is disabled.\r\n   * @default false\r\n   */\r\n  disabled?: boolean;\r\n\r\n  /**\r\n   * The text to display when the combobox is loading.\r\n   * @default \"Loading...\"\r\n   */\r\n  loadingText?: string;\r\n\r\n  /**\r\n   * The text to display when there are no options.\r\n   * @default \"No Items\"\r\n   */\r\n  emptyOptionsText?: string;\r\n};\r\n\r\nconst Combobox = <T extends string | number>({\r\n  onValueChange,\r\n  options,\r\n  value,\r\n  className,\r\n  closeOnSelect = true,\r\n  loading,\r\n  disabled,\r\n  placeholder = \"Select an option\",\r\n  searchText = \"Search...\",\r\n  noResultsText = \"No results found\",\r\n  loadingText = \"Loading...\",\r\n  emptyOptionsText = \"No Items\",\r\n  ...props\r\n}: ComboboxProps<T>) => {\r\n  const [isPopoverOpen, setIsPopoverOpen] = React.useState(false);\r\n\r\n  const [currentSelectedValue, setCurrentSelectedValue] = React.useState<T | undefined>(value);\r\n\r\n  const handleInputKeyDown = React.useCallback(\r\n    (event: React.KeyboardEvent<HTMLInputElement>) => {\r\n      if (event.key === \"Enter\") {\r\n        setIsPopoverOpen(true);\r\n      } else if (event.key === \"Backspace\" && !event.currentTarget.value) {\r\n        setCurrentSelectedValue(currentSelectedValue);\r\n        onValueChange?.(currentSelectedValue!);\r\n        if (closeOnSelect) setIsPopoverOpen(false);\r\n      }\r\n    },\r\n    [currentSelectedValue, onValueChange, closeOnSelect],\r\n  );\r\n\r\n  const handleSelect = React.useCallback(\r\n    (currentValue: T) => {\r\n      setCurrentSelectedValue(currentValue);\r\n      onValueChange?.(currentValue);\r\n      if (closeOnSelect) setIsPopoverOpen(false);\r\n    },\r\n    [onValueChange, closeOnSelect],\r\n  );\r\n\r\n  const handleFilter = React.useCallback((value: string, search: string, keywords: string[] = [\"\"]) => {\r\n    return keywords.join(\"\").toLocaleLowerCase().includes(search.toLocaleLowerCase()) ? 1 : 0;\r\n  }, []);\r\n\r\n  useEffect(() => {\r\n    setCurrentSelectedValue(value);\r\n  }, [value]);\r\n\r\n  const showPlaceholder = currentSelectedValue === undefined || currentSelectedValue === \"\";\r\n\r\n  return (\r\n    <Popover open={isPopoverOpen} onOpenChange={setIsPopoverOpen}>\r\n      <PopoverTrigger asChild>\r\n        <Button\r\n          variant=\"text\"\r\n          role=\"combobox\"\r\n          aria-expanded={isPopoverOpen}\r\n          className={cn(\r\n            \"group flex h-8 w-full items-center justify-between whitespace-nowrap rounded-sm border border-input bg-transparent px-3 py-1.5 text-sm ring-offset-background data-[placeholder]:text-muted-foreground hover:border hover:border-primary hover:bg-transparent focus:border focus:border-primary focus:outline-none focus:ring focus:ring-primary-100 disabled:cursor-not-allowed disabled:bg-gray-100 disabled:text-text-300 disabled:border-gray-100 [&>span]:line-clamp-1 [&_svg]:disabled:text-text-300\",\r\n            // showPlaceholder ? \"text-muted-foreground\" : \"\",\r\n            className,\r\n          )}\r\n          data-value={currentSelectedValue}\r\n          data-placeholder={showPlaceholder ? \"\" : undefined}\r\n          loading={loading}\r\n          disabled={disabled}\r\n          endIcon={\r\n            <ChevronDown\r\n              role=\"button\"\r\n              aria-label=\"Expand dropdown\"\r\n              className=\"!h-4.5 !w-4.5 cursor-pointer group-data-[state=open]:rotate-180 transition-transform ms-auto\"\r\n            />\r\n          }\r\n          {...props}\r\n        >\r\n          {!showPlaceholder ? options.find(option => option.value === currentSelectedValue)?.label : loading ? loadingText : placeholder}\r\n        </Button>\r\n      </PopoverTrigger>\r\n      <PopoverContent className=\"w-auto p-0\" align=\"start\" onEscapeKeyDown={() => setIsPopoverOpen(false)}>\r\n        <Command className=\"w-[--radix-popper-anchor-width]\" filter={handleFilter}>\r\n          <CommandInput placeholder={searchText} onKeyDown={handleInputKeyDown} />\r\n          <CommandList>\r\n            {!loading && <CommandEmpty>{noResultsText}</CommandEmpty>}\r\n            {!loading && !options.length ? (\r\n              <CommandItem value=\"8fdcaeb67c8ad943c80fe54c3b1059b700d9254389a38a4a1fc39a6eee7564623\" disabled>\r\n                {emptyOptionsText}\r\n              </CommandItem>\r\n            ) : null}\r\n            <CommandGroup>\r\n              {options.map(option => (\r\n                <CommandItem\r\n                  key={String(option.value)}\r\n                  value={option.value}\r\n                  keywords={[option.label]}\r\n                  onSelect={handleSelect as React.ComponentProps<typeof CommandItem>[\"onSelect\"]}\r\n                >\r\n                  {option.label}\r\n                  <Check className={cn(\"ml-auto\", value === option.value ? \"opacity-100\" : \"opacity-0\")} />\r\n                </CommandItem>\r\n              ))}\r\n            </CommandGroup>\r\n          </CommandList>\r\n        </Command>\r\n      </PopoverContent>\r\n    </Popover>\r\n  );\r\n};\r\nexport { Combobox, type ComboboxProps };\r\n"],"names":["Combobox","onValueChange","options","value","className","closeOnSelect","loading","disabled","placeholder","searchText","noResultsText","loadingText","emptyOptionsText","props","isPopoverOpen","setIsPopoverOpen","React","currentSelectedValue","setCurrentSelectedValue","handleInputKeyDown","event","handleSelect","currentValue","handleFilter","search","keywords","useEffect","showPlaceholder","jsxs","Popover","jsx","PopoverTrigger","Button","cn","ChevronDown","option","PopoverContent","Command","CommandInput","CommandList","CommandEmpty","CommandItem","CommandGroup","Check"],"mappings":"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"}

package/dist/components/badge/Badge.d.ts

@@ -15,8 +15,13 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
-}, undefined, "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", TVConfig<{
+}, undefined, "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent", TVConfig<{
     variant: {
         primary: string;
         secondary: string;
@@ -30,6 +35,11 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
 }, {
     variant: {
@@ -45,6 +55,11 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
 }>, {
     variant: {
@@ -60,6 +75,11 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
 }, undefined, TVReturnType<{
     variant: {
@@ -75,8 +95,13 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
-}, undefined, "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2", TVConfig<{
+}, undefined, "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 border-transparent", TVConfig<{
     variant: {
         primary: string;
         secondary: string;
@@ -90,6 +115,11 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
 }, {
     variant: {
@@ -105,6 +135,11 @@ declare const badgeVariants: TVReturnType<{
         dangerInverse: string;
         warningInverse: string;
         infoInverse: string;
+        purpleInverce: string;
+        coralInverce: string;
+        turquoiseInverce: string;
+        limeInverce: string;
+        grayInverce: string;
     };
 }>, unknown, unknown, undefined>>;
 export type BadgeVariant = VariantProps<typeof badgeVariants>["variant"];

package/dist/components/badge/Badge.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCAqBjB,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC,SAAS,CAAC,CAAC;AAEzE,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/D,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAE/B,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}
+{"version":3,"file":"Badge.d.ts","sourceRoot":"","sources":["../../../src/components/badge/Badge.tsx"],"names":[],"mappings":";AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAM,KAAK,YAAY,EAAE,MAAM,mBAAmB,CAAC;AAI1D,QAAA,MAAM,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;iCA0BjB,CAAC;AAEH,MAAM,MAAM,YAAY,GAAG,YAAY,CAAC,OAAO,aAAa,CAAC,CAAC,SAAS,CAAC,CAAC;AAEzE,UAAU,UAAW,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IAC/D,OAAO,CAAC,EAAE,YAAY,CAAC;CACxB;AAED,QAAA,MAAM,KAAK,EAAE,KAAK,CAAC,EAAE,CAAC,UAAU,CAE/B,CAAC;AAEF,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,CAAC"}

package/dist/components/combobox/Combobox.d.ts

@@ -13,7 +13,7 @@ type ComboboxProps<T extends string | number> = React.HTMLAttributes<HTMLButtonE
     /**
      * The value of the combobox.
      */
-    selectedValue?: T;
+    value?: T;
     /**
      * A function that is called when the value of the combobox changes.
      */
@@ -66,6 +66,6 @@ type ComboboxProps<T extends string | number> = React.HTMLAttributes<HTMLButtonE
      */
     emptyOptionsText?: string;
 };
-declare const Combobox: <T extends string | number>({ onValueChange, options, selectedValue, className, closeOnSelect, loading, disabled, placeholder, searchText, noResultsText, loadingText, emptyOptionsText, ...props }: ComboboxProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const Combobox: <T extends string | number>({ onValueChange, options, value, className, closeOnSelect, loading, disabled, placeholder, searchText, noResultsText, loadingText, emptyOptionsText, ...props }: ComboboxProps<T>) => import("react/jsx-runtime").JSX.Element;
 export { Combobox, type ComboboxProps };
 //# sourceMappingURL=Combobox.d.ts.map

package/dist/components/combobox/Combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/Combobox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,KAAK,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACxF;;;;;OAKG;IACH,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,CAAC,CAAA;KAAE,EAAE,CAAC;IAEvC;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,CAAC;IAElB;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAEnC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,QAAQ,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,2KAcxC,aAAa,CAAC,CAAC,CAAC,4CAyFlB,CAAC;AACF,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,CAAC"}
+{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../../src/components/combobox/Combobox.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAoB,MAAM,OAAO,CAAC;AAQzC,KAAK,aAAa,CAAC,CAAC,SAAS,MAAM,GAAG,MAAM,IAAI,KAAK,CAAC,cAAc,CAAC,iBAAiB,CAAC,GAAG;IACxF;;;;;OAKG;IACH,OAAO,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,CAAC,CAAA;KAAE,EAAE,CAAC;IAEvC;;OAEG;IACH,KAAK,CAAC,EAAE,CAAC,CAAC;IAEV;;OAEG;IACH,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IAEnC;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;;;OAKG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;;OAGG;IACH,gBAAgB,CAAC,EAAE,MAAM,CAAC;CAC3B,CAAC;AAEF,QAAA,MAAM,QAAQ,GAAI,CAAC,SAAS,MAAM,GAAG,MAAM,mKAcxC,aAAa,CAAC,CAAC,CAAC,4CA6FlB,CAAC;AACF,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,CAAC"}

package/dist/formcombobox.es.js

@@ -1,57 +1,57 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { FormField as f, FormItem as C, FormLabel as P, FormControl as V, FormMessage as j } from "./form.es.js";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
+import { FormField as f, FormItem as C, FormLabel as P, FormControl as j, FormMessage as v } from "./form.es.js";
 import { Combobox as I } from "./combobox.es.js";
-const q = (t) => {
+const V = (s) => {
   const {
-    name: n,
+    name: t,
     control: m,
     defaultValue: a,
     disabled: o,
     rules: d,
     shouldUnregister: i,
     label: p,
-    options: c,
-    loading: u,
+    options: u,
+    loading: c,
     loadingText: g,
     emptyOptionsText: x,
     placeholder: b,
     slotProps: r,
     required: h,
     ...F
-  } = t;
+  } = s;
   return /* @__PURE__ */ e(
     f,
     {
       control: m,
-      name: n,
+      name: t,
       defaultValue: a,
       disabled: o,
       rules: d,
       shouldUnregister: i,
-      render: ({ field: l }) => /* @__PURE__ */ s(C, { ...F, children: [
-        /* @__PURE__ */ s(P, { ...r?.formLabelProps ?? {}, children: [
+      render: ({ field: l }) => /* @__PURE__ */ n(C, { ...F, children: [
+        /* @__PURE__ */ n(P, { ...r?.formLabelProps ?? {}, children: [
           p,
           h && /* @__PURE__ */ e("span", { className: "text-danger text-sm leading-4", children: "*" })
         ] }),
-        /* @__PURE__ */ e(V, { children: /* @__PURE__ */ e(
+        /* @__PURE__ */ e(j, { children: /* @__PURE__ */ e(
           I,
           {
-            options: c,
-            selectedValue: l.value,
+            options: u,
+            value: l.value,
             onValueChange: l.onChange,
-            loading: u,
+            loading: c,
             loadingText: g,
             emptyOptionsText: x,
             placeholder: b,
             disabled: o
           }
         ) }),
-        /* @__PURE__ */ e(j, { ...r?.formMessageProps ?? {} })
+        /* @__PURE__ */ e(v, { ...r?.formMessageProps ?? {} })
       ] })
     }
   );
 };
 export {
-  q as FormCombobox
+  V as FormCombobox
 };
 //# sourceMappingURL=formcombobox.es.js.map

package/dist/formcombobox.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"formcombobox.es.js","sources":["../src/components/form-combobox/FormCombobox.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { Combobox } from \"../combobox/Combobox\";\r\n\r\ntype FormComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n  ControllerProps<TFieldValues, TName>,\r\n  \"render\"\r\n> &\r\n  React.ComponentProps<typeof FormItem> & {\r\n    label: string;\r\n    options: { value: string | number; label: string }[];\r\n    loading?: boolean;\r\n    loadingText?: string;\r\n    emptyOptionsText?: string;\r\n    placeholder?: string;\r\n    required?: boolean;\r\n    slotProps?: {\r\n      formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n      formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n      comboboxProps?: React.ComponentProps<typeof Combobox>;\r\n    };\r\n  };\r\n\r\nconst FormCombobox = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n  props: FormComboboxProps<TFieldValues, TName>,\r\n) => {\r\n  const {\r\n    name,\r\n    control,\r\n    defaultValue,\r\n    disabled,\r\n    rules,\r\n    shouldUnregister,\r\n    label,\r\n    options,\r\n    loading,\r\n    loadingText,\r\n    emptyOptionsText,\r\n    placeholder,\r\n    slotProps,\r\n    required,\r\n    ...formItemProps\r\n  } = props;\r\n\r\n  return (\r\n    <FormField\r\n      control={control}\r\n      name={name}\r\n      defaultValue={defaultValue}\r\n      disabled={disabled}\r\n      rules={rules}\r\n      shouldUnregister={shouldUnregister}\r\n      render={({ field }) => {\r\n        return (\r\n          <FormItem {...formItemProps}>\r\n            <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n              {label}\r\n              {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n            </FormLabel>\r\n            <FormControl>\r\n              <Combobox\r\n                options={options}\r\n                selectedValue={field.value}\r\n                onValueChange={field.onChange}\r\n                loading={loading}\r\n                loadingText={loadingText}\r\n                emptyOptionsText={emptyOptionsText}\r\n                placeholder={placeholder}\r\n                disabled={disabled}\r\n              />\r\n            </FormControl>\r\n\r\n            <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n          </FormItem>\r\n        );\r\n      }}\r\n    />\r\n  );\r\n};\r\nexport { FormCombobox, type FormComboboxProps };\r\n"],"names":["FormCombobox","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","options","loading","loadingText","emptyOptionsText","placeholder","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Combobox","FormMessage"],"mappings":";;;AA0BM,MAAAA,IAAe,CACnBC,MACG;AACG,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,aAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDf;AAGF,SAAA,gBAAAgB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAf;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAY,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAN;AAAA,UACAO,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCM,GACC,EAAA,UAAA,gBAAAN;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,SAAAf;AAAA,YACA,eAAeU,EAAM;AAAA,YACrB,eAAeA,EAAM;AAAA,YACrB,SAAAT;AAAA,YACA,aAAAC;AAAA,YACA,kBAAAC;AAAA,YACA,aAAAC;AAAA,YACA,UAAAR;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,0BAECoB,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"formcombobox.es.js","sources":["../src/components/form-combobox/FormCombobox.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport { ControllerProps, FieldPath, FieldValues } from \"react-hook-form\";\r\n\r\nimport { FormControl, FormField, FormItem, FormLabel, FormMessage } from \"../form/Form\";\r\nimport { Combobox } from \"../combobox/Combobox\";\r\n\r\ntype FormComboboxProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>> = Omit<\r\n  ControllerProps<TFieldValues, TName>,\r\n  \"render\"\r\n> &\r\n  React.ComponentProps<typeof FormItem> & {\r\n    label: string;\r\n    options: { value: string | number; label: string }[];\r\n    loading?: boolean;\r\n    loadingText?: string;\r\n    emptyOptionsText?: string;\r\n    placeholder?: string;\r\n    required?: boolean;\r\n    slotProps?: {\r\n      formLabelProps?: React.HTMLAttributes<HTMLLabelElement> & React.RefAttributes<HTMLLabelElement>;\r\n      formMessageProps?: React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>;\r\n      comboboxProps?: React.ComponentProps<typeof Combobox>;\r\n    };\r\n  };\r\n\r\nconst FormCombobox = <TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>(\r\n  props: FormComboboxProps<TFieldValues, TName>,\r\n) => {\r\n  const {\r\n    name,\r\n    control,\r\n    defaultValue,\r\n    disabled,\r\n    rules,\r\n    shouldUnregister,\r\n    label,\r\n    options,\r\n    loading,\r\n    loadingText,\r\n    emptyOptionsText,\r\n    placeholder,\r\n    slotProps,\r\n    required,\r\n    ...formItemProps\r\n  } = props;\r\n\r\n  return (\r\n    <FormField\r\n      control={control}\r\n      name={name}\r\n      defaultValue={defaultValue}\r\n      disabled={disabled}\r\n      rules={rules}\r\n      shouldUnregister={shouldUnregister}\r\n      render={({ field }) => {\r\n        return (\r\n          <FormItem {...formItemProps}>\r\n            <FormLabel {...(slotProps?.formLabelProps ?? {})}>\r\n              {label}\r\n              {required && <span className=\"text-danger text-sm leading-4\">*</span>}\r\n            </FormLabel>\r\n            <FormControl>\r\n              <Combobox\r\n                options={options}\r\n                value={field.value}\r\n                onValueChange={field.onChange}\r\n                loading={loading}\r\n                loadingText={loadingText}\r\n                emptyOptionsText={emptyOptionsText}\r\n                placeholder={placeholder}\r\n                disabled={disabled}\r\n              />\r\n            </FormControl>\r\n\r\n            <FormMessage {...(slotProps?.formMessageProps ?? {})} />\r\n          </FormItem>\r\n        );\r\n      }}\r\n    />\r\n  );\r\n};\r\nexport { FormCombobox, type FormComboboxProps };\r\n"],"names":["FormCombobox","props","name","control","defaultValue","disabled","rules","shouldUnregister","label","options","loading","loadingText","emptyOptionsText","placeholder","slotProps","required","formItemProps","jsx","FormField","field","jsxs","FormItem","FormLabel","FormControl","Combobox","FormMessage"],"mappings":";;;AA0BM,MAAAA,IAAe,CACnBC,MACG;AACG,QAAA;AAAA,IACJ,MAAAC;AAAA,IACA,SAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,OAAAC;AAAA,IACA,SAAAC;AAAA,IACA,SAAAC;AAAA,IACA,aAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,WAAAC;AAAA,IACA,UAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,IACDf;AAGF,SAAA,gBAAAgB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,SAAAf;AAAA,MACA,MAAAD;AAAA,MACA,cAAAE;AAAA,MACA,UAAAC;AAAA,MACA,OAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,QAAQ,CAAC,EAAE,OAAAY,QAEP,gBAAAC,EAACC,GAAU,EAAA,GAAGL,GACZ,UAAA;AAAA,QAAA,gBAAAI,EAACE,GAAW,EAAA,GAAIR,GAAW,kBAAkB,CAC1C,GAAA,UAAA;AAAA,UAAAN;AAAA,UACAO,KAAY,gBAAAE,EAAC,QAAK,EAAA,WAAU,iCAAgC,UAAC,IAAA,CAAA;AAAA,QAAA,GAChE;AAAA,0BACCM,GACC,EAAA,UAAA,gBAAAN;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,SAAAf;AAAA,YACA,OAAOU,EAAM;AAAA,YACb,eAAeA,EAAM;AAAA,YACrB,SAAAT;AAAA,YACA,aAAAC;AAAA,YACA,kBAAAC;AAAA,YACA,aAAAC;AAAA,YACA,UAAAR;AAAA,UAAA;AAAA,QAAA,GAEJ;AAAA,0BAECoB,GAAa,EAAA,GAAIX,GAAW,oBAAoB,CAAA,EAAK,CAAA;AAAA,MAAA,GACxD;AAAA,IAEJ;AAAA,EACF;AAEJ;"}