lawgic-dev-kit 0.15.0 → 0.15.6

package/dist/_virtual/index2.js

@@ -1,5 +1,4 @@
-import { __require as r } from "../node_modules/property-expr/index.js";
-var e = r();
+var p = { exports: {} };
 export {
-  e as p
+  p as __module
 };

package/dist/_virtual/index3.js

@@ -1,5 +1,5 @@
-import { __require as r } from "../node_modules/tiny-case/index.js";
-var a = r();
+import { __require as r } from "../node_modules/property-expr/index.js";
+var e = r();
 export {
-  a as t
+  e as p
 };

package/dist/_virtual/index4.js

@@ -1,7 +1,5 @@
-import { getDefaultExportFromCjs as o } from "./_commonjsHelpers.js";
-import { __require as r } from "../node_modules/toposort/index.js";
-var t = r();
-const s = /* @__PURE__ */ o(t);
+import { __require as r } from "../node_modules/tiny-case/index.js";
+var a = r();
 export {
-  s as default
+  a as t
 };

package/dist/_virtual/index5.js

@@ -1,4 +1,7 @@
-var p = { exports: {} };
+import { getDefaultExportFromCjs as o } from "./_commonjsHelpers.js";
+import { __require as r } from "../node_modules/toposort/index.js";
+var t = r();
+const s = /* @__PURE__ */ o(t);
 export {
-  p as __module
+  s as default
 };

package/dist/components/atoms/Avatar/Avatar.js

@@ -1,4 +1,4 @@
-import { j as a } from "../../../_virtual/jsx-runtime.js";
+import { j as i } from "../../../_virtual/jsx-runtime.js";
 import { faUser as A } from "../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";
 import { FontAwesomeIcon as H } from "../../../node_modules/@fortawesome/react-fontawesome/index.es.js";
 import { useState as W } from "react";
@@ -9,33 +9,34 @@ import "../../../contexts/themeContext.js";
 import "react-hook-form";
 import "../../../constants/countries.js";
 import "../ImageProfileInput/ImageProfileInput.validators.js";
+import "fuse.js";
 import "../../molecules/InformationContainer/InformationContainer.js";
-const $ = ({
+const q = ({
   containerProps: x = {},
   imageProps: p = {},
   src: m = "",
-  alt: i = "",
+  alt: a = "",
   size: e = 30,
   user: t = null
 }) => {
-  const { className: d = " ", ...g } = x, { className: s = " ", ...v } = p, o = e + "px", n = e * 0.5 + "px", l = e * 0.4 + "px", [j, w] = W(!1), N = () => i ? h(i) : t ? h(
+  const { className: d = " ", ...g } = x, { className: s = " ", ...v } = p, o = e + "px", n = e * 0.5 + "px", l = e * 0.4 + "px", [j, w] = W(!1), N = () => a ? h(a) : t ? h(
     t != null && t.first_name || t != null && t.last_name ? ((t == null ? void 0 : t.first_name) || "") + " " + ((t == null ? void 0 : t.last_name) || "") : t == null ? void 0 : t.email
-  ) : "#9CA1B6", c = (f) => {
+  ) : "#9CA1B6", r = (f) => {
     try {
       return f ? (new URL(f), !0) : !1;
     } catch (C) {
       return console.log(C), !1;
     }
-  }, y = () => c(m) ? m : t != null && t.image && c(t.image) ? t.image : t != null && t.image ? E(t.image) : "", S = () => i ? /* @__PURE__ */ a.jsx(
+  }, y = () => r(m) ? m : t != null && t.image && r(t.image) ? t.image : t != null && t.image ? E(t.image) : "", S = () => a ? /* @__PURE__ */ i.jsx(
     "h4",
     {
       className: "text-white uppercase font-600 text-nowrap",
       style: {
         fontSize: l
       },
-      children: i
+      children: a
     }
-  ) : t ? /* @__PURE__ */ a.jsx(
+  ) : t ? /* @__PURE__ */ i.jsx(
     "h4",
     {
       className: "text-white uppercase font-600 text-nowrap",
@@ -44,7 +45,7 @@ const $ = ({
       },
       children: t != null && t.first_name || t != null && t.last_name ? ((t == null ? void 0 : t.first_name) || " ")[0] + ((t == null ? void 0 : t.last_name) || " ")[0] : ((t == null ? void 0 : t.email) || " ")[0]
     }
-  ) : /* @__PURE__ */ a.jsx(
+  ) : /* @__PURE__ */ i.jsx(
     H,
     {
       style: {
@@ -58,8 +59,8 @@ const $ = ({
     }
   ), _ = () => {
     w(!0);
-  }, r = y();
-  return /* @__PURE__ */ a.jsxs(
+  }, c = y();
+  return /* @__PURE__ */ i.jsxs(
     "div",
     {
       className: "flex items-center justify-center rounded-full overflow-hidden h-full relative " + d,
@@ -72,11 +73,11 @@ const $ = ({
       },
       ...g,
       children: [
-        r && !j && /* @__PURE__ */ a.jsx(
+        c && !j && /* @__PURE__ */ i.jsx(
           "img",
           {
-            src: r,
-            alt: i,
+            src: c,
+            alt: a,
             className: `
           object-cover w-full h-full text-center indent-[10000px] absolute
           z-10
@@ -86,7 +87,7 @@ const $ = ({
             ...v
           }
         ),
-        /* @__PURE__ */ a.jsx(
+        /* @__PURE__ */ i.jsx(
           "div",
           {
             className: `
@@ -106,5 +107,5 @@ const $ = ({
   );
 };
 export {
-  $ as default
+  q as default
 };

package/dist/components/atoms/SelectInput/SelectInput.js

@@ -1,52 +1,52 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { useFloating as B, useClick as H, useDismiss as U, useInteractions as W, useTransitionStyles as Y } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
-import { useState as b, useRef as k, useEffect as q } from "react";
+import { useFloating as D, useClick as H, useDismiss as U, useInteractions as Y, useTransitionStyles as _ } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
+import { useState as k, useRef as N, useEffect as q } from "react";
 import { Controller as G } from "react-hook-form";
 import { useTheme as J } from "../../../hooks/useTheme.js";
 import { autoUpdate as K } from "../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
 import { offset as Q, flip as V, shift as X, size as Z, arrow as ee } from "../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";
 const ce = ({
-  options: a,
+  options: c,
   name: l,
-  control: c,
-  label: d = "Select an option",
-  placeholder: p = "Type to search...",
+  control: p,
+  label: m = "Select an option",
+  placeholder: x = "Type to search...",
   className: r = "",
-  input: u = !0
+  input: h = !0
 }) => /* @__PURE__ */ e.jsx(
   G,
   {
     name: l,
-    control: c,
+    control: p,
     render: ({ field: { onChange: f, value: o }, fieldState: { error: s } }) => /* @__PURE__ */ e.jsx(
       te,
       {
-        options: a,
+        options: c,
         value: o,
         onChange: f,
-        label: d,
-        placeholder: p,
+        label: m,
+        placeholder: x,
         error: s == null ? void 0 : s.message,
         className: r,
-        input: u
+        input: h
       }
     )
   }
 ), te = ({
-  options: a,
+  options: c,
   value: l,
-  onChange: c,
-  label: d = "Select an option",
-  placeholder: p = "Type to search...",
+  onChange: p,
+  label: m = "Select an option",
+  placeholder: x = "Type to search...",
   error: r,
-  className: u = "",
+  className: h = "",
   input: f = !0
 }) => {
-  const { t: o } = J(), [s, m] = b(!1), [x, y] = b(""), [j, w] = b(
+  const { t: o } = J(), [s, g] = k(!1), [a, y] = k(""), [i, v] = k(
     l || null
-  ), h = k(null), C = k(null), { x: T, y: O, strategy: $, refs: v, context: g } = B({
+  ), b = N(null), C = N(null), { x: L, y: S, strategy: M, refs: d, context: j } = D({
     open: s,
-    onOpenChange: m,
+    onOpenChange: g,
     middleware: [
       Q(8),
       V(),
@@ -63,52 +63,52 @@ const ce = ({
     ],
     placement: "bottom-start",
     whileElementsMounted: K
-  }), L = H(g), P = U(g), { getReferenceProps: R, getFloatingProps: F } = W([
-    L,
-    P
-  ]), { isMounted: N, styles: I } = Y(g, {
+  }), T = H(j), $ = U(j), { getReferenceProps: O, getFloatingProps: P } = Y([
+    T,
+    $
+  ]), { isMounted: R, styles: z } = _(j, {
     duration: { open: 200, close: 150 },
     initial: { opacity: 0, transform: "translateY(-4px)" }
-  }), S = (() => {
-    const t = Array.isArray(a) ? a : [];
-    if (!x.trim()) return t;
-    const n = x.toLowerCase();
-    return t.filter((i) => {
-      const D = i.label.toLowerCase(), _ = i.key.toLowerCase();
-      return D.includes(n) || _.includes(n);
+  }), w = (() => {
+    const t = Array.isArray(c) ? c : [];
+    if (!a.trim()) return t;
+    const n = a.toLowerCase();
+    return t.filter((u) => {
+      const E = u.label.toLowerCase(), A = u.key.toLowerCase();
+      return E.includes(n) || A.includes(n);
     });
-  })(), M = (t) => {
-    w(t), m(!1), y(""), c(t);
-  }, z = () => {
-    m(!s), !s && h.current && setTimeout(() => {
+  })(), F = (t) => {
+    v(t), g(!1), y(""), p(t);
+  }, I = () => {
+    g(!s), !s && b.current && setTimeout(() => {
       var t;
-      return (t = h.current) == null ? void 0 : t.focus();
+      return (t = b.current) == null ? void 0 : t.focus();
     }, 100);
   };
   q(() => {
-    w(l);
+    v(l);
   }, [l]);
-  const E = R({
-    onClick: z
-  }), A = o(p);
-  return /* @__PURE__ */ e.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${u}`, children: [
+  const W = O({
+    onClick: I
+  }), B = o(x);
+  return /* @__PURE__ */ e.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${h}`, children: [
     /* @__PURE__ */ e.jsx(
-      "label",
+      "h6",
       {
-        className: `text-gray-600 font-600 group ${r && "!text-red-500"} text-label`,
-        children: d
+        className: `text-gray-600 font-600 group ${r ? "!text-red-500" : ""} text-label`,
+        children: m
       }
     ),
     /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: v.setReference,
+        ref: d.setReference,
         className: `flex items-center justify-between bg-light rounded-full p-16 cursor-pointer
           border transition-all duration-200 hover:border-blue-400
-          ${r && "border-red-500 hover:border-red-600"} ${N ? "border-blue-400" : "border-blue-100"}`,
-        ...E,
+          ${r ? "border-red-500 hover:border-red-600" : ""} ${s ? "border-blue-400" : "border-blue-100"}`,
+        ...W,
         children: [
-          j ? /* @__PURE__ */ e.jsx("div", { className: "flex items-center w-full", children: /* @__PURE__ */ e.jsx("span", { className: "flex-grow flex-grow font-600 text-body-m", children: o(j.label) }) }) : /* @__PURE__ */ e.jsx("span", { className: "text-gray-400 font-600 text-body-m", children: A }),
+          i ? /* @__PURE__ */ e.jsx("div", { className: "flex items-center w-full", children: /* @__PURE__ */ e.jsx("span", { className: "flex-grow font-600 text-body-m", children: o(i.label) }) }) : /* @__PURE__ */ e.jsx("span", { className: "text-gray-400 font-600 text-body-m", children: B }),
           /* @__PURE__ */ e.jsx(
             "svg",
             {
@@ -131,43 +131,65 @@ const ce = ({
       }
     ),
     r && /* @__PURE__ */ e.jsx("p", { className: "mt-1 text-sm text-red-600", children: r }),
-    N && /* @__PURE__ */ e.jsxs(
+    R && /* @__PURE__ */ e.jsxs(
       "div",
       {
-        ref: v.setFloating,
+        ref: d.setFloating,
         style: {
-          position: $,
-          top: O ?? 0,
-          left: T ?? 0,
-          ...I
+          position: M,
+          top: S ?? 0,
+          left: L ?? 0,
+          ...z,
+          width: d.reference.current instanceof Element ? d.reference.current.clientWidth : void 0,
+          zIndex: 50
         },
-        className: "z-10 w-full bg-white border border-blue-400 rounded-3xl shadow-lg overflow-auto",
-        ...F(),
+        className: "bg-white border border-blue-400 rounded-3xl shadow-lg overflow-hidden",
+        ...P(),
         children: [
-          f && /* @__PURE__ */ e.jsx("div", { className: "sticky top-0 bg-white p-2 z-20", children: /* @__PURE__ */ e.jsx(
-            "input",
-            {
-              ref: h,
-              type: "text",
-              className: "w-full p-16",
-              placeholder: "Search...",
-              value: x,
-              onChange: (t) => y(t.target.value),
-              onClick: (t) => t.stopPropagation(),
-              autoFocus: !0
-            }
-          ) }),
-          /* @__PURE__ */ e.jsx("div", { className: "", children: S.length > 0 ? /* @__PURE__ */ e.jsx("ul", { children: S.map((t, n) => /* @__PURE__ */ e.jsx(
+          f && /* @__PURE__ */ e.jsx("div", { className: "sticky top-0 bg-white p-8 border-b border-gray-100 z-20", children: /* @__PURE__ */ e.jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ e.jsx("div", { className: "absolute inset-y-0 left-0 pl-12 flex items-center pointer-events-none", children: /* @__PURE__ */ e.jsx("svg", { className: "h-16 w-16 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }) }),
+            /* @__PURE__ */ e.jsx(
+              "input",
+              {
+                ref: b,
+                type: "text",
+                className: "w-full py-8 pl-40 pr-12 rounded-full focus:outline-none text-body-s",
+                placeholder: o("search_options"),
+                value: a,
+                onChange: (t) => y(t.target.value),
+                onClick: (t) => t.stopPropagation(),
+                autoFocus: !0
+              }
+            ),
+            a && /* @__PURE__ */ e.jsx(
+              "button",
+              {
+                className: "absolute inset-y-0 right-0 pr-12 flex items-center",
+                onClick: (t) => {
+                  t.stopPropagation(), y("");
+                },
+                children: /* @__PURE__ */ e.jsx("svg", { className: "h-16 w-16 text-gray-400 hover:text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M6 18L18 6M6 6l12 12" }) })
+              }
+            )
+          ] }) }),
+          /* @__PURE__ */ e.jsx("div", { className: "max-h-[250px] overflow-y-auto", children: w.length > 0 ? /* @__PURE__ */ e.jsx("ul", { className: "py-4", children: w.map((t, n) => /* @__PURE__ */ e.jsx(
             "li",
             {
-              className: "flex items-center justify-between px-16 py-8 transition-all duration-200 hover:bg-blue-100/50 cursor-pointer",
-              onClick: (i) => {
-                i.stopPropagation(), M(t);
+              className: `flex items-center px-16 py-10 transition-all duration-200 hover:bg-blue-50 cursor-pointer ${(i == null ? void 0 : i.key) === t.key ? "bg-blue-100/30 text-blue-500 font-medium" : ""}`,
+              onClick: (u) => {
+                u.stopPropagation(), F(t);
               },
               children: /* @__PURE__ */ e.jsx("span", { children: o(t.label) })
             },
             `${t.key}-${n}`
-          )) }) : /* @__PURE__ */ e.jsx("div", { className: "px-16 py-8 text-gray-500 text-body-s", children: o("no_options_found") }) })
+          )) }) : /* @__PURE__ */ e.jsxs("div", { className: "px-16 py-16 text-center text-gray-500", children: [
+            /* @__PURE__ */ e.jsx("svg", { className: "mx-auto h-24 w-24 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ e.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
+            /* @__PURE__ */ e.jsxs("p", { className: "mt-8 text-body-s", children: [
+              'No matches found for "',
+              a,
+              '"'
+            ] })
+          ] }) })
         ]
       }
     )

package/dist/components/atoms/UncontrolledSelector/UncontrolledSelector.d.ts

@@ -11,6 +11,8 @@ interface UncontrolledSelectorProps {
     label?: string;
     error?: string;
     disabled?: boolean;
+    className?: string;
+    allowSearch?: boolean;
 }
 declare const UncontrolledSelector: React.FC<UncontrolledSelectorProps>;
 export default UncontrolledSelector;

package/dist/components/atoms/UncontrolledSelector/UncontrolledSelector.js

@@ -1,58 +1,196 @@
-import { j as e } from "../../../_virtual/jsx-runtime.js";
-import { useState as m } from "react";
-import u from "../../molecules/FloatingMenu/FloatingMenu.js";
-import { FontAwesomeIcon as f } from "../../../node_modules/@fortawesome/react-fontawesome/index.es.js";
-import { faChevronDown as p } from "../../../node_modules/@fortawesome/pro-regular-svg-icons/index.js";
-const v = ({ options: r, onChange: n, value: o, disabled: i, error: d, label: c, placeholder: x }) => {
-  var s;
-  const [l, a] = m(!1);
-  return /* @__PURE__ */ e.jsx(
-    u,
-    {
-      open: l,
-      onClose: () => a(!1),
-      offset: 12,
-      padding: 0,
-      placement: "bottom",
-      className: "!p-0 overflow-hidden",
-      strategy: "fixed",
-      component: /* @__PURE__ */ e.jsx("div", { className: "bg-white rounded-lg shadow-lg max-h-[150px] overflow-y-auto flex flex-col py-8", children: r.map((t) => /* @__PURE__ */ e.jsx(
-        "button",
-        {
-          onClick: () => n(t.value),
-          className: `w-full text-center px-16 py-8 transition-all duration-100 hover:bg-blue-100 ${o === t.label ? "text-blue-500 font-medium" : ""}`,
-          children: t.label
+import { j as t } from "../../../_virtual/jsx-runtime.js";
+import M, { useState as k, useRef as N, useMemo as f } from "react";
+import { useFloating as D, useClick as I, useDismiss as U, useInteractions as _, useTransitionStyles as H } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
+import Y from "fuse.js";
+import { autoUpdate as q } from "../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
+import { offset as G, flip as J, shift as K, size as Q, arrow as X } from "../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";
+const le = ({
+  options: r,
+  onChange: x,
+  value: s,
+  disabled: d,
+  error: a,
+  label: g = "Select an option",
+  placeholder: L = "Select an option...",
+  className: S = "",
+  allowSearch: b = !1
+}) => {
+  const [l, u] = k(!1), [o, m] = k(""), p = N(null), C = N(null), y = r.find((e) => e.value === s), j = f(() => r.map((e) => ({
+    ...e,
+    // Extract text from React nodes if needed
+    searchableLabel: typeof e.label == "string" ? e.label : M.isValidElement(e.label) ? c(e.label) : String(e.label),
+    searchableValue: String(e.value)
+  })), [r]), v = f(() => {
+    const e = {
+      keys: [
+        { name: "searchableLabel", weight: 2 },
+        { name: "searchableValue", weight: 1 }
+      ],
+      threshold: 0.2,
+      // Lower threshold for stricter matching
+      distance: 150,
+      // Increased distance for better fuzzy matching
+      includeScore: !0,
+      includeMatches: !0,
+      // For highlighting matches
+      ignoreLocation: !0,
+      minMatchCharLength: 1,
+      shouldSort: !0,
+      findAllMatches: !0
+    };
+    return new Y(j, e);
+  }, [j]), { x: $, y: O, strategy: R, refs: i, context: h } = D({
+    open: l,
+    onOpenChange: u,
+    middleware: [
+      G(8),
+      J(),
+      K({ padding: 8 }),
+      Q({
+        apply({ availableHeight: e, elements: n }) {
+          Object.assign(n.floating.style, {
+            maxHeight: `${Math.min(e - 10, 300)}px`
+          });
         },
-        t.value
-      )) }),
-      children: /* @__PURE__ */ e.jsxs("div", { className: "flex flex-col gap-8 relative", onClick: () => a(!l), children: [
-        /* @__PURE__ */ e.jsx(
-          "h6",
-          {
-            className: `text-gray-600 font-600 group ${d && "!text-red-500"} text-label ${i && "text-gray-300"}`,
-            children: c
-          }
-        ),
-        /* @__PURE__ */ e.jsxs(
-          "div",
-          {
-            className: `px-10 py-8 bg-blue-50 border-1 border-blue-200 rounded-full flex items-center gap-8 cursor-pointer transition-colors duration-150 ease-in-out ${l ? "!border-blue-500" : ""}`,
-            children: [
-              o ? /* @__PURE__ */ e.jsx("h4", { className: "text-body-m", children: (s = r.find((t) => t.value === o)) == null ? void 0 : s.label }) : /* @__PURE__ */ e.jsx("h4", { className: "text-body-m text-gray-400", children: x }),
-              /* @__PURE__ */ e.jsx(
-                f,
+        padding: 8
+      }),
+      X({ element: C })
+    ],
+    placement: "bottom-start",
+    whileElementsMounted: q
+  }), T = I(h), F = U(h), { getReferenceProps: P, getFloatingProps: z } = _([
+    T,
+    F
+  ]), { isMounted: A, styles: E } = H(h, {
+    duration: { open: 200, close: 150 },
+    initial: { opacity: 0, transform: "translateY(-4px)" }
+  }), w = f(() => o.trim() ? v.search(o).map((n) => ({
+    ...n.item,
+    score: n.score,
+    matches: n.matches
+  })) : r, [o, v, r]), W = (e) => {
+    x(e.value), u(!1), m("");
+  }, B = P({
+    onClick: () => {
+      d || (u(!l), !l && p.current && b && setTimeout(() => {
+        var e;
+        return (e = p.current) == null ? void 0 : e.focus();
+      }, 100));
+    }
+  });
+  return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${S}`, children: [
+    g && /* @__PURE__ */ t.jsx(
+      "h6",
+      {
+        className: `text-gray-600 font-600 group ${a ? "!text-red-500" : ""} text-label ${d ? "text-gray-300" : ""}`,
+        children: g
+      }
+    ),
+    /* @__PURE__ */ t.jsxs(
+      "div",
+      {
+        ref: i.setReference,
+        className: `flex items-center justify-between bg-light rounded-full p-16 cursor-pointer
+          border transition-all duration-200 ${d ? "opacity-60 cursor-not-allowed" : "hover:border-blue-400"}
+          ${a ? "border-red-500 hover:border-red-600" : ""} ${l ? "border-blue-400" : "border-blue-100"}`,
+        ...B,
+        children: [
+          y ? /* @__PURE__ */ t.jsx("div", { className: "flex items-center w-full", children: /* @__PURE__ */ t.jsx("span", { className: "flex-grow font-600 text-body-m", children: y.label }) }) : /* @__PURE__ */ t.jsx("span", { className: "text-gray-400 font-600 text-body-m", children: L }),
+          /* @__PURE__ */ t.jsx(
+            "svg",
+            {
+              className: `w-16 h-16 transition-transform ${l ? "transform rotate-180" : ""}`,
+              fill: "none",
+              stroke: "currentColor",
+              viewBox: "0 0 24 24",
+              children: /* @__PURE__ */ t.jsx(
+                "path",
                 {
-                  icon: p,
-                  className: `text-gray-400 transition-all duration-150 ease-in-out ${l ? "rotate-180" : ""}`
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  strokeWidth: "2",
+                  d: "M19 9l-7 7-7-7"
                 }
               )
-            ]
-          }
-        )
-      ] })
-    }
-  );
+            }
+          )
+        ]
+      }
+    ),
+    a && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: a }),
+    A && /* @__PURE__ */ t.jsxs(
+      "div",
+      {
+        ref: i.setFloating,
+        style: {
+          position: R,
+          top: O ?? 0,
+          left: $ ?? 0,
+          ...E,
+          width: i.reference.current instanceof Element ? i.reference.current.clientWidth : void 0,
+          zIndex: 50
+        },
+        className: "bg-white border border-blue-400 rounded-3xl shadow-lg overflow-hidden",
+        ...z(),
+        children: [
+          b && /* @__PURE__ */ t.jsx("div", { className: "sticky top-0 bg-white p-8 border-b border-gray-100 z-20", children: /* @__PURE__ */ t.jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ t.jsx("div", { className: "absolute inset-y-0 left-0 pl-12 flex items-center pointer-events-none", children: /* @__PURE__ */ t.jsx("svg", { className: "h-16 w-16 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ t.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z" }) }) }),
+            /* @__PURE__ */ t.jsx(
+              "input",
+              {
+                ref: p,
+                type: "text",
+                className: "w-full py-8 pl-40 pr-12 rounded-full focus:outline-none text-body-s",
+                placeholder: "Search options...",
+                value: o,
+                onChange: (e) => m(e.target.value),
+                onClick: (e) => e.stopPropagation(),
+                autoFocus: !0
+              }
+            ),
+            o && /* @__PURE__ */ t.jsx(
+              "button",
+              {
+                className: "absolute inset-y-0 right-0 pr-12 flex items-center",
+                onClick: (e) => {
+                  e.stopPropagation(), m("");
+                },
+                children: /* @__PURE__ */ t.jsx("svg", { className: "h-16 w-16 text-gray-400 hover:text-gray-600", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ t.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M6 18L18 6M6 6l12 12" }) })
+              }
+            )
+          ] }) }),
+          /* @__PURE__ */ t.jsx("div", { className: "max-h-[250px] overflow-y-auto", children: w.length > 0 ? /* @__PURE__ */ t.jsx("ul", { className: "py-4", children: w.map((e, n) => /* @__PURE__ */ t.jsx(
+            "li",
+            {
+              className: `flex items-center px-16 py-10 transition-all duration-200 hover:bg-blue-50 cursor-pointer ${s === e.value ? "bg-blue-100/30 text-blue-500 font-medium" : ""}`,
+              onClick: (V) => {
+                V.stopPropagation(), W(e);
+              },
+              children: /* @__PURE__ */ t.jsx("span", { children: e.label })
+            },
+            `${e.value}-${n}`
+          )) }) : /* @__PURE__ */ t.jsxs("div", { className: "px-16 py-16 text-center text-gray-500", children: [
+            /* @__PURE__ */ t.jsx("svg", { className: "mx-auto h-24 w-24 text-gray-400", fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", children: /* @__PURE__ */ t.jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: "2", d: "M9.172 16.172a4 4 0 015.656 0M9 10h.01M15 10h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" }) }),
+            /* @__PURE__ */ t.jsxs("p", { className: "mt-8 text-body-s", children: [
+              'No matches found for "',
+              o,
+              '"'
+            ] })
+          ] }) })
+        ]
+      }
+    )
+  ] });
+}, c = (r) => {
+  if (typeof r == "string") return r;
+  if (typeof r == "number" || typeof r == "boolean") return String(r);
+  if (!r) return "";
+  if (M.isValidElement(r)) {
+    const s = r.props.children;
+    return s ? Array.isArray(s) ? s.map(c).join(" ") : c(s) : "";
+  }
+  return Array.isArray(r) ? r.map(c).join(" ") : "";
 };
 export {
-  v as default
+  le as default
 };