npm - lawgic-dev-kit - Versions diffs - 0.21.0 → 0.21.4 - Mend

lawgic-dev-kit 0.21.0 → 0.21.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/dist/components/atoms/SelectInput/SelectInput.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 import { FieldValues } from 'react-hook-form';
 import { SelectInputProps } from './SelectInput.types';
-declare const SelectInput: <T extends FieldValues>({ options, name, control, label, placeholder, className, input, }: SelectInputProps<T>) => import("react/jsx-runtime").JSX.Element;
+declare const SelectInput: <T extends FieldValues>({ options, name, control, label, placeholder, className, input, dropdownStyle, innerClassName }: SelectInputProps<T>) => import("react/jsx-runtime").JSX.Element;
 export default SelectInput;

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

@@ -1,114 +1,120 @@
 import { j as e } from "../../../_virtual/jsx-runtime.js";
-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 = ({
+import { useFloating as U, useClick as Y, useDismiss as _, useInteractions as q, useTransitionStyles as G } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
+import { useState as w, useRef as L, useEffect as J } from "react";
+import { Controller as K } from "react-hook-form";
+import { useTheme as Q } from "../../../hooks/useTheme.js";
+import { autoUpdate as V } from "../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
+import { offset as X, flip as Z, shift as ee, size as te, arrow as se } from "../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";
+const ue = ({
   options: c,
   name: l,
   control: p,
-  label: m = "Select an option",
-  placeholder: x = "Type to search...",
+  label: x = "Select an option",
+  placeholder: m = "Type to search...",
   className: r = "",
-  input: h = !0
+  input: h = !0,
+  dropdownStyle: f = {},
+  innerClassName: g = ""
 }) => /* @__PURE__ */ e.jsx(
-  G,
+  K,
   {
     name: l,
     control: p,
-    render: ({ field: { onChange: f, value: o }, fieldState: { error: s } }) => /* @__PURE__ */ e.jsx(
-      te,
+    render: ({ field: { onChange: b, value: n }, fieldState: { error: s } }) => /* @__PURE__ */ e.jsx(
+      re,
       {
         options: c,
-        value: o,
-        onChange: f,
-        label: m,
-        placeholder: x,
+        value: n,
+        onChange: b,
+        label: x,
+        placeholder: m,
         error: s == null ? void 0 : s.message,
         className: r,
-        input: h
+        input: h,
+        dropdownStyle: f,
+        innerClassName: g
       }
     )
   }
-), te = ({
+), re = ({
   options: c,
   value: l,
   onChange: p,
-  label: m = "Select an option",
-  placeholder: x = "Type to search...",
+  label: x = "Select an option",
+  placeholder: m = "Type to search...",
   error: r,
-  className: h = "",
-  input: f = !0
+  input: h = !0,
+  className: f = "",
+  dropdownStyle: g = {},
+  innerClassName: b = ""
 }) => {
-  const { t: o } = J(), [s, g] = k(!1), [a, y] = k(""), [i, v] = k(
+  const { t: n } = Q(), [s, y] = w(!1), [a, j] = w(""), [i, N] = w(
     l || null
-  ), b = N(null), C = N(null), { x: L, y: S, strategy: M, refs: d, context: j } = D({
+  ), k = L(null), S = L(null), { x: M, y: T, strategy: $, refs: d, context: v } = U({
     open: s,
-    onOpenChange: g,
+    onOpenChange: y,
     middleware: [
-      Q(8),
-      V(),
-      X({ padding: 8 }),
-      Z({
-        apply({ availableHeight: t, elements: n }) {
-          Object.assign(n.floating.style, {
+      X(8),
+      Z(),
+      ee({ padding: 8 }),
+      te({
+        apply({ availableHeight: t, elements: o }) {
+          Object.assign(o.floating.style, {
             maxHeight: `${Math.min(t - 10, 300)}px`
           });
         },
         padding: 8
       }),
-      ee({ element: C })
+      se({ element: S })
     ],
     placement: "bottom-start",
-    whileElementsMounted: K
-  }), T = H(j), $ = U(j), { getReferenceProps: O, getFloatingProps: P } = Y([
-    T,
-    $
-  ]), { isMounted: R, styles: z } = _(j, {
+    whileElementsMounted: V
+  }), O = Y(v), P = _(v), { getReferenceProps: R, getFloatingProps: z } = q([
+    O,
+    P
+  ]), { isMounted: F, styles: I } = G(v, {
     duration: { open: 200, close: 150 },
     initial: { opacity: 0, transform: "translateY(-4px)" }
-  }), w = (() => {
+  }), C = (() => {
     const t = Array.isArray(c) ? c : [];
     if (!a.trim()) return t;
-    const n = a.toLowerCase();
+    const o = a.toLowerCase();
     return t.filter((u) => {
-      const E = u.label.toLowerCase(), A = u.key.toLowerCase();
-      return E.includes(n) || A.includes(n);
+      const D = u.label.toLowerCase(), H = u.key.toLowerCase();
+      return D.includes(o) || H.includes(o);
     });
-  })(), F = (t) => {
-    v(t), g(!1), y(""), p(t);
-  }, I = () => {
-    g(!s), !s && b.current && setTimeout(() => {
+  })(), W = (t) => {
+    N(t), y(!1), j(""), p(t);
+  }, B = () => {
+    y(!s), !s && k.current && setTimeout(() => {
       var t;
-      return (t = b.current) == null ? void 0 : t.focus();
+      return (t = k.current) == null ? void 0 : t.focus();
     }, 100);
   };
-  q(() => {
-    v(l);
+  J(() => {
+    N(l);
   }, [l]);
-  const W = O({
-    onClick: I
-  }), B = o(x);
-  return /* @__PURE__ */ e.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${h}`, children: [
+  const E = R({
+    onClick: B
+  }), A = n(m);
+  return /* @__PURE__ */ e.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${f}`, children: [
     /* @__PURE__ */ e.jsx(
       "h6",
       {
         className: `text-gray-600 font-600 group ${r ? "!text-red-500" : ""} text-label`,
-        children: m
+        children: x
       }
     ),
     /* @__PURE__ */ e.jsxs(
       "div",
       {
         ref: d.setReference,
-        className: `flex items-center justify-between bg-light rounded-full p-16 cursor-pointer
+        className: `${b} 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" : ""} ${s ? "border-blue-400" : "border-blue-100"}`,
-        ...W,
+        ...E,
         children: [
-          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 }),
+          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: n(i.label) }) }) : /* @__PURE__ */ e.jsx("span", { className: "text-gray-400 font-600 text-body-m", children: A }),
           /* @__PURE__ */ e.jsx(
             "svg",
             {
@@ -131,32 +137,33 @@ const ce = ({
       }
     ),
     r && /* @__PURE__ */ e.jsx("p", { className: "mt-1 text-sm text-red-600", children: r }),
-    R && /* @__PURE__ */ e.jsxs(
+    F && /* @__PURE__ */ e.jsxs(
       "div",
       {
         ref: d.setFloating,
         style: {
-          position: M,
-          top: S ?? 0,
-          left: L ?? 0,
-          ...z,
+          position: $,
+          top: T ?? 0,
+          left: M ?? 0,
+          ...I,
           width: d.reference.current instanceof Element ? d.reference.current.clientWidth : void 0,
-          zIndex: 50
+          zIndex: 50,
+          ...g
         },
         className: "bg-white border border-blue-400 rounded-3xl shadow-lg overflow-hidden",
-        ...P(),
+        ...z(),
         children: [
-          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: [
+          h && /* @__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,
+                ref: k,
                 type: "text",
                 className: "w-full py-8 pl-40 pr-12 rounded-full focus:outline-none text-body-s",
-                placeholder: o("search_options"),
+                placeholder: n("search_options"),
                 value: a,
-                onChange: (t) => y(t.target.value),
+                onChange: (t) => j(t.target.value),
                 onClick: (t) => t.stopPropagation(),
                 autoFocus: !0
               }
@@ -166,22 +173,22 @@ const ce = ({
               {
                 className: "absolute inset-y-0 right-0 pr-12 flex items-center",
                 onClick: (t) => {
-                  t.stopPropagation(), y("");
+                  t.stopPropagation(), j("");
                 },
                 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(
+          /* @__PURE__ */ e.jsx("div", { className: "max-h-[250px] overflow-y-auto", children: C.length > 0 ? /* @__PURE__ */ e.jsx("ul", { className: "py-4", children: C.map((t, o) => /* @__PURE__ */ e.jsx(
             "li",
             {
               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);
+                u.stopPropagation(), W(t);
               },
-              children: /* @__PURE__ */ e.jsx("span", { children: o(t.label) })
+              children: /* @__PURE__ */ e.jsx("span", { children: typeof t.label == "string" ? n(t.label) : t.expandedLabel || t.label })
             },
-            `${t.key}-${n}`
+            `${t.key}-${o}`
           )) }) : /* @__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: [
@@ -196,5 +203,5 @@ const ce = ({
   ] });
 };
 export {
-  ce as default
+  ue as default
 };

package/dist/components/atoms/SelectInput/SelectInput.types.d.ts CHANGED Viewed

@@ -2,6 +2,7 @@ import { Control, FieldValues, Path } from 'react-hook-form';
 export interface Option {
     key: string;
     label: string;
+    expandedLabel?: string | React.ReactNode;
 }
 export interface SelectInputProps<T extends FieldValues> {
     options: Option[];
@@ -9,8 +10,10 @@ export interface SelectInputProps<T extends FieldValues> {
     control: Control<T>;
     label?: string;
     placeholder?: string;
-    className?: string;
     input?: boolean;
+    className?: string;
+    innerClassName?: string;
+    dropdownStyle?: React.CSSProperties;
 }
 export interface SelectInputFieldProps {
     options: Option[];
@@ -19,6 +22,8 @@ export interface SelectInputFieldProps {
     label?: string;
     placeholder?: string;
     error?: string;
-    className?: string;
     input?: boolean;
+    className?: string;
+    innerClassName?: string;
+    dropdownStyle?: React.CSSProperties;
 }

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

@@ -1,7 +1,8 @@
 import { default as React } from 'react';
 interface Option {
-    label: string | React.ReactNode;
     value: number | string;
+    label: string | React.ReactNode;
+    expandedLabel?: string | React.ReactNode;
 }
 interface UncontrolledSelectorProps {
     value: number | string;
@@ -11,8 +12,10 @@ interface UncontrolledSelectorProps {
     label?: string;
     error?: string;
     disabled?: boolean;
-    className?: string;
     allowSearch?: boolean;
+    className?: string;
+    innerClassName?: string;
+    dropdownStyle?: React.CSSProperties;
 }
 declare const UncontrolledSelector: React.FC<UncontrolledSelectorProps>;
 export default UncontrolledSelector;

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

@@ -1,26 +1,28 @@
 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 = ({
+import M, { useState as k, useRef as N, useMemo as p } from "react";
+import { useFloating as U, useClick as _, useDismiss as H, useInteractions as Y, useTransitionStyles as q } from "../../../node_modules/@floating-ui/react/dist/floating-ui.react.js";
+import G from "fuse.js";
+import { autoUpdate as J } from "../../../node_modules/@floating-ui/dom/dist/floating-ui.dom.js";
+import { offset as K, flip as Q, shift as X, size as Z, arrow as ee } from "../../../node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js";
+const ie = ({
   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
+  error: o,
+  label: g = "",
+  placeholder: L = "",
+  allowSearch: b = !1,
+  className: C = "",
+  innerClassName: $ = "",
+  dropdownStyle: S = {}
 }) => {
-  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) => ({
+  const [a, u] = k(!1), [l, m] = k(""), h = N(null), O = N(null), y = r.find((e) => e.value === s), j = p(() => 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(() => {
+  })), [r]), v = p(() => {
     const e = {
       keys: [
         { name: "searchableLabel", weight: 2 },
@@ -38,15 +40,15 @@ const le = ({
       shouldSort: !0,
       findAllMatches: !0
     };
-    return new Y(j, e);
-  }, [j]), { x: $, y: O, strategy: R, refs: i, context: h } = D({
-    open: l,
+    return new G(j, e);
+  }, [j]), { x: R, y: T, strategy: F, refs: i, context: f } = U({
+    open: a,
     onOpenChange: u,
     middleware: [
-      G(8),
-      J(),
-      K({ padding: 8 }),
-      Q({
+      K(8),
+      Q(),
+      X({ padding: 8 }),
+      Z({
         apply({ availableHeight: e, elements: n }) {
           Object.assign(n.floating.style, {
             maxHeight: `${Math.min(e - 10, 300)}px`
@@ -54,35 +56,35 @@ const le = ({
         },
         padding: 8
       }),
-      X({ element: C })
+      ee({ element: O })
     ],
     placement: "bottom-start",
-    whileElementsMounted: q
-  }), T = I(h), F = U(h), { getReferenceProps: P, getFloatingProps: z } = _([
-    T,
-    F
-  ]), { isMounted: A, styles: E } = H(h, {
+    whileElementsMounted: J
+  }), P = _(f), z = H(f), { getReferenceProps: A, getFloatingProps: E } = Y([
+    P,
+    z
+  ]), { isMounted: W, styles: B } = q(f, {
     duration: { open: 200, close: 150 },
     initial: { opacity: 0, transform: "translateY(-4px)" }
-  }), w = f(() => o.trim() ? v.search(o).map((n) => ({
+  }), w = p(() => l.trim() ? v.search(l).map((n) => ({
     ...n.item,
     score: n.score,
     matches: n.matches
-  })) : r, [o, v, r]), W = (e) => {
+  })) : r, [l, v, r]), V = (e) => {
     x(e.value), u(!1), m("");
-  }, B = P({
+  }, D = A({
     onClick: () => {
-      d || (u(!l), !l && p.current && b && setTimeout(() => {
+      d || (u(!a), !a && h.current && b && setTimeout(() => {
         var e;
-        return (e = p.current) == null ? void 0 : e.focus();
+        return (e = h.current) == null ? void 0 : e.focus();
       }, 100));
     }
   });
-  return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${S}`, children: [
+  return /* @__PURE__ */ t.jsxs("div", { className: `w-full relative flex flex-col gap-8 ${C}`, children: [
     g && /* @__PURE__ */ t.jsx(
       "h6",
       {
-        className: `text-gray-600 font-600 group ${a ? "!text-red-500" : ""} text-label ${d ? "text-gray-300" : ""}`,
+        className: `text-gray-600 font-600 group ${o ? "!text-red-500" : ""} text-label ${d ? "text-gray-300" : ""}`,
         children: g
       }
     ),
@@ -90,16 +92,16 @@ const le = ({
       "div",
       {
         ref: i.setReference,
-        className: `flex items-center justify-between bg-light rounded-full p-16 cursor-pointer
+        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,
+          ${o ? "border-red-500 hover:border-red-600" : ""} ${a ? "border-blue-400" : "border-blue-100"}`,
+        ...D,
         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" : ""}`,
+              className: `w-16 h-16 transition-transform ${a ? "transform rotate-180" : ""}`,
               fill: "none",
               stroke: "currentColor",
               viewBox: "0 0 24 24",
@@ -117,38 +119,39 @@ const le = ({
         ]
       }
     ),
-    a && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: a }),
-    A && /* @__PURE__ */ t.jsxs(
+    o && /* @__PURE__ */ t.jsx("p", { className: "mt-1 text-sm text-red-600", children: o }),
+    W && /* @__PURE__ */ t.jsxs(
       "div",
       {
         ref: i.setFloating,
         style: {
-          position: R,
-          top: O ?? 0,
-          left: $ ?? 0,
-          ...E,
+          position: F,
+          top: T ?? 0,
+          left: R ?? 0,
+          ...B,
           width: i.reference.current instanceof Element ? i.reference.current.clientWidth : void 0,
-          zIndex: 50
+          zIndex: 50,
+          ...S
         },
         className: "bg-white border border-blue-400 rounded-3xl shadow-lg overflow-hidden",
-        ...z(),
+        ...E(),
         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,
+                ref: h,
                 type: "text",
                 className: "w-full py-8 pl-40 pr-12 rounded-full focus:outline-none text-body-s",
                 placeholder: "Search options...",
-                value: o,
+                value: l,
                 onChange: (e) => m(e.target.value),
                 onClick: (e) => e.stopPropagation(),
                 autoFocus: !0
               }
             ),
-            o && /* @__PURE__ */ t.jsx(
+            l && /* @__PURE__ */ t.jsx(
               "button",
               {
                 className: "absolute inset-y-0 right-0 pr-12 flex items-center",
@@ -163,17 +166,17 @@ const le = ({
             "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);
+              onClick: (I) => {
+                I.stopPropagation(), V(e);
               },
-              children: /* @__PURE__ */ t.jsx("span", { children: e.label })
+              children: /* @__PURE__ */ t.jsx("span", { children: (e == null ? void 0 : e.expandedLabel) || 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,
+              l,
               '"'
             ] })
           ] }) })
@@ -192,5 +195,5 @@ const le = ({
   return Array.isArray(r) ? r.map(c).join(" ") : "";
 };
 export {
-  le as default
+  ie as default
 };