@stenajs-webui/core 19.0.3 → 19.0.5

package/dist/index.es.js

@@ -1,39 +1,36 @@
-(function(){"use strict";try{var i=document.createElement("style");i.appendChild(document.createTextNode("._visuallyHidden_1gevf_1{border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}._text_1iisw_1{--swui-text-color: var(--swui-text-primary-color);--swui-text-color-caption: var(--lhds-color-ui-600);--swui-text-color-overline: var(--lhds-color-ui-600);--swui-text-font-family: var(--swui-font-primary);--swui-text-font-weight: var(--swui-font-weight-text);--current-color: var(--swui-text-color);--current-font-size: var(--swui-font-size-medium);--current-line-height: var(--swui-line-height-medium);--current-font-weight: var(--swui-text-font-weight);--current-letter-spacing: var(--swui-text-letter-spacing);font-size:var(--current-font-size);line-height:var(--current-line-height);color:var(--current-color);letter-spacing:var(--current-letter-spacing);font-family:var(--swui-text-font-family);font-weight:var(--current-font-weight)}._text_1iisw_1._bold_1iisw_27{--current-font-weight: var(--swui-font-weight-text-bold)}._text_1iisw_1._caption_1iisw_31{--current-font-size: var(--swui-font-size-small);--current-line-height: var(--swui-line-height-small);--current-color: var(--swui-text-color-caption);--current-letter-spacing: 0;font-style:italic}._text_1iisw_1._overline_1iisw_39{--current-font-size: var(--swui-font-size-smaller);--current-line-height: var(--swui-line-height-smaller);--current-color: var(--swui-text-color-overline);--current-font-weight: var(--swui-font-weight-text-bold);--current-letter-spacing: .1rem;text-transform:uppercase}._text_1iisw_1._large_1iisw_48{--current-font-size: var(--swui-font-size-large);--current-line-height: var(--swui-line-height-large)}._text_1iisw_1._medium_1iisw_53{--current-font-size: var(--swui-font-size-medium);--current-line-height: var(--swui-line-height-medium)}._text_1iisw_1._small_1iisw_58{--current-font-size: var(--swui-font-size-small);--current-line-height: var(--swui-line-height-small)}._text_1iisw_1._smaller_1iisw_63{--current-font-size: var(--swui-font-size-smaller);--current-line-height: var(--swui-line-height-smaller)}._heading_xn9xj_1{--swui-heading-text-color: var(--swui-text-primary-color);--swui-heading-font-family: var(--swui-font-primary);--swui-heading-font-weight: var(--swui-font-weight-text-bold);--swui-heading-line-height: var(--swui-line-height);font-size:var(--swui-heading-font-size);color:var(--swui-heading-text-color);letter-spacing:0;margin:0;line-height:var(--swui-heading-line-height);font-family:var(--swui-heading-font-family);font-weight:var(--swui-heading-font-weight)}._heading_xn9xj_1._h1_xn9xj_15{--swui-heading-font-size: 2.8rem}._heading_xn9xj_1._h2_xn9xj_19{--swui-heading-font-size: 2.4rem}._heading_xn9xj_1._h3_xn9xj_23{--swui-heading-font-size: 2rem}._heading_xn9xj_1._h4_xn9xj_27{--swui-heading-font-size: 1.8rem}._heading_xn9xj_1._h5_xn9xj_31{--swui-heading-font-size: 1.6rem}._heading_xn9xj_1._h6_xn9xj_35{--swui-heading-font-size: 1.4rem}")),document.head.appendChild(i)}catch(e){console.error("vite-plugin-css-injected-by-js",e)}})();
-import { cssColor as L } from "@stenajs-webui/theme";
-import { jsx as a, Fragment as I } from "react/jsx-runtime";
-import _ from "@emotion/styled";
-import { forwardRef as p, useState as w, useCallback as h, useLayoutEffect as z, useRef as f, useEffect as m, useMemo as H } from "react";
-import R from "@emotion/is-prop-valid";
-import { system as F, background as j, border as N, borderRight as P, borderLeft as V, borderTop as A, borderBottom as U, borderColor as q, borderRadius as G, borderStyle as W, borderWidth as B, boxShadow as K, flexbox as J, overflow as Q, position as X, layout as Y, zIndex as Z, left as ee, right as te, top as ne, bottom as re } from "styled-system";
-import { pickBy as oe, debounce as se } from "lodash";
-import D from "classnames";
-import * as ce from "react-dom";
-const ue = _.hr`
-  display: flex;
-  border: 0;
-  margin: 0;
-  flex: none;
-  background-color: ${(e) => e.color};
-  height: ${(e) => e.vertical ? e.size || "100%" : e.width || "1px"};
-  width: ${(e) => e.vertical ? e.width || "1px" : e.size || "100%"};
-`, Qe = p(
+(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("._separatorLine_nzfcz_1{display:flex;border:0;margin:0;flex:none}._visuallyHidden_1gevf_1{border:0;clip:rect(0 0 0 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}._text_1iisw_1{--swui-text-color: var(--swui-text-primary-color);--swui-text-color-caption: var(--lhds-color-ui-600);--swui-text-color-overline: var(--lhds-color-ui-600);--swui-text-font-family: var(--swui-font-primary);--swui-text-font-weight: var(--swui-font-weight-text);--current-color: var(--swui-text-color);--current-font-size: var(--swui-font-size-medium);--current-line-height: var(--swui-line-height-medium);--current-font-weight: var(--swui-text-font-weight);--current-letter-spacing: var(--swui-text-letter-spacing);font-size:var(--current-font-size);line-height:var(--current-line-height);color:var(--current-color);letter-spacing:var(--current-letter-spacing);font-family:var(--swui-text-font-family);font-weight:var(--current-font-weight)}._text_1iisw_1._bold_1iisw_27{--current-font-weight: var(--swui-font-weight-text-bold)}._text_1iisw_1._caption_1iisw_31{--current-font-size: var(--swui-font-size-small);--current-line-height: var(--swui-line-height-small);--current-color: var(--swui-text-color-caption);--current-letter-spacing: 0;font-style:italic}._text_1iisw_1._overline_1iisw_39{--current-font-size: var(--swui-font-size-smaller);--current-line-height: var(--swui-line-height-smaller);--current-color: var(--swui-text-color-overline);--current-font-weight: var(--swui-font-weight-text-bold);--current-letter-spacing: .1rem;text-transform:uppercase}._text_1iisw_1._large_1iisw_48{--current-font-size: var(--swui-font-size-large);--current-line-height: var(--swui-line-height-large)}._text_1iisw_1._medium_1iisw_53{--current-font-size: var(--swui-font-size-medium);--current-line-height: var(--swui-line-height-medium)}._text_1iisw_1._small_1iisw_58{--current-font-size: var(--swui-font-size-small);--current-line-height: var(--swui-line-height-small)}._text_1iisw_1._smaller_1iisw_63{--current-font-size: var(--swui-font-size-smaller);--current-line-height: var(--swui-line-height-smaller)}._heading_xn9xj_1{--swui-heading-text-color: var(--swui-text-primary-color);--swui-heading-font-family: var(--swui-font-primary);--swui-heading-font-weight: var(--swui-font-weight-text-bold);--swui-heading-line-height: var(--swui-line-height);font-size:var(--swui-heading-font-size);color:var(--swui-heading-text-color);letter-spacing:0;margin:0;line-height:var(--swui-heading-line-height);font-family:var(--swui-heading-font-family);font-weight:var(--swui-heading-font-weight)}._heading_xn9xj_1._h1_xn9xj_15{--swui-heading-font-size: 2.8rem}._heading_xn9xj_1._h2_xn9xj_19{--swui-heading-font-size: 2.4rem}._heading_xn9xj_1._h3_xn9xj_23{--swui-heading-font-size: 2rem}._heading_xn9xj_1._h4_xn9xj_27{--swui-heading-font-size: 1.8rem}._heading_xn9xj_1._h5_xn9xj_31{--swui-heading-font-size: 1.6rem}._heading_xn9xj_1._h6_xn9xj_35{--swui-heading-font-size: 1.4rem}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
+import { cssColor as R } from "@stenajs-webui/theme";
+import { jsx as i, Fragment as I } from "react/jsx-runtime";
+import { forwardRef as h, useState as v, useCallback as p, useLayoutEffect as H, useRef as w, useEffect as l, useMemo as z } from "react";
+import y from "@emotion/styled";
+import F from "@emotion/is-prop-valid";
+import { system as N, background as j, border as P, borderRight as V, borderLeft as A, borderTop as G, borderBottom as U, borderColor as q, borderRadius as W, borderStyle as B, borderWidth as K, boxShadow as J, flexbox as Q, overflow as X, position as Y, layout as Z, zIndex as ee, left as te, right as ne, top as re, bottom as oe } from "styled-system";
+import { pickBy as se, debounce as ce } from "lodash";
+import O from "classnames";
+import * as ue from "react-dom";
+const ie = "_separatorLine_nzfcz_1", ae = {
+  separatorLine: ie
+}, Ze = h(
   ({
-    color: e = L("--lhds-color-ui-300"),
+    color: e = R("--lhds-color-ui-300"),
     size: t = "100%",
     width: n = "1px",
     vertical: r = !1
-  }, o) => /* @__PURE__ */ a(
-    ue,
+  }, o) => /* @__PURE__ */ i(
+    "hr",
     {
+      className: ae.separatorLine,
       "aria-hidden": !0,
       color: e,
-      size: t,
-      width: n,
-      vertical: r,
+      style: {
+        backgroundColor: e,
+        height: r ? t || "100%" : n || "1px",
+        width: r ? n || "1px" : t || "100%"
+      },
       ref: o
     }
   )
-), ie = _.button`
+), de = y.button`
   display: inline-block;
   user-select: none;
   border: 0;
@@ -56,7 +53,7 @@ const ue = _.hr`
   ${({ width: e }) => e ? `width: ${e};` : ""}
   ${({ height: e }) => e ? `height: ${e};` : ""}
   ${({ borderRadius: e }) => e ? `border-radius: ${e};` : ""}
-`, Xe = p(
+`, et = h(
   ({
     disableFocusHighlight: e,
     onClick: t,
@@ -65,19 +62,19 @@ const ue = _.hr`
     disableOpacityOnClick: o,
     disablePointer: s,
     opacityOnHover: c,
-    disabled: i,
+    disabled: a,
     children: u,
     background: d = "transparent",
-    hoverBackground: l,
-    focusBackground: g,
-    type: O = "button",
-    ...M
-  }, k) => /* @__PURE__ */ a(
-    ie,
+    hoverBackground: m,
+    focusBackground: f,
+    type: D = "button",
+    ...L
+  }, k) => /* @__PURE__ */ i(
+    de,
     {
       opacityOnHover: c,
       title: r,
-      disabled: i,
+      disabled: a,
       disableOpacityOnClick: o,
       onClick: t,
       onDoubleClick: n,
@@ -85,19 +82,22 @@ const ue = _.hr`
       pointer: !!(t || n) && !s,
       ref: k,
       background: d,
-      hoverBackground: l,
-      focusBackground: g,
-      type: O,
-      ...M,
+      hoverBackground: m,
+      focusBackground: f,
+      type: D,
+      ...L,
       children: u
     }
   )
-), b = (e) => e == null ? 0 : typeof e == "boolean" ? e ? 1 : 0 : e, ae = {
+), _ = (e) => e == null ? 0 : typeof e == "boolean" ? e ? 1 : 0 : e, le = (e) => {
+  if (e !== 0)
+    return `calc(${e} * var(--swui-metrics-space))`;
+}, S = (e) => le(_(e)), me = {
   box: "var(--swui-shadow-box)",
   popover: "var(--swui-shadow-popover)",
   modal: "var(--swui-shadow-modal)",
   bottom: "var(--swui-shadow-bottom)"
-}, de = [
+}, pe = [
   "spacing",
   "indent",
   "gap",
@@ -105,58 +105,55 @@ const ue = _.hr`
   "height",
   "overflow",
   "display"
-], le = (e) => de.includes(e), me = F({
+], he = (e) => pe.includes(e), fe = N({
   row: {
     property: "flexDirection",
     transform: (e) => e ? "row" : "column"
   },
   indent: {
+    // @ts-ignore
     property: "--current-indent",
-    transform: b
+    transform: _
   },
   spacing: {
+    // @ts-ignore
     property: "--current-spacing",
-    transform: b
+    transform: _
   },
   gap: {
+    // @ts-ignore
     property: "--current-gap",
-    transform: b
+    transform: _
   },
   columnGap: {
-    property: "--current-column-gap",
-    transform: b
+    property: "columnGap",
+    transform: S
   },
   rowGap: {
-    property: "--current-row-gap",
-    transform: b
+    property: "rowGap",
+    transform: S
   },
   shadow: {
     property: "boxShadow",
-    transform: (e) => {
-      var t;
-      return (t = ae[e]) != null ? t : e;
-    }
+    transform: (e) => me[e] ?? e
   }
-}), x = _("div", {
-  shouldForwardProp: (e) => typeof e == "string" ? le(e) ? !1 : R(e) : !1
+}), g = y("div", {
+  shouldForwardProp: (e) => typeof e == "string" ? he(e) ? !1 : F(e) : !1
 })`
   --current-spacing: 0;
   --current-indent: 0;
   --current-gap: 0;
-  --current-column-gap: 0;
-  --current-row-gap: 0;
   box-sizing: border-box;
   display: flex;
   flex-direction: column;
-  ${me};
+  ${fe};
   ${j};
-  ${N};
   ${P};
   ${V};
   ${A};
+  ${G};
   ${U};
   ${q};
-  ${G};
   ${W};
   ${B};
   ${K};
@@ -169,104 +166,106 @@ const ue = _.hr`
   ${te};
   ${ne};
   ${re};
+  ${oe};
 
   gap: calc(var(--current-gap) * var(--swui-metrics-space));
-  column-gap: calc(var(--current-column-gap) * var(--swui-metrics-space));
-  row-gap: calc(var(--current-row-gap) * var(--swui-metrics-space));
 
   padding: calc(var(--current-spacing) * var(--swui-metrics-spacing))
     calc(var(--current-indent) * var(--swui-metrics-indent));
+
   :hover {
     ${({ hoverBackground: e }) => e ? `background: ${e};` : ""}
     ${({ hoverBorder: e }) => e ? `border: ${e};` : ""}
   }
+
   :focus {
     ${({ focusBackground: e }) => e ? `background: ${e};` : ""}
     ${({ focusBorder: e }) => e ? `border: ${e};` : ""}
   }
+
   :focus-within {
     ${({ focusWithinBackground: e }) => e ? `background: ${e};` : ""}
     ${({ focusWithinBorder: e }) => e ? `border: ${e};` : ""}
   }
-`, Ye = p(function(t, n) {
-  return /* @__PURE__ */ a(x, { ref: n, ...t });
-}), he = (e) => {
-  const { x: t, y: n, width: r, height: o, bottom: s, top: c, left: i, right: u } = e.getBoundingClientRect();
+`, tt = h(function(t, n) {
+  return /* @__PURE__ */ i(g, { ref: n, ...t });
+}), ve = (e) => {
+  const { x: t, y: n, width: r, height: o, bottom: s, top: c, left: a, right: u } = e.getBoundingClientRect();
   return {
     width: r,
     height: o,
     top: c,
-    left: i,
+    left: a,
     x: t,
     y: n,
     right: u,
     bottom: s
   };
-}, pe = (e, t) => e.x === t.x && e.y === t.y && e.width === t.width && e.height === t.height && e.bottom === t.bottom && e.top === t.top && e.left === t.left && e.right === t.right, we = (e, t) => {
-  const [n, r] = w(), o = h(() => {
+}, we = (e, t) => e.x === t.x && e.y === t.y && e.width === t.width && e.height === t.height && e.bottom === t.bottom && e.top === t.top && e.left === t.left && e.right === t.right, be = (e, t) => {
+  const [n, r] = v(), o = p(() => {
     window.requestAnimationFrame(() => {
       if (e.current) {
-        const s = he(e.current);
-        (!n || !pe(n, s)) && t && t(s), r(s);
+        const s = ve(e.current);
+        (!n || !we(n, s)) && t && t(s), r(s);
       }
     });
   }, [e, n, r, t]);
-  return z(() => {
+  return H(() => {
     o();
   }, [o]), {
     dimensions: n
   };
-}, Ze = p(
+}, nt = h(
   function({ onResize: t, ...n }, r) {
-    const o = f(null), s = r != null ? r : o;
-    return we(s, t), /* @__PURE__ */ a(x, { ...n, ref: r });
+    const o = w(null);
+    return be(r ?? o, t), /* @__PURE__ */ i(g, { ...n, ref: r });
   }
-), et = p(function(t, n) {
-  return /* @__PURE__ */ a(x, { row: !0, ref: n, ...t });
-}), tt = p(function({ num: t = 1, ...n }, r) {
-  return /* @__PURE__ */ a(x, { indent: t, ref: r, ...n });
-}), nt = p(
+), rt = h(function(t, n) {
+  return /* @__PURE__ */ i(g, { row: !0, ref: n, ...t });
+}), ot = h(function({ num: t = 1, ...n }, r) {
+  return /* @__PURE__ */ i(g, { indent: t, ref: r, ...n });
+}), st = h(
   function({ num: t = 1, ...n }, r) {
-    return /* @__PURE__ */ a(x, { spacing: t, ref: r, ...n });
+    return /* @__PURE__ */ i(g, { spacing: t, ref: r, ...n });
   }
-), fe = _.div`
+), ge = y.div`
   --current-size: 1;
   flex: none;
   width: calc(var(--current-size) * var(--swui-metrics-space));
   height: calc(var(--current-size) * var(--swui-metrics-space));
-`, rt = ({
+`, ct = ({
   half: e = !1,
   horizontal: t = !1,
   num: n = 1,
   vertical: r = !1
 }) => {
   const o = n * (e ? 0.5 : 1);
-  return /* @__PURE__ */ a(
-    fe,
+  return /* @__PURE__ */ i(
+    ge,
     {
       style: {
-        ["--current-size"]: o,
+        "--current-size": o,
         height: t ? 1 : void 0,
         width: r ? 1 : void 0
       }
     }
   );
-}, ot = ({ children: e, nest: t, render: n }) => t ? /* @__PURE__ */ a(I, { children: n(e) }) : /* @__PURE__ */ a(I, { children: e }), ve = "_visuallyHidden_1gevf_1", ge = {
-  visuallyHidden: ve
-}, be = (e) => oe(e, xe), xe = (e, t) => $e(t), $e = (e) => e.startsWith("data-") || e.startsWith("aria-"), st = ({
+}, ut = ({ children: e, nest: t, render: n }) => t ? /* @__PURE__ */ i(I, { children: n(e) }) : /* @__PURE__ */ i(I, { children: e }), xe = "_visuallyHidden_1gevf_1", _e = {
+  visuallyHidden: xe
+}, $e = (e) => se(e, ye), ye = (e, t) => Ee(t), Ee = (e) => e.startsWith("data-") || e.startsWith("aria-"), it = ({
   children: e,
   ...t
-}) => /* @__PURE__ */ a("span", { className: ge.visuallyHidden, ...be(t), children: e }), _e = "_text_1iisw_1", ye = "_standard_1iisw_24", Ee = "_bold_1iisw_27", Ie = "_caption_1iisw_31", Se = "_overline_1iisw_39", Ce = "_large_1iisw_48", Te = "_medium_1iisw_53", De = "_small_1iisw_58", Oe = "_smaller_1iisw_63", y = {
-  text: _e,
-  standard: ye,
-  bold: Ee,
-  caption: Ie,
-  overline: Se,
-  large: Ce,
-  medium: Te,
-  small: De,
-  smaller: Oe
-}, $ = p(
+}) => /* @__PURE__ */ i("span", { className: _e.visuallyHidden, ...$e(t), children: e }), Ie = "_text_1iisw_1", Se = "_standard_1iisw_24", Ce = "_bold_1iisw_27", Te = "_caption_1iisw_31", Me = "_overline_1iisw_39", Oe = "_large_1iisw_48", De = "_medium_1iisw_53", Le = "_small_1iisw_58", ke = "_smaller_1iisw_63", $ = {
+  text: Ie,
+  standard: Se,
+  bold: Ce,
+  caption: Te,
+  overline: Me,
+  large: Oe,
+  medium: De,
+  small: Le,
+  smaller: ke
+}, x = h(
   ({
     children: e,
     variant: t = "standard",
@@ -275,28 +274,36 @@ const ue = _.hr`
     color: o,
     userSelect: s,
     whiteSpace: c,
-    wordBreak: i,
-    style: u,
-    ...d
-  }, l) => /* @__PURE__ */ a(
+    wordBreak: a,
+    textAlign: u,
+    style: d,
+    ...m
+  }, f) => /* @__PURE__ */ i(
     "span",
     {
-      className: D(y.text, y[t], y[n], r),
-      ref: l,
-      style: { color: o, userSelect: s, whiteSpace: c, wordBreak: i, ...u },
-      ...d,
+      className: O($.text, $[t], $[n], r),
+      ref: f,
+      style: {
+        color: o,
+        userSelect: s,
+        whiteSpace: c,
+        wordBreak: a,
+        textAlign: u,
+        ...d
+      },
+      ...m,
       children: e
     }
   )
-), ct = $, ut = (e) => /* @__PURE__ */ a($, { size: "small", ...e }), it = (e) => /* @__PURE__ */ a($, { size: "smaller", ...e }), at = (e) => /* @__PURE__ */ a($, { size: "medium", ...e }), dt = (e) => /* @__PURE__ */ a($, { size: "large", ...e }), Me = "_heading_xn9xj_1", ke = "_h1_xn9xj_15", Le = "_h2_xn9xj_19", ze = "_h3_xn9xj_23", He = "_h4_xn9xj_27", Re = "_h5_xn9xj_31", Fe = "_h6_xn9xj_35", S = {
-  heading: Me,
-  h1: ke,
-  h2: Le,
-  h3: ze,
-  h4: He,
-  h5: Re,
-  h6: Fe
-}, je = p(
+), at = x, dt = (e) => /* @__PURE__ */ i(x, { size: "small", ...e }), lt = (e) => /* @__PURE__ */ i(x, { size: "smaller", ...e }), mt = (e) => /* @__PURE__ */ i(x, { size: "medium", ...e }), pt = (e) => /* @__PURE__ */ i(x, { size: "large", ...e }), Re = "_heading_xn9xj_1", He = "_h1_xn9xj_15", ze = "_h2_xn9xj_19", Fe = "_h3_xn9xj_23", Ne = "_h4_xn9xj_27", je = "_h5_xn9xj_31", Pe = "_h6_xn9xj_35", C = {
+  heading: Re,
+  h1: He,
+  h2: ze,
+  h3: Fe,
+  h4: Ne,
+  h5: je,
+  h6: Pe
+}, Ve = h(
   ({
     variant: e = "h3",
     className: t,
@@ -305,48 +312,45 @@ const ue = _.hr`
     wordBreak: o,
     style: s,
     children: c,
-    as: i,
+    as: a,
     ...u
-  }, d) => {
-    const l = i != null ? i : e;
-    return /* @__PURE__ */ a(
-      l,
-      {
-        className: D(S.heading, S[e], t),
-        style: { color: n, whiteSpace: r, wordBreak: o, ...s },
-        ref: d,
-        ...u,
-        children: c
-      }
-    );
-  }
-), lt = (e) => /* @__PURE__ */ a(je, { variant: "h2", ...e }), Ne = (e, t) => e === t, mt = (e, t, n = Ne) => {
-  const r = h(
+  }, d) => /* @__PURE__ */ i(
+    a ?? e,
+    {
+      className: O(C.heading, C[e], t),
+      style: { color: n, whiteSpace: r, wordBreak: o, ...s },
+      ref: d,
+      ...u,
+      children: c
+    }
+  )
+), ht = (e) => /* @__PURE__ */ i(Ve, { variant: "h2", ...e }), Ae = (e, t) => e === t, ft = (e, t, n = Ae) => {
+  const r = p(
     (u) => {
       e.some((d) => n(d, u)) || t([...e, u]);
     },
     [e, t, n]
-  ), o = h(
+  ), o = p(
     (u) => {
       t(
-        u.reduce((d, l) => d.some((g) => n(g, l)) ? d : [...d, l], e)
+        u.reduce((d, m) => d.some((f) => n(f, m)) ? d : [...d, m], e)
       );
     },
     [e, t, n]
-  ), s = h(
+  ), s = p(
     (u) => {
-      const d = e.findIndex((l) => n(l, u));
-      d >= 0 && t(e.filter((l, g) => g !== d));
+      const d = e.findIndex((m) => n(m, u));
+      d >= 0 && t(e.filter((m, f) => f !== d));
     },
     [e, t, n]
-  ), c = h(
+  ), c = p(
     (u) => {
-      t(e.filter((d) => !u.some((l) => n(l, d))));
+      t(e.filter((d) => !u.some((m) => n(m, d))));
     },
     [e, t, n]
-  ), i = h(
+  ), a = p(
     (u) => {
-      e.some((l) => n(l, u)) ? s(u) : r(u);
+      e.some((m) => n(m, u)) ? s(u) : r(u);
     },
     [e, r, s, n]
   );
@@ -355,20 +359,20 @@ const ue = _.hr`
     addMultiple: o,
     remove: s,
     removeMultiple: c,
-    toggle: i
+    toggle: a
   };
 }, E = (e) => {
-  const [t, n] = w(e), r = h(() => {
+  const [t, n] = v(e), r = p(() => {
     n(!0);
-  }, [n]), o = h(() => {
+  }, [n]), o = p(() => {
     n(!1);
-  }, [n]), s = h(() => {
+  }, [n]), s = p(() => {
     n((c) => !c);
   }, [n]);
   return [t, r, o, s];
-}, ht = (e, t) => {
-  const [n, r] = w(e);
-  return m(() => {
+}, vt = (e, t) => {
+  const [n, r] = v(e);
+  return l(() => {
     const o = setTimeout(() => {
       r(e);
     }, t);
@@ -376,9 +380,9 @@ const ue = _.hr`
       clearTimeout(o);
     };
   }, [e, t]), n;
-}, pt = (e, t) => {
-  const [n, r] = w(e);
-  return m(() => {
+}, wt = (e, t) => {
+  const [n, r] = v(e);
+  return l(() => {
     e && r(!0);
     const o = setTimeout(() => {
       e || r(e);
@@ -388,20 +392,20 @@ const ue = _.hr`
     };
   }, [e, t]), n;
 };
-let Pe = 0;
-const C = (e) => `webui-${e ? e + "-" : ""}${++Pe}`, wt = (e) => {
-  const [t, n] = w(() => C(e));
-  return m(() => n(C(e)), [e]), t;
-}, v = (e, t, n) => {
-  const r = f();
-  m(() => {
+let Ge = 0;
+const T = (e) => `webui-${e ? e + "-" : ""}${++Ge}`, bt = (e) => {
+  const [t, n] = v(() => T(e));
+  return l(() => n(T(e)), [e]), t;
+}, b = (e, t, n) => {
+  const r = w();
+  l(() => {
     r.current = n;
-  }, [n]), m(() => {
+  }, [n]), l(() => {
     if (!(e.current && e.current.addEventListener))
       return;
-    const s = (i) => {
+    const s = (a) => {
       if (r.current)
-        return r.current(i);
+        return r.current(a);
     };
     if (!e.current)
       return;
@@ -410,42 +414,42 @@ const C = (e) => `webui-${e ? e + "-" : ""}${++Pe}`, wt = (e) => {
       c && c.removeEventListener(t, s);
     };
   }, [t, e]);
-}, ft = (e) => {
+}, gt = (e) => {
   const [t, n, r] = E(!1);
-  m(() => {
-    document.activeElement === ce.findDOMNode(e.current) ? n() : r();
-  }, [e, r, n]), v(e, "focus", n), v(e, "blur", r);
-  const o = h(() => {
+  l(() => {
+    document.activeElement === ue.findDOMNode(e.current) ? n() : r();
+  }, [e, r, n]), b(e, "focus", n), b(e, "blur", r);
+  const o = p(() => {
     e.current && e.current.focus();
-  }, [e]), s = h(() => {
+  }, [e]), s = p(() => {
     e.current && e.current.blur();
   }, [e]);
   return { isInFocus: t, focus: o, blur: s };
-}, vt = (e) => {
+}, xt = (e) => {
   const [t, n, r] = E(!1);
-  return v(e, "mouseover", n), v(e, "mouseout", r), t;
-}, gt = (e) => {
+  return b(e, "mouseover", n), b(e, "mouseout", r), t;
+}, _t = (e) => {
   const [t, n, r] = E(!1);
-  return v(e, "mouseenter", n), v(e, "mouseleave", r), t;
-}, bt = (e, t) => {
-  const n = f(() => {
+  return b(e, "mouseenter", n), b(e, "mouseleave", r), t;
+}, $t = (e, t) => {
+  const n = w(() => {
   });
-  m(() => {
+  l(() => {
     n.current = t;
-  }, [t]), m(() => {
+  }, [t]), l(() => {
     const r = (o) => {
-      !e.filter((c) => c.current).every((c) => c.current && !c.current.contains(o.target)) || n.current(o);
+      e.filter((c) => c.current).every((c) => c.current && !c.current.contains(o.target)) && n.current(o);
     };
     return document.addEventListener("mousedown", r), document.addEventListener("touchstart", r), () => {
       document.removeEventListener("mousedown", r), document.removeEventListener("touchstart", r);
     };
   }, [...e]);
-}, xt = (e, t, n) => {
-  const r = f(() => {
+}, yt = (e, t, n) => {
+  const r = w(() => {
   });
-  m(() => {
+  l(() => {
     r.current = t;
-  }, [t]), m(() => {
+  }, [t]), l(() => {
     const o = (s) => {
       !e.current || e.current.contains(s.target) || r.current(s);
     };
@@ -453,21 +457,21 @@ const C = (e) => `webui-${e ? e + "-" : ""}${++Pe}`, wt = (e) => {
       document.removeEventListener("mousedown", o, n), document.removeEventListener("touchstart", o, n);
     };
   }, [e, n]);
-}, T = ["mousemove", "mousedown", "keydown", "touchstart", "scroll"], $t = (e, t) => {
-  const n = f(() => {
+}, M = ["mousemove", "mousedown", "keydown", "touchstart", "scroll"], Et = (e, t) => {
+  const n = w(() => {
   });
-  m(() => {
+  l(() => {
     n.current = e;
-  }, [e]), m(() => {
-    const r = se(n.current, t);
-    return T.forEach((o) => window.addEventListener(o, r)), () => {
-      T.forEach(
+  }, [e]), l(() => {
+    const r = ce(n.current, t);
+    return M.forEach((o) => window.addEventListener(o, r)), () => {
+      M.forEach(
         (o) => window.removeEventListener(o, r)
       );
     };
   }, [t]);
-}, _t = (e, t) => {
-  const [n, r] = w(!1), { rootMargin: o, root: s, threshold: c } = t || {}, i = H(() => new IntersectionObserver(
+}, It = (e, t) => {
+  const [n, r] = v(!1), { rootMargin: o, root: s, threshold: c } = t || {}, a = z(() => new IntersectionObserver(
     ([u]) => r(u.isIntersecting),
     {
       rootMargin: o,
@@ -475,33 +479,33 @@ const C = (e) => `webui-${e ? e + "-" : ""}${++Pe}`, wt = (e) => {
       threshold: c
     }
   ), [r, o, s, c]);
-  return m(() => (e.current && i.observe(e.current), () => {
-    i.disconnect();
-  }), [i, e]), n;
-}, yt = (e) => {
-  const t = f(null);
-  return m(() => {
-    !e || (typeof e == "function" ? e(t.current) : e.current = t.current);
+  return l(() => (e.current && a.observe(e.current), () => {
+    a.disconnect();
+  }), [a, e]), n;
+}, St = (e) => {
+  const t = w(null);
+  return l(() => {
+    e && (typeof e == "function" ? e(t.current) : e.current = t.current);
   }), t;
-}, Et = (e, t, n = !0) => {
-  const [r, o] = w(e), s = f(), c = h(
-    (i, u = t) => {
-      o(i), n && clearTimeout(s.current), s.current = setTimeout(() => o(e), u);
+}, Ct = (e, t, n = !0) => {
+  const [r, o] = v(e), s = w(), c = p(
+    (a, u = t) => {
+      o(a), n && clearTimeout(s.current), s.current = setTimeout(() => o(e), u);
     },
     [t, n, e]
   );
-  return m(() => () => {
+  return l(() => () => {
     clearTimeout(s.current);
   }, []), [r, c];
-}, It = (e) => {
+}, Tt = (e) => {
   throw new Error(`Switch unhandled case: ${e}`);
-}, St = (e, t) => t, Ct = (e) => Object.keys(e).filter((t) => e[t]), Tt = (e) => {
+}, Mt = (e, t) => t, Ot = (e) => Object.keys(e).filter((t) => e[t]), Dt = (e) => {
   try {
     const t = parseFloat(e);
     return isNaN(t) || t == null ? void 0 : t;
   } catch {
   }
-}, Dt = (e) => {
+}, Lt = (e) => {
   try {
     const t = parseInt(e, 10);
     return isNaN(t) || t == null ? void 0 : t;
@@ -509,48 +513,48 @@ const C = (e) => `webui-${e ? e + "-" : ""}${++Pe}`, wt = (e) => {
   }
 };
 export {
-  x as Box,
-  Xe as Clickable,
-  Ye as Column,
-  lt as HeaderText,
-  je as Heading,
-  tt as Indent,
-  dt as LargeText,
-  ot as Nest,
-  Ze as ResizeAwareBox,
-  et as Row,
-  st as ScreenReaderOnlyText,
-  Qe as SeparatorLine,
-  ut as SmallText,
-  it as SmallerText,
-  rt as Space,
-  nt as Spacing,
-  at as StandardText,
-  $ as Text,
-  ct as Txt,
-  b as booleanOrNumberToNumber,
-  St as exhaustSwitchCase,
-  It as exhaustSwitchCaseElseThrow,
-  be as getDataProps,
-  he as getDimensionObject,
-  Tt as parseFloatElseUndefined,
-  Dt as parseIntElseUndefined,
-  Ct as truthyKeysAsList,
-  mt as useArraySet,
+  g as Box,
+  et as Clickable,
+  tt as Column,
+  ht as HeaderText,
+  Ve as Heading,
+  ot as Indent,
+  pt as LargeText,
+  ut as Nest,
+  nt as ResizeAwareBox,
+  rt as Row,
+  it as ScreenReaderOnlyText,
+  Ze as SeparatorLine,
+  dt as SmallText,
+  lt as SmallerText,
+  ct as Space,
+  st as Spacing,
+  mt as StandardText,
+  x as Text,
+  at as Txt,
+  _ as booleanOrNumberToNumber,
+  Mt as exhaustSwitchCase,
+  Tt as exhaustSwitchCaseElseThrow,
+  $e as getDataProps,
+  ve as getDimensionObject,
+  Dt as parseFloatElseUndefined,
+  Lt as parseIntElseUndefined,
+  Ot as truthyKeysAsList,
+  ft as useArraySet,
   E as useBoolean,
-  ht as useDebounce,
-  pt as useDelayedFalse,
-  wt as useDomId,
-  we as useElementDimensions,
-  ft as useElementFocus,
-  v as useEventListener,
-  yt as useForwardedRef,
-  gt as useMouseIsEntered,
-  vt as useMouseIsOver,
-  bt as useMultiOnClickOutside,
-  xt as useOnClickOutside,
-  $t as useOnNoMouseMovement,
-  _t as useOnScreen,
-  Et as useTimeoutState
+  vt as useDebounce,
+  wt as useDelayedFalse,
+  bt as useDomId,
+  be as useElementDimensions,
+  gt as useElementFocus,
+  b as useEventListener,
+  St as useForwardedRef,
+  _t as useMouseIsEntered,
+  xt as useMouseIsOver,
+  $t as useMultiOnClickOutside,
+  yt as useOnClickOutside,
+  Et as useOnNoMouseMovement,
+  It as useOnScreen,
+  Ct as useTimeoutState
 };
 //# sourceMappingURL=index.es.js.map