@new-black/lyra 1.0.30 → 1.0.31

package/dist/lyra36.js

@@ -1,13 +1,13 @@
 import { j as r } from "./lyra90.js";
-import { useContext as Q, useState as F, useRef as M, useCallback as y, useEffect as d, useMemo as g } from "react";
-import { Button as q, Group as I } from "./lyra89.js";
-import { clsx as X } from "./lyra450.js";
+import { useContext as K, useState as G, useMemo as T, useRef as J, useCallback as y, useEffect as M } from "react";
+import { Button as B, Group as pr } from "./lyra89.js";
+import { clsx as C } from "./lyra450.js";
 import "./lyra2.js";
 import "./lyra3.js";
 import "./lyra4.js";
 import "./lyra5.js";
 import "./lyra6.js";
-import { SvgIcon as z } from "./lyra65.js";
+import { SvgIcon as H } from "./lyra65.js";
 import "./lyra8.js";
 import "./lyra9.js";
 import "./lyra10.js";
@@ -26,35 +26,36 @@ import "./lyra22.js";
 import "./lyra23.js";
 import "./lyra24.js";
 import "./lyra25.js";
-import { FieldGroupContext as Y } from "./lyra26.js";
+import { FieldGroupContext as g } from "./lyra26.js";
 import "./lyra27.js";
 import "./lyra28.js";
 import "./lyra29.js";
 import "./lyra95.js";
 import "./lyra80.js";
-import "./lyra458.js";
-import { InputHeader as Z } from "./lyra38.js";
-import { InputFooter as _ } from "./lyra39.js";
-import { sharedInputStyles as O } from "./lyra40.js";
+import "./lyra452.js";
+import { InputHeader as I } from "./lyra38.js";
+import { InputFooter as rr } from "./lyra39.js";
+import { sharedInputStyles as Q } from "./lyra40.js";
 import "./lyra44.js";
 import "./lyra31.js";
 import "./lyra32.js";
 import "./lyra33.js";
 import "./lyra34.js";
 import "./lyra35.js";
-import rr from "./lyra597.js";
-import { sharedListStyles as or } from "./lyra452.js";
-import { SharedListItem as tr } from "./lyra453.js";
-import { Popover as sr } from "./lyra53.js";
+import er from "./lyra597.js";
+import { sharedListStyles as lr } from "./lyra453.js";
+import { SharedListItem as mr } from "./lyra454.js";
+import { Popover as ur } from "./lyra53.js";
 import "./lyra54.js";
 import "./lyra55.js";
 import "./lyra56.js";
-import { Text as R } from "./lyra73.js";
+import { Text as or } from "./lyra73.js";
 import "./lyra74.js";
-import { InputTagGroup as nr, InputTag as ir } from "./lyra459.js";
-import "./lyra460.js";
+import { InputTagGroup as fr, InputTag as xr } from "./lyra455.js";
+import "./lyra456.js";
+import { shouldRenderInputHeader as sr, shouldRenderInputFooter as tr } from "./lyra610.js";
 import "react-dom";
-import { useMousePosition as cr } from "./lyra84.js";
+import { useMousePosition as ar } from "./lyra84.js";
 import "./lyra41.js";
 import "./lyra42.js";
 import "./lyra43.js";
@@ -83,515 +84,515 @@ import "./lyra78.js";
 import "./lyra79.js";
 import "./lyra81.js";
 import "./lyra98.js";
-import { useLocale as B } from "./lyra88.js";
-const pr = ({
-  closePopover: e,
-  disabledItemIdKeys: i,
-  filteredItems: m,
+import { useLocale as nr } from "./lyra88.js";
+const jr = ({
+  closePopover: p,
+  disabledItemIdKeys: t,
+  filteredItems: e,
   getItemId: o,
-  onMultiChange: a,
-  onSingleChange: l,
-  value: s
+  onMultiChange: u,
+  onSingleChange: m,
+  value: i
 }) => {
-  const A = g(() => {
-    if (Array.isArray(s))
-      return s.length ? m.findIndex((t) => o(t) === o(s[0])) : 0;
-    if (s)
-      return m.findIndex((t) => o(t) === o(s));
-  }, [m, o, s]), [w, u] = F(A ?? 0), j = y(
-    (t) => {
-      if (Number.isInteger(t)) {
-        for (let n = t - 1; n >= 0; n--)
-          if (!(i != null && i.includes(o(m[n]))))
-            return Math.max(n, 0);
+  const S = T(() => {
+    if (Array.isArray(i))
+      return i.length ? e.findIndex((n) => o(n) === o(i[0])) : 0;
+    if (i)
+      return e.findIndex((n) => o(n) === o(i));
+  }, [e, o, i]), [j, f] = G(S ?? 0), h = y(
+    (n) => {
+      if (Number.isInteger(n)) {
+        for (let l = n - 1; l >= 0; l--)
+          if (!(t != null && t.includes(o(e[l]))))
+            return Math.max(l, 0);
       }
       return -1;
     },
-    [i, m, o]
+    [t, e, o]
   ), k = y(
-    (t) => {
-      if (Number.isInteger(t)) {
-        for (let n = t + 1; n < m.length; n++)
-          if (!(i != null && i.includes(o(m[n]))))
-            return Math.min(m.length - 1, n);
+    (n) => {
+      if (Number.isInteger(n)) {
+        for (let l = n + 1; l < e.length; l++)
+          if (!(t != null && t.includes(o(e[l]))))
+            return Math.min(e.length - 1, l);
       }
       return -1;
     },
-    [i, m, o]
-  ), D = M([]), x = y((t, n) => {
-    n && (D.current[t] = n);
+    [t, e, o]
+  ), D = J([]), N = y((n, l) => {
+    l && (D.current[n] = l);
   }, []), c = y(
-    (t) => {
-      if (a) {
-        const n = s ? [...s] : [], S = n.map(o), h = S != null && S.includes(o(t)) ? n.filter((V) => o(V) !== o(t)) : [...n, t];
-        a == null || a(h);
+    (n) => {
+      if (u) {
+        const l = i ? [...i] : [], v = l.map(o), a = v != null && v.includes(o(n)) ? l.filter((P) => o(P) !== o(n)) : [...l, n];
+        u == null || u(a);
       } else
-        l && (l == null || l(t));
+        m && (m == null || m(n));
     },
-    [o, a, l, s]
-  ), p = y(
-    (t) => Array.isArray(s) ? s.some((n) => o(n) === o(t)) : s ? o(s) === o(t) : !1,
-    [o, s]
-  ), N = cr(), f = M(void 0), P = y(
-    (t) => {
-      const n = w;
-      if (t.key === "ArrowDown") {
-        t.preventDefault();
-        const S = k(n);
-        if (S >= 0) {
-          u(S), f.current = N;
-          const h = D.current[S];
-          h == null || h.scrollIntoView({ block: "nearest" }), h == null || h.focus();
+    [o, u, m, i]
+  ), s = y(
+    (n) => Array.isArray(i) ? i.some((l) => o(l) === o(n)) : i ? o(i) === o(n) : !1,
+    [o, i]
+  ), w = ar(), x = J(void 0), A = y(
+    (n) => {
+      const l = j;
+      if (n.key === "ArrowDown") {
+        n.preventDefault();
+        const v = k(l);
+        if (v >= 0) {
+          f(v), x.current = w;
+          const a = D.current[v];
+          a == null || a.scrollIntoView({ block: "nearest" }), a == null || a.focus();
         }
-      } else if (t.key === "ArrowUp") {
-        t.preventDefault();
-        const S = j(n);
-        if (S >= 0) {
-          u(S);
-          const h = D.current[S];
-          h == null || h.scrollIntoView({ block: "nearest" }), h == null || h.focus(), f.current = N;
+      } else if (n.key === "ArrowUp") {
+        n.preventDefault();
+        const v = h(l);
+        if (v >= 0) {
+          f(v);
+          const a = D.current[v];
+          a == null || a.scrollIntoView({ block: "nearest" }), a == null || a.focus(), x.current = w;
         }
       } else
-        t.key === "Escape" && e();
+        n.key === "Escape" && p();
     },
-    [w, e, k, j, N]
-  ), G = y(
-    (t, n) => {
-      t && f.current !== N && (u(n), f.current = N);
+    [j, p, k, h, w]
+  ), $ = y(
+    (n, l) => {
+      n && x.current !== w && (f(l), x.current = w);
     },
-    [N]
+    [w]
   );
-  return d(() => {
-    var t;
-    (t = D.current) != null && t[w] && D.current[w].focus();
+  return M(() => {
+    var n;
+    (n = D.current) != null && n[j] && D.current[j].focus();
   }, [open]), {
-    activeItem: w,
-    assignRefOnIndex: x,
-    getItemIsSelected: p,
-    onKeyDown: P,
-    onHoverChange: G,
-    selectedItemIndex: A,
+    activeItem: j,
+    assignRefOnIndex: N,
+    getItemIsSelected: s,
+    onKeyDown: A,
+    onHoverChange: $,
+    selectedItemIndex: S,
     toggleSelection: c
   };
-}, er = ({
-  disabledItemIdKeys: e,
-  getItemId: i,
-  items: m,
+}, hr = ({
+  disabledItemIdKeys: p,
+  getItemId: t,
+  items: e,
   onMultiChange: o,
-  onSingleChange: a,
-  selectRenderElements: l,
-  setOpenPopover: s,
-  value: A
+  onSingleChange: u,
+  selectRenderElements: m,
+  setOpenPopover: i,
+  value: S
 }) => {
   const {
-    activeItem: w,
-    assignRefOnIndex: u,
-    getItemIsSelected: j,
+    activeItem: j,
+    assignRefOnIndex: f,
+    getItemIsSelected: h,
     onHoverChange: k,
     onKeyDown: D,
-    toggleSelection: x
-  } = pr({
-    closePopover: () => s(!1),
-    disabledItemIdKeys: e,
-    filteredItems: m,
-    getItemId: i,
+    toggleSelection: N
+  } = jr({
+    closePopover: () => i(!1),
+    disabledItemIdKeys: p,
+    filteredItems: e,
+    getItemId: t,
     onMultiChange: o,
-    onSingleChange: a,
-    value: A
-  }), c = (p) => (e == null ? void 0 : e.includes(i(p))) ?? !1;
+    onSingleChange: u,
+    value: S
+  }), c = (s) => (p == null ? void 0 : p.includes(t(s))) ?? !1;
   return /* @__PURE__ */ r.jsx(
     "div",
     {
-      className: or({
+      className: lr({
         className: "h-full max-h-72 overflow-auto"
       }),
-      children: m.map((p, N) => /* @__PURE__ */ r.jsx(
-        q,
+      children: e.map((s, w) => /* @__PURE__ */ r.jsx(
+        B,
         {
-          "data-index": N,
-          ref: (f) => u(N, f),
+          "data-index": w,
+          ref: (x) => f(w, x),
           className: "w-full text-start outline-none",
-          onHoverChange: (f) => {
-            k(f, N);
+          onHoverChange: (x) => {
+            k(x, w);
           },
-          onPress: () => x(p),
-          onKeyDown: (f) => D(f),
-          isDisabled: c(p),
+          onPress: () => N(s),
+          onKeyDown: (x) => D(x),
+          isDisabled: c(s),
           children: /* @__PURE__ */ r.jsx(
-            tr,
+            mr,
             {
-              item: p,
+              item: s,
               state: {
-                active: w === N,
-                disabled: (e == null ? void 0 : e.includes(i(p))) ?? !1,
-                selected: j(p)
+                active: j === w,
+                disabled: (p == null ? void 0 : p.includes(t(s))) ?? !1,
+                selected: h(s)
               },
-              selectRenderElements: l,
+              selectRenderElements: m,
               hasSelection: !0
             }
           )
         },
-        i(p)
+        t(s)
       ))
     }
   );
-}, K = ({
-  direction: e,
-  disabledItemIdKeys: i,
-  getItemId: m,
+}, ir = ({
+  direction: p,
+  disabledItemIdKeys: t,
+  getItemId: e,
   items: o,
-  label: a,
-  onMultiChange: l,
-  onSingleChange: s,
-  open: A,
-  placement: w = "bottom start",
-  selectRenderElements: u,
-  setOpenPopover: j,
+  label: u,
+  onMultiChange: m,
+  onSingleChange: i,
+  open: S,
+  placement: j = "bottom start",
+  selectRenderElements: f,
+  setOpenPopover: h,
   triggerRef: k,
   value: D
 }) => {
-  var N, f;
-  const [x, c] = F(
-    (N = k.current) == null ? void 0 : N.offsetWidth
-  ), p = x ?? ((f = k.current) == null ? void 0 : f.offsetWidth);
-  return rr("resize", () => {
-    var P;
-    c((P = k.current) == null ? void 0 : P.offsetWidth);
+  var w, x;
+  const [N, c] = G(
+    (w = k.current) == null ? void 0 : w.offsetWidth
+  ), s = N ?? ((x = k.current) == null ? void 0 : x.offsetWidth);
+  return er("resize", () => {
+    var A;
+    c((A = k.current) == null ? void 0 : A.offsetWidth);
   }), /* @__PURE__ */ r.jsx(
-    sr,
+    ur,
     {
       className: "p-1",
-      isOpen: A,
+      isOpen: S,
       triggerRef: k,
-      onOpenChange: j,
+      onOpenChange: h,
       shouldUpdatePosition: !0,
-      "aria-label": a,
+      "aria-label": u,
       disablePadding: !0,
-      placement: w,
+      placement: j,
       style: {
-        width: p && p > 280 ? p + "px" : "280px",
-        direction: e
+        width: s && s > 280 ? s + "px" : "280px",
+        direction: p
       },
-      children: A ? /* @__PURE__ */ r.jsx(
-        er,
+      children: S ? /* @__PURE__ */ r.jsx(
+        hr,
         {
-          getItemId: m,
+          getItemId: e,
           items: o,
-          onMultiChange: l,
-          onSingleChange: s,
-          selectRenderElements: u,
-          setOpenPopover: j,
+          onMultiChange: m,
+          onSingleChange: i,
+          selectRenderElements: f,
+          setOpenPopover: h,
           value: D,
-          disabledItemIdKeys: i
+          disabledItemIdKeys: t
         }
       ) : null
     }
   );
-}, mr = ({
-  disableClearLogic: e,
-  fullWidth: i,
-  getLabel: m,
+}, Nr = ({
+  disableClearLogic: p,
+  fullWidth: t,
+  getLabel: e,
   isDisabled: o,
-  isInvalid: a,
-  onChange: l,
-  placeholder: s,
-  renderCustomElementInValueButton: A,
-  selectRenderElements: w,
-  setOpenPopover: u,
-  value: j
+  isInvalid: u,
+  onChange: m,
+  placeholder: i,
+  renderCustomElementInValueButton: S,
+  selectRenderElements: j,
+  setOpenPopover: f,
+  value: h
 }) => {
-  var x;
-  const { inputField: k } = O({}), D = (c) => {
-    (c.key === "Escape" || c.key === "Backspace") && !e ? l == null || l(void 0) : c.key === "ArrowDown" && (c.preventDefault(), u(!0));
+  var N;
+  const { inputField: k } = Q({}), D = (c) => {
+    (c.key === "Escape" || c.key === "Backspace") && !p ? m == null || m(void 0) : c.key === "ArrowDown" && (c.preventDefault(), f(!0));
   };
   return /* @__PURE__ */ r.jsxs(
-    q,
+    B,
     {
-      className: ({ isFocused: c, isHovered: p }) => k({
-        fullWidth: i,
+      className: ({ isFocused: c, isHovered: s }) => k({
+        fullWidth: t,
         isDisabled: o,
-        isHovered: p,
+        isHovered: s,
         isFocused: c,
-        isInvalid: a,
+        isInvalid: u,
         hasEndSlot: !0,
-        className: X(
-          p && !a && !o && !c ? "border-hover" : "",
+        className: C(
+          s && !u && !o && !c ? "border-hover" : "",
           "min-h-8"
         )
       }),
       isDisabled: o,
       onKeyDown: D,
       onPress: () => {
-        u(!0);
+        f(!0);
       },
       children: [
         /* @__PURE__ */ r.jsxs("div", { className: "flex grow text-start", children: [
-          A && j ? (x = w(j)) == null ? void 0 : x.customElement : null,
-          j ? /* @__PURE__ */ r.jsx(r.Fragment, { children: m(j) }) : /* @__PURE__ */ r.jsx(R, { color: "secondary", children: s })
+          S && h ? (N = j(h)) == null ? void 0 : N.customElement : null,
+          h ? /* @__PURE__ */ r.jsx(r.Fragment, { children: e(h) }) : /* @__PURE__ */ r.jsx(or, { color: "secondary", children: i })
         ] }),
         /* @__PURE__ */ r.jsxs("div", { className: "flex items-center gap-2", children: [
-          j && !e && !o ? /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsx(
+          h && !p && !o ? /* @__PURE__ */ r.jsx(r.Fragment, { children: /* @__PURE__ */ r.jsx(
             "div",
             {
               className: "text-secondary",
               role: "button",
               onClick: (c) => {
-                c.stopPropagation(), l == null || l(void 0);
+                c.stopPropagation(), m == null || m(void 0);
               },
-              children: /* @__PURE__ */ r.jsx(z, { name: "clear" })
+              children: /* @__PURE__ */ r.jsx(H, { name: "clear" })
             }
           ) }) : null,
-          /* @__PURE__ */ r.jsx(z, { name: "chevron-up-down" })
+          /* @__PURE__ */ r.jsx(H, { name: "chevron-up-down" })
         ] })
       ]
     }
   );
-}, lr = ({
-  fullWidth: e,
-  getItemId: i,
-  getLabel: m,
+}, wr = ({
+  fullWidth: p,
+  getItemId: t,
+  getLabel: e,
   isDisabled: o,
-  isInvalid: a,
-  label: l,
-  onChange: s,
-  placeholder: A,
-  setOpenPopover: w,
-  value: u
+  isInvalid: u,
+  label: m,
+  onChange: i,
+  placeholder: S,
+  setOpenPopover: j,
+  value: f
 }) => {
-  const { inputField: j } = O({}), k = y(
-    (x) => {
-      u && s(
-        u.filter((c) => {
-          const p = i(c);
-          return !x.has(p);
+  const { inputField: h } = Q({}), k = y(
+    (N) => {
+      f && i(
+        f.filter((c) => {
+          const s = t(c);
+          return !N.has(s);
         })
       );
     },
-    [i, s, u]
-  ), D = (x) => {
-    (x.key === "ArrowDown" || x.key === "Enter" || x.key === " ") && (x.preventDefault(), w(!0));
+    [t, i, f]
+  ), D = (N) => {
+    (N.key === "ArrowDown" || N.key === "Enter" || N.key === " ") && (N.preventDefault(), j(!0));
   };
-  return /* @__PURE__ */ r.jsx(I, { children: ({ isFocusWithin: x }) => /* @__PURE__ */ r.jsx(
-    q,
+  return /* @__PURE__ */ r.jsx(pr, { children: ({ isFocusWithin: N }) => /* @__PURE__ */ r.jsx(
+    B,
     {
-      className: ({ isFocused: c, isHovered: p }) => j({
-        fullWidth: e,
+      className: ({ isFocused: c, isHovered: s }) => h({
+        fullWidth: p,
         isDisabled: o,
-        isHovered: p,
-        isFocused: c || x,
-        isInvalid: a,
+        isHovered: s,
+        isFocused: c || N,
+        isInvalid: u,
         hasEndSlot: !0,
-        className: X(
-          p && !a && !o && !c ? "border-hover" : "",
+        className: C(
+          s && !u && !o && !c ? "border-hover" : "",
           "items-start",
           "py-[0.4375rem]"
         )
       }),
       onKeyDown: (c) => D(c),
-      onPress: () => w(!0),
+      onPress: () => j(!0),
       isDisabled: o,
       children: /* @__PURE__ */ r.jsxs("div", { className: "flex w-full outline-none", children: [
-        /* @__PURE__ */ r.jsx("div", { className: "grow text-left", children: u && u.length ? /* @__PURE__ */ r.jsx(
-          nr,
+        /* @__PURE__ */ r.jsx("div", { className: "grow text-left", children: f && f.length ? /* @__PURE__ */ r.jsx(
+          fr,
           {
-            label: l ?? "Selected items",
+            label: m ?? "Selected items",
             className: "-m-1.5 -mt-[0.3125rem]",
             onRemove: o ? void 0 : k,
-            children: u.map((c) => /* @__PURE__ */ r.jsx(ir, { id: i(c), isDisabled: o, children: m(c) }, i(c)))
+            children: f.map((c) => /* @__PURE__ */ r.jsx(xr, { id: t(c), isDisabled: o, children: e(c) }, t(c)))
           }
-        ) : /* @__PURE__ */ r.jsx(R, { color: "secondary", children: A }) }),
-        /* @__PURE__ */ r.jsx(z, { name: "chevron-up-down", className: "h-4 w-4 min-w-4" })
+        ) : /* @__PURE__ */ r.jsx(or, { color: "secondary", children: S }) }),
+        /* @__PURE__ */ r.jsx(H, { name: "chevron-up-down", className: "h-4 w-4 min-w-4" })
       ] })
     }
   ) });
-}, C = ({
-  getItemId: e,
-  name: i,
-  value: m
-}) => i ? Array.isArray(m) ? m.map((o) => /* @__PURE__ */ r.jsx("input", { type: "hidden", name: i, value: e(o) }, e(o))) : m ? /* @__PURE__ */ r.jsx("input", { type: "hidden", name: i, value: e(m) }) : null : null, Xo = ({
-  defaultValue: e,
-  description: i,
-  disableClearLogic: m,
+}, cr = ({
+  getItemId: p,
+  name: t,
+  value: e
+}) => t ? Array.isArray(e) ? e.map((o) => /* @__PURE__ */ r.jsx("input", { type: "hidden", name: t, value: p(o) }, p(o))) : e ? /* @__PURE__ */ r.jsx("input", { type: "hidden", name: t, value: p(e) }) : null : null, Io = ({
+  defaultValue: p,
+  description: t,
+  disableClearLogic: e,
   disabledItemIdKeys: o,
-  errorMessage: a,
-  fullWidth: l = !0,
-  getItemId: s,
-  getLabel: A,
-  hideHintLabel: w,
-  hideInputFooter: u,
-  hideInputHeader: j,
+  errorMessage: u,
+  fullWidth: m = !0,
+  getItemId: i,
+  getLabel: S,
+  hideHintLabel: j,
+  hideInputFooter: f,
+  hideInputHeader: h,
   isDisabled: k,
   isInvalid: D,
-  isRequired: x,
+  isRequired: N,
   items: c,
-  label: p,
-  name: N,
-  onChange: f,
-  placeholder: P,
-  placement: G,
-  renderCustomElementInValueButton: t,
-  selectRenderElements: n,
-  value: S
+  label: s,
+  name: w,
+  onChange: x,
+  outerEndSlot: A,
+  outerStartSlot: $,
+  placeholder: n,
+  placement: l,
+  renderCustomElementInValueButton: v,
+  selectRenderElements: a,
+  value: P
 }) => {
-  const { isDisabled: h } = Q(Y), [V, $] = F(!1), U = k || h, [L, b] = F(S ?? e), { wrapper: H } = O({}), T = M(null), { direction: W } = B(), v = y(
-    (J) => {
-      b(J), f == null || f(J), $(!1);
+  const { isDisabled: X } = K(g), [Y, F] = G(!1), Z = k || X, [d, V] = G(P ?? p), O = T(
+    () => sr({ hideHintLabel: j, hideInputHeader: h, label: s }),
+    [j, h, s]
+  ), U = T(
+    () => tr({ description: t, errorMessage: u, hideInputFooter: f }),
+    [t, u, f]
+  ), { outerSlot: L, outerSlotsWrapper: z, wrapper: _ } = Q({
+    hasInputHeader: O,
+    hasLabel: !!s
+  }), R = J(null), { direction: q } = nr(), W = y(
+    (b) => {
+      V(b), x == null || x(b), F(!1);
     },
-    [f]
+    [x]
   );
-  d(() => {
-    b(S ?? e);
-  }, [e, S]);
-  const E = S ?? L;
+  M(() => {
+    V(P ?? p);
+  }, [p, P]);
+  const E = P ?? d;
   return /* @__PURE__ */ r.jsxs("div", { children: [
-    /* @__PURE__ */ r.jsx(C, { name: N, value: E, getItemId: s }),
-    /* @__PURE__ */ r.jsxs("div", { className: H({ fullWidth: l }), children: [
-      /* @__PURE__ */ r.jsx(
-        Z,
-        {
-          label: p,
-          hideHintLabel: w,
-          hideInputHeader: j,
-          isRequired: x
-        }
-      ),
-      /* @__PURE__ */ r.jsx("div", { ref: T, children: /* @__PURE__ */ r.jsx(
-        mr,
-        {
-          fullWidth: l,
-          isDisabled: U,
-          disableClearLogic: m,
-          isInvalid: D,
-          placeholder: P,
-          value: E,
-          getLabel: A,
-          getItemId: s,
-          label: p,
-          onChange: v,
-          setOpenPopover: $,
-          renderCustomElementInValueButton: t,
-          selectRenderElements: n
-        }
-      ) }),
-      /* @__PURE__ */ r.jsx(
-        _,
-        {
-          description: i,
-          errorMessage: a,
-          hideInputFooter: u
-        }
-      )
+    /* @__PURE__ */ r.jsx(cr, { name: w, value: E, getItemId: i }),
+    /* @__PURE__ */ r.jsxs("div", { className: z(), children: [
+      $ ? /* @__PURE__ */ r.jsx("div", { className: L(), children: $ }) : null,
+      /* @__PURE__ */ r.jsxs("div", { className: _({ fullWidth: m }), children: [
+        O ? /* @__PURE__ */ r.jsx(I, { label: s, hideHintLabel: j, isRequired: N }) : null,
+        /* @__PURE__ */ r.jsx("div", { ref: R, children: /* @__PURE__ */ r.jsx(
+          Nr,
+          {
+            fullWidth: m,
+            isDisabled: Z,
+            disableClearLogic: e,
+            isInvalid: D,
+            placeholder: n,
+            value: E,
+            getLabel: S,
+            getItemId: i,
+            label: s,
+            onChange: W,
+            setOpenPopover: F,
+            renderCustomElementInValueButton: v,
+            selectRenderElements: a
+          }
+        ) }),
+        U ? /* @__PURE__ */ r.jsx(rr, { description: t, errorMessage: u }) : null
+      ] }),
+      A ? /* @__PURE__ */ r.jsx("div", { className: L(), children: A }) : null
     ] }),
     /* @__PURE__ */ r.jsx(
-      K,
+      ir,
       {
-        triggerRef: T,
-        label: `${p} options`,
-        getItemId: s,
-        selectRenderElements: n,
+        triggerRef: R,
+        label: `${s} options`,
+        getItemId: i,
+        selectRenderElements: a,
         items: c,
-        open: V,
+        open: Y,
         disabledItemIdKeys: o,
-        direction: W,
-        setOpenPopover: $,
-        onSingleChange: v,
+        direction: q,
+        setOpenPopover: F,
+        onSingleChange: W,
         value: E,
-        placement: G
+        placement: l
       }
     )
   ] });
-}, Yo = ({
-  defaultValue: e,
-  description: i,
-  disableClearLogic: m,
+}, rs = ({
+  defaultValue: p,
+  description: t,
+  disableClearLogic: e,
   disabledItemIdKeys: o,
-  errorMessage: a,
-  fullWidth: l = !0,
-  getItemId: s,
-  getLabel: A,
-  hideHintLabel: w,
-  hideInputFooter: u,
-  hideInputHeader: j,
+  errorMessage: u,
+  fullWidth: m = !0,
+  getItemId: i,
+  getLabel: S,
+  hideHintLabel: j,
+  hideInputFooter: f,
+  hideInputHeader: h,
   isDisabled: k,
   isInvalid: D,
-  isRequired: x,
+  isRequired: N,
   items: c,
-  label: p,
-  name: N,
-  onChange: f,
-  placeholder: P,
-  placement: G,
-  selectRenderElements: t,
-  value: n
+  label: s,
+  name: w,
+  onChange: x,
+  outerEndSlot: A,
+  outerStartSlot: $,
+  placeholder: n,
+  placement: l,
+  selectRenderElements: v,
+  value: a
 }) => {
-  const { isDisabled: S } = Q(Y), h = k || S, [V, $] = F(!1), [U, L] = F(n ?? e), b = M(null), { direction: H } = B(), { wrapper: T } = O({}), W = y(
+  const { isDisabled: P } = K(g), X = k || P, [Y, F] = G(!1), [Z, d] = G(a ?? p), V = J(null), { direction: O } = nr(), U = T(
+    () => sr({ hideHintLabel: j, hideInputHeader: h, label: s }),
+    [j, h, s]
+  ), L = T(
+    () => tr({ description: t, errorMessage: u, hideInputFooter: f }),
+    [t, u, f]
+  ), { outerSlot: z, outerSlotsWrapper: _, wrapper: R } = Q({
+    hasInputHeader: U,
+    hasLabel: !!s
+  }), q = y(
     (E) => {
-      L(E), f == null || f(E);
+      d(E), x == null || x(E);
     },
-    [f]
+    [x]
   );
-  d(() => {
-    L(n ?? e);
-  }, [e, n]);
-  const v = n ?? U;
+  M(() => {
+    d(a ?? p);
+  }, [p, a]);
+  const W = a ?? Z;
   return /* @__PURE__ */ r.jsxs("div", { children: [
-    /* @__PURE__ */ r.jsx(C, { name: N, value: v, getItemId: s }),
-    /* @__PURE__ */ r.jsxs("div", { className: T({ fullWidth: l }), children: [
-      /* @__PURE__ */ r.jsx(
-        Z,
-        {
-          label: p,
-          hideHintLabel: w,
-          hideInputHeader: j,
-          isRequired: x
-        }
-      ),
-      /* @__PURE__ */ r.jsx("div", { ref: b, children: /* @__PURE__ */ r.jsx(
-        lr,
-        {
-          fullWidth: l,
-          isDisabled: h,
-          isInvalid: D,
-          placeholder: P,
-          value: v,
-          onChange: W,
-          getItemId: s,
-          getLabel: A,
-          label: p,
-          disableClearLogic: m,
-          setOpenPopover: $,
-          selectRenderElements: t
-        }
-      ) }),
-      /* @__PURE__ */ r.jsx(
-        _,
-        {
-          description: i,
-          errorMessage: a,
-          hideInputFooter: u
-        }
-      )
+    /* @__PURE__ */ r.jsx(cr, { name: w, value: W, getItemId: i }),
+    /* @__PURE__ */ r.jsxs("div", { className: _(), children: [
+      $ ? /* @__PURE__ */ r.jsx("div", { className: z(), children: $ }) : null,
+      /* @__PURE__ */ r.jsxs("div", { className: R({ fullWidth: m }), children: [
+        U ? /* @__PURE__ */ r.jsx(I, { label: s, hideHintLabel: j, isRequired: N }) : null,
+        /* @__PURE__ */ r.jsx("div", { ref: V, children: /* @__PURE__ */ r.jsx(
+          wr,
+          {
+            fullWidth: m,
+            isDisabled: X,
+            isInvalid: D,
+            placeholder: n,
+            value: W,
+            onChange: q,
+            getItemId: i,
+            getLabel: S,
+            label: s,
+            disableClearLogic: e,
+            setOpenPopover: F,
+            selectRenderElements: v
+          }
+        ) }),
+        L ? /* @__PURE__ */ r.jsx(rr, { description: t, errorMessage: u }) : null
+      ] }),
+      A ? /* @__PURE__ */ r.jsx("div", { className: z(), children: A }) : null
     ] }),
     /* @__PURE__ */ r.jsx(
-      K,
+      ir,
       {
-        label: `${p} options`,
-        triggerRef: b,
+        label: `${s} options`,
+        triggerRef: V,
         items: c,
-        open: V,
-        getItemId: s,
-        selectRenderElements: t,
+        open: Y,
+        getItemId: i,
+        selectRenderElements: v,
         disabledItemIdKeys: o,
-        direction: H,
-        setOpenPopover: $,
-        onMultiChange: W,
-        placement: G,
-        value: v
+        direction: O,
+        setOpenPopover: F,
+        onMultiChange: q,
+        placement: l,
+        value: W
       }
     )
   ] });
 };
 export {
-  Yo as MultiSelect,
-  Xo as Select
+  rs as MultiSelect,
+  Io as Select
 };