@oneplatformdev/ui 0.1.99-beta.202 → 0.1.99-beta.204

package/CHANGELOG.md

@@ -1,3 +1,27 @@
+## 0.1.99-beta.204 (2026-02-18)
+
+### 🚀 Features
+
+- **Combobox:** add `listFooterActionProps` for customizable footer styles and attributes ([6c917f0](https://github.com/oneplatformdev/core-web/commit/6c917f0))
+
+### 🧱 Updated Dependencies
+
+- Updated @oneplatformdev/utils to 0.1.99-beta.204
+- Updated @oneplatformdev/hooks to 0.1.99-beta.204
+- Updated @oneplatformdev/tokens to 0.1.99-beta.204
+
+### ❤️ Thank You
+
+- Bohdan Radchenko
+
+## 0.1.99-beta.203 (2026-02-18)
+
+### 🧱 Updated Dependencies
+
+- Updated @oneplatformdev/utils to 0.1.99-beta.203
+- Updated @oneplatformdev/hooks to 0.1.99-beta.203
+- Updated @oneplatformdev/tokens to 0.1.99-beta.203
+
 ## 0.1.99-beta.202 (2026-02-18)
 
 ### 🚀 Features

package/Combobox/Combobox.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAuBA,OAAO,EAGL,aAAa,EACd,MAAM,kBAAkB,CAAC;AAqB1B,eAAO,MAAM,QAAQ,GAAI,IAAI,SAAS,MAAM,EAAI,OAAO,aAAa,CAAC,IAAI,CAAC,4CA4RzE,CAAA"}
+{"version":3,"file":"Combobox.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.tsx"],"names":[],"mappings":"AAuBA,OAAO,EAGL,aAAa,EACd,MAAM,kBAAkB,CAAC;AAqB1B,eAAO,MAAM,QAAQ,GAAI,IAAI,SAAS,MAAM,EAAI,OAAO,aAAa,CAAC,IAAI,CAAC,4CA4SzE,CAAA"}

package/Combobox/Combobox.js

@@ -1,227 +1,241 @@
-import { jsx as e, jsxs as c, Fragment as R } from "react/jsx-runtime";
-import { useState as d, useCallback as f, useEffect as le, useMemo as G, useLayoutEffect as ce } from "react";
-import { LoadingMask as _ } from "../LoadingMask/LoadingMask.js";
+import { jsx as t, jsxs as d, Fragment as W } from "react/jsx-runtime";
+import { useState as p, useCallback as m, useEffect as de, useMemo as q, useLayoutEffect as pe } from "react";
+import { LoadingMask as K } from "../LoadingMask/LoadingMask.js";
 import "../LoadingMask/RenderLoadingMask.js";
-import { Popover as de, PopoverTrigger as pe, PopoverContent as fe } from "../Popover/Popover.js";
-import { Button as me } from "../Button/Button.js";
+import { Popover as fe, PopoverTrigger as me, PopoverContent as ue } from "../Popover/Popover.js";
+import { Button as he } from "../Button/Button.js";
 import "../Button/buttonVariants.js";
-import { Command as ue, CommandInput as he, CommandList as ge, CommandGroup as be, CommandEmpty as J, CommandItem as ye } from "../Command/Command.js";
-import { cn as I } from "@oneplatformdev/utils";
-import { useDebounceCallback as ve } from "@oneplatformdev/hooks";
-import { X as Ce, ChevronDown as xe } from "lucide-react";
-import { ComboboxOptions as we } from "./ComboboxOptions.js";
-const Ne = (k) => {
-  const { value: n, flattenOptions: D = [], selectedOption: M } = k;
+import { Command as ge, CommandInput as be, CommandList as ye, CommandGroup as ve, CommandEmpty as Q, CommandItem as xe } from "../Command/Command.js";
+import { cn as x } from "@oneplatformdev/utils";
+import { useDebounceCallback as Ce } from "@oneplatformdev/hooks";
+import { X as we, ChevronDown as Ne } from "lucide-react";
+import { ComboboxOptions as Oe } from "./ComboboxOptions.js";
+const Se = (P) => {
+  const { value: n, flattenOptions: k = [], selectedOption: D } = P;
   if (!n) return "No value for render label";
-  const C = [D.find((m) => String(m.value).toLowerCase() === String(n).toLowerCase()), M].filter(Boolean).map((m) => m.label).find(Boolean);
+  const C = [k.find((u) => String(u.value).toLowerCase() === String(n).toLowerCase()), D].filter(Boolean).map((u) => u.label).find(Boolean);
   return C || n;
-}, Be = (k) => {
+}, Re = (P) => {
   const {
     value: n,
-    onChange: D,
-    placeholder: M,
-    disabled: W,
+    onChange: k,
+    placeholder: D,
+    disabled: z,
     searchLabel: C = "Type to search...",
-    fetchOptions: m,
-    options: P,
-    emptyLabel: q = "No options",
-    emptyAction: x,
-    commandInputAction: E,
-    listHeadAction: w,
-    listFooterAction: N,
-    onMount: T,
-    defaultNodeDisabled: K,
-    defaultNodeMatched: Q,
-    defaultNodeMuted: Y,
-    defaultNodeInteractive: Z,
-    renderTrigger: u
-  } = k, [O, z] = d(!1), [a, j] = d(!1), [i, A] = d(""), [h, B] = d(), [o, p] = d(!1), [r, $] = d([]), [ee, te] = d([]), g = f((t) => {
-    const y = (F) => {
-      const l = [], X = (S) => {
-        if (S)
-          for (const v of S)
-            l.push(v), v.items && v.items.length && X(v.items);
+    fetchOptions: u,
+    options: M,
+    emptyLabel: H = "No options",
+    emptyAction: w,
+    commandInputAction: A,
+    listHeadAction: N,
+    listFooterAction: O,
+    listFooterActionProps: E,
+    onMount: F,
+    defaultNodeDisabled: Y,
+    defaultNodeMatched: Z,
+    defaultNodeMuted: $,
+    defaultNodeInteractive: ee,
+    renderTrigger: h,
+    renderList: T
+  } = P, [S, J] = p(!1), [i, j] = p(!1), [s, B] = p(""), [g, R] = p(), [o, f] = p(!1), [r, te] = p([]), [ne, oe] = p([]), b = m((e) => {
+    const l = (G) => {
+      const c = [], _ = (L) => {
+        if (L)
+          for (const v of L)
+            c.push(v), v.items && v.items.length && _(v.items);
       };
-      X(F), te((S) => {
-        if (!l.find((L) => !!n && String(L.value) === String(n))) {
-          const L = h || S.find((se) => !!n && String(se.value) === String(n));
-          if (L) return [L, ...l];
+      _(G), oe((L) => {
+        if (!c.find((I) => !!n && String(I.value) === String(n))) {
+          const I = g || L.find((ce) => !!n && String(ce.value) === String(n));
+          if (I) return [I, ...c];
         }
-        return l;
+        return c;
       });
     };
-    $((F) => {
-      const l = typeof t == "function" ? t(F) : t;
-      return y(l), l;
+    te((G) => {
+      const c = typeof e == "function" ? e(G) : e;
+      return l(c), c;
     });
-  }, [h, n]);
-  le(() => {
-    P?.length && g(P);
-  }, [P]);
-  const ne = async () => {
-    a || (H(), A(""));
-  }, H = f(async (t) => {
-    p(!0);
+  }, [g, n]);
+  de(() => {
+    M?.length && b(M);
+  }, [M]);
+  const re = async () => {
+    i || (U(), B(""));
+  }, U = m(async (e) => {
+    f(!0);
     try {
-      const y = await m(t);
-      g(y);
-    } catch (y) {
-      console.error("Unexpected error while get option:", y);
+      const l = await u(e);
+      b(l);
+    } catch (l) {
+      console.error("Unexpected error while get option:", l);
     } finally {
-      p(!1);
+      f(!1);
     }
-  }, [g]), oe = ve(H, 1e3, {
+  }, [b]), ae = Ce(U, 1e3, {
     leading: !1,
     trailing: !0
-  }), re = f((t) => {
-    p(!0), A(t), oe(t);
-  }, []), U = f((t) => {
-    D(t.value), B(t), p(!1);
-  }, []), ae = f(() => {
-    U({ value: "", label: "" }), B(void 0), p(!1);
-  }, []), V = G(() => !!i && !r.length && !o, [o, r.length, i]), b = G(() => !r.length && !o, [o, r.length, i]), s = G(() => ({
+  }), ie = m((e) => {
+    f(!0), B(e), ae(e);
+  }, []), V = m((e) => {
+    k(e.value), R(e), f(!1);
+  }, []), se = m(() => {
+    V({ value: "", label: "" }), R(void 0), f(!1);
+  }, []), X = q(() => !!s && !r.length && !o, [o, r.length, s]), y = q(() => !r.length && !o, [o, r.length, s]), a = q(() => ({
     options: r,
-    setOptions: g,
-    selectedOption: h,
-    setSelectedOption: B,
-    search: i || "",
-    setSearch: A,
-    open: a,
+    setOptions: b,
+    selectedOption: g,
+    setSelectedOption: R,
+    search: s || "",
+    setSearch: B,
+    open: i,
     setOpen: j,
     loading: o,
-    setLoading: p,
-    isEmptyList: b,
-    isSearchedEmptyList: V
-  }), [o, a, r, i, h, b, V, g]), ie = f(async () => {
-    if (T) {
-      z(!0);
+    setLoading: f,
+    isEmptyList: y,
+    isSearchedEmptyList: X
+  }), [o, i, r, s, g, y, X, b]), le = m(async () => {
+    if (F) {
+      J(!0);
       try {
-        await T(s);
+        await F(a);
       } finally {
-        z(!1);
+        J(!1);
       }
     }
-  }, [T, s]);
-  return ce(() => {
-    ie();
-  }, []), /* @__PURE__ */ e("div", { className: "w-full", children: /* @__PURE__ */ c(
-    de,
+  }, [F, a]);
+  return pe(() => {
+    le();
+  }, []), /* @__PURE__ */ t("div", { className: "w-full", children: /* @__PURE__ */ d(
+    fe,
     {
-      open: a,
-      onOpenChange: (t) => {
-        j(t), t && ne();
+      open: i,
+      onOpenChange: (e) => {
+        j(e), e && re();
       },
       children: [
-        /* @__PURE__ */ e(pe, { asChild: !0, className: "border-input", children: /* @__PURE__ */ c(
-          me,
+        /* @__PURE__ */ t(me, { asChild: !0, className: "border-input", children: /* @__PURE__ */ d(
+          he,
           {
             color: "secondary",
             role: "combobox",
-            "aria-expanded": a,
-            className: I(
+            "aria-expanded": i,
+            className: x(
               "relative w-full justify-between font-normal text-sm bg-transparent",
               "border border-border",
-              a && "border-2 outline-hidden ring-1 ring-ring",
+              i && "border-2 outline-hidden ring-1 ring-ring",
               "focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring",
-              u && "p-0",
-              u && a && "p-0 border-1 ring-0 ring-transparent"
+              h && "p-0",
+              h && i && "p-0 border-1 ring-0 ring-transparent"
             ),
-            disabled: W || O,
+            disabled: z || S,
             children: [
-              O && /* @__PURE__ */ e(_, { fullWidth: !0 }),
-              !O && u && u(s),
-              !O && !u && /* @__PURE__ */ c(R, { children: [
-                /* @__PURE__ */ e(
+              S && /* @__PURE__ */ t(K, { fullWidth: !0 }),
+              !S && h && h(a),
+              !S && !h && /* @__PURE__ */ d(W, { children: [
+                /* @__PURE__ */ t(
                   "span",
                   {
                     className: "truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap",
-                    children: n ? Ne({ value: n, flattenOptions: ee, selectedOption: h }) : /* @__PURE__ */ e("span", { className: "text-gray-400", children: M })
+                    children: n ? Se({ value: n, flattenOptions: ne, selectedOption: g }) : /* @__PURE__ */ t("span", { className: "text-gray-400", children: D })
                   }
                 ),
-                n ? /* @__PURE__ */ e(
+                n ? /* @__PURE__ */ t(
                   "div",
                   {
-                    className: I(
+                    className: x(
                       "absolute top-0 right-1",
                       "flex items-center justify-center",
                       "w-9 aspect-square [&_svg]:size-5",
                       "opacity-50 cursor-pointer hover:opacity-100"
                     ),
-                    onClick: (t) => {
-                      t.stopPropagation(), ae();
+                    onClick: (e) => {
+                      e.stopPropagation(), se();
                     },
-                    children: /* @__PURE__ */ e(Ce, {})
+                    children: /* @__PURE__ */ t(we, {})
                   }
-                ) : /* @__PURE__ */ e(xe, { className: "opacity-50 w-4 h-4" })
+                ) : /* @__PURE__ */ t(Ne, { className: "opacity-50 w-4 h-4" })
               ] })
             ]
           }
         ) }),
-        /* @__PURE__ */ e(
-          fe,
+        /* @__PURE__ */ t(
+          ue,
           {
-            className: I(
+            className: x(
               "w-(--radix-popper-anchor-width) max-w-none p-2",
               "-translate-y-3"
             ),
             align: "start",
-            children: /* @__PURE__ */ c(ue, { shouldFilter: !1, children: [
-              /* @__PURE__ */ e(
-                he,
+            children: /* @__PURE__ */ d(ge, { shouldFilter: !1, children: [
+              /* @__PURE__ */ t(
+                be,
                 {
                   placeholder: C,
-                  value: i,
-                  onValueChange: re
+                  value: s,
+                  onValueChange: ie
                 }
               ),
-              typeof E == "function" ? E(s) : E,
-              /* @__PURE__ */ e(ge, { children: /* @__PURE__ */ c(
-                be,
+              typeof A == "function" ? A(a) : A,
+              /* @__PURE__ */ t(ye, { children: /* @__PURE__ */ d(
+                ve,
                 {
-                  className: I(
+                  className: x(
                     !r.length && "p-0 shadow-none",
                     "px-0 py-2"
                   ),
                   children: [
-                    o && /* @__PURE__ */ e(_, { fullWidth: !0 }),
-                    !o && b && /* @__PURE__ */ e(R, { children: x ? /* @__PURE__ */ c(J, { className: "flex flex-col gap-3 py-5 px-3 items-center", children: [
-                      /* @__PURE__ */ e("span", { children: q }),
-                      typeof x == "function" ? x(s) : x
-                    ] }) : /* @__PURE__ */ e(J, { children: q }) }),
-                    !o && !b && /* @__PURE__ */ c(R, { children: [
-                      w && /* @__PURE__ */ e(
-                        ye,
+                    o && /* @__PURE__ */ t(K, { fullWidth: !0 }),
+                    !o && y && /* @__PURE__ */ t(W, { children: w ? /* @__PURE__ */ d(Q, { className: "flex flex-col gap-3 py-5 px-3 items-center", children: [
+                      /* @__PURE__ */ t("span", { children: H }),
+                      typeof w == "function" ? w(a) : w
+                    ] }) : /* @__PURE__ */ t(Q, { children: H }) }),
+                    !o && !y && /* @__PURE__ */ d(W, { children: [
+                      N && /* @__PURE__ */ t(
+                        xe,
                         {
                           asChild: !0,
                           className: "w-full",
-                          children: typeof w == "function" ? w(s) : w
+                          children: typeof N == "function" ? N(a) : N
                         },
                         "combobox-list-head-action"
                       ),
-                      /* @__PURE__ */ e(
-                        we,
+                      T && T(a),
+                      !T && /* @__PURE__ */ t(
+                        Oe,
                         {
-                          searchTerm: i,
+                          searchTerm: s,
                           value: n,
                           options: r,
-                          onChangeOption: U,
+                          onChangeOption: V,
                           setOpen: j,
-                          defaultNodeDisabled: K,
-                          defaultNodeMatched: Q,
-                          defaultNodeMuted: Y,
-                          defaultNodeInteractive: Z
+                          defaultNodeDisabled: Y,
+                          defaultNodeMatched: Z,
+                          defaultNodeMuted: $,
+                          defaultNodeInteractive: ee
                         }
                       )
                     ] })
                   ]
                 }
               ) }),
-              !o && N && !b && /* @__PURE__ */ e(
+              !o && O && !y && /* @__PURE__ */ t(
                 "div",
                 {
                   "data-slot": "command-footer-wrapper",
-                  className: "flex w-full min-h-9 items-center gap-2 border-t px-3",
-                  children: typeof N == "function" ? N(s) : N
+                  ...(() => {
+                    const { bordered: e = !0, ...l } = E || {};
+                    return {
+                      ...l,
+                      "data-slot-bordered": JSON.stringify(e)
+                    };
+                  })(),
+                  className: x(
+                    "flex w-full min-h-10 items-center gap-2 px-0",
+                    (E?.bordered ?? !0) && "border-t px-0 pt-2 min-h-12",
+                    E?.className
+                  ),
+                  children: typeof O == "function" ? O(a) : O
                 }
               )
             ] })
@@ -232,6 +246,6 @@ const Ne = (k) => {
   ) });
 };
 export {
-  Be as Combobox
+  Re as Combobox
 };
 //# sourceMappingURL=Combobox.js.map

package/Combobox/Combobox.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  Dispatch,\n  SetStateAction,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { LoadingMask } from '../LoadingMask';\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\nimport { Button } from '../Button';\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../Command';\nimport { cn } from '@oneplatformdev/utils';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport { ChevronDown, X } from 'lucide-react';\nimport {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps,\n} from './Combobox.types';\nimport { ComboboxOptions } from './ComboboxOptions';\n\n// TODO: refactor next component | nlt code\nconst getSelectRenderLabel = <Data extends object>(params: {\n  value: ComboboxProps<Data>['value'];\n  flattenOptions: ComboboxOption<Data>[];\n  selectedOption?: ComboboxOption<Data>;\n}): string => {\n  const { value, flattenOptions = [], selectedOption } = params;\n  if (!value) return 'No value for render label';\n  const flattenedOption = flattenOptions.find(o => String(o.value).toLowerCase() === String(value).toLowerCase());\n  const label = [ flattenedOption, selectedOption ]\n    .filter(Boolean)\n    .map(o => o!.label)\n    .find(Boolean);\n  if (!label) return value;\n  return label;\n}\n\n// TODO: refactor next component | nlt code\nexport const Combobox = <Data extends object, >(props: ComboboxProps<Data>) => {\n  const {\n    value,\n    onChange,\n    placeholder,\n    disabled,\n    searchLabel = 'Type to search...',\n    fetchOptions,\n    options: itemOptions,\n    emptyLabel = 'No options',\n    emptyAction,\n    commandInputAction,\n    listHeadAction,\n    listFooterAction,\n    onMount,\n    defaultNodeDisabled,\n    defaultNodeMatched,\n    defaultNodeMuted,\n    defaultNodeInteractive,\n    renderTrigger,\n  } = props;\n  const [ initialLoading, setInitialLoading ] = useState(false);\n  const [ open, setOpen ] = useState(false);\n  const [ searchTerm, setSearchTerm ] = useState('');\n  const [ selectedOption, setSelectedOption ] = useState<ComboboxOption<Data>>();\n  const [ loading, setLoading ] = useState(false);\n\n  const [ options, setOptionsDispatch ] = useState<ComboboxOption<Data>[]>([]);\n  const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n    const flatten = (next: ComboboxOption<Data>[]) => {\n      const res: ComboboxOption<Data>[] = [];\n      const walk = (nodes?: ComboboxOption<Data>[]) => {\n        if (!nodes) return;\n        for (const node of nodes) {\n          res.push(node);\n          if (node.items && node.items.length) walk(node.items);\n        }\n      };\n      walk(next);\n      setFlattenOptions((prev) => {\n        const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n        if (!isIncludedInRes) {\n          const current = selectedOption || prev.find(o => !!value && String(o.value) === String(value))\n          if (current) return [ current, ...res ];\n        }\n\n        return res;\n      });\n    }\n    setOptionsDispatch((prev) => {\n      const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n      flatten(next);\n      return next;\n    });\n  }, [ selectedOption, value ])\n\n  useEffect(() => {\n    itemOptions?.length && setOptions(itemOptions);\n  }, [ itemOptions ]);\n\n  const handlePopoverOpen = async () => {\n    if (!open) {\n      void getData();\n      setSearchTerm('');\n    }\n  };\n\n  const getData = useCallback(async (search?: string) => {\n    setLoading(true);\n    try {\n      const fetchedOptions = await fetchOptions(search);\n      setOptions(fetchedOptions);\n    } catch (error) {\n      console.error('Unexpected error while get option:', error);\n    } finally {\n      setLoading(false);\n    }\n  }, [ setOptions ]);\n\n  const debouncedGetData = useDebounceCallback(getData, 1000, {\n    leading: false,\n    trailing: true,\n  });\n\n  const handleSearchChange = useCallback((value: string) => {\n    setLoading(true);\n    setSearchTerm(value);\n    debouncedGetData(value);\n  }, []);\n\n  const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n    onChange(option.value);\n    setSelectedOption(option);\n    setLoading(false);\n  }, []);\n\n  const handleClearSelection = useCallback(() => {\n    onChangeOption({ value: '', label: '' });\n    setSelectedOption(undefined);\n    setLoading(false);\n  }, []);\n\n  const isSearchedEmptyList = useMemo(() => {\n    return Boolean(searchTerm) && !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const isEmptyList = useMemo(() => {\n    return !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const comboboxCallbackStateParams =\n    useMemo((): ComboboxCallbackStateParams<Data> => {\n      return {\n        options,\n        setOptions,\n        selectedOption,\n        setSelectedOption,\n        search: searchTerm || '',\n        setSearch: setSearchTerm,\n        open,\n        setOpen,\n        loading,\n        setLoading,\n        isEmptyList,\n        isSearchedEmptyList,\n      };\n    }, [ loading, open, options, searchTerm, selectedOption, isEmptyList, isSearchedEmptyList, setOptions ]);\n\n  const runOnMount = useCallback(async () => {\n    if (!onMount) return;\n    setInitialLoading(true);\n    try {\n      await onMount(comboboxCallbackStateParams);\n    } finally {\n      setInitialLoading(false);\n    }\n  }, [ onMount, comboboxCallbackStateParams ]);\n\n  useLayoutEffect(() => {\n    runOnMount();\n  }, []);\n\n  return (\n    <div className=\"w-full\">\n      <Popover\n        open={open}\n        onOpenChange={(newOpen) => {\n          setOpen(newOpen);\n          if (newOpen) handlePopoverOpen();\n        }}\n      >\n        <PopoverTrigger asChild className=\"border-input\">\n          <Button\n            color='secondary'\n            role=\"combobox\"\n            aria-expanded={open}\n            className={cn(\n              'relative w-full justify-between font-normal text-sm bg-transparent',\n              'border border-border',\n              open && 'border-2 outline-hidden ring-1 ring-ring',\n              'focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring',\n              renderTrigger && 'p-0',\n              renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\n            )}\n            disabled={disabled || initialLoading}\n          >\n            {initialLoading && <LoadingMask fullWidth/>}\n            {!initialLoading && renderTrigger && renderTrigger(comboboxCallbackStateParams)}\n            {!initialLoading && !renderTrigger && (\n              <>\n                  <span\n                    className=\"truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap\">\n                    {value\n                      ? getSelectRenderLabel({ value, flattenOptions, selectedOption })\n                      : <span className=\"text-gray-400\">{placeholder}</span>\n                    }\n                  </span>\n                {value ? (\n                  <div\n                    className={cn(\n                      'absolute top-0 right-1',\n                      'flex items-center justify-center',\n                      'w-9 aspect-square [&_svg]:size-5',\n                      'opacity-50 cursor-pointer hover:opacity-100'\n                    )}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      handleClearSelection();\n                    }}\n                  >\n                    <X/>\n                  </div>\n                ) : (\n                  <ChevronDown className=\"opacity-50 w-4 h-4\"/>\n                )}\n              </>\n            )}\n          </Button>\n        </PopoverTrigger>\n        <PopoverContent\n          className={cn(\n            \"w-(--radix-popper-anchor-width) max-w-none p-2\",\n            '-translate-y-3',\n          )}\n          align=\"start\"\n        >\n          <Command shouldFilter={false}>\n            <CommandInput\n              placeholder={searchLabel}\n              value={searchTerm}\n              onValueChange={handleSearchChange}\n            />\n            {typeof commandInputAction === 'function'\n              ? commandInputAction(comboboxCallbackStateParams)\n              : commandInputAction}\n            <CommandList>\n              <CommandGroup\n                className={cn(\n                  !options.length && 'p-0 shadow-none',\n                  'px-0 py-2',\n                )}\n              >\n                {loading && <LoadingMask fullWidth/>}\n                {!loading && isEmptyList && (\n                  <>\n                    {emptyAction ? (\n                      <CommandEmpty className=\"flex flex-col gap-3 py-5 px-3 items-center\">\n                        <span>{emptyLabel}</span>\n                        {typeof emptyAction === 'function'\n                          ? emptyAction(comboboxCallbackStateParams)\n                          : emptyAction}\n                      </CommandEmpty>\n                    ) : (\n                      <CommandEmpty>{emptyLabel}</CommandEmpty>\n                    )}\n                  </>\n                )}\n                {!loading && !isEmptyList && (\n                  <>\n                    {listHeadAction && (\n                      <CommandItem\n                        key='combobox-list-head-action'\n                        asChild\n                        className='w-full'\n                      >\n                        {typeof listHeadAction === 'function'\n                          ? listHeadAction(comboboxCallbackStateParams)\n                          : listHeadAction}\n                      </CommandItem>\n                    )}\n                    <ComboboxOptions\n                      searchTerm={searchTerm}\n                      value={value}\n                      options={options}\n                      onChangeOption={onChangeOption}\n                      setOpen={setOpen}\n                      defaultNodeDisabled={defaultNodeDisabled}\n                      defaultNodeMatched={defaultNodeMatched}\n                      defaultNodeMuted={defaultNodeMuted}\n                      defaultNodeInteractive={defaultNodeInteractive}\n                    />\n                  </>\n                )}\n              </CommandGroup>\n            </CommandList>\n\n            {/*LIST FOOTER ACTION*/}\n            {!loading && listFooterAction && !isEmptyList && (\n              <div\n                data-slot=\"command-footer-wrapper\"\n                className=\"flex w-full min-h-9 items-center gap-2 border-t px-3\"\n              >\n                {typeof listFooterAction === 'function'\n                  ? listFooterAction(comboboxCallbackStateParams)\n                  : listFooterAction}\n              </div>\n            )}\n          </Command>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n}\n"],"names":["getSelectRenderLabel","params","value","flattenOptions","selectedOption","label","o","Combobox","props","onChange","placeholder","disabled","searchLabel","fetchOptions","itemOptions","emptyLabel","emptyAction","commandInputAction","listHeadAction","listFooterAction","onMount","defaultNodeDisabled","defaultNodeMatched","defaultNodeMuted","defaultNodeInteractive","renderTrigger","initialLoading","setInitialLoading","useState","open","setOpen","searchTerm","setSearchTerm","setSelectedOption","loading","setLoading","options","setOptionsDispatch","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","handleClearSelection","isSearchedEmptyList","useMemo","isEmptyList","comboboxCallbackStateParams","runOnMount","useLayoutEffect","jsx","jsxs","Popover","newOpen","PopoverTrigger","Button","cn","LoadingMask","Fragment","e","X","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandGroup","CommandEmpty","CommandItem","ComboboxOptions"],"mappings":";;;;;;;;;;;;AA+BA,MAAMA,KAAuB,CAAsBC,MAIrC;AACZ,QAAM,EAAE,OAAAC,GAAO,gBAAAC,IAAiB,CAAA,GAAI,gBAAAC,MAAmBH;AACvD,MAAI,CAACC,EAAO,QAAO;AAEnB,QAAMG,IAAQ,CADUF,EAAe,KAAK,CAAAG,MAAK,OAAOA,EAAE,KAAK,EAAE,YAAA,MAAkB,OAAOJ,CAAK,EAAE,aAAa,GAC7EE,CAAe,EAC7C,OAAO,OAAO,EACd,IAAI,CAAAE,MAAKA,EAAG,KAAK,EACjB,KAAK,OAAO;AACf,SAAKD,KAAcH;AAErB,GAGaK,KAAW,CAAwBC,MAA+B;AAC7E,QAAM;AAAA,IACJ,OAAAN;AAAA,IACA,UAAAO;AAAA,IACA,aAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,IACd,cAAAC;AAAA,IACA,SAASC;AAAA,IACT,YAAAC,IAAa;AAAA,IACb,aAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,SAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,eAAAC;AAAA,EAAA,IACEjB,GACE,CAAEkB,GAAgBC,CAAkB,IAAIC,EAAS,EAAK,GACtD,CAAEC,GAAMC,CAAQ,IAAIF,EAAS,EAAK,GAClC,CAAEG,GAAYC,CAAc,IAAIJ,EAAS,EAAE,GAC3C,CAAExB,GAAgB6B,CAAkB,IAAIL,EAAA,GACxC,CAAEM,GAASC,CAAW,IAAIP,EAAS,EAAK,GAExC,CAAEQ,GAASC,CAAmB,IAAIT,EAAiC,CAAA,CAAE,GACrE,CAAEzB,IAAgBmC,EAAkB,IAAIV,EAAiC,CAAA,CAAE,GAC3EW,IAA+DC,EAAY,CAACC,MAAW;AAC3F,UAAMC,IAAU,CAACC,MAAiC;AAChD,YAAMC,IAA8B,CAAA,GAC9BC,IAAO,CAACC,MAAmC;AAC/C,YAAKA;AACL,qBAAWC,KAAQD;AACjB,YAAAF,EAAI,KAAKG,CAAI,GACTA,EAAK,SAASA,EAAK,MAAM,UAAQF,EAAKE,EAAK,KAAK;AAAA,MAExD;AACA,MAAAF,EAAKF,CAAI,GACTL,GAAkB,CAACU,MAAS;AAG1B,YAAI,CAFoBJ,EAAI,KAAK,CAAAtC,MAAK,CAAC,CAACJ,KAAS,OAAOI,EAAE,KAAK,MAAM,OAAOJ,CAAK,CAAC,GAE5D;AACpB,gBAAM+C,IAAU7C,KAAkB4C,EAAK,KAAK,QAAK,CAAC,CAAC9C,KAAS,OAAOI,GAAE,KAAK,MAAM,OAAOJ,CAAK,CAAC;AAC7F,cAAI+C,EAAS,QAAO,CAAEA,GAAS,GAAGL,CAAI;AAAA,QACxC;AAEA,eAAOA;AAAA,MACT,CAAC;AAAA,IACH;AACA,IAAAP,EAAmB,CAACW,MAAS;AAC3B,YAAML,IAA+B,OAAOF,KAAW,aAAaA,EAAOO,CAAI,IAAIP;AACnF,aAAAC,EAAQC,CAAI,GACLA;AAAA,IACT,CAAC;AAAA,EACH,GAAG,CAAEvC,GAAgBF,CAAM,CAAC;AAE5B,EAAAgD,GAAU,MAAM;AACd,IAAApC,GAAa,UAAUyB,EAAWzB,CAAW;AAAA,EAC/C,GAAG,CAAEA,CAAY,CAAC;AAElB,QAAMqC,KAAoB,YAAY;AACpC,IAAKtB,MACEuB,EAAA,GACLpB,EAAc,EAAE;AAAA,EAEpB,GAEMoB,IAAUZ,EAAY,OAAOa,MAAoB;AACrD,IAAAlB,EAAW,EAAI;AACf,QAAI;AACF,YAAMmB,IAAiB,MAAMzC,EAAawC,CAAM;AAChD,MAAAd,EAAWe,CAAc;AAAA,IAC3B,SAASC,GAAO;AACd,cAAQ,MAAM,sCAAsCA,CAAK;AAAA,IAC3D,UAAA;AACE,MAAApB,EAAW,EAAK;AAAA,IAClB;AAAA,EACF,GAAG,CAAEI,CAAW,CAAC,GAEXiB,KAAmBC,GAAoBL,GAAS,KAAM;AAAA,IAC1D,SAAS;AAAA,IACT,UAAU;AAAA,EAAA,CACX,GAEKM,KAAqBlB,EAAY,CAACtC,MAAkB;AACxD,IAAAiC,EAAW,EAAI,GACfH,EAAc9B,CAAK,GACnBsD,GAAiBtD,CAAK;AAAA,EACxB,GAAG,CAAA,CAAE,GAECyD,IAAiBnB,EAAY,CAACoB,MAAiC;AACnE,IAAAnD,EAASmD,EAAO,KAAK,GACrB3B,EAAkB2B,CAAM,GACxBzB,EAAW,EAAK;AAAA,EAClB,GAAG,CAAA,CAAE,GAEC0B,KAAuBrB,EAAY,MAAM;AAC7C,IAAAmB,EAAe,EAAE,OAAO,IAAI,OAAO,IAAI,GACvC1B,EAAkB,MAAS,GAC3BE,EAAW,EAAK;AAAA,EAClB,GAAG,CAAA,CAAE,GAEC2B,IAAsBC,EAAQ,MAC3B,EAAQhC,KAAe,CAACK,EAAQ,UAAU,CAACF,GACjD,CAAEA,GAASE,EAAQ,QAAQL,CAAW,CAAC,GAEpCiC,IAAcD,EAAQ,MACnB,CAAC3B,EAAQ,UAAU,CAACF,GAC1B,CAAEA,GAASE,EAAQ,QAAQL,CAAW,CAAC,GAEpCkC,IACJF,EAAQ,OACC;AAAA,IACL,SAAA3B;AAAA,IACA,YAAAG;AAAA,IACA,gBAAAnC;AAAA,IACA,mBAAA6B;AAAA,IACA,QAAQF,KAAc;AAAA,IACtB,WAAWC;AAAA,IACX,MAAAH;AAAA,IACA,SAAAC;AAAA,IACA,SAAAI;AAAA,IACA,YAAAC;AAAA,IACA,aAAA6B;AAAA,IACA,qBAAAF;AAAA,EAAA,IAED,CAAE5B,GAASL,GAAMO,GAASL,GAAY3B,GAAgB4D,GAAaF,GAAqBvB,CAAW,CAAC,GAEnG2B,KAAa1B,EAAY,YAAY;AACzC,QAAKpB,GACL;AAAA,MAAAO,EAAkB,EAAI;AACtB,UAAI;AACF,cAAMP,EAAQ6C,CAA2B;AAAA,MAC3C,UAAA;AACE,QAAAtC,EAAkB,EAAK;AAAA,MACzB;AAAA;AAAA,EACF,GAAG,CAAEP,GAAS6C,CAA4B,CAAC;AAE3C,SAAAE,GAAgB,MAAM;AACpB,IAAAD,GAAA;AAAA,EACF,GAAG,CAAA,CAAE,GAGH,gBAAAE,EAAC,OAAA,EAAI,WAAU,UACb,UAAA,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAzC;AAAA,MACA,cAAc,CAAC0C,MAAY;AACzB,QAAAzC,EAAQyC,CAAO,GACXA,KAASpB,GAAA;AAAA,MACf;AAAA,MAEA,UAAA;AAAA,QAAA,gBAAAiB,EAACI,IAAA,EAAe,SAAO,IAAC,WAAU,gBAChC,UAAA,gBAAAH;AAAA,UAACI;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,MAAK;AAAA,YACL,iBAAe5C;AAAA,YACf,WAAW6C;AAAA,cACT;AAAA,cACA;AAAA,cACA7C,KAAQ;AAAA,cACR;AAAA,cACAJ,KAAiB;AAAA,cACjBA,KAAiBI,KAAQ;AAAA,YAAA;AAAA,YAE3B,UAAUlB,KAAYe;AAAA,YAErB,UAAA;AAAA,cAAAA,KAAkB,gBAAA0C,EAACO,KAAY,WAAS,GAAA,CAAA;AAAA,cACxC,CAACjD,KAAkBD,KAAiBA,EAAcwC,CAA2B;AAAA,cAC7E,CAACvC,KAAkB,CAACD,KACnB,gBAAA4C,EAAAO,GAAA,EACI,UAAA;AAAA,gBAAA,gBAAAR;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAU;AAAA,oBACT,UAAAlE,IACGF,GAAqB,EAAE,OAAAE,GAAO,gBAAAC,IAAgB,gBAAAC,EAAA,CAAgB,IAC9D,gBAAAgE,EAAC,QAAA,EAAK,WAAU,iBAAiB,UAAA1D,EAAA,CAAY;AAAA,kBAAA;AAAA,gBAAA;AAAA,gBAGpDR,IACC,gBAAAkE;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAWM;AAAA,sBACT;AAAA,sBACA;AAAA,sBACA;AAAA,sBACA;AAAA,oBAAA;AAAA,oBAEF,SAAS,CAACG,MAAM;AACd,sBAAAA,EAAE,gBAAA,GACFhB,GAAA;AAAA,oBACF;AAAA,oBAEA,4BAACiB,IAAA,CAAA,CAAC;AAAA,kBAAA;AAAA,gBAAA,IAGJ,gBAAAV,EAACW,IAAA,EAAY,WAAU,qBAAA,CAAoB;AAAA,cAAA,EAAA,CAE/C;AAAA,YAAA;AAAA,UAAA;AAAA,QAAA,GAGN;AAAA,QACA,gBAAAX;AAAA,UAACY;AAAA,UAAA;AAAA,YACC,WAAWN;AAAA,cACT;AAAA,cACA;AAAA,YAAA;AAAA,YAEF,OAAM;AAAA,YAEN,UAAA,gBAAAL,EAACY,IAAA,EAAQ,cAAc,IACrB,UAAA;AAAA,cAAA,gBAAAb;AAAA,gBAACc;AAAA,gBAAA;AAAA,kBACC,aAAatE;AAAA,kBACb,OAAOmB;AAAA,kBACP,eAAe2B;AAAA,gBAAA;AAAA,cAAA;AAAA,cAEhB,OAAOzC,KAAuB,aAC3BA,EAAmBgD,CAA2B,IAC9ChD;AAAA,gCACHkE,IAAA,EACC,UAAA,gBAAAd;AAAA,gBAACe;AAAA,gBAAA;AAAA,kBACC,WAAWV;AAAA,oBACT,CAACtC,EAAQ,UAAU;AAAA,oBACnB;AAAA,kBAAA;AAAA,kBAGD,UAAA;AAAA,oBAAAF,KAAW,gBAAAkC,EAACO,KAAY,WAAS,GAAA,CAAA;AAAA,oBACjC,CAACzC,KAAW8B,KACX,gBAAAI,EAAAQ,GAAA,EACG,cACC,gBAAAP,EAACgB,GAAA,EAAa,WAAU,8CACtB,UAAA;AAAA,sBAAA,gBAAAjB,EAAC,UAAM,UAAArD,EAAA,CAAW;AAAA,sBACjB,OAAOC,KAAgB,aACpBA,EAAYiD,CAA2B,IACvCjD;AAAA,oBAAA,EAAA,CACN,IAEA,gBAAAoD,EAACiB,GAAA,EAAc,UAAAtE,EAAA,CAAW,GAE9B;AAAA,oBAED,CAACmB,KAAW,CAAC8B,KACZ,gBAAAK,EAAAO,GAAA,EACG,UAAA;AAAA,sBAAA1D,KACC,gBAAAkD;AAAA,wBAACkB;AAAA,wBAAA;AAAA,0BAEC,SAAO;AAAA,0BACP,WAAU;AAAA,0BAET,UAAA,OAAOpE,KAAmB,aACvBA,EAAe+C,CAA2B,IAC1C/C;AAAA,wBAAA;AAAA,wBANA;AAAA,sBAAA;AAAA,sBASR,gBAAAkD;AAAA,wBAACmB;AAAA,wBAAA;AAAA,0BACC,YAAAxD;AAAA,0BACA,OAAA7B;AAAA,0BACA,SAAAkC;AAAA,0BACA,gBAAAuB;AAAA,0BACA,SAAA7B;AAAA,0BACA,qBAAAT;AAAA,0BACA,oBAAAC;AAAA,0BACA,kBAAAC;AAAA,0BACA,wBAAAC;AAAA,wBAAA;AAAA,sBAAA;AAAA,oBACF,EAAA,CACF;AAAA,kBAAA;AAAA,gBAAA;AAAA,cAAA,GAGN;AAAA,cAGC,CAACU,KAAWf,KAAoB,CAAC6C,KAChC,gBAAAI;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,aAAU;AAAA,kBACV,WAAU;AAAA,kBAET,UAAA,OAAOjD,KAAqB,aACzBA,EAAiB8C,CAA2B,IAC5C9C;AAAA,gBAAA;AAAA,cAAA;AAAA,YACN,EAAA,CAEJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACF;AAAA,IAAA;AAAA,EAAA,GAEJ;AAEJ;"}
+{"version":3,"file":"Combobox.js","sources":["../../src/Combobox/Combobox.tsx"],"sourcesContent":["import {\n  Dispatch,\n  SetStateAction,\n  useCallback,\n  useEffect,\n  useLayoutEffect,\n  useMemo,\n  useState,\n} from 'react';\nimport { LoadingMask } from '../LoadingMask';\nimport { Popover, PopoverContent, PopoverTrigger } from '../Popover';\nimport { Button } from '../Button';\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem,\n  CommandList,\n} from '../Command';\nimport { cn } from '@oneplatformdev/utils';\nimport { useDebounceCallback } from '@oneplatformdev/hooks';\nimport { ChevronDown, X } from 'lucide-react';\nimport {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps,\n} from './Combobox.types';\nimport { ComboboxOptions } from './ComboboxOptions';\n\n// TODO: refactor next component | nlt code\nconst getSelectRenderLabel = <Data extends object>(params: {\n  value: ComboboxProps<Data>['value'];\n  flattenOptions: ComboboxOption<Data>[];\n  selectedOption?: ComboboxOption<Data>;\n}): string => {\n  const { value, flattenOptions = [], selectedOption } = params;\n  if (!value) return 'No value for render label';\n  const flattenedOption = flattenOptions.find(o => String(o.value).toLowerCase() === String(value).toLowerCase());\n  const label = [ flattenedOption, selectedOption ]\n    .filter(Boolean)\n    .map(o => o!.label)\n    .find(Boolean);\n  if (!label) return value;\n  return label;\n}\n\n// TODO: refactor next component | nlt code\nexport const Combobox = <Data extends object, >(props: ComboboxProps<Data>) => {\n  const {\n    value,\n    onChange,\n    placeholder,\n    disabled,\n    searchLabel = 'Type to search...',\n    fetchOptions,\n    options: itemOptions,\n    emptyLabel = 'No options',\n    emptyAction,\n    commandInputAction,\n    listHeadAction,\n    listFooterAction,\n    listFooterActionProps,\n    onMount,\n    defaultNodeDisabled,\n    defaultNodeMatched,\n    defaultNodeMuted,\n    defaultNodeInteractive,\n    renderTrigger,\n    renderList,\n  } = props;\n  const [ initialLoading, setInitialLoading ] = useState(false);\n  const [ open, setOpen ] = useState(false);\n  const [ searchTerm, setSearchTerm ] = useState('');\n  const [ selectedOption, setSelectedOption ] = useState<ComboboxOption<Data>>();\n  const [ loading, setLoading ] = useState(false);\n\n  const [ options, setOptionsDispatch ] = useState<ComboboxOption<Data>[]>([]);\n  const [ flattenOptions, setFlattenOptions ] = useState<ComboboxOption<Data>[]>([]);\n  const setOptions: Dispatch<SetStateAction<ComboboxOption<Data>[]>> = useCallback((stater) => {\n    const flatten = (next: ComboboxOption<Data>[]) => {\n      const res: ComboboxOption<Data>[] = [];\n      const walk = (nodes?: ComboboxOption<Data>[]) => {\n        if (!nodes) return;\n        for (const node of nodes) {\n          res.push(node);\n          if (node.items && node.items.length) walk(node.items);\n        }\n      };\n      walk(next);\n      setFlattenOptions((prev) => {\n        const isIncludedInRes = res.find(o => !!value && String(o.value) === String(value));\n\n        if (!isIncludedInRes) {\n          const current = selectedOption || prev.find(o => !!value && String(o.value) === String(value))\n          if (current) return [ current, ...res ];\n        }\n\n        return res;\n      });\n    }\n    setOptionsDispatch((prev) => {\n      const next: ComboboxOption<Data>[] = typeof stater === 'function' ? stater(prev) : stater;\n      flatten(next);\n      return next;\n    });\n  }, [ selectedOption, value ])\n\n  useEffect(() => {\n    itemOptions?.length && setOptions(itemOptions);\n  }, [ itemOptions ]);\n\n  const handlePopoverOpen = async () => {\n    if (!open) {\n      void getData();\n      setSearchTerm('');\n    }\n  };\n\n  const getData = useCallback(async (search?: string) => {\n    setLoading(true);\n    try {\n      const fetchedOptions = await fetchOptions(search);\n      setOptions(fetchedOptions);\n    } catch (error) {\n      console.error('Unexpected error while get option:', error);\n    } finally {\n      setLoading(false);\n    }\n  }, [ setOptions ]);\n\n  const debouncedGetData = useDebounceCallback(getData, 1000, {\n    leading: false,\n    trailing: true,\n  });\n\n  const handleSearchChange = useCallback((value: string) => {\n    setLoading(true);\n    setSearchTerm(value);\n    debouncedGetData(value);\n  }, []);\n\n  const onChangeOption = useCallback((option: ComboboxOption<Data>) => {\n    onChange(option.value);\n    setSelectedOption(option);\n    setLoading(false);\n  }, []);\n\n  const handleClearSelection = useCallback(() => {\n    onChangeOption({ value: '', label: '' });\n    setSelectedOption(undefined);\n    setLoading(false);\n  }, []);\n\n  const isSearchedEmptyList = useMemo(() => {\n    return Boolean(searchTerm) && !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const isEmptyList = useMemo(() => {\n    return !options.length && !loading;\n  }, [ loading, options.length, searchTerm ])\n\n  const comboboxCallbackStateParams =\n    useMemo((): ComboboxCallbackStateParams<Data> => {\n      return {\n        options,\n        setOptions,\n        selectedOption,\n        setSelectedOption,\n        search: searchTerm || '',\n        setSearch: setSearchTerm,\n        open,\n        setOpen,\n        loading,\n        setLoading,\n        isEmptyList,\n        isSearchedEmptyList,\n      };\n    }, [ loading, open, options, searchTerm, selectedOption, isEmptyList, isSearchedEmptyList, setOptions ]);\n\n  const runOnMount = useCallback(async () => {\n    if (!onMount) return;\n    setInitialLoading(true);\n    try {\n      await onMount(comboboxCallbackStateParams);\n    } finally {\n      setInitialLoading(false);\n    }\n  }, [ onMount, comboboxCallbackStateParams ]);\n\n  useLayoutEffect(() => {\n    runOnMount();\n  }, []);\n\n  return (\n    <div className=\"w-full\">\n      <Popover\n        open={open}\n        onOpenChange={(newOpen) => {\n          setOpen(newOpen);\n          if (newOpen) handlePopoverOpen();\n        }}\n      >\n        <PopoverTrigger asChild className=\"border-input\">\n          <Button\n            color='secondary'\n            role=\"combobox\"\n            aria-expanded={open}\n            className={cn(\n              'relative w-full justify-between font-normal text-sm bg-transparent',\n              'border border-border',\n              open && 'border-2 outline-hidden ring-1 ring-ring',\n              'focus-visible:outline-hidden focus-visible:ring-1 focus-visible:ring-ring',\n              renderTrigger && 'p-0',\n              renderTrigger && open && 'p-0 border-1 ring-0 ring-transparent',\n            )}\n            disabled={disabled || initialLoading}\n          >\n            {initialLoading && <LoadingMask fullWidth/>}\n            {!initialLoading && renderTrigger && renderTrigger(comboboxCallbackStateParams)}\n            {!initialLoading && !renderTrigger && (\n              <>\n                  <span\n                    className=\"truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap\">\n                    {value\n                      ? getSelectRenderLabel({ value, flattenOptions, selectedOption })\n                      : <span className=\"text-gray-400\">{placeholder}</span>\n                    }\n                  </span>\n                {value ? (\n                  <div\n                    className={cn(\n                      'absolute top-0 right-1',\n                      'flex items-center justify-center',\n                      'w-9 aspect-square [&_svg]:size-5',\n                      'opacity-50 cursor-pointer hover:opacity-100'\n                    )}\n                    onClick={(e) => {\n                      e.stopPropagation();\n                      handleClearSelection();\n                    }}\n                  >\n                    <X/>\n                  </div>\n                ) : (\n                  <ChevronDown className=\"opacity-50 w-4 h-4\"/>\n                )}\n              </>\n            )}\n          </Button>\n        </PopoverTrigger>\n        <PopoverContent\n          className={cn(\n            \"w-(--radix-popper-anchor-width) max-w-none p-2\",\n            '-translate-y-3',\n          )}\n          align=\"start\"\n        >\n          <Command shouldFilter={false}>\n            <CommandInput\n              placeholder={searchLabel}\n              value={searchTerm}\n              onValueChange={handleSearchChange}\n            />\n            {typeof commandInputAction === 'function'\n              ? commandInputAction(comboboxCallbackStateParams)\n              : commandInputAction}\n            <CommandList>\n              <CommandGroup\n                className={cn(\n                  !options.length && 'p-0 shadow-none',\n                  'px-0 py-2',\n                )}\n              >\n                {loading && <LoadingMask fullWidth/>}\n                {!loading && isEmptyList && (\n                  <>\n                    {emptyAction ? (\n                      <CommandEmpty className=\"flex flex-col gap-3 py-5 px-3 items-center\">\n                        <span>{emptyLabel}</span>\n                        {typeof emptyAction === 'function'\n                          ? emptyAction(comboboxCallbackStateParams)\n                          : emptyAction}\n                      </CommandEmpty>\n                    ) : (\n                      <CommandEmpty>{emptyLabel}</CommandEmpty>\n                    )}\n                  </>\n                )}\n                {!loading && !isEmptyList && (\n                  <>\n                    {listHeadAction && (\n                      <CommandItem\n                        key='combobox-list-head-action'\n                        asChild\n                        className='w-full'\n                      >\n                        {typeof listHeadAction === 'function'\n                          ? listHeadAction(comboboxCallbackStateParams)\n                          : listHeadAction}\n                      </CommandItem>\n                    )}\n                    {renderList && renderList(comboboxCallbackStateParams)}\n                    {!renderList && (\n                      <ComboboxOptions\n                        searchTerm={searchTerm}\n                        value={value}\n                        options={options}\n                        onChangeOption={onChangeOption}\n                        setOpen={setOpen}\n                        defaultNodeDisabled={defaultNodeDisabled}\n                        defaultNodeMatched={defaultNodeMatched}\n                        defaultNodeMuted={defaultNodeMuted}\n                        defaultNodeInteractive={defaultNodeInteractive}\n                      />\n                    )}\n                  </>\n                )}\n              </CommandGroup>\n            </CommandList>\n\n            {/*LIST FOOTER ACTION*/}\n            {!loading && listFooterAction && !isEmptyList && (\n              <div\n                data-slot=\"command-footer-wrapper\"\n                {...((() => {\n                  const { bordered = true, ...rest } = listFooterActionProps || {};\n                  return {\n                    ...rest,\n                    'data-slot-bordered': JSON.stringify(bordered)\n                  }\n                })())}\n                className={cn(\n                  \"flex w-full min-h-10 items-center gap-2 px-0\",\n                  (listFooterActionProps?.bordered ?? true) && 'border-t px-0 pt-2 min-h-12',\n                  listFooterActionProps?.className,\n                )}\n              >\n                {typeof listFooterAction === 'function'\n                  ? listFooterAction(comboboxCallbackStateParams)\n                  : listFooterAction}\n              </div>\n            )}\n          </Command>\n        </PopoverContent>\n      </Popover>\n    </div>\n  );\n}\n"],"names":["getSelectRenderLabel","params","value","flattenOptions","selectedOption","label","o","Combobox","props","onChange","placeholder","disabled","searchLabel","fetchOptions","itemOptions","emptyLabel","emptyAction","commandInputAction","listHeadAction","listFooterAction","listFooterActionProps","onMount","defaultNodeDisabled","defaultNodeMatched","defaultNodeMuted","defaultNodeInteractive","renderTrigger","renderList","initialLoading","setInitialLoading","useState","open","setOpen","searchTerm","setSearchTerm","setSelectedOption","loading","setLoading","options","setOptionsDispatch","setFlattenOptions","setOptions","useCallback","stater","flatten","next","res","walk","nodes","node","prev","current","useEffect","handlePopoverOpen","getData","search","fetchedOptions","error","debouncedGetData","useDebounceCallback","handleSearchChange","onChangeOption","option","handleClearSelection","isSearchedEmptyList","useMemo","isEmptyList","comboboxCallbackStateParams","runOnMount","useLayoutEffect","jsx","jsxs","Popover","newOpen","PopoverTrigger","Button","cn","LoadingMask","Fragment","X","ChevronDown","PopoverContent","Command","CommandInput","CommandList","CommandGroup","CommandEmpty","CommandItem","ComboboxOptions","bordered","rest"],"mappings":"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"}

package/Combobox/Combobox.stories.js

@@ -14,11 +14,11 @@ const h = (e) => new Promise((n) => setTimeout(n, e)), x = (e = []) => {
   if (!l) return e;
   const s = x(e), b = new Set(
     s.filter((i) => String(i.label).toLowerCase().includes(l)).map((i) => String(i.value))
-  ), p = (i) => i.map((c) => {
-    const m = c.items?.length ? p(c.items) : void 0;
-    return !(b.has(String(c.value)) || String(c.label).toLowerCase().includes(l)) && !m?.length ? null : { ...c, items: m };
+  ), m = (i) => i.map((c) => {
+    const p = c.items?.length ? m(c.items) : void 0;
+    return !(b.has(String(c.value)) || String(c.label).toLowerCase().includes(l)) && !p?.length ? null : { ...c, items: p };
   }).filter(Boolean);
-  return p(e);
+  return m(e);
 }, r = [
   { value: "ua", label: "Ukraine" },
   { value: "pl", label: "Poland" },
@@ -168,11 +168,11 @@ const w = {
       "button",
       {
         type: "button",
-        className: "w-full text-left px-3 py-2 text-sm",
+        className: "w-full text-left min-h-10 text-sm",
         onClick: () => {
           e.setSearch(""), e.setOpen(!1);
         },
-        children: "Add new option"
+        children: "list footer action"
       }
     )
   },

package/Combobox/Combobox.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport type {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n  const res: ComboboxOption[] = [];\n  const walk = (list?: ComboboxOption[]) => {\n    if (!list?.length) return;\n    for (const n of list) {\n      res.push(n);\n      if (n.items?.length) walk(n.items);\n    }\n  };\n  walk(nodes);\n  return res;\n};\n\nconst createFetchOptions =\n  (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n    async (search?: string) => {\n      await sleep(delayMs);\n\n      const q = (search ?? '').trim().toLowerCase();\n      if (!q) return all;\n\n      // simple \"contains\" search across flattened options; then return top-level filtered\n      // (enough for Storybook demos; your real API can do better)\n      const allFlat = flatten(all);\n      const matchedValues = new Set(\n        allFlat\n          .filter((o) => String(o.label).toLowerCase().includes(q))\n          .map((o) => String(o.value)),\n      );\n\n      const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n        return list\n          .map((n) => {\n            const items = n.items?.length ? filterTree(n.items) : undefined;\n            const selfMatch =\n              matchedValues.has(String(n.value)) ||\n              String(n.label).toLowerCase().includes(q);\n\n            if (!selfMatch && !items?.length) return null;\n            return { ...n, items };\n          })\n          .filter(Boolean) as ComboboxOption[];\n      };\n\n      return filterTree(all);\n    };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n  { value: 'ua', label: 'Ukraine' },\n  { value: 'pl', label: 'Poland' },\n  { value: 'de', label: 'Germany' },\n  { value: 'fr', label: 'France' },\n  { value: 'es', label: 'Spain' },\n  { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n  {\n    value: 'europe',\n    label: 'Europe',\n    items: [\n      { value: 'ua', label: 'Ukraine' },\n      { value: 'pl', label: 'Poland' },\n      { value: 'de', label: 'Germany' },\n      { value: 'fr', label: 'France' },\n    ],\n  },\n  {\n    value: 'north-america',\n    label: 'North America',\n    items: [\n      { value: 'us', label: 'United States' },\n      { value: 'ca', label: 'Canada' },\n      { value: 'mx', label: 'Mexico' },\n    ],\n  },\n];\n\ntype ControlledProps = Omit<ComboboxProps, 'value' | 'onChange'> & {\n  initialValue?: ComboboxProps['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps) {\n  const [value, setValue] = useState<ComboboxProps['value']>(initialValue);\n\n  // keep stable reference if someone passes inline fetchOptions\n  const fetchOptions = useMemo(\n    () => args.fetchOptions,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{String(value || '')}</span>\n      </div>\n    </div>\n  );\n}\n\nconst meta = {\n  title: 'Combobox',\n  component: Combobox,\n  parameters: {\n    layout: 'centered',\n  },\n  args: {\n    placeholder: 'Select option...',\n    searchLabel: 'Type to search...',\n    emptyLabel: 'No options',\n    disabled: false,\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n  },\n  argTypes: {\n    fetchOptions: { control: false },\n    onChange: { control: false },\n    onMount: { control: false },\n    emptyAction: { control: false },\n    commandInputAction: { control: false },\n    listHeadAction: { control: false },\n    options: { control: false },\n    value: { control: false },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"p-6 w-[420px]\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n  render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n  args: { disabled: true },\n  render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n  args: {\n    options: BASE_OPTIONS,\n    fetchOptions: async () => BASE_OPTIONS,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n  args: {\n    emptyLabel: 'Nothing found',\n    emptyAction: (st: ComboboxCallbackStateParams) => {\n      const canCreate = Boolean(st.search?.trim());\n      return (\n        <button\n          type=\"button\"\n          className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n          disabled={!canCreate}\n          onClick={() => {\n            const v = st.search.trim();\n            const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n            st.setOptions([next]);\n            st.setLoading(false);\n          }}\n        >\n          Create option\n        </button>\n      );\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n  args: {\n    commandInputAction: (st: ComboboxCallbackStateParams) => (\n      <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n        <span>\n          results: <span className=\"font-mono\">{st.options.length}</span>\n        </span>\n        <button\n          type=\"button\"\n          className=\"underline\"\n          onClick={() => {\n            st.setSearch('');\n            st.setLoading(false);\n          }}\n        >\n          Clear search\n        </button>\n      </div>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n  args: {\n    listHeadAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left px-3 py-2 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        Close list\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n  args: {\n    listFooterAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left px-3 py-2 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        Add new option\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    defaultNodeDisabled: false,\n    defaultNodeMatched: false,\n    defaultNodeMuted: true,\n    defaultNodeInteractive: false,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams) => {\n      await sleep(900);\n      st.setOptions(BASE_OPTIONS);\n      st.setLoading(false);\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 12) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n  args: {\n    renderTrigger: (state) => {\n      console.log('state', state);\n      return (\n        <button\n          type=\"button\"\n          className=\"w-full\"\n          onClick={() => state.setOpen((o) => !o)}\n        >\n          {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n        </button>\n      )\n    }\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":"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"}
+{"version":3,"file":"Combobox.stories.js","sources":["../../src/Combobox/Combobox.stories.tsx"],"sourcesContent":["import React, { useMemo, useState } from 'react';\nimport type { Meta, StoryObj } from '@storybook/react';\n\nimport { Combobox } from './Combobox';\nimport type {\n  ComboboxCallbackStateParams,\n  ComboboxOption,\n  ComboboxProps,\n} from './Combobox.types';\n\nconst sleep = (ms: number) => new Promise((r) => setTimeout(r, ms));\n\nconst flatten = (nodes: ComboboxOption[] = []): ComboboxOption[] => {\n  const res: ComboboxOption[] = [];\n  const walk = (list?: ComboboxOption[]) => {\n    if (!list?.length) return;\n    for (const n of list) {\n      res.push(n);\n      if (n.items?.length) walk(n.items);\n    }\n  };\n  walk(nodes);\n  return res;\n};\n\nconst createFetchOptions =\n  (all: ComboboxOption[], delayMs = 350): ComboboxProps['fetchOptions'] =>\n    async (search?: string) => {\n      await sleep(delayMs);\n\n      const q = (search ?? '').trim().toLowerCase();\n      if (!q) return all;\n\n      // simple \"contains\" search across flattened options; then return top-level filtered\n      // (enough for Storybook demos; your real API can do better)\n      const allFlat = flatten(all);\n      const matchedValues = new Set(\n        allFlat\n          .filter((o) => String(o.label).toLowerCase().includes(q))\n          .map((o) => String(o.value)),\n      );\n\n      const filterTree = (list: ComboboxOption[]): ComboboxOption[] => {\n        return list\n          .map((n) => {\n            const items = n.items?.length ? filterTree(n.items) : undefined;\n            const selfMatch =\n              matchedValues.has(String(n.value)) ||\n              String(n.label).toLowerCase().includes(q);\n\n            if (!selfMatch && !items?.length) return null;\n            return { ...n, items };\n          })\n          .filter(Boolean) as ComboboxOption[];\n      };\n\n      return filterTree(all);\n    };\n\nconst BASE_OPTIONS: ComboboxOption[] = [\n  { value: 'ua', label: 'Ukraine' },\n  { value: 'pl', label: 'Poland' },\n  { value: 'de', label: 'Germany' },\n  { value: 'fr', label: 'France' },\n  { value: 'es', label: 'Spain' },\n  { value: 'it', label: 'Italy' },\n];\n\nconst NESTED_OPTIONS: ComboboxOption[] = [\n  {\n    value: 'europe',\n    label: 'Europe',\n    items: [\n      { value: 'ua', label: 'Ukraine' },\n      { value: 'pl', label: 'Poland' },\n      { value: 'de', label: 'Germany' },\n      { value: 'fr', label: 'France' },\n    ],\n  },\n  {\n    value: 'north-america',\n    label: 'North America',\n    items: [\n      { value: 'us', label: 'United States' },\n      { value: 'ca', label: 'Canada' },\n      { value: 'mx', label: 'Mexico' },\n    ],\n  },\n];\n\ntype ControlledProps = Omit<ComboboxProps, 'value' | 'onChange'> & {\n  initialValue?: ComboboxProps['value'];\n};\n\nfunction ControlledCombobox({ initialValue = '', ...args }: ControlledProps) {\n  const [value, setValue] = useState<ComboboxProps['value']>(initialValue);\n\n  // keep stable reference if someone passes inline fetchOptions\n  const fetchOptions = useMemo(\n    () => args.fetchOptions,\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [],\n  );\n\n  return (\n    <div className=\"max-w-sm\">\n      <Combobox {...args} value={value} onChange={setValue} fetchOptions={fetchOptions} />\n      <div className=\"mt-3 text-xs text-muted-foreground\">\n        value: <span className=\"font-mono\">{String(value || '')}</span>\n      </div>\n    </div>\n  );\n}\n\nconst meta = {\n  title: 'Combobox',\n  component: Combobox,\n  parameters: {\n    layout: 'centered',\n  },\n  args: {\n    placeholder: 'Select option...',\n    searchLabel: 'Type to search...',\n    emptyLabel: 'No options',\n    disabled: false,\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n  },\n  argTypes: {\n    fetchOptions: { control: false },\n    onChange: { control: false },\n    onMount: { control: false },\n    emptyAction: { control: false },\n    commandInputAction: { control: false },\n    listHeadAction: { control: false },\n    options: { control: false },\n    value: { control: false },\n  },\n  decorators: [\n    (Story) => (\n      <div className=\"p-6 w-[420px]\">\n        <Story />\n      </div>\n    ),\n  ],\n} satisfies Meta<typeof Combobox>;\n\nexport default meta;\n\ntype Story = StoryObj<typeof meta>;\n\n/** 1) Default (async options) */\nexport const Default: Story = {\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 2) With initial selected value */\nexport const WithValueSelected: Story = {\n  render: (args) => <ControlledCombobox {...args} initialValue=\"pl\" />,\n};\n\n/** 3) Disabled */\nexport const Disabled: Story = {\n  args: { disabled: true },\n  render: (args) => <ControlledCombobox {...args} initialValue=\"de\" />,\n};\n\n/** 4) Static options via `options` prop (no async needed, but fetchOptions still required) */\nexport const WithStaticOptionsProp: Story = {\n  args: {\n    options: BASE_OPTIONS,\n    fetchOptions: async () => BASE_OPTIONS,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 5) Slow fetch to show loading state on open/search */\nexport const SlowFetchLoading: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 1200),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 6) Empty state with action (search something like \"zzz\") */\nexport const EmptyStateWithAction: Story = {\n  args: {\n    emptyLabel: 'Nothing found',\n    emptyAction: (st: ComboboxCallbackStateParams) => {\n      const canCreate = Boolean(st.search?.trim());\n      return (\n        <button\n          type=\"button\"\n          className=\"inline-flex items-center justify-center rounded-md border px-3 py-1.5 text-sm\"\n          disabled={!canCreate}\n          onClick={() => {\n            const v = st.search.trim();\n            const next: ComboboxOption = { value: v, label: `Create \"${v}\"` };\n            st.setOptions([next]);\n            st.setLoading(false);\n          }}\n        >\n          Create option\n        </button>\n      );\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 7) commandInputAction (helper row under input) */\nexport const WithCommandInputAction: Story = {\n  args: {\n    commandInputAction: (st: ComboboxCallbackStateParams) => (\n      <div className=\"px-3 py-2 flex items-center justify-between text-xs text-muted-foreground\">\n        <span>\n          results: <span className=\"font-mono\">{st.options.length}</span>\n        </span>\n        <button\n          type=\"button\"\n          className=\"underline\"\n          onClick={() => {\n            st.setSearch('');\n            st.setLoading(false);\n          }}\n        >\n          Clear search\n        </button>\n      </div>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 8) listHeadAction (top action inside list) */\nexport const WithListHeadAction: Story = {\n  args: {\n    listHeadAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left px-3 py-2 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        Close list\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 9) listHeadAction (footer action outside of list) */\nexport const WithListFooterAction: Story = {\n  args: {\n    listFooterAction: (st: ComboboxCallbackStateParams) => (\n      <button\n        type=\"button\"\n        className=\"w-full text-left min-h-10 text-sm\"\n        onClick={() => {\n          st.setSearch('');\n          st.setOpen(false);\n        }}\n      >\n        list footer action\n      </button>\n    ),\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 10) Nested options tree */\nexport const NestedOptions: Story = {\n  args: {\n    fetchOptions: createFetchOptions(NESTED_OPTIONS, 250),\n    defaultNodeDisabled: false,\n    defaultNodeMatched: false,\n    defaultNodeMuted: true,\n    defaultNodeInteractive: false,\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 11) onMount initial loading (simulate prefetch on mount) */\nexport const OnMountPrefetch: Story = {\n  args: {\n    fetchOptions: createFetchOptions(BASE_OPTIONS, 250),\n    onMount: async (st: ComboboxCallbackStateParams) => {\n      await sleep(900);\n      st.setOptions(BASE_OPTIONS);\n      st.setLoading(false);\n    },\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n\n/** 12) render custom trigger */\nexport const RenderCustomTrigger: Story = {\n  args: {\n    renderTrigger: (state) => {\n      console.log('state', state);\n      return (\n        <button\n          type=\"button\"\n          className=\"w-full\"\n          onClick={() => state.setOpen((o) => !o)}\n        >\n          {state.selectedOption ? `Selected: ${state.selectedOption.label}` : 'Select option...'}\n        </button>\n      )\n    }\n  },\n  render: (args) => <ControlledCombobox {...args} />,\n};\n"],"names":["sleep","ms","r","flatten","nodes","res","walk","list","n","createFetchOptions","all","delayMs","search","q","allFlat","matchedValues","o","filterTree","items","BASE_OPTIONS","NESTED_OPTIONS","ControlledCombobox","initialValue","args","value","setValue","useState","fetchOptions","useMemo","jsxs","jsx","Combobox","meta","Story","Default","WithValueSelected","Disabled","WithStaticOptionsProp","SlowFetchLoading","EmptyStateWithAction","st","canCreate","v","next","WithCommandInputAction","WithListHeadAction","WithListFooterAction","NestedOptions","OnMountPrefetch","RenderCustomTrigger","state"],"mappings":";;;AAUA,MAAMA,IAAQ,CAACC,MAAe,IAAI,QAAQ,CAACC,MAAM,WAAWA,GAAGD,CAAE,CAAC,GAE5DE,IAAU,CAACC,IAA0B,OAAyB;AAClE,QAAMC,IAAwB,CAAA,GACxBC,IAAO,CAACC,MAA4B;AACxC,QAAKA,GAAM;AACX,iBAAWC,KAAKD;AACd,QAAAF,EAAI,KAAKG,CAAC,GACNA,EAAE,OAAO,UAAQF,EAAKE,EAAE,KAAK;AAAA,EAErC;AACA,SAAAF,EAAKF,CAAK,GACHC;AACT,GAEMI,IACJ,CAACC,GAAuBC,IAAU,QAChC,OAAOC,MAAoB;AACzB,QAAMZ,EAAMW,CAAO;AAEnB,QAAME,KAAKD,KAAU,IAAI,KAAA,EAAO,YAAA;AAChC,MAAI,CAACC,EAAG,QAAOH;AAIf,QAAMI,IAAUX,EAAQO,CAAG,GACrBK,IAAgB,IAAI;AAAA,IACxBD,EACG,OAAO,CAACE,MAAM,OAAOA,EAAE,KAAK,EAAE,YAAA,EAAc,SAASH,CAAC,CAAC,EACvD,IAAI,CAACG,MAAM,OAAOA,EAAE,KAAK,CAAC;AAAA,EAAA,GAGzBC,IAAa,CAACV,MACXA,EACJ,IAAI,CAACC,MAAM;AACV,UAAMU,IAAQV,EAAE,OAAO,SAASS,EAAWT,EAAE,KAAK,IAAI;AAKtD,WAAI,EAHFO,EAAc,IAAI,OAAOP,EAAE,KAAK,CAAC,KACjC,OAAOA,EAAE,KAAK,EAAE,YAAA,EAAc,SAASK,CAAC,MAExB,CAACK,GAAO,SAAe,OAClC,EAAE,GAAGV,GAAG,OAAAU,EAAA;AAAA,EACjB,CAAC,EACA,OAAO,OAAO;AAGnB,SAAOD,EAAWP,CAAG;AACvB,GAEES,IAAiC;AAAA,EACrC,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,QAAA;AAAA,EACtB,EAAE,OAAO,MAAM,OAAO,QAAA;AACxB,GAEMC,IAAmC;AAAA,EACvC;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,MACL,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,UAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,IAAS;AAAA,EACjC;AAAA,EAEF;AAAA,IACE,OAAO;AAAA,IACP,OAAO;AAAA,IACP,OAAO;AAAA,MACL,EAAE,OAAO,MAAM,OAAO,gBAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,MACtB,EAAE,OAAO,MAAM,OAAO,SAAA;AAAA,IAAS;AAAA,EACjC;AAEJ;AAMA,SAASC,EAAmB,EAAE,cAAAC,IAAe,IAAI,GAAGC,KAAyB;AAC3E,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAAiCJ,CAAY,GAGjEK,IAAeC;AAAA,IACnB,MAAML,EAAK;AAAA;AAAA,IAEX,CAAA;AAAA,EAAC;AAGH,SACE,gBAAAM,EAAC,OAAA,EAAI,WAAU,YACb,UAAA;AAAA,IAAA,gBAAAC,EAACC,KAAU,GAAGR,GAAM,OAAAC,GAAc,UAAUC,GAAU,cAAAE,GAA4B;AAAA,IAClF,gBAAAE,EAAC,OAAA,EAAI,WAAU,sCAAqC,UAAA;AAAA,MAAA;AAAA,wBAC1C,QAAA,EAAK,WAAU,aAAa,UAAA,OAAOL,KAAS,EAAE,EAAA,CAAE;AAAA,IAAA,EAAA,CAC1D;AAAA,EAAA,GACF;AAEJ;AAEA,MAAMQ,IAAO;AAAA,EACX,OAAO;AAAA,EACP,WAAWD;AAAA,EACX,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,MAAM;AAAA,IACJ,aAAa;AAAA,IACb,aAAa;AAAA,IACb,YAAY;AAAA,IACZ,UAAU;AAAA,IACV,cAActB,EAAmBU,GAAc,GAAG;AAAA,EAAA;AAAA,EAEpD,UAAU;AAAA,IACR,cAAc,EAAE,SAAS,GAAA;AAAA,IACzB,UAAU,EAAE,SAAS,GAAA;AAAA,IACrB,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,aAAa,EAAE,SAAS,GAAA;AAAA,IACxB,oBAAoB,EAAE,SAAS,GAAA;AAAA,IAC/B,gBAAgB,EAAE,SAAS,GAAA;AAAA,IAC3B,SAAS,EAAE,SAAS,GAAA;AAAA,IACpB,OAAO,EAAE,SAAS,GAAA;AAAA,EAAM;AAAA,EAE1B,YAAY;AAAA,IACV,CAACc,MACC,gBAAAH,EAAC,OAAA,EAAI,WAAU,iBACb,UAAA,gBAAAA,EAACG,KAAM,EAAA,CACT;AAAA,EAAA;AAGN,GAOaC,IAAiB;AAAA,EAC5B,QAAQ,CAACX,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGaY,IAA2B;AAAA,EACtC,QAAQ,CAACZ,MAAS,gBAAAO,EAACT,KAAoB,GAAGE,GAAM,cAAa,KAAA,CAAK;AACpE,GAGaa,IAAkB;AAAA,EAC7B,MAAM,EAAE,UAAU,GAAA;AAAA,EAClB,QAAQ,CAACb,MAAS,gBAAAO,EAACT,KAAoB,GAAGE,GAAM,cAAa,KAAA,CAAK;AACpE,GAGac,IAA+B;AAAA,EAC1C,MAAM;AAAA,IACJ,SAASlB;AAAA,IACT,cAAc,YAAYA;AAAA,EAAA;AAAA,EAE5B,QAAQ,CAACI,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGae,IAA0B;AAAA,EACrC,MAAM;AAAA,IACJ,cAAc7B,EAAmBU,GAAc,IAAI;AAAA,EAAA;AAAA,EAErD,QAAQ,CAACI,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGagB,IAA8B;AAAA,EACzC,MAAM;AAAA,IACJ,YAAY;AAAA,IACZ,aAAa,CAACC,MAAoC;AAChD,YAAMC,IAAY,EAAQD,EAAG,QAAQ;AACrC,aACE,gBAAAV;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,UAAU,CAACW;AAAA,UACX,SAAS,MAAM;AACb,kBAAMC,IAAIF,EAAG,OAAO,KAAA,GACdG,IAAuB,EAAE,OAAOD,GAAG,OAAO,WAAWA,CAAC,IAAA;AAC5D,YAAAF,EAAG,WAAW,CAACG,CAAI,CAAC,GACpBH,EAAG,WAAW,EAAK;AAAA,UACrB;AAAA,UACD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAIL;AAAA,EAAA;AAAA,EAEF,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGaqB,IAAgC;AAAA,EAC3C,MAAM;AAAA,IACJ,oBAAoB,CAACJ,MACnB,gBAAAX,EAAC,OAAA,EAAI,WAAU,6EACb,UAAA;AAAA,MAAA,gBAAAA,EAAC,QAAA,EAAK,UAAA;AAAA,QAAA;AAAA,0BACM,QAAA,EAAK,WAAU,aAAa,UAAAW,EAAG,QAAQ,OAAA,CAAO;AAAA,MAAA,GAC1D;AAAA,MACA,gBAAAV;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,MAAM;AACb,YAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,WAAW,EAAK;AAAA,UACrB;AAAA,UACD,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAED,EAAA,CACF;AAAA,EAAA;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGasB,IAA4B;AAAA,EACvC,MAAM;AAAA,IACJ,gBAAgB,CAACL,MACf,gBAAAV;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM;AACb,UAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,QAAQ,EAAK;AAAA,QAClB;AAAA,QACD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGauB,IAA8B;AAAA,EACzC,MAAM;AAAA,IACJ,kBAAkB,CAACN,MACjB,gBAAAV;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAM;AACb,UAAAU,EAAG,UAAU,EAAE,GACfA,EAAG,QAAQ,EAAK;AAAA,QAClB;AAAA,QACD,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED;AAAA,EAGJ,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGawB,IAAuB;AAAA,EAClC,MAAM;AAAA,IACJ,cAActC,EAAmBW,GAAgB,GAAG;AAAA,IACpD,qBAAqB;AAAA,IACrB,oBAAoB;AAAA,IACpB,kBAAkB;AAAA,IAClB,wBAAwB;AAAA,EAAA;AAAA,EAE1B,QAAQ,CAACG,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGayB,IAAyB;AAAA,EACpC,MAAM;AAAA,IACJ,cAAcvC,EAAmBU,GAAc,GAAG;AAAA,IAClD,SAAS,OAAOqB,MAAoC;AAClD,YAAMxC,EAAM,GAAG,GACfwC,EAAG,WAAWrB,CAAY,GAC1BqB,EAAG,WAAW,EAAK;AAAA,IACrB;AAAA,EAAA;AAAA,EAEF,QAAQ,CAACjB,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD,GAGa0B,IAA6B;AAAA,EACxC,MAAM;AAAA,IACJ,eAAe,CAACC,OACd,QAAQ,IAAI,SAASA,CAAK,GAExB,gBAAApB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,WAAU;AAAA,QACV,SAAS,MAAMoB,EAAM,QAAQ,CAAClC,MAAM,CAACA,CAAC;AAAA,QAErC,YAAM,iBAAiB,aAAakC,EAAM,eAAe,KAAK,KAAK;AAAA,MAAA;AAAA,IAAA;AAAA,EAG1E;AAAA,EAEF,QAAQ,CAAC3B,MAAS,gBAAAO,EAACT,GAAA,EAAoB,GAAGE,EAAA,CAAM;AAClD;"}

package/Combobox/Combobox.types.d.ts

@@ -1,9 +1,9 @@
-import { Dispatch, ReactNode, SetStateAction } from 'react';
+import { Dispatch, HTMLAttributes, ReactNode, SetStateAction } from 'react';
 export interface ComboboxOption<Data extends object = object> {
     value: string;
     label: string;
-    items?: ComboboxOption<Data>[];
     node?: Data;
+    items?: ComboboxOption<Data>[];
     path?: string[];
     parent?: string;
     level?: number;
@@ -41,6 +41,9 @@ export interface IComboboxOptionsNodeProps<Data extends object = object> extends
 export interface IComboboxOptionsProps<Data extends object = object> extends Omit<IComboboxOptionsNodeProps<Data>, 'option'>, IComboboxOptionsNodeHandlersProps<Data> {
     options?: ComboboxOption<Data>[];
 }
+interface IListActionProps extends HTMLAttributes<HTMLDivElement> {
+    bordered?: boolean;
+}
 export interface ComboboxProps<Data extends object = object> extends IComboboxOptionsNodeHandlersProps {
     value: string;
     onChange: (value: string) => void;
@@ -59,8 +62,12 @@ export interface ComboboxProps<Data extends object = object> extends IComboboxOp
     listHeadAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;
     /** Command List footer element action */
     listFooterAction?: ((params: ComboboxCallbackStateParams<Data>) => ReactNode) | ReactNode;
+    /** Command List footer element action props */
+    listFooterActionProps?: IListActionProps;
     /** Callback for load data on start component */
     onMount?: (params: ComboboxCallbackStateParams<Data>) => Promise<void>;
     renderTrigger?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;
+    renderList?: (params: ComboboxCallbackStateParams<Data>) => ReactNode;
 }
+export {};
 //# sourceMappingURL=Combobox.types.d.ts.map

package/Combobox/Combobox.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"Combobox.types.d.ts","sourceRoot":"","sources":["../../src/Combobox/Combobox.types.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneplatformdev/ui",
-  "version": "0.1.99-beta.202",
+  "version": "0.1.99-beta.204",
   "description": "UI component library for OnePlatform",
   "author": "One Platform Development Team",
   "keywords": [
@@ -106,9 +106,9 @@
     "recharts": "^3.2.0",
     "sonner": "^2.0.7",
     "vaul": "^1.1.2",
-    "@oneplatformdev/tokens": "^0.1.99-beta.202",
-    "@oneplatformdev/utils": "^0.1.99-beta.202",
-    "@oneplatformdev/hooks": "^0.1.99-beta.202"
+    "@oneplatformdev/tokens": "^0.1.99-beta.204",
+    "@oneplatformdev/hooks": "^0.1.99-beta.204",
+    "@oneplatformdev/utils": "^0.1.99-beta.204"
   },
   "scripts": {
     "chromatic": "chromatic"