@stenajs-webui/core 20.2.0 → 20.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.es.js +130 -130
- package/dist/index.js +5 -5
- package/package.json +3 -3
package/dist/index.es.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
|
-
(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)}.
|
|
1
|
+
(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)}})();
|
|
2
2
|
import { cssColor as R } from "@stenajs-webui/theme";
|
|
3
3
|
import { jsx as i, Fragment as I } from "react/jsx-runtime";
|
|
4
|
-
import { forwardRef as h, useState as
|
|
4
|
+
import { forwardRef as h, useState as g, useCallback as p, useLayoutEffect as H, useRef as v, useEffect as l, useMemo as z } from "react";
|
|
5
5
|
import y from "@emotion/styled";
|
|
6
6
|
import F from "@emotion/is-prop-valid";
|
|
7
|
-
import { system as N, background as
|
|
8
|
-
import { pickBy as
|
|
7
|
+
import { system as N, background as P, border as V, borderRight as A, borderLeft as G, borderTop as j, 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 se } from "styled-system";
|
|
8
|
+
import { pickBy as oe, debounce as ce } from "lodash";
|
|
9
9
|
import O from "classnames";
|
|
10
10
|
import * as ue from "react-dom";
|
|
11
11
|
const ie = "_separatorLine_nzfcz_1", ae = {
|
|
@@ -16,7 +16,7 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
16
16
|
size: t = "100%",
|
|
17
17
|
width: n = "1px",
|
|
18
18
|
vertical: r = !1
|
|
19
|
-
},
|
|
19
|
+
}, s) => /* @__PURE__ */ i(
|
|
20
20
|
"hr",
|
|
21
21
|
{
|
|
22
22
|
className: ae.separatorLine,
|
|
@@ -27,7 +27,7 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
27
27
|
height: r ? t || "100%" : n || "1px",
|
|
28
28
|
width: r ? n || "1px" : t || "100%"
|
|
29
29
|
},
|
|
30
|
-
ref:
|
|
30
|
+
ref: s
|
|
31
31
|
}
|
|
32
32
|
)
|
|
33
33
|
), de = y.button`
|
|
@@ -59,8 +59,8 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
59
59
|
onClick: t,
|
|
60
60
|
onDblClick: n,
|
|
61
61
|
tooltip: r,
|
|
62
|
-
disableOpacityOnClick:
|
|
63
|
-
disablePointer:
|
|
62
|
+
disableOpacityOnClick: s,
|
|
63
|
+
disablePointer: o,
|
|
64
64
|
opacityOnHover: c,
|
|
65
65
|
disabled: a,
|
|
66
66
|
children: u,
|
|
@@ -75,11 +75,11 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
75
75
|
opacityOnHover: c,
|
|
76
76
|
title: r,
|
|
77
77
|
disabled: a,
|
|
78
|
-
disableOpacityOnClick:
|
|
78
|
+
disableOpacityOnClick: s,
|
|
79
79
|
onClick: t,
|
|
80
80
|
onDoubleClick: n,
|
|
81
81
|
disableFocusHighlight: e,
|
|
82
|
-
pointer: !!(t || n) && !
|
|
82
|
+
pointer: !!(t || n) && !o,
|
|
83
83
|
ref: k,
|
|
84
84
|
background: d,
|
|
85
85
|
hoverBackground: m,
|
|
@@ -89,10 +89,10 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
89
89
|
children: u
|
|
90
90
|
}
|
|
91
91
|
)
|
|
92
|
-
),
|
|
92
|
+
), $ = (e) => e == null ? 0 : typeof e == "boolean" ? e ? 1 : 0 : e, le = (e) => {
|
|
93
93
|
if (e !== 0)
|
|
94
94
|
return `calc(${e} * var(--swui-metrics-space))`;
|
|
95
|
-
}, S = (e) => le(
|
|
95
|
+
}, S = (e) => le($(e)), me = {
|
|
96
96
|
box: "var(--swui-shadow-box)",
|
|
97
97
|
popover: "var(--swui-shadow-popover)",
|
|
98
98
|
modal: "var(--swui-shadow-modal)",
|
|
@@ -113,17 +113,17 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
113
113
|
indent: {
|
|
114
114
|
// @ts-ignore
|
|
115
115
|
property: "--current-indent",
|
|
116
|
-
transform:
|
|
116
|
+
transform: $
|
|
117
117
|
},
|
|
118
118
|
spacing: {
|
|
119
119
|
// @ts-ignore
|
|
120
120
|
property: "--current-spacing",
|
|
121
|
-
transform:
|
|
121
|
+
transform: $
|
|
122
122
|
},
|
|
123
123
|
gap: {
|
|
124
124
|
// @ts-ignore
|
|
125
125
|
property: "--current-gap",
|
|
126
|
-
transform:
|
|
126
|
+
transform: $
|
|
127
127
|
},
|
|
128
128
|
columnGap: {
|
|
129
129
|
property: "columnGap",
|
|
@@ -137,7 +137,7 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
137
137
|
property: "boxShadow",
|
|
138
138
|
transform: (e) => me[e] ?? e
|
|
139
139
|
}
|
|
140
|
-
}),
|
|
140
|
+
}), b = y("div", {
|
|
141
141
|
shouldForwardProp: (e) => typeof e == "string" ? he(e) ? !1 : F(e) : !1
|
|
142
142
|
})`
|
|
143
143
|
--current-spacing: 0;
|
|
@@ -147,11 +147,11 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
147
147
|
display: flex;
|
|
148
148
|
flex-direction: column;
|
|
149
149
|
${fe};
|
|
150
|
-
${j};
|
|
151
150
|
${P};
|
|
152
151
|
${V};
|
|
153
152
|
${A};
|
|
154
153
|
${G};
|
|
154
|
+
${j};
|
|
155
155
|
${U};
|
|
156
156
|
${q};
|
|
157
157
|
${W};
|
|
@@ -166,7 +166,7 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
166
166
|
${te};
|
|
167
167
|
${ne};
|
|
168
168
|
${re};
|
|
169
|
-
${
|
|
169
|
+
${se};
|
|
170
170
|
|
|
171
171
|
gap: calc(var(--current-gap) * var(--swui-metrics-space));
|
|
172
172
|
|
|
@@ -188,47 +188,47 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
188
188
|
${({ focusWithinBorder: e }) => e ? `border: ${e};` : ""}
|
|
189
189
|
}
|
|
190
190
|
`, tt = h(function(t, n) {
|
|
191
|
-
return /* @__PURE__ */ i(
|
|
192
|
-
}),
|
|
193
|
-
const { x: t, y: n, width: r, height:
|
|
191
|
+
return /* @__PURE__ */ i(b, { ref: n, ...t });
|
|
192
|
+
}), ge = (e) => {
|
|
193
|
+
const { x: t, y: n, width: r, height: s, bottom: o, top: c, left: a, right: u } = e.getBoundingClientRect();
|
|
194
194
|
return {
|
|
195
195
|
width: r,
|
|
196
|
-
height:
|
|
196
|
+
height: s,
|
|
197
197
|
top: c,
|
|
198
198
|
left: a,
|
|
199
199
|
x: t,
|
|
200
200
|
y: n,
|
|
201
201
|
right: u,
|
|
202
|
-
bottom:
|
|
202
|
+
bottom: o
|
|
203
203
|
};
|
|
204
|
-
},
|
|
205
|
-
const [n, r] =
|
|
204
|
+
}, ve = (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) => {
|
|
205
|
+
const [n, r] = g(), s = p(() => {
|
|
206
206
|
window.requestAnimationFrame(() => {
|
|
207
207
|
if (e.current) {
|
|
208
|
-
const
|
|
209
|
-
(!n || !
|
|
208
|
+
const o = ge(e.current);
|
|
209
|
+
(!n || !ve(n, o)) && t && t(o), r(o);
|
|
210
210
|
}
|
|
211
211
|
});
|
|
212
212
|
}, [e, n, r, t]);
|
|
213
213
|
return H(() => {
|
|
214
|
-
|
|
215
|
-
}, [
|
|
214
|
+
s();
|
|
215
|
+
}, [s]), {
|
|
216
216
|
dimensions: n
|
|
217
217
|
};
|
|
218
218
|
}, nt = h(
|
|
219
219
|
function({ onResize: t, ...n }, r) {
|
|
220
|
-
const
|
|
221
|
-
return
|
|
220
|
+
const s = v(null);
|
|
221
|
+
return we(r ?? s, t), /* @__PURE__ */ i(b, { ...n, ref: r });
|
|
222
222
|
}
|
|
223
223
|
), rt = h(function(t, n) {
|
|
224
|
-
return /* @__PURE__ */ i(
|
|
225
|
-
}),
|
|
226
|
-
return /* @__PURE__ */ i(
|
|
227
|
-
}),
|
|
224
|
+
return /* @__PURE__ */ i(b, { row: !0, ref: n, ...t });
|
|
225
|
+
}), st = h(function({ num: t = 1, ...n }, r) {
|
|
226
|
+
return /* @__PURE__ */ i(b, { indent: t, ref: r, ...n });
|
|
227
|
+
}), ot = h(
|
|
228
228
|
function({ num: t = 1, ...n }, r) {
|
|
229
|
-
return /* @__PURE__ */ i(
|
|
229
|
+
return /* @__PURE__ */ i(b, { spacing: t, ref: r, ...n });
|
|
230
230
|
}
|
|
231
|
-
),
|
|
231
|
+
), be = y.div`
|
|
232
232
|
--current-size: 1;
|
|
233
233
|
flex: none;
|
|
234
234
|
width: calc(var(--current-size) * var(--swui-metrics-space));
|
|
@@ -239,23 +239,23 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
239
239
|
num: n = 1,
|
|
240
240
|
vertical: r = !1
|
|
241
241
|
}) => {
|
|
242
|
-
const
|
|
242
|
+
const s = n * (e ? 0.5 : 1);
|
|
243
243
|
return /* @__PURE__ */ i(
|
|
244
|
-
|
|
244
|
+
be,
|
|
245
245
|
{
|
|
246
246
|
style: {
|
|
247
|
-
"--current-size":
|
|
247
|
+
"--current-size": s,
|
|
248
248
|
height: t ? 1 : void 0,
|
|
249
249
|
width: r ? 1 : void 0
|
|
250
250
|
}
|
|
251
251
|
}
|
|
252
252
|
);
|
|
253
|
-
}, ut = ({ children: e, nest: t, render: n }) => t ? /* @__PURE__ */ i(I, { children: n(e) }) : /* @__PURE__ */ i(I, { children: e }),
|
|
254
|
-
visuallyHidden:
|
|
255
|
-
},
|
|
253
|
+
}, ut = ({ children: e, nest: t, render: n }) => t ? /* @__PURE__ */ i(I, { children: n(e) }) : /* @__PURE__ */ i(I, { children: e }), _e = "_visuallyHidden_1gevf_1", $e = {
|
|
254
|
+
visuallyHidden: _e
|
|
255
|
+
}, xe = (e) => oe(e, ye), ye = (e, t) => Ee(t), Ee = (e) => e.startsWith("data-") || e.startsWith("aria-"), it = ({
|
|
256
256
|
children: e,
|
|
257
257
|
...t
|
|
258
|
-
}) => /* @__PURE__ */ i("span", { className:
|
|
258
|
+
}) => /* @__PURE__ */ i("span", { className: $e.visuallyHidden, ...xe(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", x = {
|
|
259
259
|
text: Ie,
|
|
260
260
|
standard: Se,
|
|
261
261
|
bold: Ce,
|
|
@@ -265,14 +265,14 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
265
265
|
medium: De,
|
|
266
266
|
small: Le,
|
|
267
267
|
smaller: ke
|
|
268
|
-
},
|
|
268
|
+
}, _ = h(
|
|
269
269
|
({
|
|
270
270
|
children: e,
|
|
271
271
|
variant: t = "standard",
|
|
272
272
|
size: n = "medium",
|
|
273
273
|
className: r,
|
|
274
|
-
color:
|
|
275
|
-
userSelect:
|
|
274
|
+
color: s,
|
|
275
|
+
userSelect: o,
|
|
276
276
|
whiteSpace: c,
|
|
277
277
|
wordBreak: a,
|
|
278
278
|
textAlign: u,
|
|
@@ -281,11 +281,11 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
281
281
|
}, f) => /* @__PURE__ */ i(
|
|
282
282
|
"span",
|
|
283
283
|
{
|
|
284
|
-
className: O(
|
|
284
|
+
className: O(x.text, x[t], x[n], r),
|
|
285
285
|
ref: f,
|
|
286
286
|
style: {
|
|
287
|
-
color:
|
|
288
|
-
userSelect:
|
|
287
|
+
color: s,
|
|
288
|
+
userSelect: o,
|
|
289
289
|
whiteSpace: c,
|
|
290
290
|
wordBreak: a,
|
|
291
291
|
textAlign: u,
|
|
@@ -295,22 +295,22 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
295
295
|
children: e
|
|
296
296
|
}
|
|
297
297
|
)
|
|
298
|
-
), at =
|
|
298
|
+
), at = _, dt = (e) => /* @__PURE__ */ i(_, { size: "small", ...e }), lt = (e) => /* @__PURE__ */ i(_, { size: "smaller", ...e }), mt = (e) => /* @__PURE__ */ i(_, { size: "medium", ...e }), pt = (e) => /* @__PURE__ */ i(_, { size: "large", ...e }), Re = "_heading_1cnsg_1", He = "_h1_1cnsg_10", ze = "_h2_1cnsg_14", Fe = "_h3_1cnsg_18", Ne = "_h4_1cnsg_22", Pe = "_h5_1cnsg_26", Ve = "_h6_1cnsg_30", C = {
|
|
299
299
|
heading: Re,
|
|
300
300
|
h1: He,
|
|
301
301
|
h2: ze,
|
|
302
302
|
h3: Fe,
|
|
303
303
|
h4: Ne,
|
|
304
|
-
h5:
|
|
305
|
-
h6:
|
|
306
|
-
},
|
|
304
|
+
h5: Pe,
|
|
305
|
+
h6: Ve
|
|
306
|
+
}, Ae = h(
|
|
307
307
|
({
|
|
308
308
|
variant: e = "h3",
|
|
309
309
|
className: t,
|
|
310
310
|
color: n,
|
|
311
311
|
whiteSpace: r,
|
|
312
|
-
wordBreak:
|
|
313
|
-
style:
|
|
312
|
+
wordBreak: s,
|
|
313
|
+
style: o,
|
|
314
314
|
children: c,
|
|
315
315
|
as: a,
|
|
316
316
|
...u
|
|
@@ -318,26 +318,26 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
318
318
|
a ?? e,
|
|
319
319
|
{
|
|
320
320
|
className: O(C.heading, C[e], t),
|
|
321
|
-
style: { color: n, whiteSpace: r, wordBreak:
|
|
321
|
+
style: { color: n, whiteSpace: r, wordBreak: s, ...o },
|
|
322
322
|
ref: d,
|
|
323
323
|
...u,
|
|
324
324
|
children: c
|
|
325
325
|
}
|
|
326
326
|
)
|
|
327
|
-
), ht = (e) => /* @__PURE__ */ i(
|
|
327
|
+
), ht = (e) => /* @__PURE__ */ i(Ae, { variant: "h2", ...e }), Ge = (e, t) => e === t, ft = (e, t, n = Ge) => {
|
|
328
328
|
const r = p(
|
|
329
329
|
(u) => {
|
|
330
330
|
e.some((d) => n(d, u)) || t([...e, u]);
|
|
331
331
|
},
|
|
332
332
|
[e, t, n]
|
|
333
|
-
),
|
|
333
|
+
), s = p(
|
|
334
334
|
(u) => {
|
|
335
335
|
t(
|
|
336
336
|
u.reduce((d, m) => d.some((f) => n(f, m)) ? d : [...d, m], e)
|
|
337
337
|
);
|
|
338
338
|
},
|
|
339
339
|
[e, t, n]
|
|
340
|
-
),
|
|
340
|
+
), o = p(
|
|
341
341
|
(u) => {
|
|
342
342
|
const d = e.findIndex((m) => n(m, u));
|
|
343
343
|
d >= 0 && t(e.filter((m, f) => f !== d));
|
|
@@ -350,152 +350,152 @@ const ie = "_separatorLine_nzfcz_1", ae = {
|
|
|
350
350
|
[e, t, n]
|
|
351
351
|
), a = p(
|
|
352
352
|
(u) => {
|
|
353
|
-
e.some((m) => n(m, u)) ?
|
|
353
|
+
e.some((m) => n(m, u)) ? o(u) : r(u);
|
|
354
354
|
},
|
|
355
|
-
[e, r,
|
|
355
|
+
[e, r, o, n]
|
|
356
356
|
);
|
|
357
357
|
return {
|
|
358
358
|
add: r,
|
|
359
|
-
addMultiple:
|
|
360
|
-
remove:
|
|
359
|
+
addMultiple: s,
|
|
360
|
+
remove: o,
|
|
361
361
|
removeMultiple: c,
|
|
362
362
|
toggle: a
|
|
363
363
|
};
|
|
364
364
|
}, E = (e) => {
|
|
365
|
-
const [t, n] =
|
|
365
|
+
const [t, n] = g(e), r = p(() => {
|
|
366
366
|
n(!0);
|
|
367
|
-
}, [n]), o = p(() => {
|
|
368
|
-
n(!1);
|
|
369
367
|
}, [n]), s = p(() => {
|
|
368
|
+
n(!1);
|
|
369
|
+
}, [n]), o = p(() => {
|
|
370
370
|
n((c) => !c);
|
|
371
371
|
}, [n]);
|
|
372
|
-
return [t, r,
|
|
373
|
-
},
|
|
374
|
-
const [n, r] =
|
|
372
|
+
return [t, r, s, o];
|
|
373
|
+
}, gt = (e, t) => {
|
|
374
|
+
const [n, r] = g(e);
|
|
375
375
|
return l(() => {
|
|
376
|
-
const
|
|
376
|
+
const s = setTimeout(() => {
|
|
377
377
|
r(e);
|
|
378
378
|
}, t);
|
|
379
379
|
return () => {
|
|
380
|
-
clearTimeout(
|
|
380
|
+
clearTimeout(s);
|
|
381
381
|
};
|
|
382
382
|
}, [e, t]), n;
|
|
383
|
-
},
|
|
384
|
-
const [n, r] =
|
|
383
|
+
}, vt = (e, t) => {
|
|
384
|
+
const [n, r] = g(e);
|
|
385
385
|
return l(() => {
|
|
386
386
|
e && r(!0);
|
|
387
|
-
const
|
|
387
|
+
const s = setTimeout(() => {
|
|
388
388
|
e || r(e);
|
|
389
389
|
}, t);
|
|
390
390
|
return () => {
|
|
391
|
-
clearTimeout(
|
|
391
|
+
clearTimeout(s);
|
|
392
392
|
};
|
|
393
393
|
}, [e, t]), n;
|
|
394
394
|
};
|
|
395
|
-
let
|
|
396
|
-
const T = (e) => `webui-${e ? e + "-" : ""}${++
|
|
397
|
-
const [t, n] =
|
|
395
|
+
let je = 0;
|
|
396
|
+
const T = (e) => `webui-${e ? e + "-" : ""}${++je}`, wt = (e) => {
|
|
397
|
+
const [t, n] = g(() => T(e));
|
|
398
398
|
return l(() => n(T(e)), [e]), t;
|
|
399
|
-
},
|
|
400
|
-
const r =
|
|
399
|
+
}, w = (e, t, n) => {
|
|
400
|
+
const r = v();
|
|
401
401
|
l(() => {
|
|
402
402
|
r.current = n;
|
|
403
403
|
}, [n]), l(() => {
|
|
404
404
|
if (!(e.current && e.current.addEventListener))
|
|
405
405
|
return;
|
|
406
|
-
const
|
|
406
|
+
const o = (a) => {
|
|
407
407
|
if (r.current)
|
|
408
408
|
return r.current(a);
|
|
409
409
|
};
|
|
410
410
|
if (!e.current)
|
|
411
411
|
return;
|
|
412
412
|
const c = e.current;
|
|
413
|
-
return c.addEventListener(t,
|
|
414
|
-
c && c.removeEventListener(t,
|
|
413
|
+
return c.addEventListener(t, o), () => {
|
|
414
|
+
c && c.removeEventListener(t, o);
|
|
415
415
|
};
|
|
416
416
|
}, [t, e]);
|
|
417
|
-
},
|
|
417
|
+
}, bt = (e) => {
|
|
418
418
|
const [t, n, r] = E(!1);
|
|
419
419
|
l(() => {
|
|
420
420
|
document.activeElement === ue.findDOMNode(e.current) ? n() : r();
|
|
421
|
-
}, [e, r, n]),
|
|
422
|
-
const
|
|
421
|
+
}, [e, r, n]), w(e, "focus", n), w(e, "blur", r);
|
|
422
|
+
const s = p(() => {
|
|
423
423
|
e.current && e.current.focus();
|
|
424
|
-
}, [e]),
|
|
424
|
+
}, [e]), o = p(() => {
|
|
425
425
|
e.current && e.current.blur();
|
|
426
426
|
}, [e]);
|
|
427
|
-
return { isInFocus: t, focus:
|
|
428
|
-
}, xt = (e) => {
|
|
429
|
-
const [t, n, r] = E(!1);
|
|
430
|
-
return b(e, "mouseover", n), b(e, "mouseout", r), t;
|
|
427
|
+
return { isInFocus: t, focus: s, blur: o };
|
|
431
428
|
}, _t = (e) => {
|
|
432
429
|
const [t, n, r] = E(!1);
|
|
433
|
-
return
|
|
434
|
-
}, $t = (e
|
|
435
|
-
const n =
|
|
430
|
+
return w(e, "mouseover", n), w(e, "mouseout", r), t;
|
|
431
|
+
}, $t = (e) => {
|
|
432
|
+
const [t, n, r] = E(!1);
|
|
433
|
+
return w(e, "mouseenter", n), w(e, "mouseleave", r), t;
|
|
434
|
+
}, xt = (e, t) => {
|
|
435
|
+
const n = v(() => {
|
|
436
436
|
});
|
|
437
437
|
l(() => {
|
|
438
438
|
n.current = t;
|
|
439
439
|
}, [t]), l(() => {
|
|
440
|
-
const r = (
|
|
441
|
-
e.filter((c) => c.current).every((c) => c.current && !c.current.contains(
|
|
440
|
+
const r = (s) => {
|
|
441
|
+
e.filter((c) => c.current).every((c) => c.current && !c.current.contains(s.target)) && n.current(s);
|
|
442
442
|
};
|
|
443
443
|
return document.addEventListener("mousedown", r), document.addEventListener("touchstart", r), () => {
|
|
444
444
|
document.removeEventListener("mousedown", r), document.removeEventListener("touchstart", r);
|
|
445
445
|
};
|
|
446
446
|
}, [...e]);
|
|
447
447
|
}, yt = (e, t, n) => {
|
|
448
|
-
const r =
|
|
448
|
+
const r = v(() => {
|
|
449
449
|
});
|
|
450
450
|
l(() => {
|
|
451
451
|
r.current = t;
|
|
452
452
|
}, [t]), l(() => {
|
|
453
|
-
const
|
|
454
|
-
!e.current || e.current.contains(
|
|
453
|
+
const s = (o) => {
|
|
454
|
+
!e.current || e.current.contains(o.target) || r.current(o);
|
|
455
455
|
};
|
|
456
|
-
return document.addEventListener("mousedown",
|
|
457
|
-
document.removeEventListener("mousedown",
|
|
456
|
+
return document.addEventListener("mousedown", s, n), document.addEventListener("touchstart", s, n), () => {
|
|
457
|
+
document.removeEventListener("mousedown", s, n), document.removeEventListener("touchstart", s, n);
|
|
458
458
|
};
|
|
459
459
|
}, [e, n]);
|
|
460
460
|
}, M = ["mousemove", "mousedown", "keydown", "touchstart", "scroll"], Et = (e, t) => {
|
|
461
|
-
const n =
|
|
461
|
+
const n = v(() => {
|
|
462
462
|
});
|
|
463
463
|
l(() => {
|
|
464
464
|
n.current = e;
|
|
465
465
|
}, [e]), l(() => {
|
|
466
466
|
const r = ce(n.current, t);
|
|
467
|
-
return M.forEach((
|
|
467
|
+
return M.forEach((s) => window.addEventListener(s, r)), () => {
|
|
468
468
|
M.forEach(
|
|
469
|
-
(
|
|
469
|
+
(s) => window.removeEventListener(s, r)
|
|
470
470
|
);
|
|
471
471
|
};
|
|
472
472
|
}, [t]);
|
|
473
473
|
}, It = (e, t) => {
|
|
474
|
-
const [n, r] =
|
|
474
|
+
const [n, r] = g(!1), { rootMargin: s, root: o, threshold: c } = t || {}, a = z(() => new IntersectionObserver(
|
|
475
475
|
([u]) => r(u.isIntersecting),
|
|
476
476
|
{
|
|
477
|
-
rootMargin:
|
|
478
|
-
root:
|
|
477
|
+
rootMargin: s,
|
|
478
|
+
root: o,
|
|
479
479
|
threshold: c
|
|
480
480
|
}
|
|
481
|
-
), [r,
|
|
481
|
+
), [r, s, o, c]);
|
|
482
482
|
return l(() => (e.current && a.observe(e.current), () => {
|
|
483
483
|
a.disconnect();
|
|
484
484
|
}), [a, e]), n;
|
|
485
485
|
}, St = (e) => {
|
|
486
|
-
const t =
|
|
486
|
+
const t = v(null);
|
|
487
487
|
return l(() => {
|
|
488
488
|
e && (typeof e == "function" ? e(t.current) : e.current = t.current);
|
|
489
489
|
}), t;
|
|
490
490
|
}, Ct = (e, t, n = !0) => {
|
|
491
|
-
const [r,
|
|
491
|
+
const [r, s] = g(e), o = v(), c = p(
|
|
492
492
|
(a, u = t) => {
|
|
493
|
-
|
|
493
|
+
s(a), n && clearTimeout(o.current), o.current = setTimeout(() => s(e), u);
|
|
494
494
|
},
|
|
495
495
|
[t, n, e]
|
|
496
496
|
);
|
|
497
497
|
return l(() => () => {
|
|
498
|
-
clearTimeout(
|
|
498
|
+
clearTimeout(o.current);
|
|
499
499
|
}, []), [r, c];
|
|
500
500
|
}, Tt = (e) => {
|
|
501
501
|
throw new Error(`Switch unhandled case: ${e}`);
|
|
@@ -513,12 +513,12 @@ const T = (e) => `webui-${e ? e + "-" : ""}${++Ge}`, bt = (e) => {
|
|
|
513
513
|
}
|
|
514
514
|
};
|
|
515
515
|
export {
|
|
516
|
-
|
|
516
|
+
b as Box,
|
|
517
517
|
et as Clickable,
|
|
518
518
|
tt as Column,
|
|
519
519
|
ht as HeaderText,
|
|
520
|
-
|
|
521
|
-
|
|
520
|
+
Ae as Heading,
|
|
521
|
+
st as Indent,
|
|
522
522
|
pt as LargeText,
|
|
523
523
|
ut as Nest,
|
|
524
524
|
nt as ResizeAwareBox,
|
|
@@ -528,30 +528,30 @@ export {
|
|
|
528
528
|
dt as SmallText,
|
|
529
529
|
lt as SmallerText,
|
|
530
530
|
ct as Space,
|
|
531
|
-
|
|
531
|
+
ot as Spacing,
|
|
532
532
|
mt as StandardText,
|
|
533
|
-
|
|
533
|
+
_ as Text,
|
|
534
534
|
at as Txt,
|
|
535
|
-
|
|
535
|
+
$ as booleanOrNumberToNumber,
|
|
536
536
|
Mt as exhaustSwitchCase,
|
|
537
537
|
Tt as exhaustSwitchCaseElseThrow,
|
|
538
|
-
|
|
539
|
-
|
|
538
|
+
xe as getDataProps,
|
|
539
|
+
ge as getDimensionObject,
|
|
540
540
|
Dt as parseFloatElseUndefined,
|
|
541
541
|
Lt as parseIntElseUndefined,
|
|
542
542
|
Ot as truthyKeysAsList,
|
|
543
543
|
ft as useArraySet,
|
|
544
544
|
E as useBoolean,
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
545
|
+
gt as useDebounce,
|
|
546
|
+
vt as useDelayedFalse,
|
|
547
|
+
wt as useDomId,
|
|
548
|
+
we as useElementDimensions,
|
|
549
|
+
bt as useElementFocus,
|
|
550
|
+
w as useEventListener,
|
|
551
551
|
St as useForwardedRef,
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
552
|
+
$t as useMouseIsEntered,
|
|
553
|
+
_t as useMouseIsOver,
|
|
554
|
+
xt as useMultiOnClickOutside,
|
|
555
555
|
yt as useOnClickOutside,
|
|
556
556
|
Et as useOnNoMouseMovement,
|
|
557
557
|
It as useOnScreen,
|
package/dist/index.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
(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)}.
|
|
2
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("@stenajs-webui/theme"),d=require("react/jsx-runtime"),
|
|
1
|
+
(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)}})();
|
|
2
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const F=require("@stenajs-webui/theme"),d=require("react/jsx-runtime"),r=require("react"),_=require("@emotion/styled"),N=require("@emotion/is-prop-valid"),i=require("styled-system"),C=require("lodash"),O=require("classnames"),z=require("react-dom");function H(e){const t=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const n in e)if(n!=="default"){const s=Object.getOwnPropertyDescriptor(e,n);Object.defineProperty(t,n,s.get?s:{enumerable:!0,get:()=>e[n]})}}return t.default=e,Object.freeze(t)}const q=H(z),P="_separatorLine_nzfcz_1",A={separatorLine:P},V=r.forwardRef(({color:e=F.cssColor("--lhds-color-ui-300"),size:t="100%",width:n="1px",vertical:s=!1},o)=>d.jsx("hr",{className:A.separatorLine,"aria-hidden":!0,color:e,style:{backgroundColor:e,height:s?t||"100%":n||"1px",width:s?n||"1px":t||"100%"},ref:o})),U=_.button`
|
|
3
3
|
display: inline-block;
|
|
4
4
|
user-select: none;
|
|
5
5
|
border: 0;
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
${({width:e})=>e?`width: ${e};`:""}
|
|
23
23
|
${({height:e})=>e?`height: ${e};`:""}
|
|
24
24
|
${({borderRadius:e})=>e?`border-radius: ${e};`:""}
|
|
25
|
-
`,B=
|
|
25
|
+
`,B=r.forwardRef(({disableFocusHighlight:e,onClick:t,onDblClick:n,tooltip:s,disableOpacityOnClick:o,disablePointer:c,opacityOnHover:u,disabled:l,children:a,background:f="transparent",hoverBackground:m,focusBackground:h,type:j="button",...D},M)=>{const L=!!(t||n);return d.jsx(U,{opacityOnHover:u,title:s,disabled:l,disableOpacityOnClick:o,onClick:t,onDoubleClick:n,disableFocusHighlight:e,pointer:L&&!c,ref:M,background:f,hoverBackground:m,focusBackground:h,type:j,...D,children:a})}),g=e=>e==null?0:typeof e=="boolean"?e?1:0:e,G=e=>{if(e!==0)return`calc(${e} * var(--swui-metrics-space))`},y=e=>G(g(e)),K={box:"var(--swui-shadow-box)",popover:"var(--swui-shadow-popover)",modal:"var(--swui-shadow-modal)",bottom:"var(--swui-shadow-bottom)"},W=["spacing","indent","gap","width","height","overflow","display"],J=e=>W.includes(e),Q=i.system({row:{property:"flexDirection",transform:e=>e?"row":"column"},indent:{property:"--current-indent",transform:g},spacing:{property:"--current-spacing",transform:g},gap:{property:"--current-gap",transform:g},columnGap:{property:"columnGap",transform:y},rowGap:{property:"rowGap",transform:y},shadow:{property:"boxShadow",transform:e=>K[e]??e}}),b=_("div",{shouldForwardProp:e=>typeof e=="string"?J(e)?!1:N(e):!1})`
|
|
26
26
|
--current-spacing: 0;
|
|
27
27
|
--current-indent: 0;
|
|
28
28
|
--current-gap: 0;
|
|
@@ -70,10 +70,10 @@
|
|
|
70
70
|
${({focusWithinBackground:e})=>e?`background: ${e};`:""}
|
|
71
71
|
${({focusWithinBorder:e})=>e?`border: ${e};`:""}
|
|
72
72
|
}
|
|
73
|
-
`,X=
|
|
73
|
+
`,X=r.forwardRef(function(t,n){return d.jsx(b,{ref:n,...t})}),R=e=>{const{x:t,y:n,width:s,height:o,bottom:c,top:u,left:l,right:a}=e.getBoundingClientRect();return{width:s,height:o,top:u,left:l,x:t,y:n,right:a,bottom:c}},Y=(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,T=(e,t)=>{const[n,s]=r.useState(),o=r.useCallback(()=>{window.requestAnimationFrame(()=>{if(e.current){const c=R(e.current);(!n||!Y(n,c))&&t&&t(c),s(c)}})},[e,n,s,t]);return r.useLayoutEffect(()=>{o()},[o]),{dimensions:n}},Z=r.forwardRef(function({onResize:t,...n},s){const o=r.useRef(null);return T(s??o,t),d.jsx(b,{...n,ref:s})}),ee=r.forwardRef(function(t,n){return d.jsx(b,{row:!0,ref:n,...t})}),te=r.forwardRef(function({num:t=1,...n},s){return d.jsx(b,{indent:t,ref:s,...n})}),ne=r.forwardRef(function({num:t=1,...n},s){return d.jsx(b,{spacing:t,ref:s,...n})}),se=_.div`
|
|
74
74
|
--current-size: 1;
|
|
75
75
|
flex: none;
|
|
76
76
|
width: calc(var(--current-size) * var(--swui-metrics-space));
|
|
77
77
|
height: calc(var(--current-size) * var(--swui-metrics-space));
|
|
78
|
-
`,
|
|
78
|
+
`,re=({half:e=!1,horizontal:t=!1,num:n=1,vertical:s=!1})=>{const o=n*(e?.5:1);return d.jsx(se,{style:{"--current-size":o,height:t?1:void 0,width:s?1:void 0}})},oe=({children:e,nest:t,render:n})=>t?d.jsx(d.Fragment,{children:n(e)}):d.jsx(d.Fragment,{children:e}),ce="_visuallyHidden_1gevf_1",ue={visuallyHidden:ce},I=e=>C.pickBy(e,ae),ae=(e,t)=>ie(t),ie=e=>e.startsWith("data-")||e.startsWith("aria-"),de=({children:e,...t})=>d.jsx("span",{className:ue.visuallyHidden,...I(t),children:e}),le="_text_1iisw_1",fe="_standard_1iisw_24",me="_bold_1iisw_27",he="_caption_1iisw_31",pe="_overline_1iisw_39",be="_large_1iisw_48",we="_medium_1iisw_53",ge="_small_1iisw_58",ve="_smaller_1iisw_63",x={text:le,standard:fe,bold:me,caption:he,overline:pe,large:be,medium:we,small:ge,smaller:ve},w=r.forwardRef(({children:e,variant:t="standard",size:n="medium",className:s,color:o,userSelect:c,whiteSpace:u,wordBreak:l,textAlign:a,style:f,...m},h)=>d.jsx("span",{className:O(x.text,x[t],x[n],s),ref:h,style:{color:o,userSelect:c,whiteSpace:u,wordBreak:l,textAlign:a,...f},...m,children:e})),xe=w,_e=e=>d.jsx(w,{size:"small",...e}),ye=e=>d.jsx(w,{size:"smaller",...e}),$e=e=>d.jsx(w,{size:"medium",...e}),Ee=e=>d.jsx(w,{size:"large",...e}),Se="_heading_1cnsg_1",Ce="_h1_1cnsg_10",Oe="_h2_1cnsg_14",Re="_h3_1cnsg_18",Te="_h4_1cnsg_22",Ie="_h5_1cnsg_26",ke="_h6_1cnsg_30",$={heading:Se,h1:Ce,h2:Oe,h3:Re,h4:Te,h5:Ie,h6:ke},k=r.forwardRef(({variant:e="h3",className:t,color:n,whiteSpace:s,wordBreak:o,style:c,children:u,as:l,...a},f)=>{const m=l??e;return d.jsx(m,{className:O($.heading,$[e],t),style:{color:n,whiteSpace:s,wordBreak:o,...c},ref:f,...a,children:u})}),je=e=>d.jsx(k,{variant:"h2",...e}),De=(e,t)=>e===t,Me=(e,t,n=De)=>{const s=r.useCallback(a=>{e.some(f=>n(f,a))||t([...e,a])},[e,t,n]),o=r.useCallback(a=>{t(a.reduce((f,m)=>f.some(h=>n(h,m))?f:[...f,m],e))},[e,t,n]),c=r.useCallback(a=>{const f=e.findIndex(m=>n(m,a));f>=0&&t(e.filter((m,h)=>h!==f))},[e,t,n]),u=r.useCallback(a=>{t(e.filter(f=>!a.some(m=>n(m,f))))},[e,t,n]),l=r.useCallback(a=>{e.some(m=>n(m,a))?c(a):s(a)},[e,s,c,n]);return{add:s,addMultiple:o,remove:c,removeMultiple:u,toggle:l}},v=e=>{const[t,n]=r.useState(e),s=r.useCallback(()=>{n(!0)},[n]),o=r.useCallback(()=>{n(!1)},[n]),c=r.useCallback(()=>{n(u=>!u)},[n]);return[t,s,o,c]},Le=(e,t)=>{const[n,s]=r.useState(e);return r.useEffect(()=>{const o=setTimeout(()=>{s(e)},t);return()=>{clearTimeout(o)}},[e,t]),n},Fe=(e,t)=>{const[n,s]=r.useState(e);return r.useEffect(()=>{e&&s(!0);const o=setTimeout(()=>{e||s(e)},t);return()=>{clearTimeout(o)}},[e,t]),n};let Ne=0;const E=e=>`webui-${e?e+"-":""}${++Ne}`,ze=e=>{const[t,n]=r.useState(()=>E(e));return r.useEffect(()=>n(E(e)),[e]),t},p=(e,t,n)=>{const s=r.useRef();r.useEffect(()=>{s.current=n},[n]),r.useEffect(()=>{if(!(e.current&&e.current.addEventListener))return;const c=l=>{if(s.current)return s.current(l)};if(!e.current)return;const u=e.current;return u.addEventListener(t,c),()=>{u&&u.removeEventListener(t,c)}},[t,e])},He=e=>{const[t,n,s]=v(!1);r.useEffect(()=>{document.activeElement===q.findDOMNode(e.current)?n():s()},[e,s,n]),p(e,"focus",n),p(e,"blur",s);const o=r.useCallback(()=>{e.current&&e.current.focus()},[e]),c=r.useCallback(()=>{e.current&&e.current.blur()},[e]);return{isInFocus:t,focus:o,blur:c}},qe=e=>{const[t,n,s]=v(!1);return p(e,"mouseover",n),p(e,"mouseout",s),t},Pe=e=>{const[t,n,s]=v(!1);return p(e,"mouseenter",n),p(e,"mouseleave",s),t},Ae=(e,t)=>{const n=r.useRef(()=>{});r.useEffect(()=>{n.current=t},[t]),r.useEffect(()=>{const s=o=>{e.filter(u=>u.current).every(u=>u.current&&!u.current.contains(o.target))&&n.current(o)};return document.addEventListener("mousedown",s),document.addEventListener("touchstart",s),()=>{document.removeEventListener("mousedown",s),document.removeEventListener("touchstart",s)}},[...e])},Ve=(e,t,n)=>{const s=r.useRef(()=>{});r.useEffect(()=>{s.current=t},[t]),r.useEffect(()=>{const o=c=>{!e.current||e.current.contains(c.target)||s.current(c)};return document.addEventListener("mousedown",o,n),document.addEventListener("touchstart",o,n),()=>{document.removeEventListener("mousedown",o,n),document.removeEventListener("touchstart",o,n)}},[e,n])},S=["mousemove","mousedown","keydown","touchstart","scroll"],Ue=(e,t)=>{const n=r.useRef(()=>{});r.useEffect(()=>{n.current=e},[e]),r.useEffect(()=>{const s=C.debounce(n.current,t);return S.forEach(o=>window.addEventListener(o,s)),()=>{S.forEach(o=>window.removeEventListener(o,s))}},[t])},Be=(e,t)=>{const[n,s]=r.useState(!1),{rootMargin:o,root:c,threshold:u}=t||{},l=r.useMemo(()=>new IntersectionObserver(([a])=>s(a.isIntersecting),{rootMargin:o,root:c,threshold:u}),[s,o,c,u]);return r.useEffect(()=>(e.current&&l.observe(e.current),()=>{l.disconnect()}),[l,e]),n},Ge=e=>{const t=r.useRef(null);return r.useEffect(()=>{e&&(typeof e=="function"?e(t.current):e.current=t.current)}),t},Ke=(e,t,n=!0)=>{const[s,o]=r.useState(e),c=r.useRef(),u=r.useCallback((l,a=t)=>{o(l),n&&clearTimeout(c.current),c.current=setTimeout(()=>o(e),a)},[t,n,e]);return r.useEffect(()=>()=>{clearTimeout(c.current)},[]),[s,u]},We=e=>{throw new Error(`Switch unhandled case: ${e}`)},Je=(e,t)=>t,Qe=e=>Object.keys(e).filter(t=>e[t]),Xe=e=>{try{const t=parseFloat(e);return isNaN(t)||t==null?void 0:t}catch{}},Ye=e=>{try{const t=parseInt(e,10);return isNaN(t)||t==null?void 0:t}catch{}};exports.Box=b;exports.Clickable=B;exports.Column=X;exports.HeaderText=je;exports.Heading=k;exports.Indent=te;exports.LargeText=Ee;exports.Nest=oe;exports.ResizeAwareBox=Z;exports.Row=ee;exports.ScreenReaderOnlyText=de;exports.SeparatorLine=V;exports.SmallText=_e;exports.SmallerText=ye;exports.Space=re;exports.Spacing=ne;exports.StandardText=$e;exports.Text=w;exports.Txt=xe;exports.booleanOrNumberToNumber=g;exports.exhaustSwitchCase=Je;exports.exhaustSwitchCaseElseThrow=We;exports.getDataProps=I;exports.getDimensionObject=R;exports.parseFloatElseUndefined=Xe;exports.parseIntElseUndefined=Ye;exports.truthyKeysAsList=Qe;exports.useArraySet=Me;exports.useBoolean=v;exports.useDebounce=Le;exports.useDelayedFalse=Fe;exports.useDomId=ze;exports.useElementDimensions=T;exports.useElementFocus=He;exports.useEventListener=p;exports.useForwardedRef=Ge;exports.useMouseIsEntered=Pe;exports.useMouseIsOver=qe;exports.useMultiOnClickOutside=Ae;exports.useOnClickOutside=Ve;exports.useOnNoMouseMovement=Ue;exports.useOnScreen=Be;exports.useTimeoutState=Ke;
|
|
79
79
|
//# sourceMappingURL=index.js.map
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@stenajs-webui/core",
|
|
3
|
-
"version": "20.
|
|
3
|
+
"version": "20.3.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"description": "",
|
|
6
6
|
"author": "mattias800",
|
|
@@ -64,10 +64,10 @@
|
|
|
64
64
|
"files": [
|
|
65
65
|
"dist"
|
|
66
66
|
],
|
|
67
|
-
"gitHead": "
|
|
67
|
+
"gitHead": "d99aed68160e49557c036a9adde8f4341a4d396d",
|
|
68
68
|
"dependencies": {
|
|
69
69
|
"@emotion/is-prop-valid": "^1.1.0",
|
|
70
|
-
"@stenajs-webui/theme": "20.
|
|
70
|
+
"@stenajs-webui/theme": "20.3.0",
|
|
71
71
|
"classnames": "^2.3.1"
|
|
72
72
|
}
|
|
73
73
|
}
|