@shlinkio/shlink-frontend-kit 0.9.9 → 0.9.10

package/dist/index.d.ts

@@ -36,10 +36,12 @@ export declare const Checkbox: FC<BooleanControlProps>;
 
 export declare function determineOrder<Fields extends string = string>(orderDirChange: OrderDirChange<Fields>): Order<Fields>;
 
+/** @deprecated */
 export declare function determineOrder<Fields extends string = string>(currentField?: Fields, newField?: Fields, currentOrderDir?: OrderDir): Order<Fields>;
 
 export declare function determineOrderDir<Fields extends string = string>(orderDirChange: OrderDirChange<Fields>): OrderDir;
 
+/** @deprecated */
 export declare function determineOrderDir<Fields extends string = string>(currentField?: Fields, newField?: Fields, currentOrderDir?: OrderDir): OrderDir;
 
 /** @deprecated */
@@ -152,6 +154,7 @@ export declare type OrderingDropdownProps<T extends string = string> = {
 
 export declare type OrderSetter<T> = {
     (order: Order<T>): void;
+    /** @deprecated Pass the order object as the only argument */
     (orderField?: T, orderDir?: OrderDir): void;
 };
 

package/dist/index.js

@@ -4,8 +4,8 @@ import { FontAwesomeIcon as b } from "@fortawesome/react-fontawesome";
 import { clsx as u } from "clsx";
 import { Card as w, CardHeader as H, CardBody as M, Dropdown as v, DropdownToggle as k, DropdownMenu as C, NavItem as $, NavLink as F, Nav as G, DropdownItem as g } from "reactstrap";
 import { useId as O, useState as x, useRef as j, useCallback as U, useMemo as q, Children as Q, isValidElement as V, useEffect as Y } from "react";
-import { u as T, d as W } from "./ordering-B_hekQuu.js";
-import { e as He, o as Me, s as $e, f as Fe, a as Ge, g as je, b as Ue, c as qe } from "./ordering-B_hekQuu.js";
+import { u as T, d as W } from "./ordering-VI1mTe3x.js";
+import { e as He, o as Me, s as $e, f as Fe, a as Ge, g as je, b as Ue, c as qe } from "./ordering-VI1mTe3x.js";
 import { useNavigate as z, useLocation as J, NavLink as X } from "react-router";
 const ue = ({ className: r, children: e, loading: s = !1, type: t = "default", fullWidth: a = !1 }) => /* @__PURE__ */ n(
   w,

package/dist/ordering-VI1mTe3x.js

@@ -0,0 +1,102 @@
+import { useMemo as T, useEffect as C, useRef as A, useCallback as d, useState as b } from "react";
+function k(e, { elementsSelector: o, focusFirstItem: r = !1, vertical: n = !0, horizontal: t = !0 }) {
+  const s = T(() => {
+    const c = [];
+    return n && c.push("ArrowDown"), t && c.push("ArrowRight"), c;
+  }, [t, n]), u = T(() => {
+    const c = [];
+    return n && c.push("ArrowUp"), t && c.push("ArrowLeft"), c;
+  }, [t, n]), l = T(() => [...s, ...u], [s, u]);
+  C(() => {
+    const c = e.current;
+    if (!c)
+      return () => {
+      };
+    const f = new AbortController(), g = () => [...c.querySelectorAll(o)], w = g(), h = Math.max(w.findIndex((i) => i.dataset.selected === "true"), 0);
+    return w.forEach((i, a) => {
+      i.tabIndex = a === h ? 0 : -1, r && a === h && i.focus();
+    }), c.addEventListener("keydown", (i) => {
+      if (!l.includes(i.key))
+        return;
+      i.preventDefault();
+      const a = g(), p = a.findIndex((m) => m.tabIndex === 0), y = s.includes(i.key) ? a[p + 1] ?? a[0] : a[p - 1] ?? a[a.length - 1];
+      a.forEach((m) => {
+        m.tabIndex = -1;
+      }), y.tabIndex = 0, y.focus();
+    }, { signal: f.signal }), () => f.abort();
+  }, [l, e, o, r, s]);
+}
+function E(e, o = globalThis.setTimeout, r = globalThis.clearTimeout) {
+  const n = A(null), t = d(() => {
+    n.current && r(n.current);
+  }, [r]), s = d((u, l) => {
+    t(), n.current = o(() => {
+      u(), n.current = null;
+    }, l ?? e);
+  }, [t, e, o]);
+  return C(() => t, [t]), T(
+    () => ({ setTimeout: s, clearCurrentTimeout: t }),
+    [t, s]
+  );
+}
+const F = 2e3, I = (e = {}, o, r = globalThis.setTimeout, n = globalThis.clearTimeout) => {
+  const { initialValue: t = !1, delay: s = F } = typeof e == "boolean" ? {
+    initialValue: e,
+    delay: o
+  } : e, { setTimeout: u } = E(s, r, n), [l, c] = b(t), f = A(t), g = d(() => {
+    c(!f.current), u(() => c(f.current));
+  }, [u]);
+  return [l, g];
+};
+function L(e = !1, o = !1) {
+  const [r, n] = b(e), t = d(() => n((l) => !l), []), s = d(() => n(!0), []), u = d(() => n(!1), []);
+  return o ? { flag: r, toggle: t, setToTrue: s, setToFalse: u } : [r, t, s, u];
+}
+function D(e, o, r) {
+  if (!e || typeof e == "string")
+    return D({ currentField: e, newField: o, currentOrderDir: r });
+  const n = e;
+  if (n.currentField !== n.newField)
+    return "ASC";
+  const t = {
+    ASC: "DESC",
+    DESC: void 0
+  };
+  return n.currentOrderDir ? t[n.currentOrderDir] : "ASC";
+}
+function S(e, o, r) {
+  if (!e || typeof e == "string")
+    return S({ currentField: e, newField: o, currentOrderDir: r });
+  const n = e, t = D(n);
+  return {
+    field: t ? n.newField : void 0,
+    dir: t
+  };
+}
+const v = (e, { field: o, dir: r }) => !o || !r ? e : e.sort((n, t) => {
+  const s = r === "ASC" ? 1 : -1, u = r === "ASC" ? -1 : 1;
+  return n[o] > t[o] ? s : u;
+}), M = (e) => e.dir ? `${e.field}-${e.dir}` : void 0, R = (e) => {
+  const [o, r] = e.split("-");
+  return { field: o, dir: r };
+}, U = (e) => {
+  const [o, r] = b(e), n = d(
+    (t, s) => r(
+      t && typeof t == "object" ? t : { field: t, dir: s }
+    ),
+    []
+  );
+  return [o, n];
+};
+export {
+  k as a,
+  E as b,
+  I as c,
+  D as d,
+  S as e,
+  R as f,
+  U as g,
+  M as o,
+  v as s,
+  L as u
+};

package/dist/tailwind.js

@@ -2,9 +2,9 @@ import { jsxs as p, jsx as n, Fragment as _ } from "react/jsx-runtime";
 import w, { clsx as f } from "clsx";
 import { useRef as T, useState as R, useEffect as B, forwardRef as y, useCallback as P, createContext as q, useContext as O, useId as $, useMemo as W } from "react";
 import { Link as G, NavLink as mt } from "react-router";
-import { faClose as pt, faEyeSlash as bt, faEye as gt, faCircleNotch as nt, faSearch as ut, faCaretDown as ht, faChevronLeft as V, faChevronRight as tt, faEllipsisV as ft, faSortAmountUp as xt, faSortAmountDown as yt, faCheck as kt } from "@fortawesome/free-solid-svg-icons";
+import { faClose as pt, faEyeSlash as gt, faEye as bt, faCircleNotch as nt, faSearch as ut, faCaretDown as ht, faChevronLeft as V, faChevronRight as tt, faEllipsisV as ft, faSortAmountUp as xt, faSortAmountDown as yt, faCheck as kt } from "@fortawesome/free-solid-svg-icons";
 import { FontAwesomeIcon as v } from "@fortawesome/react-fontawesome";
-import { u as vt, b as Nt, a as Ct, e as Tt, c as It } from "./ordering-B_hekQuu.js";
+import { u as vt, b as Nt, a as Ct, e as Tt, c as It } from "./ordering-VI1mTe3x.js";
 import { useFloating as ot, flip as Pt, offset as Ot, useClick as Dt, useInteractions as at, autoPlacement as Lt, arrow as Mt, useHover as Bt, useTransitionStyles as Rt } from "@floating-ui/react";
 import { createPortal as Ft } from "react-dom";
 import "reactstrap";
@@ -89,20 +89,20 @@ function Ht({
   "aria-label": s = "Items",
   ...c
 }) {
-  const [m, g] = R(0), u = P((x) => {
-    if (g(x), o) {
-      const [b, h] = [...e.entries()][x];
-      o(b, h);
+  const [m, b] = R(0), u = P((x) => {
+    if (b(x), o) {
+      const [g, h] = [...e.entries()][x];
+      o(g, h);
     }
   }, [e, o]);
   return B(() => {
     const x = i == null ? void 0 : i.current;
     if (!x)
       return;
-    const b = (h) => {
+    const g = (h) => {
       ["Enter", "ArrowUp", "ArrowDown"].includes(h.key) && h.preventDefault(), h.key === "ArrowDown" ? u(Math.min(m + 1, e.size - 1)) : h.key === "ArrowUp" ? u(Math.max(m - 1, 0)) : h.key === "Enter" && t([...e.values()][m]);
     };
-    return x.addEventListener("keydown", b), () => x.removeEventListener("keydown", b);
+    return x.addEventListener("keydown", g), () => x.removeEventListener("keydown", g);
   }, [m, i, u, e, t]), /* @__PURE__ */ p(
     C,
     {
@@ -114,7 +114,7 @@ function Ht({
       ...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 }),
-        [...e.entries()].map(([x, b], h) => /* @__PURE__ */ n(
+        [...e.entries()].map(([x, g], h) => /* @__PURE__ */ n(
           "button",
           {
             id: `${r}_${x}`,
@@ -126,9 +126,9 @@ function Ht({
               { "tw:bg-lm-secondary tw:dark:bg-dm-secondary": h === m }
             ),
             tabIndex: -1,
-            onClick: () => t(b),
+            onClick: () => t(g),
             onMouseOver: () => u(h),
-            children: a(b)
+            children: a(g)
           },
           x
         ))
@@ -206,6 +206,7 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
           "tw:p-3": s === "lg",
           "tw:border-b-1": !i,
           "tw:block tw:lg:table-cell tw:not-last:border-b-1 tw:lg:border-b-1": i,
+          "tw:text-left": d === "th",
           // For responsive tables, display the content in data-column attribute for md sizes and lower
           "tw:before:lg:hidden tw:before:content-[attr(data-column)] tw:before:font-bold tw:before:mr-1": i && d === "td"
         },
@@ -229,7 +230,7 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
   type: d = "button",
   ...i
 }, s) => {
-  const c = "to" in i, m = c ? G : "button", g = c ? void 0 : d;
+  const c = "to" in i, m = c ? G : "button", b = c ? void 0 : d;
   return /* @__PURE__ */ n(
     m,
     {
@@ -277,13 +278,14 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
           "tw:highlight:bg-danger": t === "danger"
         },
         {
+          "tw:cursor-pointer": !e,
           "tw:pointer-events-none tw:opacity-65": e
         },
         r
       ),
       disabled: c ? void 0 : e,
       "aria-disabled": c ? e : void 0,
-      type: g,
+      type: b,
       ...i
     }
   );
@@ -321,7 +323,7 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
     onClick: r,
     className: w(
       "tw:opacity-50 tw:highlight:opacity-80 tw:transition-opacity",
-      "tw:rounded-md tw:focus-ring",
+      "tw:rounded-md tw:focus-ring tw:cursor-pointer",
       e
     ),
     "aria-label": t,
@@ -395,8 +397,8 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
   ] });
 }), Qt = y(({ containerClassName: r, className: e, size: t, ...o }, a) => {
   const [l, d, , i] = vt(!1), s = T(null), c = P(({ relatedTarget: m }) => {
-    var g;
-    (g = s.current) != null && g.contains(m) || i();
+    var b;
+    (b = s.current) != null && b.contains(m) || i();
   }, [s, i]);
   return /* @__PURE__ */ p(
     "div",
@@ -430,7 +432,7 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
             title: l ? "Hide password" : "Show password",
             "aria-label": l ? "Hide password" : "Show password",
             className: f(
-              "tw:absolute tw:top-[50%] tw:translate-y-[-50%] tw:px-1",
+              "tw:absolute tw:top-[50%] tw:translate-y-[-50%] tw:px-1 tw:cursor-pointer",
               "tw:text-placeholder tw:hover:text-lm-text tw:hover:dark:text-dm-text tw:transition-colors",
               {
                 "tw:right-1.5": t !== "sm",
@@ -438,7 +440,7 @@ const H = q(void 0), F = q({ responsive: !0, size: "md" }), Ut = ({ children: r,
               }
             ),
             tabIndex: -1,
-            children: /* @__PURE__ */ n(v, { fixedWidth: !0, icon: l ? bt : gt })
+            children: /* @__PURE__ */ n(v, { fixedWidth: !0, icon: l ? gt : bt })
           }
         )
       ]
@@ -575,18 +577,18 @@ function Fe({
   onFocus: d,
   ...i
 }) {
-  const s = T(null), c = $(), [m, g] = R(), u = W(
+  const s = T(null), c = $(), [m, b] = R(), u = W(
     () => r ? m ?? [...r.keys()][0] : void 0,
     [m, r]
-  ), x = P((b) => {
-    t(b), e(""), s.current.value = "";
+  ), x = P((g) => {
+    t(g), e(""), s.current.value = "";
   }, [e, t]);
   return /* @__PURE__ */ p(
     "div",
     {
       className: "tw:relative",
-      onBlur: (b) => {
-        b.currentTarget.contains(b.relatedTarget) || e("");
+      onBlur: (g) => {
+        g.currentTarget.contains(g.relatedTarget) || e("");
       },
       children: [
         /* @__PURE__ */ n(
@@ -602,8 +604,8 @@ function Fe({
             "aria-activedescendant": u ? `${c}_${u}` : void 0,
             autoComplete: "off",
             autoCorrect: "off",
-            onFocus: (b) => {
-              d == null || d(b), e(b.target.value);
+            onFocus: (g) => {
+              d == null || d(g), e(g.target.value);
             },
             ...i
           }
@@ -615,7 +617,7 @@ function Fe({
             items: r,
             anchor: s,
             onSelectItem: x,
-            onActiveItemChange: g,
+            onActiveItemChange: b,
             renderItem: o,
             className: w(
               "tw:absolute tw:top-full tw:mt-1 tw:z-10",
@@ -659,6 +661,7 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
           // Overwrite link styles in case a Link is being used
           "tw:no-underline tw:text-inherit",
           {
+            "tw:cursor-pointer": !t,
             "tw:pointer-events-none tw:opacity-50": t,
             "tw:bg-lm-secondary tw:dark:bg-dm-secondary": e && !t,
             "tw:highlight:bg-lm-secondary tw:dark:highlight:bg-dm-secondary tw:highlight:z-1 tw:relative": !e && !t
@@ -722,8 +725,8 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
   caretless: c,
   buttonLabel: m
 }) => {
-  const [g, u] = R(!1), x = T(null), { refs: b, floatingStyles: h, context: D } = ot({
-    open: g,
+  const [b, u] = R(!1), x = T(null), { refs: g, floatingStyles: h, context: D } = ot({
+    open: b,
     onOpenChange: u,
     placement: e === "right" ? "bottom-end" : "bottom-start",
     middleware: [Pt(), Ot(3)],
@@ -761,7 +764,7 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
             ...K(),
             type: "button",
             "aria-haspopup": !0,
-            "aria-expanded": g,
+            "aria-expanded": b,
             "aria-controls": S,
             "aria-label": m,
             disabled: d,
@@ -769,6 +772,7 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
               "tw:flex tw:items-center tw:rounded-md tw:focus-ring",
               {
                 "tw:justify-between": !c,
+                "tw:cursor-pointer": !d,
                 "tw:pointer-events-none tw:opacity-50": d,
                 // Button variant
                 "tw:border tw:border-lm-border tw:dark:border-dm-border": t === "button",
@@ -794,10 +798,10 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
             ]
           }
         ),
-        g && /* @__PURE__ */ n(
+        b && /* @__PURE__ */ n(
           "div",
           {
-            ref: b.setFloating,
+            ref: g.setFloating,
             style: h,
             className: "tw:min-w-full tw:z-1000",
             ...k(),
@@ -832,6 +836,7 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
         "tw:px-1.5 tw:py-1 tw:text-sm": t === "sm",
         "tw:px-3 tw:py-1.5": t === "md",
         "tw:px-4 tw:py-2 tw:text-lg": t === "lg",
+        "tw:cursor-pointer": !e,
         "tw:pointer-events-none tw:opacity-65": e
       },
       r
@@ -876,7 +881,7 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
   "tw:rounded-none tw:first:rounded-l tw:last:rounded-r"
 ], st = (r = !1) => w(
   it,
-  "tw:px-3 py-2 tw:cursor-pointer tw:no-underline",
+  "tw:px-3 tw:py-2 tw:cursor-pointer tw:no-underline",
   "tw:focus-ring tw:focus-visible:z-1",
   !r && [
     "tw:text-lm-brand tw:dark:text-dm-brand",
@@ -884,17 +889,17 @@ const Ee = y(({ className: r, ...e }, t) => /* @__PURE__ */ n(
     "tw:highlight:bg-lm-secondary tw:dark:highlight:bg-dm-secondary"
   ],
   r && "tw:bg-lm-main tw:dark:bg-dm-main tw:text-white"
-), z = ({ children: r }) => /* @__PURE__ */ n("span", { "aria-hidden": !0, className: w(it, "tw:px-3 py-2 tw:text-gray-400"), children: r }), ct = () => /* @__PURE__ */ n(z, { children: U });
+), z = ({ children: r }) => /* @__PURE__ */ n("span", { "aria-hidden": !0, className: w(it, "tw:px-3 tw:py-2 tw:text-gray-400"), children: r }), ct = () => /* @__PURE__ */ n(z, { children: U });
 function pe({ children: r, active: e, isEllipsis: t, href: o, ...a }) {
   const l = W(() => st(e), [e]);
   return t ? /* @__PURE__ */ n(ct, {}) : /* @__PURE__ */ n(G, { className: l, to: o, ...a, children: r });
 }
-function be({ children: r, active: e, isEllipsis: t, ...o }) {
+function ge({ children: r, active: e, isEllipsis: t, ...o }) {
   const a = W(() => st(e), [e]);
   return t ? /* @__PURE__ */ n(ct, {}) : /* @__PURE__ */ n("button", { type: "button", className: a, ...o, children: r });
 }
 const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
-  const o = "urlForPage" in t, a = o ? pe : be, l = P(
+  const o = "urlForPage" in t, a = o ? pe : ge, l = P(
     (d) => o ? { href: A(d) ? void 0 : t.urlForPage(d) } : { onClick: () => !A(d) && t.onPageChange(d) },
     [o, t]
   );
@@ -912,7 +917,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     )),
     r === e ? /* @__PURE__ */ n(z, { children: /* @__PURE__ */ n(v, { size: "xs", icon: tt }) }) : /* @__PURE__ */ n(a, { ...l(Math.min(e, r + 1)), "aria-label": "Next", children: /* @__PURE__ */ n(v, { size: "xs", icon: tt }) })
   ] });
-}, ge = ({ buttonLabel: r = "Options", buttonSize: e = "md", ...t }) => /* @__PURE__ */ n(
+}, be = ({ buttonLabel: r = "Options", buttonSize: e = "md", ...t }) => /* @__PURE__ */ n(
   I,
   {
     buttonContent: /* @__PURE__ */ n(
@@ -927,7 +932,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     buttonSize: e,
     ...t
   }
-), _e = Object.assign(ge, {
+), _e = Object.assign(be, {
   Item: I.Item,
   Separator: I.Separator,
   Title: I.Title,
@@ -944,8 +949,8 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     var c, m;
     const d = document.body, i = d.style.overflow, s = d.style.paddingRight;
     if (r) {
-      const g = window.outerWidth - d.clientWidth, u = d.scrollHeight > d.clientHeight;
-      d.style.overflow = "hidden", u && (d.style.paddingRight = `${g}px`), (c = l.current) == null || c.showModal();
+      const b = window.outerWidth - d.clientWidth, u = d.scrollHeight > d.clientHeight;
+      d.style.overflow = "hidden", u && (d.style.paddingRight = `${b}px`), (c = l.current) == null || c.showModal();
     } else
       (m = l.current) == null || m.close();
     return () => {
@@ -980,12 +985,12 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     confirmText: s = "Confirm",
     cancelText: c = "Cancel",
     confirmDisabled: m,
-    onConfirm: g,
+    onConfirm: b,
     onClosed: u,
     ...x
-  } = "onConfirm" in d ? d : { ...d }, [b, h] = R(r), D = T(null), E = T("cancel"), K = P((k) => {
-    k.preventDefault(), k.stopPropagation(), E.current = "confirm", g == null || g();
-  }, [g]);
+  } = "onConfirm" in d ? d : { ...d }, [g, h] = R(r), D = T(null), E = T("cancel"), K = P((k) => {
+    k.preventDefault(), k.stopPropagation(), E.current = "confirm", b == null || b();
+  }, [b]);
   return B(() => {
     if (r) {
       E.current = "cancel", h(!0);
@@ -1004,15 +1009,15 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     }
   }, [u, r]), B(() => {
     const k = D.current;
-    b && k && (k.dataset.open = "");
-  }, [b]), /* @__PURE__ */ n(
+    g && k && (k.dataset.open = "");
+  }, [g]), /* @__PURE__ */ n(
     ue,
     {
-      open: b,
+      open: g,
       onClose: e,
       className: w(
         {
-          "tw:flex tw:w-screen tw:h-screen tw:max-w-screen tw:max-h-screen": b,
+          "tw:flex tw:w-screen tw:h-screen tw:max-w-screen tw:max-h-screen": g,
           "tw:overflow-hidden": t === "cover"
         },
         l
@@ -1067,7 +1072,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
               /* @__PURE__ */ n(et, { onClick: e, label: "Close dialog" })
             ] }),
             /* @__PURE__ */ n(C.Body, { children: a }),
-            g && /* @__PURE__ */ p(
+            b && /* @__PURE__ */ p(
               C.Footer,
               {
                 "data-testid": "footer",
@@ -1134,7 +1139,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
   }), c = Bt(i, {
     delay: { open: 300 },
     move: !0
-  }), { getFloatingProps: m, getReferenceProps: g } = at([c]), { isMounted: u, styles: x } = Rt(i, { duration: 200 }), b = W(() => {
+  }), { getFloatingProps: m, getReferenceProps: b } = at([c]), { isMounted: u, styles: x } = Rt(i, { duration: 200 }), g = W(() => {
     const h = i.placement.split("-")[0];
     return {
       top: "bottom",
@@ -1144,7 +1149,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
     }[h] ?? "";
   }, [i.placement]);
   return {
-    anchor: { ...g(), ref: l.setReference },
+    anchor: { ...b(), ref: l.setReference },
     tooltip: {
       ...m(),
       refSetter: l.setFloating,
@@ -1152,7 +1157,7 @@ const Ae = ({ currentPage: r, pagesCount: e, ...t }) => {
       styles: { ...d, ...x },
       arrowPos: s.arrow,
       arrowRef: e,
-      arrowSide: b
+      arrowSide: g
     }
   };
 }, Ke = ({ children: r, isMounted: e, styles: t, refSetter: o, arrowRef: a, arrowPos: l, arrowSide: d, ...i }) => {
@@ -1232,7 +1237,7 @@ function ze({ items: r, order: e, onChange: t, prefixed: o = !0, buttonVariant:
           {
             selected: e.field === s,
             onClick: () => d(s),
-            className: "tw:flex tw:items-center tw:justify-between",
+            className: "tw:flex tw:items-center tw:justify-between tw:gap-2",
             children: [
               c,
               e.field === s && /* @__PURE__ */ n(v, { icon: e.dir === "ASC" ? xt : yt })
@@ -1256,7 +1261,7 @@ const qe = ({ text: r, className: e, size: t = "lg", initialCopied: o = !1, navi
     {
       type: "button",
       className: f(
-        "tw:focus-ring tw:rounded-sm",
+        "tw:focus-ring tw:rounded-sm tw:cursor-pointer",
         {
           "tw:text-md": t === "sm",
           "tw:text-lg": t === "md",

package/dist/tailwind.preset.css

@@ -51,7 +51,7 @@
     --breakpoint-md: 768px;
     --breakpoint-lg: 992px;
     --breakpoint-xl: 1200px;
-    --breakpoint-2xl: 1400px;
+    --breakpoint-2xl: 1320px; /* 1400px according to bootstrap docs, but then the container is bigger than before */
 }
 
 /* Deprecated. TODO Remove with bootstrap support */
@@ -150,7 +150,7 @@
     }
 
     hr {
-        @apply tw:my-2
+        @apply tw:my-3;
     }
 
     p {
@@ -160,6 +160,10 @@
     code {
         @apply tw:text-sm tw:text-pink-600 tw:dark:text-pink-500 tw:font-mono;
     }
+
+    input[type="search"]::-webkit-search-cancel-button {
+        @apply tw:cursor-pointer;
+    }
 }
 
 @utility focus-ring-base {

package/package.json

@@ -93,5 +93,5 @@
     "not ie <= 11",
     "not op_mini all"
   ],
-  "version": "0.9.9"
+  "version": "0.9.10"
 }

package/dist/ordering-B_hekQuu.js

@@ -1,96 +0,0 @@
-import { useMemo as b, useEffect as C, useRef as E, useCallback as d, useState as g } from "react";
-function k(e, { elementsSelector: s, focusFirstItem: n = !1, vertical: o = !0, horizontal: t = !0 }) {
-  const r = b(() => {
-    const c = [];
-    return o && c.push("ArrowDown"), t && c.push("ArrowRight"), c;
-  }, [t, o]), u = b(() => {
-    const c = [];
-    return o && c.push("ArrowUp"), t && c.push("ArrowLeft"), c;
-  }, [t, o]), l = b(() => [...r, ...u], [r, u]);
-  C(() => {
-    const c = e.current;
-    if (!c)
-      return () => {
-      };
-    const f = new AbortController(), T = () => [...c.querySelectorAll(s)], w = T(), p = Math.max(w.findIndex((i) => i.dataset.selected === "true"), 0);
-    return w.forEach((i, a) => {
-      i.tabIndex = a === p ? 0 : -1, n && a === p && i.focus();
-    }), c.addEventListener("keydown", (i) => {
-      if (!l.includes(i.key))
-        return;
-      i.preventDefault();
-      const a = T(), h = a.findIndex((m) => m.tabIndex === 0), y = r.includes(i.key) ? a[h + 1] ?? a[0] : a[h - 1] ?? a[a.length - 1];
-      a.forEach((m) => {
-        m.tabIndex = -1;
-      }), y.tabIndex = 0, y.focus();
-    }, { signal: f.signal }), () => f.abort();
-  }, [l, e, s, n, r]);
-}
-function F(e, s = globalThis.setTimeout, n = globalThis.clearTimeout) {
-  const o = E(null), t = d(() => {
-    o.current && n(o.current);
-  }, [n]), r = d((u, l) => {
-    t(), o.current = s(() => {
-      u(), o.current = null;
-    }, l ?? e);
-  }, [t, e, s]);
-  return C(() => t, [t]), b(
-    () => ({ setTimeout: r, clearCurrentTimeout: t }),
-    [t, r]
-  );
-}
-const S = 2e3, I = (e = {}, s, n = globalThis.setTimeout, o = globalThis.clearTimeout) => {
-  const { initialValue: t = !1, delay: r = S } = typeof e == "boolean" ? {
-    initialValue: e,
-    delay: s
-  } : e, { setTimeout: u } = F(r, n, o), [l, c] = g(t), f = E(t), T = d(() => {
-    c(!f.current), u(() => c(f.current));
-  }, [u]);
-  return [l, T];
-};
-function L(e = !1, s = !1) {
-  const [n, o] = g(e), t = d(() => o((l) => !l), []), r = d(() => o(!0), []), u = d(() => o(!1), []);
-  return s ? { flag: n, toggle: t, setToTrue: r, setToFalse: u } : [n, t, r, u];
-}
-function A(e, s, n) {
-  return typeof e == "object" ? A(e.currentField, e.newField, e.currentOrderDir) : e !== s ? "ASC" : n ? {
-    ASC: "DESC",
-    DESC: void 0
-  }[n] : "ASC";
-}
-function x(e, s, n) {
-  if (typeof e == "object")
-    return x(e.currentField, e.newField, e.currentOrderDir);
-  const o = A(e, s, n);
-  return {
-    field: o ? s : void 0,
-    dir: o
-  };
-}
-const v = (e, { field: s, dir: n }) => !s || !n ? e : e.sort((o, t) => {
-  const r = n === "ASC" ? 1 : -1, u = n === "ASC" ? -1 : 1;
-  return o[s] > t[s] ? r : u;
-}), M = (e) => e.dir ? `${e.field}-${e.dir}` : void 0, j = (e) => {
-  const [s, n] = e.split("-");
-  return { field: s, dir: n };
-}, R = (e) => {
-  const [s, n] = g(e), o = d(
-    (t, r) => n(
-      t && typeof t == "object" ? t : { field: t, dir: r }
-    ),
-    []
-  );
-  return [s, o];
-};
-export {
-  k as a,
-  F as b,
-  I as c,
-  A as d,
-  x as e,
-  j as f,
-  R as g,
-  M as o,
-  v as s,
-  L as u
-};