@shlinkio/shlink-frontend-kit 0.8.7 → 0.8.9

package/dist/tailwind.js

@@ -1,119 +1,233 @@
-import { jsx as o, jsxs as i, Fragment as S } from "react/jsx-runtime";
-import w, { clsx as p } from "clsx";
-import { createContext as j, useContext as x, forwardRef as b, useCallback as C, useId as H, useMemo as K, useRef as E, useEffect as F, useState as rt } from "react";
-import { Link as _, NavLink as ot } from "react-router";
-import { faClose as nt, faEyeSlash as at, faEye as dt, faSearch as lt, faChevronLeft as W, faChevronRight as q, faCircleNotch as st } from "@fortawesome/free-solid-svg-icons";
-import { FontAwesomeIcon as h } from "@fortawesome/react-fontawesome";
-import { a as wt, b as it, u as ct } from "./use-toggle-DlYE68B3.js";
-import { createPortal as mt } from "react-dom";
-const I = j(void 0), N = j({ responsive: !0 }), gt = ({ children: t, className: r }) => {
-  const { responsive: e } = x(N);
-  return /* @__PURE__ */ o(I.Provider, { value: { section: "head" }, children: /* @__PURE__ */ o(
+import { jsx as n, jsxs as g, Fragment as F } from "react/jsx-runtime";
+import i, { clsx as v } from "clsx";
+import { useState as $, useCallback as I, useEffect as _, createContext as H, useContext as N, forwardRef as x, useId as A, useRef as E, useMemo as O } from "react";
+import { Link as S, NavLink as nt } from "react-router";
+import { faClose as at, faEyeSlash as lt, faEye as dt, faCircleNotch as V, faSearch as st, faChevronLeft as z, faChevronRight as G } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon as k } from "@fortawesome/react-fontawesome";
+import { a as it, u as wt } from "./use-toggle-CNvdDGvy.js";
+import { createPortal as ct } from "react-dom";
+const mt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: i(
+      "tw:px-4 tw:py-3 tw:rounded-t-md",
+      "tw:bg-lm-primary tw:dark:bg-dm-primary tw:border-b tw:border-lm-border tw:dark:border-dm-border",
+      t
+    ),
+    ...e
+  }
+), gt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: i(
+      "tw:p-4 tw:bg-lm-primary tw:dark:bg-dm-primary tw:first:rounded-t-md",
+      "tw:first:rounded-t-md tw:last:rounded-b-md",
+      t
+    ),
+    ...e
+  }
+), bt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: i(
+      "tw:px-4 tw:py-3 tw:rounded-b-md",
+      "tw:bg-lm-primary tw:dark:bg-dm-primary tw:border-t tw:border-lm-border tw:dark:border-dm-border",
+      t
+    ),
+    ...e
+  }
+), ut = ({ className: t, ...e }) => /* @__PURE__ */ n(
+  "div",
+  {
+    className: i(
+      "tw:group/card tw:rounded-md tw:shadow-md",
+      "tw:border tw:border-lm-border tw:dark:border-dm-border tw:bg-lm-primary tw:dark:bg-dm-primary",
+      t
+    ),
+    ...e
+  }
+), y = Object.assign(ut, { Body: gt, Header: mt, Footer: bt }), pt = ({ bodyClassName: t, children: e, ...r }) => {
+  const { title: o, titleSize: a = "md", ...d } = "title" in r ? r : {
+    ...r,
+    title: void 0,
+    titleSize: void 0
+  };
+  return /* @__PURE__ */ g(y, { ...d, children: [
+    o && /* @__PURE__ */ g(y.Header, { children: [
+      a === "lg" && /* @__PURE__ */ n("h4", { children: o }),
+      a === "md" && /* @__PURE__ */ n("h5", { children: o }),
+      a === "sm" && /* @__PURE__ */ n("h6", { children: o })
+    ] }),
+    /* @__PURE__ */ n(y.Body, { className: t, children: e })
+  ] });
+};
+function ht({
+  id: t,
+  items: e,
+  onSelectItem: r,
+  onActiveItemChange: o,
+  renderItem: a,
+  className: d,
+  noItemsMessage: l = "No items",
+  anchor: s,
+  "aria-label": c = "Items",
+  ...b
+}) {
+  const [w, u] = $(0), p = I((f) => {
+    if (u(f), o) {
+      const [m, h] = [...e.entries()][f];
+      o(m, h);
+    }
+  }, [e, o]);
+  return _(() => {
+    const f = s == null ? void 0 : s.current;
+    if (!f)
+      return;
+    const m = (h) => {
+      ["Enter", "ArrowUp", "ArrowDown"].includes(h.key) && h.preventDefault(), h.key === "ArrowDown" ? p(Math.min(w + 1, e.size - 1)) : h.key === "ArrowUp" ? p(Math.max(w - 1, 0)) : h.key === "Enter" && r([...e.values()][w]);
+    };
+    return f.addEventListener("keydown", m), () => f.removeEventListener("keydown", m);
+  }, [w, s, p, e, r]), /* @__PURE__ */ g(
+    y,
+    {
+      id: t,
+      className: i("tw:py-1 tw:flex tw:flex-col", d),
+      role: "listbox",
+      "aria-orientation": "vertical",
+      "aria-label": c,
+      ...b,
+      children: [
+        e.size === 0 && /* @__PURE__ */ n("i", { role: "option", "aria-disabled": !0, "aria-selected": !1, "data-testid": "no-items", className: "tw:px-2 tw:py-1", children: l }),
+        [...e.entries()].map(([f, m], h) => /* @__PURE__ */ n(
+          "button",
+          {
+            id: `${t}_${f}`,
+            type: "button",
+            role: "option",
+            "aria-selected": h === w,
+            className: i(
+              "tw:px-2 tw:py-1 tw:text-left tw:truncate",
+              { "tw:bg-lm-secondary tw:dark:bg-dm-secondary": h === w }
+            ),
+            tabIndex: -1,
+            onClick: () => r(m),
+            onMouseOver: () => p(h),
+            children: a(m)
+          },
+          f
+        ))
+      ]
+    }
+  );
+}
+const B = H(void 0), T = H({ responsive: !0 }), ft = ({ children: t, className: e }) => {
+  const { responsive: r } = N(T);
+  return /* @__PURE__ */ n(B.Provider, { value: { section: "head" }, children: /* @__PURE__ */ n(
     "thead",
     {
-      className: w(
-        { "tw:hidden tw:lg:table-header-group": e },
-        r
+      className: i(
+        { "tw:hidden tw:lg:table-header-group": r },
+        e
       ),
       children: t
     }
   ) });
-}, bt = ({ children: t, className: r }) => {
-  const { responsive: e } = x(N);
-  return /* @__PURE__ */ o(I.Provider, { value: { section: "body" }, children: /* @__PURE__ */ o(
+}, xt = ({ children: t, className: e }) => {
+  const { responsive: r } = N(T);
+  return /* @__PURE__ */ n(B.Provider, { value: { section: "body" }, children: /* @__PURE__ */ n(
     "tbody",
     {
-      className: w(
-        { "tw:lg:table-row-group tw:flex tw:flex-col tw:gap-y-3": e },
-        r
+      className: i(
+        { "tw:lg:table-row-group tw:flex tw:flex-col tw:gap-y-3": r },
+        e
       ),
       children: t
     }
   ) });
-}, pt = ({ children: t, className: r }) => {
-  const { responsive: e } = x(N);
-  return /* @__PURE__ */ o(I.Provider, { value: { section: "footer" }, children: /* @__PURE__ */ o(
+}, yt = ({ children: t, className: e }) => {
+  const { responsive: r } = N(T);
+  return /* @__PURE__ */ n(B.Provider, { value: { section: "footer" }, children: /* @__PURE__ */ n(
     "tfoot",
     {
-      className: w(
-        { "tw:lg:table-row-group tw:flex tw:flex-col tw:gap-y-3 tw:mt-4": e },
-        r
+      className: i(
+        { "tw:lg:table-row-group tw:flex tw:flex-col tw:gap-y-3 tw:mt-4": r },
+        e
       ),
       children: t
     }
   ) });
-}, ut = ({ children: t, className: r, ...e }) => {
-  const n = x(I), a = (n == null ? void 0 : n.section) === "body", { responsive: l } = x(N);
-  return /* @__PURE__ */ o(
+}, vt = ({ children: t, className: e, ...r }) => {
+  const o = N(B), a = (o == null ? void 0 : o.section) === "body", { responsive: d } = N(T);
+  return /* @__PURE__ */ n(
     "tr",
     {
-      className: w(
+      className: i(
         "tw:group",
         {
-          "tw:lg:table-row tw:flex tw:flex-col": l,
-          "tw:lg:border-0 tw:border-y-2 tw:border-lm-border tw:dark:border-dm-border": l,
+          "tw:lg:table-row tw:flex tw:flex-col": d,
+          "tw:lg:border-0 tw:border-y-2 tw:border-lm-border tw:dark:border-dm-border": d,
           "tw:hover:bg-lm-primary tw:dark:hover:bg-dm-primary": a,
           // Use a different hover bg color depending on the table being inside a card or not
           "tw:group-[&]/card:hover:bg-lm-secondary tw:dark:group-[&]/card:hover:bg-dm-secondary": a
         },
-        r
+        e
       ),
-      ...e,
+      ...r,
       children: t
     }
   );
-}, ht = ({ children: t, className: r, columnName: e, type: n, ...a }) => {
-  const l = x(I), d = n ?? ((l == null ? void 0 : l.section) !== "body" ? "th" : "td"), { responsive: s } = x(N);
-  return /* @__PURE__ */ o(
-    d,
+}, kt = ({ children: t, className: e, columnName: r, type: o, ...a }) => {
+  const d = N(B), l = o ?? ((d == null ? void 0 : d.section) !== "body" ? "th" : "td"), { responsive: s } = N(T);
+  return /* @__PURE__ */ n(
+    l,
     {
-      "data-column": s ? e : void 0,
-      className: w(
+      "data-column": s ? r : void 0,
+      className: i(
         "tw:p-2 tw:border-lm-border tw:dark:border-dm-border",
         {
           "tw:border-b-1": !s,
           "tw:block tw:lg:table-cell tw:not-last:border-b-1 tw:lg:border-b-1": s,
           // For md and lower, display the content in data-column attribute as before
-          "tw:before:lg:hidden tw:before:content-[attr(data-column)] tw:before:font-bold tw:before:mr-1": s && d === "td"
+          "tw:before:lg:hidden tw:before:content-[attr(data-column)] tw:before:font-bold tw:before:mr-1": s && l === "td"
         },
-        r
+        e
       ),
       ...a,
       children: t
     }
   );
-}, ft = ({ header: t, footer: r, children: e, responsive: n = !0, ...a }) => /* @__PURE__ */ o(N.Provider, { value: { responsive: n }, children: /* @__PURE__ */ i("table", { className: "tw:w-full", ...a, children: [
-  /* @__PURE__ */ o(gt, { children: t }),
-  /* @__PURE__ */ o(bt, { children: e }),
-  r && /* @__PURE__ */ o(pt, { children: r })
-] }) }), Kt = Object.assign(ft, { Row: ut, Cell: ht }), xt = ({
+}, Nt = ({ header: t, footer: e, children: r, responsive: o = !0, ...a }) => /* @__PURE__ */ n(T.Provider, { value: { responsive: o }, children: /* @__PURE__ */ g("table", { className: "tw:w-full", ...a, children: [
+  /* @__PURE__ */ n(ft, { children: t }),
+  /* @__PURE__ */ n(xt, { children: r }),
+  e && /* @__PURE__ */ n(yt, { children: e })
+] }) }), Jt = Object.assign(Nt, { Row: vt, Cell: kt }), Pt = ({
   children: t,
-  className: r,
-  disabled: e,
-  variant: n = "primary",
+  className: e,
+  disabled: r,
+  variant: o = "primary",
   size: a = "md",
-  inline: l = !1,
-  solid: d = !1,
+  inline: d = !1,
+  solid: l = !1,
   type: s = "button",
   ...c
 }) => {
-  const m = "to" in c ? _ : "button", u = m === _ ? void 0 : s;
+  const b = "to" in c ? S : "button", w = b === S ? void 0 : s;
   return (
     // @ts-expect-error We are explicitly checking for the `to` prop before using Link
-    /* @__PURE__ */ o(
-      m,
+    /* @__PURE__ */ n(
+      b,
       {
-        className: w(
+        className: i(
           {
-            "tw:inline-flex": l,
-            "tw:flex": !l
+            "tw:inline-flex": d,
+            "tw:flex": !d
           },
           "tw:gap-2 tw:items-center tw:justify-center",
           "tw:border tw:rounded-md tw:no-underline",
           "tw:transition-colors",
           {
-            "tw:focus-ring": n !== "danger",
-            "tw:focus-ring-danger": n === "danger"
+            "tw:focus-ring": o !== "danger",
+            "tw:focus-ring-danger": o === "danger"
           },
           {
             "tw:px-1.5 tw:py-1 tw:text-sm": a === "sm",
@@ -121,47 +235,47 @@ const I = j(void 0), N = j({ responsive: !0 }), gt = ({ children: t, className:
             "tw:px-4 tw:py-2 tw:text-lg": a === "lg"
           },
           {
-            "tw:border-brand tw:text-brand": n === "primary",
-            "tw:border-zinc-500": n === "secondary",
-            "tw:text-zinc-500": n === "secondary" && !d,
-            "tw:border-danger": n === "danger",
-            "tw:text-danger": n === "danger" && !d
+            "tw:border-brand tw:text-brand": o === "primary",
+            "tw:border-zinc-500": o === "secondary",
+            "tw:text-zinc-500": o === "secondary" && !l,
+            "tw:border-danger": o === "danger",
+            "tw:text-danger": o === "danger" && !l
           },
-          d && {
+          l && {
             "tw:text-white": !0,
-            "tw:bg-brand": n === "primary",
-            "tw:highlight:bg-brand-dark tw:highlight:border-brand-dark": n === "primary",
-            "tw:bg-zinc-500": n === "secondary",
-            "tw:highlight:bg-zinc-600 tw:highlight:border-zinc-600": n === "secondary",
-            "tw:bg-danger": n === "danger",
-            "tw:highlight:bg-danger-dark tw:highlight:border-danger-dark": n === "danger"
+            "tw:bg-brand": o === "primary",
+            "tw:highlight:bg-brand-dark tw:highlight:border-brand-dark": o === "primary",
+            "tw:bg-zinc-500": o === "secondary",
+            "tw:highlight:bg-zinc-600 tw:highlight:border-zinc-600": o === "secondary",
+            "tw:bg-danger": o === "danger",
+            "tw:highlight:bg-danger-dark tw:highlight:border-danger-dark": o === "danger"
           },
-          !e && {
-            "tw:highlight:text-white": !d,
-            "tw:highlight:bg-brand": n === "primary",
-            "tw:highlight:bg-zinc-500": n === "secondary",
-            "tw:highlight:bg-danger": n === "danger"
+          !r && {
+            "tw:highlight:text-white": !l,
+            "tw:highlight:bg-brand": o === "primary",
+            "tw:highlight:bg-zinc-500": o === "secondary",
+            "tw:highlight:bg-danger": o === "danger"
           },
           {
-            "tw:pointer-events-none tw:opacity-65": e
+            "tw:pointer-events-none tw:opacity-65": r
           },
-          r
+          e
         ),
-        disabled: e,
-        type: u,
+        disabled: r,
+        type: w,
         ...c,
         children: t
       }
     )
   );
-}, Q = b(({ className: t, onChange: r, ...e }, n) => {
-  const a = C((l) => r == null ? void 0 : r(l.target.checked, l), [r]);
-  return /* @__PURE__ */ o(
+}, X = x(({ className: t, onChange: e, ...r }, o) => {
+  const a = I((d) => e == null ? void 0 : e(d.target.checked, d), [e]);
+  return /* @__PURE__ */ n(
     "input",
     {
-      ref: n,
+      ref: o,
       type: "checkbox",
-      className: p(
+      className: v(
         "tw:appearance-none tw:focus-ring",
         "tw:border-1 tw:border-lm-input-border tw:dark:border-dm-input-border",
         "tw:bg-lm-primary tw:dark:bg-dm-primary tw:checked:bg-brand tw:bg-no-repeat",
@@ -170,184 +284,184 @@ const I = j(void 0), N = j({ responsive: !0 }), gt = ({ children: t, className:
         t
       ),
       onChange: a,
-      ...e
+      ...r
     }
   );
-}), Qt = b(({ className: t, ...r }, e) => /* @__PURE__ */ o(
-  Q,
+}), Qt = x(({ className: t, ...e }, r) => /* @__PURE__ */ n(
+  X,
   {
-    ref: e,
-    className: p("tw:rounded-sm tw:w-4 tw:h-4 tw:checked:bg-(image:--tick) tw:bg-center", t),
-    ...r
+    ref: r,
+    className: v("tw:rounded-sm tw:w-4 tw:h-4 tw:checked:bg-(image:--tick) tw:bg-center", t),
+    ...e
   }
-)), G = ({ onClick: t, label: r = "Close" }) => /* @__PURE__ */ o(
+)), J = ({ onClick: t, label: e = "Close" }) => /* @__PURE__ */ n(
   "button",
   {
     type: "button",
     onClick: t,
-    className: w(
+    className: i(
       "tw:opacity-50 tw:highlight:opacity-80 tw:transition-opacity",
       "tw:rounded-md tw:focus-ring"
     ),
-    "aria-label": r,
-    children: /* @__PURE__ */ o(h, { icon: nt, size: "xl" })
+    "aria-label": e,
+    children: /* @__PURE__ */ n(k, { icon: at, size: "xl" })
   }
-), D = b(({
+), U = x(({
   borderless: t = !1,
-  size: r = "md",
-  feedback: e,
-  className: n,
+  size: e = "md",
+  feedback: r,
+  className: o,
   disabled: a,
-  readOnly: l,
-  ...d
+  readOnly: d,
+  ...l
 }, s) => {
-  const c = !a && !l;
-  return /* @__PURE__ */ o(
+  const c = !a && !d;
+  return /* @__PURE__ */ n(
     "input",
     {
       ref: s,
-      className: w(
+      className: i(
         "tw:w-full",
         {
-          "tw:focus-ring": !e,
-          "tw:focus-ring-danger": e === "error"
+          "tw:focus-ring": !r,
+          "tw:focus-ring-danger": r === "error"
         },
         {
-          "tw:px-2 tw:py-1 tw:text-sm": r === "sm",
-          "tw:px-3 tw:py-1.5": r === "md",
-          "tw:px-4 tw:py-2 tw:text-xl": r === "lg"
+          "tw:px-2 tw:py-1 tw:text-sm": e === "sm",
+          "tw:px-3 tw:py-1.5": e === "md",
+          "tw:px-4 tw:py-2 tw:text-xl": e === "lg"
         },
         {
           "tw:rounded-md tw:border": !t,
-          "tw:border-lm-input-border tw:dark:border-dm-input-border": !t && !e,
-          "tw:border-danger": !t && e === "error",
+          "tw:border-lm-input-border tw:dark:border-dm-input-border": !t && !r,
+          "tw:border-danger": !t && r === "error",
           "tw:bg-lm-disabled-input tw:dark:bg-dm-disabled-input": !c,
           "tw:bg-lm-primary tw:dark:bg-dm-primary": c,
           // Use different background color when rendered inside a card
           "tw:group-[&]/card:bg-lm-input tw:group-[&]/card:dark:bg-dm-input": c
         },
-        n
+        o
       ),
       disabled: a,
-      readOnly: l,
-      ...d
+      readOnly: d,
+      ...l
     }
   );
-}), O = ({ required: t, children: r, ...e }) => /* @__PURE__ */ i("label", { ...e, children: [
-  r,
-  t && /* @__PURE__ */ o("span", { className: "tw:text-danger tw:ml-1", "data-testid": "required-indicator", children: "*" })
-] }), Vt = b(({ label: t, inputClassName: r, required: e, hiddenRequired: n, error: a, ...l }, d) => {
-  const s = H();
-  return /* @__PURE__ */ i("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
-    /* @__PURE__ */ o(O, { htmlFor: s, required: e, children: t }),
-    /* @__PURE__ */ o(
-      D,
+}), K = ({ required: t, children: e, ...r }) => /* @__PURE__ */ g("label", { ...r, children: [
+  e,
+  t && /* @__PURE__ */ n("span", { className: "tw:text-danger tw:ml-1", "data-testid": "required-indicator", children: "*" })
+] }), Vt = x(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, ...d }, l) => {
+  const s = A();
+  return /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
+    /* @__PURE__ */ n(K, { htmlFor: s, required: r, children: t }),
+    /* @__PURE__ */ n(
+      U,
       {
-        ref: d,
+        ref: l,
         id: s,
-        className: r,
-        required: e || n,
+        className: e,
+        required: r || o,
         feedback: a ? "error" : void 0,
-        ...l
+        ...d
       }
     ),
-    a && /* @__PURE__ */ o("span", { className: "tw:text-danger", children: a })
+    a && /* @__PURE__ */ n("span", { className: "tw:text-danger", children: a })
   ] });
-}), yt = b(({ containerClassName: t, className: r, size: e, ...n }, a) => {
-  const [l, d, , s] = wt(!1), c = it(), m = C(({ relatedTarget: u }) => {
-    var g;
-    (g = c.current) != null && g.contains(u) || s();
+}), It = x(({ containerClassName: t, className: e, size: r, ...o }, a) => {
+  const [d, l, , s] = it(!1), c = E(null), b = I(({ relatedTarget: w }) => {
+    var u;
+    (u = c.current) != null && u.contains(w) || s();
   }, [c, s]);
-  return /* @__PURE__ */ i(
+  return /* @__PURE__ */ g(
     "div",
     {
-      className: p("tw:group tw:relative", t),
+      className: v("tw:group tw:relative", t),
       ref: c,
-      onBlurCapture: m,
+      onBlurCapture: b,
       children: [
-        /* @__PURE__ */ o(
-          D,
+        /* @__PURE__ */ n(
+          U,
           {
             ref: a,
-            type: l ? "text" : "password",
-            className: p(
+            type: d ? "text" : "password",
+            className: v(
               {
-                "tw:pr-10": e !== "sm",
-                "tw:pr-8": e === "sm"
+                "tw:pr-10": r !== "sm",
+                "tw:pr-8": r === "sm"
               },
-              r
+              e
             ),
-            size: e,
+            size: r,
             "data-testid": "input",
-            ...n
+            ...o
           }
         ),
-        /* @__PURE__ */ o(
+        /* @__PURE__ */ n(
           "button",
           {
             type: "button",
-            onClick: d,
-            title: l ? "Hide password" : "Show password",
-            "aria-label": l ? "Hide password" : "Show password",
-            className: p(
+            onClick: l,
+            title: d ? "Hide password" : "Show password",
+            "aria-label": d ? "Hide password" : "Show password",
+            className: v(
               "tw:absolute tw:top-[50%] tw:translate-y-[-50%] tw:px-1",
               "tw:text-placeholder tw:hover:text-lm-text tw:hover:dark:text-dm-text tw:transition-colors",
               {
-                "tw:right-1.5": e !== "sm",
-                "tw:scale-85 tw:right-1": e === "sm"
+                "tw:right-1.5": r !== "sm",
+                "tw:scale-85 tw:right-1": r === "sm"
               }
             ),
             tabIndex: -1,
-            children: /* @__PURE__ */ o(h, { fixedWidth: !0, icon: l ? at : dt })
+            children: /* @__PURE__ */ n(k, { fixedWidth: !0, icon: d ? lt : dt })
           }
         )
       ]
     }
   );
-}), Xt = b(({ label: t, inputClassName: r, required: e, hiddenRequired: n, error: a, ...l }, d) => {
-  const s = H();
-  return /* @__PURE__ */ i("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
-    /* @__PURE__ */ o(O, { htmlFor: s, required: e, children: t }),
-    /* @__PURE__ */ o(
-      yt,
+}), Xt = x(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, ...d }, l) => {
+  const s = A();
+  return /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
+    /* @__PURE__ */ n(K, { htmlFor: s, required: r, children: t }),
+    /* @__PURE__ */ n(
+      It,
       {
-        ref: d,
+        ref: l,
         id: s,
-        className: r,
-        required: e || n,
+        className: e,
+        required: r || o,
         feedback: a ? "error" : void 0,
-        ...l
+        ...d
       }
     ),
-    a && /* @__PURE__ */ o("span", { className: "tw:text-danger", children: a })
+    a && /* @__PURE__ */ n("span", { className: "tw:text-danger", children: a })
   ] });
-}), kt = b(({
+}), Ct = x(({
   className: t,
-  size: r = "md",
-  feedback: e,
-  style: n = {},
+  size: e = "md",
+  feedback: r,
+  style: o = {},
   disabled: a,
-  ...l
-}, d) => /* @__PURE__ */ o(
+  ...d
+}, l) => /* @__PURE__ */ n(
   "select",
   {
-    ref: d,
-    className: w(
+    ref: l,
+    className: i(
       "tw:w-full tw:appearance-none tw:pr-9",
       "tw:bg-(image:--chevron-down) tw:bg-no-repeat",
       {
-        "tw:focus-ring": !e,
-        "tw:focus-ring-danger": e === "error"
+        "tw:focus-ring": !r,
+        "tw:focus-ring-danger": r === "error"
       },
       "tw:rounded-md tw:border",
       {
-        "tw:border-lm-input-border tw:dark:border-dm-input-border": !e,
-        "tw:border-danger": e === "error"
+        "tw:border-lm-input-border tw:dark:border-dm-input-border": !r,
+        "tw:border-danger": r === "error"
       },
       {
-        "tw:pl-2 tw:py-1 tw:text-sm": r === "sm",
-        "tw:pl-3 tw:py-1.5": r === "md",
-        "tw:pl-4 tw:py-2 tw:text-xl": r === "lg",
+        "tw:pl-2 tw:py-1 tw:text-sm": e === "sm",
+        "tw:pl-3 tw:py-1.5": e === "md",
+        "tw:pl-4 tw:py-2 tw:text-xl": e === "lg",
         "tw:bg-lm-disabled-input tw:dark:bg-dm-disabled-input": a,
         // Apply different background color when rendered inside a card
         "tw:bg-lm-primary tw:dark:bg-dm-primary tw:group-[&]/card:bg-lm-input tw:group-[&]/card:dark:bg-dm-input": !a
@@ -355,365 +469,382 @@ const I = j(void 0), N = j({ responsive: !0 }), gt = ({ children: t, className:
       t
     ),
     style: {
-      ...n,
+      ...o,
       background: "right 0.75rem center / 16px 12px"
     },
     disabled: a,
-    ...l
+    ...d
   }
-)), Yt = b(({ selectClassName: t, label: r, required: e, hiddenRequired: n, ...a }, l) => {
-  const d = H();
-  return /* @__PURE__ */ i("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
-    /* @__PURE__ */ o(O, { htmlFor: d, required: e, children: r }),
-    /* @__PURE__ */ o(kt, { ref: l, id: d, className: t, required: e || n, ...a })
+)), Yt = x(({ selectClassName: t, label: e, required: r, hiddenRequired: o, ...a }, d) => {
+  const l = A();
+  return /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:gap-1", children: [
+    /* @__PURE__ */ n(K, { htmlFor: l, required: r, children: e }),
+    /* @__PURE__ */ n(Ct, { ref: d, id: l, className: t, required: r || o, ...a })
   ] });
-}), Zt = b(({
+}), Tt = x(({
   onChange: t,
-  containerClassName: r,
-  inputClassName: e,
+  containerClassName: e,
+  inputClassName: r,
   // Inputs have a default 'md' size. Search inputs are usually 'lg' as they are rendered at the top of sections
-  size: n = "lg",
-  ...a
+  size: o = "lg",
+  loading: a = !1,
+  ...d
 }, l) => {
-  const { setTimeout: d, clearCurrentTimeout: s } = ct(500), c = C((m) => {
-    m ? d(() => t(m)) : (s(), t(m));
-  }, [s, t, d]);
-  return /* @__PURE__ */ i("div", { className: w("tw:group tw:relative tw:focus-within:z-10", r), children: [
-    /* @__PURE__ */ o(
-      h,
+  const { setTimeout: s, clearCurrentTimeout: c } = wt(500), b = I((w) => {
+    w ? s(() => t(w)) : (c(), t(w));
+  }, [c, t, s]);
+  return /* @__PURE__ */ g("div", { className: i("tw:group tw:relative tw:focus-within:z-10", e), children: [
+    /* @__PURE__ */ n(
+      k,
       {
-        icon: lt,
-        className: w(
+        icon: a ? V : st,
+        spin: a,
+        className: i(
           "tw:absolute tw:top-[50%] tw:translate-y-[-50%] tw:transition-colors",
           "tw:text-placeholder tw:group-focus-within:text-lm-text tw:dark:group-focus-within:text-dm-text",
           {
-            "tw:left-3": n !== "sm",
-            "tw:scale-85 tw:left-2": n === "sm"
+            "tw:left-3": o !== "sm",
+            "tw:scale-85 tw:left-2": o === "sm"
           }
         )
       }
     ),
-    /* @__PURE__ */ o(
-      D,
+    /* @__PURE__ */ n(
+      U,
       {
         ref: l,
         type: "search",
-        className: w(
+        className: i(
           {
-            "tw:pl-9": n !== "sm",
-            "tw:pl-7": n === "sm"
+            "tw:pl-9": o !== "sm",
+            "tw:pl-7": o === "sm"
           },
-          e
+          r
         ),
         placeholder: "Search...",
-        onChange: (m) => c(m.target.value),
-        size: n,
-        ...a
+        onChange: (w) => b(w.target.value),
+        size: o,
+        ...d
       }
     )
   ] });
-}), zt = b(({ className: t, ...r }, e) => /* @__PURE__ */ o(
-  Q,
+});
+function Zt({
+  searchResults: t,
+  onSearch: e,
+  onSelectSearchResult: r,
+  renderSearchResult: o,
+  size: a = "md",
+  // SearchInput defaults its size to 'lg'. Change it to 'md'
+  listboxSpan: d = "full",
+  onFocus: l,
+  ...s
+}) {
+  const c = E(null), b = A(), [w, u] = $(), p = O(
+    () => t ? w ?? [...t.keys()][0] : void 0,
+    [w, t]
+  ), f = I((m) => {
+    r(m), e(""), c.current.value = "";
+  }, [e, r]);
+  return /* @__PURE__ */ g(
+    "div",
+    {
+      className: "tw:relative",
+      onBlur: (m) => {
+        m.currentTarget.contains(m.relatedTarget) || e("");
+      },
+      children: [
+        /* @__PURE__ */ n(
+          Tt,
+          {
+            onChange: e,
+            size: a,
+            ref: c,
+            role: "combobox",
+            "aria-autocomplete": "list",
+            "aria-expanded": !!t,
+            "aria-controls": b,
+            "aria-activedescendant": p ? `${b}_${p}` : void 0,
+            autoComplete: "off",
+            autoCorrect: "off",
+            onFocus: (m) => {
+              l == null || l(m), e(m.target.value);
+            },
+            ...s
+          }
+        ),
+        t && /* @__PURE__ */ n(
+          ht,
+          {
+            id: b,
+            items: t,
+            anchor: c,
+            onSelectItem: f,
+            onActiveItemChange: u,
+            renderItem: o,
+            className: i(
+              "tw:absolute tw:top-full tw:mt-1 tw:z-10",
+              {
+                "tw:min-w-60 tw:max-w-full": d === "auto",
+                "tw:w-full": d === "full"
+              }
+            ),
+            "aria-label": "Matching items",
+            noItemsMessage: "No results found matching search"
+          }
+        )
+      ]
+    }
+  );
+}
+const te = x(({ className: t, ...e }, r) => /* @__PURE__ */ n(
+  X,
   {
-    ref: e,
-    className: p(
+    ref: r,
+    className: v(
       "tw:rounded-full tw:w-8 tw:h-4",
       "tw:bg-(image:--circle-grey-dark) tw:dark:bg-(image:--circle-grey-light) tw:checked:bg-(image:--circle-white)",
       "tw:focus-visible:not-checked:bg-(image:--circle-light-blue)",
       "tw:checked:bg-right tw:transition-[background-position]",
       t
     ),
-    ...r
+    ...e
   }
-)), vt = ({ className: t, disabled: r, size: e = "md", type: n = "button", ...a }) => /* @__PURE__ */ o(
+)), Lt = ({ className: t, disabled: e, size: r = "md", type: o = "button", ...a }) => /* @__PURE__ */ n(
   "button",
   {
-    className: w(
+    className: i(
       "tw:inline-flex tw:rounded-md tw:focus-ring",
       "tw:text-brand tw:highlight:text-brand-dark tw:highlight:underline",
       {
-        "tw:px-1.5 tw:py-1 tw:text-sm": e === "sm",
-        "tw:px-3 tw:py-1.5": e === "md",
-        "tw:px-4 tw:py-2 tw:text-lg": e === "lg",
-        "tw:pointer-events-none tw:opacity-65": r
+        "tw:px-1.5 tw:py-1 tw:text-sm": r === "sm",
+        "tw:px-3 tw:py-1.5": r === "md",
+        "tw:px-4 tw:py-2 tw:text-lg": r === "lg",
+        "tw:pointer-events-none tw:opacity-65": e
       },
       t
     ),
-    disabled: r,
-    type: n,
+    disabled: e,
+    type: o,
     ...a
   }
-), Nt = ({ className: t, ...r }) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: w(
-      "tw:px-4 tw:py-3 tw:rounded-t-md",
-      "tw:bg-lm-primary tw:dark:bg-dm-primary tw:border-b tw:border-lm-border tw:dark:border-dm-border",
-      t
-    ),
-    ...r
-  }
-), Pt = ({ className: t, ...r }) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: w(
-      "tw:p-4 tw:bg-lm-primary tw:dark:bg-dm-primary tw:first:rounded-t-md",
-      "tw:first:rounded-t-md tw:last:rounded-b-md",
-      t
-    ),
-    ...r
-  }
-), Ct = ({ className: t, ...r }) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: w(
-      "tw:px-4 tw:py-3 tw:rounded-b-md",
-      "tw:bg-lm-primary tw:dark:bg-dm-primary tw:border-t tw:border-lm-border tw:dark:border-dm-border",
-      t
-    ),
-    ...r
-  }
-), It = ({ className: t, ...r }) => /* @__PURE__ */ o(
-  "div",
-  {
-    className: w(
-      "tw:group/card tw:rounded-md tw:shadow-md",
-      "tw:border tw:border-lm-border tw:dark:border-dm-border tw:bg-lm-primary tw:dark:bg-dm-primary",
-      t
-    ),
-    ...r
-  }
-), f = Object.assign(It, { Body: Pt, Header: Nt, Footer: Ct }), Rt = ({ bodyClassName: t, children: r, ...e }) => {
-  const { title: n, titleSize: a = "md", ...l } = "title" in e ? e : {
-    ...e,
-    title: void 0,
-    titleSize: void 0
-  };
-  return /* @__PURE__ */ i(f, { ...l, children: [
-    n && /* @__PURE__ */ i(f.Header, { children: [
-      a === "lg" && /* @__PURE__ */ o("h4", { children: n }),
-      a === "md" && /* @__PURE__ */ o("h5", { children: n }),
-      a === "sm" && /* @__PURE__ */ o("h6", { children: n })
-    ] }),
-    /* @__PURE__ */ o(f.Body, { className: t, children: r })
-  ] });
-}, V = j(null), Tt = ({ className: t, to: r, ...e }) => {
-  const n = x(V);
-  return /* @__PURE__ */ o(
-    ot,
+), Y = H(null), Et = ({ className: t, to: e, ...r }) => {
+  const o = N(Y);
+  return /* @__PURE__ */ n(
+    nt,
     {
       role: "menuitem",
-      to: r,
-      className: ({ isActive: a }) => w(
+      to: e,
+      className: ({ isActive: a }) => i(
         "tw:px-4 tw:pt-2 tw:pb-[calc(0.5rem-3px)] tw:border-b-3",
         "tw:font-bold tw:no-underline tw:text-center tw:highlight:text-brand tw:transition-colors",
         "tw:rounded-none tw:outline-none tw:focus-visible:inset-ring-2 tw:focus-visible:inset-ring-brand/50",
         {
           "tw:border-b-brand active": a,
           "tw:border-b-transparent tw:text-gray-500": !a,
-          "tw:flex-grow": n == null ? void 0 : n.fill
+          "tw:flex-grow": o == null ? void 0 : o.fill
         },
         t
       ),
-      ...e
+      ...r
     }
   );
-}, Bt = ({ children: t, className: r, fill: e }) => /* @__PURE__ */ o(V.Provider, { value: { fill: e }, children: /* @__PURE__ */ o(f, { role: "menubar", className: w("tw:flex tw:overflow-hidden", r), children: t }) }), te = Object.assign(Bt, { Pill: Tt }), Lt = new Intl.NumberFormat("en-US"), St = (t) => Lt.format(Number(t)), J = 10, ee = (t) => Math.ceil(t / J) * J, v = 2, B = "...", Et = (t, r) => Array.from({ length: r - t }, (e, n) => t + n), Ft = (t, r) => {
-  const e = Et(
-    Math.max(v, t - v),
-    Math.min(r - 1, t + v) + 1
+}, Bt = ({ children: t, className: e, fill: r }) => /* @__PURE__ */ n(Y.Provider, { value: { fill: r }, children: /* @__PURE__ */ n(y, { role: "menubar", className: i("tw:flex tw:overflow-hidden", e), children: t }) }), ee = Object.assign(Bt, { Pill: Et }), Mt = new Intl.NumberFormat("en-US"), _t = (t) => Mt.format(Number(t)), Q = 10, re = (t) => Math.ceil(t / Q) * Q, C = 2, R = "...", Rt = (t, e) => Array.from({ length: e - t }, (r, o) => t + o), At = (t, e) => {
+  const r = Rt(
+    Math.max(C, t - C),
+    Math.min(e - 1, t + C) + 1
   );
-  return t - v > v && e.unshift(B), t + v < r - 1 && e.push(B), e.unshift(1), e.push(r), e;
-}, P = (t) => t === B, _t = (t) => P(t) ? t : St(t), Mt = (t, r) => P(t) ? `${t}_${r}` : `${t}`, X = [
+  return t - C > C && r.unshift(R), t + C < e - 1 && r.push(R), r.unshift(1), r.push(e), r;
+}, L = (t) => t === R, Dt = (t) => L(t) ? t : _t(t), Ft = (t, e) => L(t) ? `${t}_${e}` : `${t}`, Z = [
   "tw:border tw:border-r-0 tw:last:border-r tw:border-lm-border tw:dark:border-dm-border",
   "tw:rounded-none tw:first:rounded-l tw:last:rounded-r"
-], Y = (t = !1) => w(
-  X,
+], tt = (t = !1) => i(
+  Z,
   "tw:px-3 py-2 tw:cursor-pointer tw:no-underline",
   "tw:focus-ring tw:focus-visible:z-1",
   {
     "tw:highlight:bg-lm-secondary tw:dark:highlight:bg-dm-secondary tw:text-brand": !t,
     "tw:bg-lm-brand tw:dark:bg-dm-brand tw:text-white": t
   }
-), M = ({ children: t }) => /* @__PURE__ */ o("span", { "aria-hidden": !0, className: w(X, "tw:px-3 py-2 tw:text-gray-400"), children: t }), Z = () => /* @__PURE__ */ o(M, { children: B });
-function jt({ children: t, active: r, isEllipsis: e, href: n, ...a }) {
-  const l = K(() => Y(r), [r]);
-  return e ? /* @__PURE__ */ o(Z, {}) : /* @__PURE__ */ o(_, { className: l, to: n, ...a, children: t });
+), j = ({ children: t }) => /* @__PURE__ */ n("span", { "aria-hidden": !0, className: i(Z, "tw:px-3 py-2 tw:text-gray-400"), children: t }), et = () => /* @__PURE__ */ n(j, { children: R });
+function St({ children: t, active: e, isEllipsis: r, href: o, ...a }) {
+  const d = O(() => tt(e), [e]);
+  return r ? /* @__PURE__ */ n(et, {}) : /* @__PURE__ */ n(S, { className: d, to: o, ...a, children: t });
 }
-function Ht({ children: t, active: r, isEllipsis: e, ...n }) {
-  const a = K(() => Y(r), [r]);
-  return e ? /* @__PURE__ */ o(Z, {}) : /* @__PURE__ */ o("button", { type: "button", className: a, ...n, children: t });
+function jt({ children: t, active: e, isEllipsis: r, ...o }) {
+  const a = O(() => tt(e), [e]);
+  return r ? /* @__PURE__ */ n(et, {}) : /* @__PURE__ */ n("button", { type: "button", className: a, ...o, children: t });
 }
-const re = ({ currentPage: t, pagesCount: r, ...e }) => {
-  const n = "urlForPage" in e, a = n ? jt : Ht, l = C(
-    (d) => n ? { href: P(d) ? void 0 : e.urlForPage(d) } : { onClick: () => !P(d) && e.onPageChange(d) },
-    [n, e]
+const oe = ({ currentPage: t, pagesCount: e, ...r }) => {
+  const o = "urlForPage" in r, a = o ? St : jt, d = I(
+    (l) => o ? { href: L(l) ? void 0 : r.urlForPage(l) } : { onClick: () => !L(l) && r.onPageChange(l) },
+    [o, r]
   );
-  return r < 2 ? null : /* @__PURE__ */ i("div", { className: "tw:select-none tw:flex", "data-testid": "paginator", children: [
-    t === 1 ? /* @__PURE__ */ o(M, { children: /* @__PURE__ */ o(h, { size: "xs", icon: W }) }) : /* @__PURE__ */ o(a, { ...l(Math.max(1, t - 1)), "aria-label": "Previous", children: /* @__PURE__ */ o(h, { size: "xs", icon: W }) }),
-    Ft(t, r).map((d, s) => /* @__PURE__ */ o(
+  return e < 2 ? null : /* @__PURE__ */ g("div", { className: "tw:select-none tw:flex", "data-testid": "paginator", children: [
+    t === 1 ? /* @__PURE__ */ n(j, { children: /* @__PURE__ */ n(k, { size: "xs", icon: z }) }) : /* @__PURE__ */ n(a, { ...d(Math.max(1, t - 1)), "aria-label": "Previous", children: /* @__PURE__ */ n(k, { size: "xs", icon: z }) }),
+    At(t, e).map((l, s) => /* @__PURE__ */ n(
       a,
       {
-        active: d === t,
-        isEllipsis: P(d),
-        ...l(d),
-        children: _t(d)
+        active: l === t,
+        isEllipsis: L(l),
+        ...d(l),
+        children: Dt(l)
       },
-      Mt(d, s)
+      Ft(l, s)
     )),
-    t === r ? /* @__PURE__ */ o(M, { children: /* @__PURE__ */ o(h, { size: "xs", icon: q }) }) : /* @__PURE__ */ o(a, { ...l(Math.min(r, t + 1)), "aria-label": "Next", children: /* @__PURE__ */ o(h, { size: "xs", icon: q }) })
+    t === e ? /* @__PURE__ */ n(j, { children: /* @__PURE__ */ n(k, { size: "xs", icon: G }) }) : /* @__PURE__ */ n(a, { ...d(Math.min(e, t + 1)), "aria-label": "Next", children: /* @__PURE__ */ n(k, { size: "xs", icon: G }) })
   ] });
-}, Dt = ({
+}, $t = ({
   open: t,
-  children: r,
-  className: e,
-  onClose: n,
+  children: e,
+  className: r,
+  onClose: o,
   ...a
 }) => {
-  const l = E(null);
-  return F(() => {
-    var m, u;
-    const d = document.body, s = d.style.overflow, c = d.style.paddingRight;
+  const d = E(null);
+  return _(() => {
+    var b, w;
+    const l = document.body, s = l.style.overflow, c = l.style.paddingRight;
     if (t) {
-      const g = window.outerWidth - d.clientWidth, k = d.scrollHeight > d.clientHeight;
-      d.style.overflow = "hidden", k && (d.style.paddingRight = `${g}px`), (m = l.current) == null || m.showModal();
+      const u = window.outerWidth - l.clientWidth, p = l.scrollHeight > l.clientHeight;
+      l.style.overflow = "hidden", p && (l.style.paddingRight = `${u}px`), (b = d.current) == null || b.showModal();
     } else
-      (u = l.current) == null || u.close();
+      (w = d.current) == null || w.close();
     return () => {
-      d.style.overflow = s, d.style.paddingRight = c;
+      l.style.overflow = s, l.style.paddingRight = c;
     };
-  }, [t]), mt(
-    /* @__PURE__ */ o(
+  }, [t]), ct(
+    /* @__PURE__ */ n(
       "dialog",
       {
-        ref: l,
-        className: w("tw:bg-transparent tw:backdrop:bg-black/50", e),
-        onCancel: (d) => {
-          d.preventDefault(), n();
+        ref: d,
+        className: i("tw:bg-transparent tw:backdrop:bg-black/50", r),
+        onCancel: (l) => {
+          l.preventDefault(), o();
         },
         ...a,
-        children: t && r
+        children: t && e
       }
     ),
     document.body
   );
-}, oe = ({
+}, ne = ({
   open: t,
-  onClose: r,
-  variant: e = "default",
-  title: n,
+  onClose: e,
+  variant: r = "default",
+  title: o,
   children: a,
-  className: l,
-  ...d
+  className: d,
+  ...l
 }) => {
   const {
     size: s = "md",
     confirmText: c = "Confirm",
-    cancelText: m = "Cancel",
-    confirmDisabled: u,
-    onConfirm: g,
-    onClosed: k,
-    ...z
-  } = "onConfirm" in d ? d : { ...d }, [R, $] = rt(t), T = E(null), L = E("cancel"), tt = C(() => {
-    L.current = "confirm", g == null || g();
-  }, [g]);
-  return F(() => {
+    cancelText: b = "Cancel",
+    confirmDisabled: w,
+    onConfirm: u,
+    onClosed: p,
+    ...f
+  } = "onConfirm" in l ? l : { ...l }, [m, h] = $(t), M = E(null), D = E("cancel"), rt = I(() => {
+    D.current = "confirm", u == null || u();
+  }, [u]);
+  return _(() => {
     if (t) {
-      L.current = "cancel", $(!0);
+      D.current = "cancel", h(!0);
       return;
     }
-    const y = T.current;
-    if (y) {
-      delete T.current.dataset.open;
-      let A = !1;
-      const U = (et) => {
-        A || et.target !== y || (A = !0, $(!1), k == null || k(L.current));
+    const P = M.current;
+    if (P) {
+      delete M.current.dataset.open;
+      let W = !1;
+      const q = (ot) => {
+        W || ot.target !== P || (W = !0, h(!1), p == null || p(D.current));
       };
-      return y.addEventListener("transitionend", U), () => {
-        y.removeEventListener("transitionend", U);
+      return P.addEventListener("transitionend", q), () => {
+        P.removeEventListener("transitionend", q);
       };
     }
-  }, [k, t]), F(() => {
-    const y = T.current;
-    R && y && (y.dataset.open = "");
-  }, [R]), /* @__PURE__ */ o(
-    Dt,
+  }, [p, t]), _(() => {
+    const P = M.current;
+    m && P && (P.dataset.open = "");
+  }, [m]), /* @__PURE__ */ n(
+    $t,
     {
-      open: R,
-      onClose: r,
-      className: w(
+      open: m,
+      onClose: e,
+      className: i(
         {
-          "tw:flex tw:w-screen tw:h-screen tw:max-w-screen tw:max-h-screen": R,
-          "tw:overflow-hidden": e === "cover"
+          "tw:flex tw:w-screen tw:h-screen tw:max-w-screen tw:max-h-screen": m,
+          "tw:overflow-hidden": r === "cover"
         },
-        l
+        d
       ),
-      ...z,
-      children: /* @__PURE__ */ o(
+      ...f,
+      children: /* @__PURE__ */ n(
         "div",
         {
           "data-testid": "transition-container",
-          ref: T,
-          className: w(
+          ref: M,
+          className: i(
             "tw:w-full tw:m-auto tw:p-4 tw:sm:p-6",
             // CSS transitions are based on the presence of the `data-open` attribute
             "tw:-translate-y-4 tw:data-open:translate-y-0 tw:opacity-0 tw:data-open:opacity-100",
             "tw:transition-[opacity_,_translate] tw:duration-300",
             // Handle modal dimensions for different variants and sizes
-            e !== "cover" && {
+            r !== "cover" && {
               "tw:sm:w-sm": s === "sm",
               "tw:md:w-lg": s === "md",
               "tw:md:w-4xl": s === "lg",
               "tw:md:w-6xl": s === "xl"
             },
-            { "tw:h-full": e === "cover" }
+            { "tw:h-full": r === "cover" }
           ),
-          children: /* @__PURE__ */ o(f, { className: w(
+          children: /* @__PURE__ */ n(y, { className: i(
             "tw:w-full",
-            { "tw:h-full tw:relative tw:overflow-auto": e === "cover" }
-          ), children: e === "cover" ? /* @__PURE__ */ i(S, { children: [
-            /* @__PURE__ */ i(
+            { "tw:h-full tw:relative tw:overflow-auto": r === "cover" }
+          ), children: r === "cover" ? /* @__PURE__ */ g(F, { children: [
+            /* @__PURE__ */ g(
               "div",
               {
-                className: w(
+                className: i(
                   "tw:px-4 tw:py-3 tw:absolute tw:top-0 tw:left-0 tw:right-0",
                   "tw:flex tw:items-center tw:justify-between",
                   "tw:text-white tw:bg-linear-to-b tw:from-black/70 tw:to-black/10",
                   "tw:[text-shadow:_0_2px_4px_rgb(0_0_0/_0.8)]"
                 ),
                 children: [
-                  /* @__PURE__ */ o("h5", { children: n }),
-                  /* @__PURE__ */ o(G, { onClick: r, label: "Close dialog" })
+                  /* @__PURE__ */ n("h5", { children: o }),
+                  /* @__PURE__ */ n(J, { onClick: e, label: "Close dialog" })
                 ]
               }
             ),
-            /* @__PURE__ */ o("div", { children: a })
-          ] }) : /* @__PURE__ */ i(S, { children: [
-            /* @__PURE__ */ i(f.Header, { className: w(
+            /* @__PURE__ */ n("div", { children: a })
+          ] }) : /* @__PURE__ */ g(F, { children: [
+            /* @__PURE__ */ g(y.Header, { className: i(
               "tw:sticky tw:top-0",
               "tw:flex tw:items-center tw:justify-between tw:gap-x-2"
             ), children: [
-              /* @__PURE__ */ o("h5", { className: w({ "tw:text-danger": e === "danger" }), children: n }),
-              /* @__PURE__ */ o(G, { onClick: r, label: "Close dialog" })
+              /* @__PURE__ */ n("h5", { className: i({ "tw:text-danger": r === "danger" }), children: o }),
+              /* @__PURE__ */ n(J, { onClick: e, label: "Close dialog" })
             ] }),
-            /* @__PURE__ */ o(f.Body, { children: a }),
-            g && /* @__PURE__ */ i(
-              f.Footer,
+            /* @__PURE__ */ n(y.Body, { children: a }),
+            u && /* @__PURE__ */ g(
+              y.Footer,
               {
                 "data-testid": "footer",
-                className: w(
+                className: i(
                   "tw:flex tw:justify-end tw:items-center tw:gap-x-2",
                   "tw:[&]:px-3 tw:sticky tw:bottom-0"
                 ),
                 children: [
-                  /* @__PURE__ */ o(vt, { onClick: r, children: m }),
-                  /* @__PURE__ */ o(
-                    xt,
+                  /* @__PURE__ */ n(Lt, { onClick: e, children: b }),
+                  /* @__PURE__ */ n(
+                    Pt,
                     {
                       solid: !0,
-                      variant: e === "danger" ? "danger" : "primary",
-                      disabled: u,
-                      onClick: tt,
+                      variant: r === "danger" ? "danger" : "primary",
+                      disabled: w,
+                      onClick: rt,
                       children: c
                     }
                   )
@@ -725,62 +856,64 @@ const re = ({ currentPage: t, pagesCount: r, ...e }) => {
       )
     }
   );
-}, ne = ({ className: t, children: r, loading: e = !1, variant: n = "default" }) => /* @__PURE__ */ o(Rt, { className: p({ "tw:[&]:border-danger": n === "error" }, t), children: /* @__PURE__ */ i("h3", { className: p("tw:text-center", {
-  "tw:text-gray-500 tw:dark:text-gray-400": n === "default",
-  "tw:text-danger": n === "error"
+}, ae = ({ className: t, children: e, loading: r = !1, variant: o = "default" }) => /* @__PURE__ */ n(pt, { className: v({ "tw:[&]:border-danger": o === "error" }, t), children: /* @__PURE__ */ g("h3", { className: v("tw:text-center", {
+  "tw:text-gray-500 tw:dark:text-gray-400": o === "default",
+  "tw:text-danger": o === "error"
 }), children: [
-  e && /* @__PURE__ */ i(S, { children: [
-    /* @__PURE__ */ o(h, { icon: st, spin: !0 }),
-    /* @__PURE__ */ o("span", { className: "tw:ml-2", children: r ?? "Loading..." })
+  r && /* @__PURE__ */ g(F, { children: [
+    /* @__PURE__ */ n(k, { icon: V, spin: !0 }),
+    /* @__PURE__ */ n("span", { className: "tw:ml-2", children: e ?? "Loading..." })
   ] }),
-  !e && r
-] }) }), ae = ({ variant: t, className: r, size: e = "md", children: n }) => /* @__PURE__ */ o(
+  !r && e
+] }) }), le = ({ variant: t, className: e, size: r = "md", children: o }) => /* @__PURE__ */ n(
   "div",
   {
-    className: p(
+    className: v(
       "tw:rounded-md tw:text-center",
       {
-        "tw:p-2": e === "sm",
-        "tw:p-4": e === "md",
-        "tw:p-6": e === "lg",
+        "tw:p-2": r === "sm",
+        "tw:p-4": r === "md",
+        "tw:p-6": r === "lg",
         "tw:[&]:text-white": t !== "warning",
         "tw:bg-brand": t === "success",
         "tw:bg-danger": t === "error",
         "tw:bg-warning tw:text-black": t === "warning"
       },
-      r
+      e
     ),
-    children: n
+    children: o
   }
 );
 export {
-  xt as Button,
-  f as Card,
-  oe as CardModal,
+  Pt as Button,
+  y as Card,
+  ne as CardModal,
   Qt as Checkbox,
-  G as CloseButton,
-  B as ELLIPSIS,
-  D as Input,
-  O as Label,
+  J as CloseButton,
+  R as ELLIPSIS,
+  U as Input,
+  K as Label,
   Vt as LabelledInput,
   Xt as LabelledRevealablePasswordInput,
   Yt as LabelledSelect,
-  vt as LinkButton,
-  ne as Message,
-  Dt as ModalDialog,
-  te as NavPills,
-  re as Paginator,
-  ae as Result,
-  yt as RevealablePasswordInput,
-  Zt as SearchInput,
-  kt as Select,
-  Rt as SimpleCard,
-  Kt as Table,
-  zt as ToggleSwitch,
-  St as formatNumber,
-  Mt as keyForPage,
-  P as pageIsEllipsis,
-  _t as prettifyPageNumber,
-  Ft as progressivePagination,
-  ee as roundTen
+  Lt as LinkButton,
+  ht as Listbox,
+  ae as Message,
+  $t as ModalDialog,
+  ee as NavPills,
+  oe as Paginator,
+  le as Result,
+  It as RevealablePasswordInput,
+  Zt as SearchCombobox,
+  Tt as SearchInput,
+  Ct as Select,
+  pt as SimpleCard,
+  Jt as Table,
+  te as ToggleSwitch,
+  _t as formatNumber,
+  Ft as keyForPage,
+  L as pageIsEllipsis,
+  Dt as prettifyPageNumber,
+  At as progressivePagination,
+  re as roundTen
 };