@stenajs-webui/core 22.6.2 → 22.7.1

package/dist/index.es.js

@@ -1,14 +1,14 @@
 (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_1cnsg_1{font-size:2rem;color:var(--swui-text-primary-color);letter-spacing:0;margin:0;line-height:var(--swui-line-height);font-family:var(--swui-font-primary);font-weight:var(--swui-font-weight-text-bold)}._heading_1cnsg_1._h1_1cnsg_10{font-size:2.8rem}._heading_1cnsg_1._h2_1cnsg_14{font-size:2.4rem}._heading_1cnsg_1._h3_1cnsg_18{font-size:2rem}._heading_1cnsg_1._h4_1cnsg_22{font-size:1.8rem}._heading_1cnsg_1._h5_1cnsg_26{font-size:1.6rem}._heading_1cnsg_1._h6_1cnsg_30{font-size:1.4rem}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
 import { cssColor as N } from "@stenajs-webui/theme";
 import { jsx as c, Fragment as T, jsxs as U } from "react/jsx-runtime";
-import V, { forwardRef as f, useState as h, useCallback as m, useLayoutEffect as F, useRef as g, createContext as j, useEffect as p, useMemo as S, useContext as q, isValidElement as B, Fragment as W } from "react";
+import V, { forwardRef as g, useState as h, useCallback as m, useLayoutEffect as F, useRef as f, createContext as j, useEffect as p, useMemo as S, useContext as q, isValidElement as B, Fragment as W } from "react";
 import E from "@emotion/styled";
 import { system as X, background as G, border as Y, borderRight as K, borderLeft as Z, borderTop as J, borderBottom as Q, borderColor as ee, borderRadius as te, borderStyle as re, borderWidth as ne, boxShadow as ue, flexbox as oe, overflow as se, position as ie, layout as ae, zIndex as ce, left as le, right as de, top as pe, bottom as me } from "styled-system";
-import { memoize as he, pickBy as P, debounce as fe } from "lodash-es";
+import { memoize as he, pickBy as P, debounce as ge } from "lodash-es";
 import O from "classnames";
-const ge = "_separatorLine_nzfcz_1", ye = {
-  separatorLine: ge
-}, lt = f(
+const fe = "_separatorLine_nzfcz_1", ve = {
+  separatorLine: fe
+}, lt = g(
   ({
     color: e = N("--lhds-color-ui-300"),
     size: t = "100%",
@@ -17,7 +17,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   }, u) => /* @__PURE__ */ c(
     "hr",
     {
-      className: ye.separatorLine,
+      className: ve.separatorLine,
       "aria-hidden": !0,
       color: e,
       style: {
@@ -28,7 +28,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
       ref: u
     }
   )
-), ve = E.button`
+), ye = E.button`
   display: inline-block;
   user-select: none;
   border: 0;
@@ -51,7 +51,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   ${({ width: e }) => e ? `width: ${e};` : ""}
   ${({ height: e }) => e ? `height: ${e};` : ""}
   ${({ borderRadius: e }) => e ? `border-radius: ${e};` : ""}
-`, dt = f(
+`, dt = g(
   ({
     disableFocusHighlight: e,
     onClick: t,
@@ -64,11 +64,11 @@ const ge = "_separatorLine_nzfcz_1", ye = {
     children: i,
     background: l = "transparent",
     hoverBackground: d,
-    focusBackground: y,
+    focusBackground: v,
     type: k = "button",
     ..._
   }, H) => /* @__PURE__ */ c(
-    ve,
+    ye,
     {
       opacityOnHover: s,
       title: n,
@@ -81,7 +81,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
       ref: H,
       background: l,
       hoverBackground: d,
-      focusBackground: y,
+      focusBackground: v,
       type: k,
       ..._,
       children: i
@@ -676,7 +676,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
     ${({ focusWithinBackground: e }) => e ? `background: ${e};` : ""}
     ${({ focusWithinBorder: e }) => e ? `border: ${e};` : ""}
   }
-`, pt = f(
+`, pt = g(
   function(t, r) {
     return /* @__PURE__ */ c(b, { ref: r, ...t });
   }
@@ -706,18 +706,18 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   }, [u]), {
     dimensions: r
   };
-}, mt = f(
+}, mt = g(
   function({ onResize: t, ...r }, n) {
-    const u = g(null);
+    const u = f(null);
     return Re(n ?? u, t), /* @__PURE__ */ c(b, { ...r, ref: n });
   }
-), ht = f(
+), ht = g(
   function(t, r) {
     return /* @__PURE__ */ c(b, { row: !0, ref: r, ...t });
   }
-), ft = f(function({ num: t = 1, ...r }, n) {
+), gt = g(function({ num: t = 1, ...r }, n) {
   return /* @__PURE__ */ c(b, { indent: t, ref: n, ...r });
-}), gt = f(
+}), ft = g(
   function({ num: t = 1, ...r }, n) {
     return /* @__PURE__ */ c(b, { spacing: t, ref: n, ...r });
   }
@@ -726,7 +726,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   flex: none;
   width: calc(var(--current-size) * var(--swui-metrics-space));
   height: calc(var(--current-size) * var(--swui-metrics-space));
-`, yt = ({
+`, vt = ({
   half: e = !1,
   horizontal: t = !1,
   num: r = 1,
@@ -743,11 +743,11 @@ const ge = "_separatorLine_nzfcz_1", ye = {
       }
     }
   );
-}, vt = ({ children: e, nest: t, render: r }) => t ? /* @__PURE__ */ c(T, { children: r(e) }) : /* @__PURE__ */ c(T, { children: e }), D = j({
+}, yt = ({ children: e, nest: t, render: r }) => t ? /* @__PURE__ */ c(T, { children: r(e) }) : /* @__PURE__ */ c(T, { children: e }), D = j({
   isFontLarge: !1,
   fontSizeRatio: 1
 }), R = 12, bt = ({ children: e }) => {
-  const t = g(null), [r, n] = h(!1), [u, o] = h(1);
+  const t = f(null), [r, n] = h(!1), [u, o] = h(1);
   p(() => {
     if (!t.current)
       return;
@@ -803,7 +803,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   medium: je,
   small: qe,
   smaller: Be
-}, w = f(
+}, w = g(
   ({
     children: e,
     variant: t = "standard",
@@ -816,7 +816,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
     textAlign: i,
     overflow: l,
     textOverflow: d,
-    style: y,
+    style: v,
     ...k
   }, _) => /* @__PURE__ */ c(
     "span",
@@ -831,7 +831,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
         textAlign: i,
         overflow: l,
         textOverflow: d,
-        ...y
+        ...v
       },
       ...k,
       children: e
@@ -845,7 +845,7 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   h4: Ke,
   h5: Ze,
   h6: Je
-}, Qe = f(
+}, Qe = g(
   ({
     variant: e = "h3",
     className: t,
@@ -897,14 +897,14 @@ const ge = "_separatorLine_nzfcz_1", ye = {
   ), u = m(
     (i) => {
       t(
-        i.reduce((l, d) => l.some((y) => r(y, d)) ? l : [...l, d], e)
+        i.reduce((l, d) => l.some((v) => r(v, d)) ? l : [...l, d], e)
       );
     },
     [e, t, r]
   ), o = m(
     (i) => {
       const l = e.findIndex((d) => r(d, i));
-      l >= 0 && t(e.filter((d, y) => y !== l));
+      l >= 0 && t(e.filter((d, v) => v !== l));
     },
     [e, t, r]
   ), s = m(
@@ -960,8 +960,8 @@ let tt = 0;
 const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
   const [t, r] = h(() => A(e));
   return p(() => r(A(e)), [e]), t;
-}, v = (e, t, r) => {
-  const n = g(null);
+}, y = (e, t, r) => {
+  const n = f(null);
   p(() => {
     n.current = r;
   }, [r]), p(() => {
@@ -981,7 +981,7 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
   const [t, r, n] = C(!1);
   p(() => {
     document.activeElement === e.current ? r() : n();
-  }, [e, n, r]), v(e, "focus", r), v(e, "blur", n);
+  }, [e, n, r]), y(e, "focus", r), y(e, "blur", n);
   const u = m(() => {
     e.current && e.current.focus();
   }, [e]), o = m(() => {
@@ -989,7 +989,7 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
   }, [e]);
   return { isInFocus: t, focus: u, blur: o };
 }, Ft = (e) => {
-  const t = g(e);
+  const t = f(e);
   return F(() => {
     t.current = e;
   }), m((...r) => {
@@ -1001,12 +1001,12 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
   return t.current = e, t;
 }, Ot = (e) => {
   const [t, r, n] = C(!1);
-  return v(e, "mouseover", r), v(e, "mouseout", n), t;
+  return y(e, "mouseover", r), y(e, "mouseout", n), t;
 }, Dt = (e) => {
   const [t, r, n] = C(!1);
-  return v(e, "mouseenter", r), v(e, "mouseleave", n), t;
+  return y(e, "mouseenter", r), y(e, "mouseleave", n), t;
 }, Ht = (e, t) => {
-  const r = g(() => {
+  const r = f(() => {
   });
   p(() => {
     r.current = t;
@@ -1019,7 +1019,7 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
     };
   }, [...e]);
 }, Nt = (e, t, r) => {
-  const n = g(() => {
+  const n = f(() => {
   });
   p(() => {
     n.current = t;
@@ -1032,12 +1032,12 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
     };
   }, [e, r]);
 }, M = ["mousemove", "mousedown", "keydown", "touchstart", "scroll"], Ut = (e, t) => {
-  const r = g(() => {
+  const r = f(() => {
   });
   p(() => {
     r.current = e;
   }, [e]), p(() => {
-    const n = fe(r.current, t);
+    const n = ge(r.current, t);
     return M.forEach((u) => window.addEventListener(u, n)), () => {
       M.forEach(
         (u) => window.removeEventListener(u, n)
@@ -1057,12 +1057,12 @@ const A = (e) => `webui-${e ? e + "-" : ""}${++tt}`, Mt = (e) => {
     a.disconnect();
   }), [a, e]), r;
 }, jt = (e) => {
-  const t = g(null);
+  const t = f(null);
   return p(() => {
     e && (typeof e == "function" ? e(t.current) : e.current = t.current);
   }), t;
 }, qt = (e, t, r = !0) => {
-  const [n, u] = h(e), o = g(null), s = m(
+  const [n, u] = h(e), o = f(null), s = m(
     (a, i = t) => {
       u(a), r && clearTimeout(o.current), o.current = setTimeout(() => u(e), i);
     },
@@ -1104,17 +1104,17 @@ export {
   pt as Column,
   Tt as HeaderText,
   Qe as Heading,
-  ft as Indent,
+  gt as Indent,
   Ct as LargeText,
-  vt as Nest,
+  yt as Nest,
   mt as ResizeAwareBox,
   ht as Row,
   kt as ScreenReaderOnlyText,
   lt as SeparatorLine,
   $t as SmallText,
   St as SmallerText,
-  yt as Space,
-  gt as Spacing,
+  vt as Space,
+  ft as Spacing,
   Et as StandardText,
   w as Text,
   _t as Txt,
@@ -1140,7 +1140,7 @@ export {
   Re as useElementDimensions,
   zt as useElementFocus,
   Ft as useEventCallback,
-  v as useEventListener,
+  y as useEventListener,
   jt as useForwardedRef,
   Pt as useLatest,
   Dt as useMouseIsEntered,