@shlinkio/shlink-frontend-kit 0.8.13 → 0.9.0

package/dist/tailwind.js

@@ -1,21 +1,22 @@
-import { jsxs as g, jsx as n, Fragment as A } from "react/jsx-runtime";
+import { jsxs as g, jsx as n, Fragment as S } from "react/jsx-runtime";
 import w, { clsx as x } from "clsx";
-import { useRef as L, useState as F, useEffect as M, useCallback as C, createContext as H, useContext as N, forwardRef as y, useId as D, useMemo as O } from "react";
-import { Link as S, NavLink as at } from "react-router";
-import { faClose as dt, faEyeSlash as lt, faEye as st, faCircleNotch as X, faSearch as it, faChevronLeft as G, faChevronRight as J } from "@fortawesome/free-solid-svg-icons";
+import { useRef as I, useState as F, useEffect as M, useCallback as C, createContext as H, useContext as N, forwardRef as y, useId as $, useMemo as O } from "react";
+import { Link as j, NavLink as at } from "react-router";
+import { faClose as dt, faEyeSlash as lt, faEye as it, faCircleNotch as Y, faSearch as st, faChevronLeft as J, faChevronRight as Q, faCheck as wt } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon as k } from "@fortawesome/react-fontawesome";
-import { a as wt, u as ct } from "./use-toggle-PWLikLl6.js";
-import { createPortal as mt } from "react-dom";
-const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
-  const a = L(null), [l, d] = F(!1);
+import { u as ct, a as mt, b as gt } from "./use-toggle-C1uZwbSD.js";
+import { createPortal as bt } from "react-dom";
+import { faClone as ut } from "@fortawesome/free-regular-svg-icons";
+const zt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
+  const a = I(null), [l, d] = F(!1);
   return M(() => {
-    const s = a.current, i = () => d(!!(s != null && s.open));
-    return s == null || s.addEventListener("toggle", i), () => s == null ? void 0 : s.removeEventListener("toggle", i);
+    const i = a.current, s = () => d(!!(i != null && i.open));
+    return i == null || i.addEventListener("toggle", s), () => i == null ? void 0 : i.removeEventListener("toggle", s);
   }, []), /* @__PURE__ */ g("details", { ref: a, ...o, children: [
     /* @__PURE__ */ n("summary", { className: x("tw:focus-ring tw:px-1 tw:-mx-1 tw:rounded-sm", r), children: e }),
     l && /* @__PURE__ */ n("div", { className: "tw:mt-3 tw:flex tw:flex-col tw:gap-y-3", children: t })
   ] });
-}, gt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+}, pt = ({ className: t, ...e }) => /* @__PURE__ */ n(
   "div",
   {
     className: w(
@@ -25,7 +26,7 @@ const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
     ),
     ...e
   }
-), bt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+), ht = ({ className: t, ...e }) => /* @__PURE__ */ n(
   "div",
   {
     className: w(
@@ -35,7 +36,7 @@ const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
     ),
     ...e
   }
-), ut = ({ className: t, ...e }) => /* @__PURE__ */ n(
+), ft = ({ className: t, ...e }) => /* @__PURE__ */ n(
   "div",
   {
     className: w(
@@ -45,7 +46,7 @@ const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
     ),
     ...e
   }
-), pt = ({ className: t, ...e }) => /* @__PURE__ */ n(
+), xt = ({ className: t, ...e }) => /* @__PURE__ */ n(
   "div",
   {
     className: w(
@@ -55,7 +56,7 @@ const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
     ),
     ...e
   }
-), v = Object.assign(pt, { Body: bt, Header: gt, Footer: ut }), ht = ({ bodyClassName: t, children: e, ...r }) => {
+), v = Object.assign(xt, { Body: ht, Header: pt, Footer: ft }), yt = ({ bodyClassName: t, children: e, ...r }) => {
   const { title: o, titleSize: a = "md", ...l } = "title" in r ? r : {
     ...r,
     title: void 0,
@@ -70,7 +71,7 @@ const Qt = ({ children: t, summary: e, summaryClasses: r, ...o }) => {
     /* @__PURE__ */ n(v.Body, { className: t, children: e })
   ] });
 };
-function ft({
+function kt({
   id: t,
   items: e,
   onSelectItem: r,
@@ -78,8 +79,8 @@ function ft({
   renderItem: a,
   className: l,
   noItemsMessage: d = "No items",
-  anchor: s,
-  "aria-label": i = "Items",
+  anchor: i,
+  "aria-label": s = "Items",
   ...c
 }) {
   const [m, u] = F(0), p = C((f) => {
@@ -89,21 +90,21 @@ function ft({
     }
   }, [e, o]);
   return M(() => {
-    const f = s == null ? void 0 : s.current;
+    const f = i == null ? void 0 : i.current;
     if (!f)
       return;
     const b = (h) => {
       ["Enter", "ArrowUp", "ArrowDown"].includes(h.key) && h.preventDefault(), h.key === "ArrowDown" ? p(Math.min(m + 1, e.size - 1)) : h.key === "ArrowUp" ? p(Math.max(m - 1, 0)) : h.key === "Enter" && r([...e.values()][m]);
     };
     return f.addEventListener("keydown", b), () => f.removeEventListener("keydown", b);
-  }, [m, s, p, e, r]), /* @__PURE__ */ g(
+  }, [m, i, p, e, r]), /* @__PURE__ */ g(
     v,
     {
       id: t,
       className: w("tw:py-1 tw:flex tw:flex-col", l),
       role: "listbox",
       "aria-orientation": "vertical",
-      "aria-label": i,
+      "aria-label": s,
       ...c,
       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: d }),
@@ -129,8 +130,8 @@ function ft({
     }
   );
 }
-const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className: e }) => {
-  const { responsive: r } = N(T);
+const E = H(void 0), L = H({ responsive: !0 }), vt = ({ children: t, className: e }) => {
+  const { responsive: r } = N(L);
   return /* @__PURE__ */ n(E.Provider, { value: { section: "head" }, children: /* @__PURE__ */ n(
     "thead",
     {
@@ -141,8 +142,8 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       children: t
     }
   ) });
-}, yt = ({ children: t, className: e }) => {
-  const { responsive: r } = N(T);
+}, Nt = ({ children: t, className: e }) => {
+  const { responsive: r } = N(L);
   return /* @__PURE__ */ n(E.Provider, { value: { section: "body" }, children: /* @__PURE__ */ n(
     "tbody",
     {
@@ -153,8 +154,8 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       children: t
     }
   ) });
-}, vt = ({ children: t, className: e }) => {
-  const { responsive: r } = N(T);
+}, Ct = ({ children: t, className: e }) => {
+  const { responsive: r } = N(L);
   return /* @__PURE__ */ n(E.Provider, { value: { section: "footer" }, children: /* @__PURE__ */ n(
     "tfoot",
     {
@@ -165,8 +166,8 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       children: t
     }
   ) });
-}, kt = ({ children: t, className: e, ...r }) => {
-  const o = N(E), a = (o == null ? void 0 : o.section) === "body", { responsive: l } = N(T);
+}, Pt = ({ children: t, className: e, ...r }) => {
+  const o = N(E), a = (o == null ? void 0 : o.section) === "body", { responsive: l } = N(L);
   return /* @__PURE__ */ n(
     "tr",
     {
@@ -185,19 +186,19 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       children: t
     }
   );
-}, Nt = ({ children: t, className: e, columnName: r, type: o, ...a }) => {
-  const l = N(E), d = o ?? ((l == null ? void 0 : l.section) !== "body" ? "th" : "td"), { responsive: s } = N(T);
+}, Tt = ({ children: t, className: e, columnName: r, type: o, ...a }) => {
+  const l = N(E), d = o ?? ((l == null ? void 0 : l.section) !== "body" ? "th" : "td"), { responsive: i } = N(L);
   return /* @__PURE__ */ n(
     d,
     {
-      "data-column": s ? r : void 0,
+      "data-column": i ? r : void 0,
       className: w(
         "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,
+          "tw:border-b-1": !i,
+          "tw:block tw:lg:table-cell tw:not-last:border-b-1 tw:lg:border-b-1": i,
           // 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": i && d === "td"
         },
         e
       ),
@@ -205,11 +206,11 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       children: t
     }
   );
-}, Pt = ({ 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(xt, { children: t }),
-  /* @__PURE__ */ n(yt, { children: r }),
-  e && /* @__PURE__ */ n(vt, { children: e })
-] }) }), Vt = Object.assign(Pt, { Row: kt, Cell: Nt }), Ct = ({
+}, It = ({ header: t, footer: e, children: r, responsive: o = !0, ...a }) => /* @__PURE__ */ n(L.Provider, { value: { responsive: o }, children: /* @__PURE__ */ g("table", { className: "tw:w-full", ...a, children: [
+  /* @__PURE__ */ n(vt, { children: t }),
+  /* @__PURE__ */ n(Nt, { children: r }),
+  e && /* @__PURE__ */ n(Ct, { children: e })
+] }) }), te = Object.assign(It, { Row: Pt, Cell: Tt }), Lt = ({
   children: t,
   className: e,
   disabled: r,
@@ -217,10 +218,10 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
   size: a = "md",
   inline: l = !1,
   solid: d = !1,
-  type: s = "button",
-  ...i
+  type: i = "button",
+  ...s
 }) => {
-  const c = "to" in i ? S : "button", m = c === S ? void 0 : s;
+  const c = "to" in s ? j : "button", m = c === j ? void 0 : i;
   return (
     // @ts-expect-error We are explicitly checking for the `to` prop before using Link
     /* @__PURE__ */ n(
@@ -245,7 +246,8 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
             "tw:px-4 tw:py-2 tw:text-lg": a === "lg"
           },
           {
-            "tw:border-brand tw:text-brand": o === "primary",
+            "tw:border-lm-brand tw:dark:border-dm-brand": o === "primary",
+            "tw:text-lm-brand tw:dark:text-dm-brand": o === "primary" && !d,
             "tw:border-zinc-500": o === "secondary",
             "tw:text-zinc-500": o === "secondary" && !d,
             "tw:border-danger": o === "danger",
@@ -253,8 +255,9 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
           },
           d && {
             "tw:text-white": !0,
-            "tw:bg-brand": o === "primary",
-            "tw:highlight:bg-brand-dark tw:highlight:border-brand-dark": o === "primary",
+            "tw:bg-lm-brand tw:dark:bg-dm-brand": o === "primary",
+            "tw:highlight:bg-lm-brand-dark tw:dark:highlight:bg-dm-brand-dark": o === "primary",
+            "tw:highlight:border-lm-brand-dark tw:dark:highlight:border-dm-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",
@@ -262,7 +265,7 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
           },
           !r && {
             "tw:highlight:text-white": !d,
-            "tw:highlight:bg-brand": o === "primary",
+            "tw:highlight:bg-lm-brand tw:dark:highlight:bg-dm-brand": o === "primary",
             "tw:highlight:bg-zinc-500": o === "secondary",
             "tw:highlight:bg-danger": o === "danger"
           },
@@ -273,12 +276,12 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
         ),
         disabled: r,
         type: m,
-        ...i,
+        ...s,
         children: t
       }
     )
   );
-}, Y = y(({ className: t, onChange: e, ...r }, o) => {
+}, Z = y(({ className: t, onChange: e, ...r }, o) => {
   const a = C((l) => e == null ? void 0 : e(l.target.checked, l), [e]);
   return /* @__PURE__ */ n(
     "input",
@@ -288,7 +291,7 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       className: x(
         "tw:appearance-none tw:focus-ring tw:cursor-[inherit]",
         "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",
+        "tw:bg-lm-primary tw:dark:bg-dm-primary tw:checked:bg-lm-brand tw:dark:checked:bg-dm-brand tw:bg-no-repeat",
         // Use different background color when rendered inside a card
         "tw:group-[&]/card:bg-lm-input tw:group-[&]/card:dark:bg-dm-input",
         t
@@ -297,14 +300,14 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       ...r
     }
   );
-}), Xt = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
-  Y,
+}), ee = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
+  Z,
   {
     ref: r,
     className: x("tw:rounded-sm tw:w-4 tw:h-4 tw:checked:bg-(image:--tick) tw:bg-center", t),
     ...e
   }
-)), Q = ({ onClick: t, label: e = "Close" }) => /* @__PURE__ */ n(
+)), V = ({ onClick: t, label: e = "Close" }) => /* @__PURE__ */ n(
   "button",
   {
     type: "button",
@@ -324,12 +327,12 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
   disabled: a,
   readOnly: l,
   ...d
-}, s) => {
-  const i = !a && !l;
+}, i) => {
+  const s = !a && !l;
   return /* @__PURE__ */ n(
     "input",
     {
-      ref: s,
+      ref: i,
       className: w(
         "tw:w-full",
         {
@@ -345,10 +348,10 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
           "tw:rounded-md tw:border": !t,
           "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": !i,
-          "tw:bg-lm-primary tw:dark:bg-dm-primary": i,
+          "tw:bg-lm-disabled-input tw:dark:bg-dm-disabled-input": !s,
+          "tw:bg-lm-primary tw:dark:bg-dm-primary": s,
           // Use different background color when rendered inside a card
-          "tw:group-[&]/card:bg-lm-input tw:group-[&]/card:dark:bg-dm-input": i
+          "tw:group-[&]/card:bg-lm-input tw:group-[&]/card:dark:bg-dm-input": s
         },
         o
       ),
@@ -357,10 +360,10 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
       ...d
     }
   );
-}), K = ({ required: t, children: e, className: r, ...o }) => /* @__PURE__ */ g("label", { className: x("tw:cursor-pointer", r), ...o, children: [
+}), W = ({ required: t, children: e, className: r, ...o }) => /* @__PURE__ */ g("label", { className: x("tw:cursor-pointer", r), ...o, children: [
   e,
   t && /* @__PURE__ */ n("span", { className: "tw:text-danger tw:ml-1", "data-testid": "required-indicator", children: "*" })
-] }), W = ({ children: t, helpText: e, error: r, "data-testid": o }) => /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:gap-1", "data-testid": o, children: [
+] }), K = ({ children: t, helpText: e, error: r, "data-testid": o }) => /* @__PURE__ */ g("div", { className: "tw:flex tw:flex-col tw:gap-1", "data-testid": o, children: [
   t,
   e && /* @__PURE__ */ n(
     "small",
@@ -371,32 +374,32 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
     }
   ),
   r && /* @__PURE__ */ n("span", { "data-testid": o ? `${o}-error` : "error", className: "tw:text-danger", children: r })
-] }), Yt = y(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, helpText: l, "data-testid": d, ...s }, i) => {
-  const c = D();
-  return /* @__PURE__ */ g(W, { error: a, helpText: l, "data-testid": d, children: [
-    /* @__PURE__ */ n(K, { htmlFor: c, required: r, children: t }),
+] }), re = y(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, helpText: l, "data-testid": d, ...i }, s) => {
+  const c = $();
+  return /* @__PURE__ */ g(K, { error: a, helpText: l, "data-testid": d, children: [
+    /* @__PURE__ */ n(W, { htmlFor: c, required: r, children: t }),
     /* @__PURE__ */ n(
       U,
       {
-        ref: i,
+        ref: s,
         id: c,
         className: e,
         required: r || o,
         feedback: a ? "error" : void 0,
-        ...s
+        ...i
       }
     )
   ] });
-}), It = y(({ containerClassName: t, className: e, size: r, ...o }, a) => {
-  const [l, d, , s] = wt(!1), i = L(null), c = C(({ relatedTarget: m }) => {
+}), Bt = y(({ containerClassName: t, className: e, size: r, ...o }, a) => {
+  const [l, d, , i] = ct(!1), s = I(null), c = C(({ relatedTarget: m }) => {
     var u;
-    (u = i.current) != null && u.contains(m) || s();
-  }, [i, s]);
+    (u = s.current) != null && u.contains(m) || i();
+  }, [s, i]);
   return /* @__PURE__ */ g(
     "div",
     {
       className: x("tw:group tw:relative", t),
-      ref: i,
+      ref: s,
       onBlurCapture: c,
       children: [
         /* @__PURE__ */ n(
@@ -432,29 +435,29 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
               }
             ),
             tabIndex: -1,
-            children: /* @__PURE__ */ n(k, { fixedWidth: !0, icon: l ? lt : st })
+            children: /* @__PURE__ */ n(k, { fixedWidth: !0, icon: l ? lt : it })
           }
         )
       ]
     }
   );
-}), Zt = y(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, helpText: l, "data-testid": d, ...s }, i) => {
-  const c = D();
-  return /* @__PURE__ */ g(W, { error: a, helpText: l, "data-testid": d, children: [
-    /* @__PURE__ */ n(K, { htmlFor: c, required: r, children: t }),
+}), oe = y(({ label: t, inputClassName: e, required: r, hiddenRequired: o, error: a, helpText: l, "data-testid": d, ...i }, s) => {
+  const c = $();
+  return /* @__PURE__ */ g(K, { error: a, helpText: l, "data-testid": d, children: [
+    /* @__PURE__ */ n(W, { htmlFor: c, required: r, children: t }),
     /* @__PURE__ */ n(
-      It,
+      Bt,
       {
-        ref: i,
+        ref: s,
         id: c,
         className: e,
         required: r || o,
         feedback: a ? "error" : void 0,
-        ...s
+        ...i
       }
     )
   ] });
-}), Lt = y(({
+}), Mt = y(({
   className: t,
   size: e = "md",
   feedback: r,
@@ -494,23 +497,23 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
     disabled: a,
     ...l
   }
-)), te = y(({ selectClassName: t, label: e, error: r, helpText: o, required: a, hiddenRequired: l, "data-testid": d, ...s }, i) => {
-  const c = D();
-  return /* @__PURE__ */ g(W, { error: r, helpText: o, "data-testid": d, children: [
-    /* @__PURE__ */ n(K, { htmlFor: c, required: a, children: e }),
+)), ne = y(({ selectClassName: t, label: e, error: r, helpText: o, required: a, hiddenRequired: l, "data-testid": d, ...i }, s) => {
+  const c = $();
+  return /* @__PURE__ */ g(K, { error: r, helpText: o, "data-testid": d, children: [
+    /* @__PURE__ */ n(W, { htmlFor: c, required: a, children: e }),
     /* @__PURE__ */ n(
-      Lt,
+      Mt,
       {
-        ref: i,
+        ref: s,
         id: c,
         className: t,
         required: a || l,
         feedback: r ? "error" : void 0,
-        ...s
+        ...i
       }
     )
   ] });
-}), Tt = y(({
+}), Et = y(({
   onChange: t,
   containerClassName: e,
   inputClassName: r,
@@ -519,14 +522,14 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
   loading: a = !1,
   ...l
 }, d) => {
-  const { setTimeout: s, clearCurrentTimeout: i } = ct(500), c = C((m) => {
-    m ? s(() => t(m)) : (i(), t(m));
-  }, [i, t, s]);
+  const { setTimeout: i, clearCurrentTimeout: s } = mt(500), c = C((m) => {
+    m ? i(() => t(m)) : (s(), t(m));
+  }, [s, t, i]);
   return /* @__PURE__ */ g("div", { className: w("tw:group tw:relative tw:focus-within:z-10", e), children: [
     /* @__PURE__ */ n(
       k,
       {
-        icon: a ? X : it,
+        icon: a ? Y : st,
         spin: a,
         className: w(
           "tw:absolute tw:top-[50%] tw:translate-y-[-50%] tw:transition-colors",
@@ -558,7 +561,7 @@ const E = H(void 0), T = H({ responsive: !0 }), xt = ({ children: t, className:
     )
   ] });
 });
-function ee({
+function ae({
   searchResults: t,
   onSearch: e,
   onSelectSearchResult: r,
@@ -567,13 +570,13 @@ function ee({
   // SearchInput defaults its size to 'lg'. Change it to 'md'
   listboxSpan: l = "full",
   onFocus: d,
-  ...s
+  ...i
 }) {
-  const i = L(null), c = D(), [m, u] = F(), p = O(
+  const s = I(null), c = $(), [m, u] = F(), p = O(
     () => t ? m ?? [...t.keys()][0] : void 0,
     [m, t]
   ), f = C((b) => {
-    r(b), e(""), i.current.value = "";
+    r(b), e(""), s.current.value = "";
   }, [e, r]);
   return /* @__PURE__ */ g(
     "div",
@@ -584,11 +587,11 @@ function ee({
       },
       children: [
         /* @__PURE__ */ n(
-          Tt,
+          Et,
           {
             onChange: e,
             size: a,
-            ref: i,
+            ref: s,
             role: "combobox",
             "aria-autocomplete": "list",
             "aria-expanded": !!t,
@@ -599,15 +602,15 @@ function ee({
             onFocus: (b) => {
               d == null || d(b), e(b.target.value);
             },
-            ...s
+            ...i
           }
         ),
         t && /* @__PURE__ */ n(
-          ft,
+          kt,
           {
             id: c,
             items: t,
-            anchor: i,
+            anchor: s,
             onSelectItem: f,
             onActiveItemChange: u,
             renderItem: o,
@@ -626,8 +629,8 @@ function ee({
     }
   );
 }
-const re = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
-  Y,
+const de = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
+  Z,
   {
     ref: r,
     className: x(
@@ -639,12 +642,13 @@ const re = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
     ),
     ...e
   }
-)), Bt = ({ className: t, disabled: e, size: r = "md", type: o = "button", ...a }) => /* @__PURE__ */ n(
+)), Rt = ({ className: t, disabled: e, size: r = "md", type: o = "button", ...a }) => /* @__PURE__ */ n(
   "button",
   {
     className: w(
       "tw:inline-flex tw:rounded-md tw:focus-ring",
-      "tw:text-brand tw:highlight:text-brand-dark tw:highlight:underline",
+      "tw:text-lm-brand tw:dark:text-dm-brand",
+      "tw:highlight:text-lm-brand-dark tw:dark:highlight:text-dm-brand-dark tw:highlight:underline",
       {
         "tw:px-1.5 tw:py-1 tw:text-sm": r === "sm",
         "tw:px-3 tw:py-1.5": r === "md",
@@ -657,8 +661,8 @@ const re = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
     type: o,
     ...a
   }
-), Z = H(null), Mt = ({ className: t, to: e, ...r }) => {
-  const o = N(Z);
+), z = H(null), _t = ({ className: t, to: e, ...r }) => {
+  const o = N(z);
   return /* @__PURE__ */ n(
     at,
     {
@@ -666,10 +670,13 @@ const re = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
       to: e,
       className: ({ isActive: a }) => w(
         "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:highlight:text-lm-brand tw:dark:highlight:text-dm-brand",
+        "tw:font-bold tw:text-center tw:no-underline tw:transition-colors",
+        "tw:rounded-none tw:outline-none tw:focus-visible:inset-ring-2",
+        "tw:focus-visible:inset-ring-lm-brand/50 tw:dark:focus-visible:inset-ring-dm-brand/50",
         {
-          "tw:border-b-brand active": a,
+          "tw:text-lm-brand tw:dark:text-dm-brand": a,
+          "tw:border-b-lm-brand tw:dark:border-b-dm-brand active": a,
           "tw:border-b-transparent tw:text-gray-500": !a,
           "tw:flex-grow": o == null ? void 0 : o.fill
         },
@@ -678,71 +685,73 @@ const re = y(({ className: t, ...e }, r) => /* @__PURE__ */ n(
       ...r
     }
   );
-}, Et = ({ children: t, className: e, fill: r }) => /* @__PURE__ */ n(Z.Provider, { value: { fill: r }, children: /* @__PURE__ */ n(v, { role: "menubar", className: w("tw:flex tw:overflow-hidden", e), children: t }) }), oe = Object.assign(Et, { Pill: Mt }), _t = new Intl.NumberFormat("en-US"), Rt = (t) => _t.format(Number(t)), V = 10, ne = (t) => Math.ceil(t / V) * V, I = 2, R = "...", Ft = (t, e) => Array.from({ length: e - t }, (r, o) => t + o), Dt = (t, e) => {
-  const r = Ft(
-    Math.max(I, t - I),
-    Math.min(e - 1, t + I) + 1
+}, Ft = ({ children: t, className: e, fill: r }) => /* @__PURE__ */ n(z.Provider, { value: { fill: r }, children: /* @__PURE__ */ n(v, { role: "menubar", className: w("tw:flex tw:overflow-hidden", e), children: t }) }), le = Object.assign(Ft, { Pill: _t }), $t = new Intl.NumberFormat("en-US"), Dt = (t) => $t.format(Number(t)), X = 10, ie = (t) => Math.ceil(t / X) * X, T = 2, _ = "...", St = (t, e) => Array.from({ length: e - t }, (r, o) => t + o), jt = (t, e) => {
+  const r = St(
+    Math.max(T, t - T),
+    Math.min(e - 1, t + T) + 1
   );
-  return t - I > I && r.unshift(R), t + I < e - 1 && r.push(R), r.unshift(1), r.push(e), r;
-}, B = (t) => t === R, $t = (t) => B(t) ? t : Rt(t), At = (t, e) => B(t) ? `${t}_${e}` : `${t}`, tt = [
+  return t - T > T && r.unshift(_), t + T < e - 1 && r.push(_), r.unshift(1), r.push(e), r;
+}, B = (t) => t === _, At = (t) => B(t) ? t : Dt(t), Ht = (t, e) => B(t) ? `${t}_${e}` : `${t}`, tt = [
   "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"
 ], et = (t = !1) => w(
   tt,
   "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
-  }
-), j = ({ children: t }) => /* @__PURE__ */ n("span", { "aria-hidden": !0, className: w(tt, "tw:px-3 py-2 tw:text-gray-400"), children: t }), rt = () => /* @__PURE__ */ n(j, { children: R });
-function St({ children: t, active: e, isEllipsis: r, href: o, ...a }) {
+  !t && [
+    "tw:text-lm-brand tw:dark:text-dm-brand",
+    "tw:bg-lm-primary tw:dark:bg-dm-primary",
+    "tw:highlight:bg-lm-secondary tw:dark:highlight:bg-dm-secondary"
+  ],
+  t && "tw:bg-lm-main tw:dark:bg-dm-main tw:text-white"
+), A = ({ children: t }) => /* @__PURE__ */ n("span", { "aria-hidden": !0, className: w(tt, "tw:px-3 py-2 tw:text-gray-400"), children: t }), rt = () => /* @__PURE__ */ n(A, { children: _ });
+function Ot({ children: t, active: e, isEllipsis: r, href: o, ...a }) {
   const l = O(() => et(e), [e]);
-  return r ? /* @__PURE__ */ n(rt, {}) : /* @__PURE__ */ n(S, { className: l, to: o, ...a, children: t });
+  return r ? /* @__PURE__ */ n(rt, {}) : /* @__PURE__ */ n(j, { className: l, to: o, ...a, children: t });
 }
-function jt({ children: t, active: e, isEllipsis: r, ...o }) {
+function Ut({ children: t, active: e, isEllipsis: r, ...o }) {
   const a = O(() => et(e), [e]);
   return r ? /* @__PURE__ */ n(rt, {}) : /* @__PURE__ */ n("button", { type: "button", className: a, ...o, children: t });
 }
-const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
-  const o = "urlForPage" in r, a = o ? St : jt, l = C(
+const se = ({ currentPage: t, pagesCount: e, ...r }) => {
+  const o = "urlForPage" in r, a = o ? Ot : Ut, l = C(
     (d) => o ? { href: B(d) ? void 0 : r.urlForPage(d) } : { onClick: () => !B(d) && r.onPageChange(d) },
     [o, r]
   );
   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: G }) }) : /* @__PURE__ */ n(a, { ...l(Math.max(1, t - 1)), "aria-label": "Previous", children: /* @__PURE__ */ n(k, { size: "xs", icon: G }) }),
-    Dt(t, e).map((d, s) => /* @__PURE__ */ n(
+    t === 1 ? /* @__PURE__ */ n(A, { children: /* @__PURE__ */ n(k, { size: "xs", icon: J }) }) : /* @__PURE__ */ n(a, { ...l(Math.max(1, t - 1)), "aria-label": "Previous", children: /* @__PURE__ */ n(k, { size: "xs", icon: J }) }),
+    jt(t, e).map((d, i) => /* @__PURE__ */ n(
       a,
       {
         active: d === t,
         isEllipsis: B(d),
         ...l(d),
-        children: $t(d)
+        children: At(d)
       },
-      At(d, s)
+      Ht(d, i)
     )),
-    t === e ? /* @__PURE__ */ n(j, { children: /* @__PURE__ */ n(k, { size: "xs", icon: J }) }) : /* @__PURE__ */ n(a, { ...l(Math.min(e, t + 1)), "aria-label": "Next", children: /* @__PURE__ */ n(k, { size: "xs", icon: J }) })
+    t === e ? /* @__PURE__ */ n(A, { children: /* @__PURE__ */ n(k, { size: "xs", icon: Q }) }) : /* @__PURE__ */ n(a, { ...l(Math.min(e, t + 1)), "aria-label": "Next", children: /* @__PURE__ */ n(k, { size: "xs", icon: Q }) })
   ] });
-}, Ht = ({
+}, Wt = ({
   open: t,
   children: e,
   className: r,
   onClose: o,
   ...a
 }) => {
-  const l = L(null);
+  const l = I(null);
   return M(() => {
     var c, m;
-    const d = document.body, s = d.style.overflow, i = d.style.paddingRight;
+    const d = document.body, i = d.style.overflow, s = d.style.paddingRight;
     if (t) {
       const u = window.outerWidth - d.clientWidth, p = d.scrollHeight > d.clientHeight;
       d.style.overflow = "hidden", p && (d.style.paddingRight = `${u}px`), (c = l.current) == null || c.showModal();
     } else
       (m = l.current) == null || m.close();
     return () => {
-      d.style.overflow = s, d.style.paddingRight = i;
+      d.style.overflow = i, d.style.paddingRight = s;
     };
-  }, [t]), mt(
+  }, [t]), bt(
     /* @__PURE__ */ n(
       "dialog",
       {
@@ -757,7 +766,7 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
     ),
     document.body
   );
-}, de = ({
+}, we = ({
   open: t,
   onClose: e,
   variant: r = "default",
@@ -767,37 +776,37 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
   ...d
 }) => {
   const {
-    size: s = "md",
-    confirmText: i = "Confirm",
+    size: i = "md",
+    confirmText: s = "Confirm",
     cancelText: c = "Cancel",
     confirmDisabled: m,
     onConfirm: u,
     onClosed: p,
     ...f
-  } = "onConfirm" in d ? d : { ...d }, [b, h] = F(t), _ = L(null), $ = L("cancel"), ot = C(() => {
-    $.current = "confirm", u == null || u();
+  } = "onConfirm" in d ? d : { ...d }, [b, h] = F(t), R = I(null), D = I("cancel"), ot = C(() => {
+    D.current = "confirm", u == null || u();
   }, [u]);
   return M(() => {
     if (t) {
-      $.current = "cancel", h(!0);
+      D.current = "cancel", h(!0);
       return;
     }
-    const P = _.current;
+    const P = R.current;
     if (P) {
-      delete _.current.dataset.open;
+      delete R.current.dataset.open;
       let q = !1;
-      const z = (nt) => {
-        q || nt.target !== P || (q = !0, h(!1), p == null || p($.current));
+      const G = (nt) => {
+        q || nt.target !== P || (q = !0, h(!1), p == null || p(D.current));
       };
-      return P.addEventListener("transitionend", z), () => {
-        P.removeEventListener("transitionend", z);
+      return P.addEventListener("transitionend", G), () => {
+        P.removeEventListener("transitionend", G);
       };
     }
   }, [p, t]), M(() => {
-    const P = _.current;
+    const P = R.current;
     b && P && (P.dataset.open = "");
   }, [b]), /* @__PURE__ */ n(
-    Ht,
+    Wt,
     {
       open: b,
       onClose: e,
@@ -813,7 +822,7 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
         "div",
         {
           "data-testid": "transition-container",
-          ref: _,
+          ref: R,
           className: w(
             "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
@@ -821,17 +830,17 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
             "tw:transition-[opacity_,_translate] tw:duration-300",
             // Handle modal dimensions for different variants and sizes
             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:sm:w-sm": i === "sm",
+              "tw:md:w-lg": i === "md",
+              "tw:md:w-4xl": i === "lg",
+              "tw:md:w-6xl": i === "xl"
             },
             { "tw:h-full": r === "cover" }
           ),
           children: /* @__PURE__ */ n(v, { className: w(
             "tw:w-full",
             { "tw:h-full tw:relative tw:overflow-auto": r === "cover" }
-          ), children: r === "cover" ? /* @__PURE__ */ g(A, { children: [
+          ), children: r === "cover" ? /* @__PURE__ */ g(S, { children: [
             /* @__PURE__ */ g(
               "div",
               {
@@ -843,18 +852,18 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
                 ),
                 children: [
                   /* @__PURE__ */ n("h5", { children: o }),
-                  /* @__PURE__ */ n(Q, { onClick: e, label: "Close dialog" })
+                  /* @__PURE__ */ n(V, { onClick: e, label: "Close dialog" })
                 ]
               }
             ),
             /* @__PURE__ */ n("div", { children: a })
-          ] }) : /* @__PURE__ */ g(A, { children: [
+          ] }) : /* @__PURE__ */ g(S, { children: [
             /* @__PURE__ */ g(v.Header, { className: w(
               "tw:sticky tw:top-0",
               "tw:flex tw:items-center tw:justify-between tw:gap-x-2"
             ), children: [
               /* @__PURE__ */ n("h5", { className: w({ "tw:text-danger": r === "danger" }), children: o }),
-              /* @__PURE__ */ n(Q, { onClick: e, label: "Close dialog" })
+              /* @__PURE__ */ n(V, { onClick: e, label: "Close dialog" })
             ] }),
             /* @__PURE__ */ n(v.Body, { children: a }),
             u && /* @__PURE__ */ g(
@@ -866,15 +875,15 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
                   "tw:[&]:px-3 tw:sticky tw:bottom-0"
                 ),
                 children: [
-                  /* @__PURE__ */ n(Bt, { onClick: e, children: c }),
+                  /* @__PURE__ */ n(Rt, { onClick: e, children: c }),
                   /* @__PURE__ */ n(
-                    Ct,
+                    Lt,
                     {
                       solid: !0,
                       variant: r === "danger" ? "danger" : "primary",
                       disabled: m,
                       onClick: ot,
-                      children: i
+                      children: s
                     }
                   )
                 ]
@@ -885,16 +894,16 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
       )
     }
   );
-}, le = ({ className: t, children: e, loading: r = !1, variant: o = "default" }) => /* @__PURE__ */ n(ht, { className: x({ "tw:[&]:border-danger": o === "error" }, t), children: /* @__PURE__ */ g("h3", { className: x("tw:text-center", {
+}, ce = ({ className: t, children: e, loading: r = !1, variant: o = "default" }) => /* @__PURE__ */ n(yt, { className: x({ "tw:[&]:border-danger": o === "error" }, t), children: /* @__PURE__ */ g("h3", { className: x("tw:text-center", {
   "tw:text-gray-500 tw:dark:text-gray-400": o === "default",
   "tw:text-danger": o === "error"
 }), children: [
-  r && /* @__PURE__ */ g(A, { children: [
-    /* @__PURE__ */ n(k, { icon: X, spin: !0 }),
+  r && /* @__PURE__ */ g(S, { children: [
+    /* @__PURE__ */ n(k, { icon: Y, spin: !0 }),
     /* @__PURE__ */ n("span", { className: "tw:ml-2", children: e ?? "Loading..." })
   ] }),
   !r && e
-] }) }), se = ({ variant: t, className: e, size: r = "md", children: o }) => /* @__PURE__ */ n(
+] }) }), me = ({ variant: t, className: e, size: r = "md", children: o }) => /* @__PURE__ */ n(
   "div",
   {
     className: x(
@@ -904,7 +913,7 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
         "tw:p-4": r === "md",
         "tw:p-6": r === "lg",
         "tw:[&]:text-white": t !== "warning",
-        "tw:bg-brand": t === "success",
+        "tw:bg-lm-brand tw:dark:bg-dm-brand": t === "success",
         "tw:bg-danger": t === "error",
         "tw:bg-warning tw:text-black": t === "warning"
       },
@@ -912,38 +921,64 @@ const ae = ({ currentPage: t, pagesCount: e, ...r }) => {
     ),
     children: o
   }
-);
+), ge = ({ text: t, className: e, size: r = "lg", initialCopied: o = !1, navigator_: a = globalThis.navigator, ...l }) => {
+  const [d, i] = gt(o), s = C(
+    () => a.clipboard.writeText(t).then(i),
+    [a.clipboard, t, i]
+  );
+  return /* @__PURE__ */ n(
+    "button",
+    {
+      type: "button",
+      className: x(
+        "tw:focus-ring tw:rounded-sm",
+        {
+          "tw:text-md": r === "sm",
+          "tw:text-lg": r === "md",
+          "tw:text-xl": r === "lg"
+        },
+        e
+      ),
+      "aria-label": `Copy ${t} to clipboard`,
+      title: "Copy to clipboard",
+      onClick: s,
+      ...l,
+      children: /* @__PURE__ */ n(k, { icon: d ? wt : ut, fixedWidth: !0 })
+    }
+  );
+};
 export {
-  Ct as Button,
+  Lt as Button,
   v as Card,
-  de as CardModal,
-  Xt as Checkbox,
-  Q as CloseButton,
-  Qt as Details,
-  R as ELLIPSIS,
+  we as CardModal,
+  ee as Checkbox,
+  V as CloseButton,
+  ge as CopyToClipboardButton,
+  zt as Details,
+  _ as ELLIPSIS,
   U as Input,
-  K as Label,
-  Yt as LabelledInput,
-  Zt as LabelledRevealablePasswordInput,
-  te as LabelledSelect,
-  Bt as LinkButton,
-  ft as Listbox,
-  le as Message,
-  Ht as ModalDialog,
-  oe as NavPills,
-  ae as Paginator,
-  se as Result,
-  It as RevealablePasswordInput,
-  ee as SearchCombobox,
-  Tt as SearchInput,
-  Lt as Select,
-  ht as SimpleCard,
-  Vt as Table,
-  re as ToggleSwitch,
-  Rt as formatNumber,
-  At as keyForPage,
+  W as Label,
+  re as LabelledInput,
+  oe as LabelledRevealablePasswordInput,
+  ne as LabelledSelect,
+  Rt as LinkButton,
+  kt as Listbox,
+  ce as Message,
+  Wt as ModalDialog,
+  le as NavPills,
+  se as Paginator,
+  me as Result,
+  Bt as RevealablePasswordInput,
+  ae as SearchCombobox,
+  Et as SearchInput,
+  Mt as Select,
+  yt as SimpleCard,
+  te as Table,
+  de as ToggleSwitch,
+  Dt as formatNumber,
+  Ht as keyForPage,
   B as pageIsEllipsis,
-  $t as prettifyPageNumber,
-  Dt as progressivePagination,
-  ne as roundTen
+  At as prettifyPageNumber,
+  jt as progressivePagination,
+  ie as roundTen
 };