@oneplatformdev/ui 0.0.1-beta.52 → 0.0.1-beta.53

package/Combobox/Combobox.mjs

@@ -1,81 +1,81 @@
-import { jsx as a, jsxs as o, Fragment as R } from "react/jsx-runtime";
+import { jsx as a, jsxs as t, Fragment as R } from "react/jsx-runtime";
 import l, { useRef as U, useEffect as _, useCallback as s, useLayoutEffect as A } from "react";
 import { LoadingMask as V } from "../LoadingMask/LoadingMask.mjs";
 import { Popover as X, PopoverTrigger as q, PopoverContent as z } from "../Popover/Popover.mjs";
 import { Button as H } from "../Button/Button.mjs";
 import "../Button/buttonVariants.mjs";
 import { Command as J, CommandInput as K, CommandList as Q, CommandGroup as W, CommandEmpty as k, CommandItem as Y } from "../Command/Command.mjs";
-import { cn as g } from "@oneplatformdev/utils";
+import { cn as v } from "@oneplatformdev/utils";
 import { useDebounceCallback as Z } from "@oneplatformdev/hooks";
 import { X as $, ChevronsUpDown as ee, Check as ae } from "lucide-react";
 const pe = (O) => {
   var L;
   const {
-    value: t,
+    value: o,
     onChange: P,
     placeholder: j,
     disabled: D,
     searchLabel: T = "Type to search...",
     fetchOptions: B,
     options: n,
-    emptyLabel: v = "No options",
+    emptyLabel: y = "No options",
     emptyAction: c,
-    onMount: y
-  } = O, p = U(!1), [i, C] = l.useState(!1), [x, w] = l.useState(""), [d, m] = l.useState([]), [u, N] = l.useState(), [h, r] = l.useState(!1);
+    onMount: C
+  } = O, u = U(!1), [i, x] = l.useState(!1), [d, w] = l.useState(""), [m, p] = l.useState([]), [h, N] = l.useState(), [f, r] = l.useState(!1);
   _(() => {
-    n != null && n.length && m(n);
+    n != null && n.length && p(n);
   }, [n]);
   const E = async () => {
     i || (S(), w(""));
   }, S = s(async (e) => {
     r(!0);
     try {
-      const b = await B(e);
-      m(b);
-    } catch (b) {
-      console.error("Unexpected error while get option:", b);
+      const g = await B(e);
+      p(g);
+    } catch (g) {
+      console.error("Unexpected error while get option:", g);
     } finally {
       r(!1);
     }
   }, []), M = Z(S, 1e3, { leading: !1, trailing: !0 }), F = s((e) => {
     r(!0), w(e), M(e);
-  }, []), f = s((e) => {
+  }, []), b = s((e) => {
     P(e.value), N(e), r(!1);
   }, []), G = s(() => {
-    f({ value: "", label: "" }), N(void 0), r(!1);
+    b({ value: "", label: "" }), N(void 0), r(!1);
   }, []), I = s(() => {
-    if (!y) {
-      p.current = !0;
+    if (!C) {
+      u.current = !0;
       return;
     }
-    y({ setOptions: m }).finally(() => {
-      p.current = !0;
+    C({ setOptions: p, search: d || "" }).finally(() => {
+      u.current = !0;
     });
   }, []);
   return A(() => (I(), () => {
-    p.current = !1;
-  }), []), /* @__PURE__ */ a("div", { className: "w-full", children: /* @__PURE__ */ o(
+    u.current = !1;
+  }), []), /* @__PURE__ */ a("div", { className: "w-full", children: /* @__PURE__ */ t(
     X,
     {
       open: i,
       onOpenChange: (e) => {
-        C(e), e && E();
+        x(e), e && E();
       },
       children: [
-        /* @__PURE__ */ a(q, { asChild: !0, className: "border-input", children: /* @__PURE__ */ o(
+        /* @__PURE__ */ a(q, { asChild: !0, className: "border-input", children: /* @__PURE__ */ t(
           H,
           {
             variant: "outline",
             role: "combobox",
             "aria-expanded": i,
-            className: g(
+            className: v(
               "w-full justify-between font-normal text-sm border bg-transparent",
               i ? "border-2 border-sidebar-accent" : "border-border"
             ),
             disabled: D,
             children: [
-              /* @__PURE__ */ a("span", { className: "truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap", children: t ? ((L = d.find((e) => e.value === t)) == null ? void 0 : L.label) || (u == null ? void 0 : u.label) : /* @__PURE__ */ a("span", { className: "text-gray-400", children: j }) }),
-              t ? /* @__PURE__ */ a(
+              /* @__PURE__ */ a("span", { className: "truncate max-w-[calc(100%-1.5rem)] overflow-hidden whitespace-nowrap", children: o ? ((L = m.find((e) => e.value === o)) == null ? void 0 : L.label) || (h == null ? void 0 : h.label) : /* @__PURE__ */ a("span", { className: "text-gray-400", children: j }) }),
+              o ? /* @__PURE__ */ a(
                 $,
                 {
                   className: "opacity-50 w-4 h-4 cursor-pointer hover:opacity-100",
@@ -92,42 +92,42 @@ const pe = (O) => {
           {
             className: "w-[var(--radix-popper-anchor-width)] max-w-none p-0",
             align: "start",
-            children: /* @__PURE__ */ o(J, { shouldFilter: !1, children: [
+            children: /* @__PURE__ */ t(J, { shouldFilter: !1, children: [
               /* @__PURE__ */ a(
                 K,
                 {
                   placeholder: T,
-                  value: x,
+                  value: d,
                   onValueChange: F
                 }
               ),
-              /* @__PURE__ */ a(Q, { children: /* @__PURE__ */ o(
+              /* @__PURE__ */ a(Q, { children: /* @__PURE__ */ t(
                 W,
                 {
-                  className: g(
-                    !d.length && "p-0 shadow-none"
+                  className: v(
+                    !m.length && "p-0 shadow-none"
                   ),
                   children: [
-                    h && /* @__PURE__ */ a("div", { className: "flex justify-center", children: /* @__PURE__ */ a(V, {}) }),
-                    !h && !!x && /* @__PURE__ */ a(R, { children: c ? /* @__PURE__ */ a("div", { className: "flex flex-col items-center", children: /* @__PURE__ */ o(k, { className: "flex flex-col gap-2 py-5 px-3", children: [
-                      /* @__PURE__ */ a("span", { children: v }),
-                      typeof c == "function" ? c({ setOptions: m }) : c
-                    ] }) }) : /* @__PURE__ */ a(k, { children: v }) }),
-                    !h && !!d.length && d.map((e) => /* @__PURE__ */ o(
+                    f && /* @__PURE__ */ a("div", { className: "flex justify-center", children: /* @__PURE__ */ a(V, {}) }),
+                    !f && !!d && /* @__PURE__ */ a(R, { children: c ? /* @__PURE__ */ t(k, { className: "flex flex-col gap-3 py-5 px-3 items-center", children: [
+                      /* @__PURE__ */ a("span", { children: y }),
+                      typeof c == "function" ? c({ setOptions: p, search: d || "" }) : c
+                    ] }) : /* @__PURE__ */ a(k, { children: y }) }),
+                    !f && !!m.length && m.map((e) => /* @__PURE__ */ t(
                       Y,
                       {
                         value: e.value,
                         onSelect: () => {
-                          t === e.value ? f({ value: "", label: "" }) : f(e), C(!1);
+                          o === e.value ? b({ value: "", label: "" }) : b(e), x(!1);
                         },
                         children: [
                           e.label,
                           /* @__PURE__ */ a(
                             ae,
                             {
-                              className: g(
+                              className: v(
                                 "ml-auto",
-                                t === e.value ? "opacity-100" : "opacity-0"
+                                o === e.value ? "opacity-100" : "opacity-0"
                               )
                             }
                           )

package/Combobox/Combobox.types.d.ts

@@ -6,6 +6,7 @@ export interface ComboboxOption {
 }
 export interface ComboboxPropsOnMountParams {
     setOptions: Dispatch<SetStateAction<ComboboxOption[]>>;
+    search: string;
 }
 export interface ComboboxProps {
     value: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneplatformdev/ui",
-  "version": "0.0.1-beta.52",
+  "version": "0.0.1-beta.53",
   "description": "UI React Components.",
   "author": "One Platform Development Team",
   "keywords": [