@purpurds/tabs 5.34.4 → 6.0.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/LICENSE.txt +1 -1
- package/dist/styles.css +1 -1
- package/dist/tab-content.d.ts +4 -0
- package/dist/tab-content.d.ts.map +1 -1
- package/dist/tabs.cjs.js +3 -3
- package/dist/tabs.cjs.js.map +1 -1
- package/dist/tabs.d.ts.map +1 -1
- package/dist/tabs.es.js +164 -150
- package/dist/tabs.es.js.map +1 -1
- package/package.json +7 -6
- package/src/tab-content.module.scss +6 -0
- package/src/tab-content.test.tsx +39 -6
- package/src/tab-content.tsx +18 -2
- package/src/tabs.stories.tsx +3 -4
- package/src/tabs.tsx +3 -1
package/dist/tabs.es.js
CHANGED
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import { jsx as T, jsxs as ee } from "react/jsx-runtime";
|
|
2
|
-
import * as
|
|
3
|
-
import E, { createContext as ne, useMemo as H, createElement as g, useContext as
|
|
4
|
-
import { flushSync as
|
|
5
|
-
function
|
|
2
|
+
import * as ve from "react";
|
|
3
|
+
import E, { createContext as ne, useMemo as H, createElement as g, useContext as ge, useCallback as L, forwardRef as w, Children as P, isValidElement as z, cloneElement as se, Fragment as Le, useLayoutEffect as Ue, useEffect as N, useRef as R, useState as F, useReducer as Ve } from "react";
|
|
4
|
+
import { flushSync as Be } from "react-dom";
|
|
5
|
+
function Ge(e) {
|
|
6
6
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
7
7
|
}
|
|
8
|
-
var
|
|
8
|
+
var he = { exports: {} };
|
|
9
9
|
/*!
|
|
10
10
|
Copyright (c) 2018 Jed Watson.
|
|
11
11
|
Licensed under the MIT License (MIT), see
|
|
@@ -40,9 +40,9 @@ var ge = { exports: {} };
|
|
|
40
40
|
}
|
|
41
41
|
e.exports ? (n.default = n, e.exports = n) : window.classNames = n;
|
|
42
42
|
})();
|
|
43
|
-
})(
|
|
44
|
-
var
|
|
45
|
-
const
|
|
43
|
+
})(he);
|
|
44
|
+
var je = he.exports;
|
|
45
|
+
const ke = /* @__PURE__ */ Ge(je), Ke = {
|
|
46
46
|
"purpur-icon": "_purpur-icon_8u1lq_1",
|
|
47
47
|
"purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
|
|
48
48
|
"purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
|
|
@@ -50,36 +50,26 @@ const je = /* @__PURE__ */ Be(Ge), ke = {
|
|
|
50
50
|
"purpur-icon--md": "_purpur-icon--md_8u1lq_16",
|
|
51
51
|
"purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
|
|
52
52
|
"purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
|
|
53
|
-
}, ze = {
|
|
54
|
-
name: "chevron-left",
|
|
55
|
-
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M16.175 3.905a.9.9 0 0 1-.08 1.27L8.36 12l7.736 6.825a.9.9 0 0 1-1.191 1.35l-8.5-7.5a.9.9 0 0 1 0-1.35l8.5-7.5a.9.9 0 0 1 1.27.08Z" clip-rule="evenodd"/></svg>',
|
|
56
|
-
keywords: ["chevron-left"],
|
|
57
|
-
category: "utility"
|
|
58
|
-
}, Ke = {
|
|
59
|
-
name: "chevron-right",
|
|
60
|
-
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M7.809 3.924a.9.9 0 0 0 .115 1.267L16.094 12l-8.17 6.809a.9.9 0 0 0 1.152 1.382l9-7.5a.9.9 0 0 0 0-1.382l-9-7.5a.9.9 0 0 0-1.267.115Z" clip-rule="evenodd"/></svg>',
|
|
61
|
-
keywords: ["chevron-right"],
|
|
62
|
-
category: "utility"
|
|
63
|
-
}, We = je.bind(ke), $e = "purpur-icon", Ye = "md", Ze = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), He = ({ content: e = "", title: t } = {}) => {
|
|
53
|
+
}, ze = ke.bind(Ke), $e = "purpur-icon", We = "md", Ye = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), Ze = ({ content: e = "", title: t } = {}) => {
|
|
64
54
|
const n = [
|
|
65
55
|
{ name: "xmlns", value: "http://www.w3.org/2000/svg" },
|
|
66
56
|
{ name: "fill", value: "currentColor" },
|
|
67
57
|
{ name: "viewBox", value: "0 0 24 24" },
|
|
68
58
|
t ? { name: "role", value: "img" } : { name: "aria-hidden", value: "true" }
|
|
69
59
|
], o = t ? `<title>${t}</title>` : "";
|
|
70
|
-
return `<svg ${
|
|
71
|
-
},
|
|
60
|
+
return `<svg ${Ye(n)}>${o}${e}</svg>`;
|
|
61
|
+
}, He = (e) => e.replace(/<(\/?)svg([^>]*)>/g, "").trim(), xe = ({
|
|
72
62
|
["data-testid"]: e,
|
|
73
63
|
svg: t,
|
|
74
64
|
allyTitle: n,
|
|
75
65
|
className: o,
|
|
76
|
-
size: s =
|
|
66
|
+
size: s = We,
|
|
77
67
|
...r
|
|
78
68
|
}) => {
|
|
79
|
-
const c =
|
|
80
|
-
content:
|
|
69
|
+
const c = Ze({
|
|
70
|
+
content: He(t.svg),
|
|
81
71
|
title: n
|
|
82
|
-
}), a =
|
|
72
|
+
}), a = ze(o, $e, `${$e}--${s}`);
|
|
83
73
|
return /* @__PURE__ */ T(
|
|
84
74
|
"span",
|
|
85
75
|
{
|
|
@@ -91,7 +81,18 @@ const je = /* @__PURE__ */ Be(Ge), ke = {
|
|
|
91
81
|
}
|
|
92
82
|
);
|
|
93
83
|
};
|
|
94
|
-
|
|
84
|
+
xe.displayName = "Icon";
|
|
85
|
+
const Xe = {
|
|
86
|
+
name: "chevron-left",
|
|
87
|
+
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M16.175 3.905a.9.9 0 0 1-.08 1.27L8.36 12l7.736 6.825a.9.9 0 0 1-1.191 1.35l-8.5-7.5a.9.9 0 0 1 0-1.35l8.5-7.5a.9.9 0 0 1 1.27.08Z" clip-rule="evenodd"/></svg>',
|
|
88
|
+
keywords: ["chevron-left"],
|
|
89
|
+
category: "utility"
|
|
90
|
+
}, Je = {
|
|
91
|
+
name: "chevron-right",
|
|
92
|
+
svg: '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><path fill-rule="evenodd" d="M7.809 3.924a.9.9 0 0 0 .115 1.267L16.094 12l-8.17 6.809a.9.9 0 0 0 1.152 1.382l9-7.5a.9.9 0 0 0 0-1.382l-9-7.5a.9.9 0 0 0-1.267.115Z" clip-rule="evenodd"/></svg>',
|
|
93
|
+
keywords: ["chevron-right"],
|
|
94
|
+
category: "utility"
|
|
95
|
+
};
|
|
95
96
|
function C() {
|
|
96
97
|
return C = Object.assign ? Object.assign.bind() : function(e) {
|
|
97
98
|
for (var t = 1; t < arguments.length; t++) {
|
|
@@ -101,7 +102,7 @@ function C() {
|
|
|
101
102
|
return e;
|
|
102
103
|
}, C.apply(null, arguments);
|
|
103
104
|
}
|
|
104
|
-
function
|
|
105
|
+
function O(e, t, { checkForDefaultPrevented: n = !0 } = {}) {
|
|
105
106
|
return function(s) {
|
|
106
107
|
if (e == null || e(s), n === !1 || !s.defaultPrevented) return t == null ? void 0 : t(s);
|
|
107
108
|
};
|
|
@@ -124,7 +125,7 @@ function ae(e, t = []) {
|
|
|
124
125
|
}, _);
|
|
125
126
|
}
|
|
126
127
|
function p(l, m) {
|
|
127
|
-
const _ = (m == null ? void 0 : m[e][u]) || a, f =
|
|
128
|
+
const _ = (m == null ? void 0 : m[e][u]) || a, f = ge(_);
|
|
128
129
|
if (f) return f;
|
|
129
130
|
if (c !== void 0) return c;
|
|
130
131
|
throw new Error(`\`${l}\` must be used within \`${r}\``);
|
|
@@ -154,10 +155,10 @@ function ae(e, t = []) {
|
|
|
154
155
|
};
|
|
155
156
|
return s.scopeName = e, [
|
|
156
157
|
o,
|
|
157
|
-
|
|
158
|
+
Qe(s, ...t)
|
|
158
159
|
];
|
|
159
160
|
}
|
|
160
|
-
function
|
|
161
|
+
function Qe(...e) {
|
|
161
162
|
const t = e[0];
|
|
162
163
|
if (e.length === 1) return t;
|
|
163
164
|
const n = () => {
|
|
@@ -187,24 +188,24 @@ function Je(...e) {
|
|
|
187
188
|
};
|
|
188
189
|
return n.scopeName = t.scopeName, n;
|
|
189
190
|
}
|
|
190
|
-
function
|
|
191
|
+
function et(e, t) {
|
|
191
192
|
typeof e == "function" ? e(t) : e != null && (e.current = t);
|
|
192
193
|
}
|
|
193
|
-
function
|
|
194
|
+
function Ie(...e) {
|
|
194
195
|
return (t) => e.forEach(
|
|
195
|
-
(n) =>
|
|
196
|
+
(n) => et(n, t)
|
|
196
197
|
);
|
|
197
198
|
}
|
|
198
199
|
function X(...e) {
|
|
199
|
-
return L(
|
|
200
|
+
return L(Ie(...e), e);
|
|
200
201
|
}
|
|
201
202
|
const J = /* @__PURE__ */ w((e, t) => {
|
|
202
|
-
const { children: n, ...o } = e, s = P.toArray(n), r = s.find(
|
|
203
|
+
const { children: n, ...o } = e, s = P.toArray(n), r = s.find(nt);
|
|
203
204
|
if (r) {
|
|
204
|
-
const c = r.props.children, a = s.map((u) => u === r ? P.count(c) > 1 ? P.only(null) : /* @__PURE__ */
|
|
205
|
+
const c = r.props.children, a = s.map((u) => u === r ? P.count(c) > 1 ? P.only(null) : /* @__PURE__ */ z(c) ? c.props.children : null : u);
|
|
205
206
|
return /* @__PURE__ */ g(re, C({}, o, {
|
|
206
207
|
ref: t
|
|
207
|
-
}), /* @__PURE__ */
|
|
208
|
+
}), /* @__PURE__ */ z(c) ? /* @__PURE__ */ se(c, void 0, a) : null);
|
|
208
209
|
}
|
|
209
210
|
return /* @__PURE__ */ g(re, C({}, o, {
|
|
210
211
|
ref: t
|
|
@@ -213,17 +214,17 @@ const J = /* @__PURE__ */ w((e, t) => {
|
|
|
213
214
|
J.displayName = "Slot";
|
|
214
215
|
const re = /* @__PURE__ */ w((e, t) => {
|
|
215
216
|
const { children: n, ...o } = e;
|
|
216
|
-
return /* @__PURE__ */
|
|
217
|
-
...
|
|
218
|
-
ref: t ?
|
|
217
|
+
return /* @__PURE__ */ z(n) ? /* @__PURE__ */ se(n, {
|
|
218
|
+
...rt(o, n.props),
|
|
219
|
+
ref: t ? Ie(t, n.ref) : n.ref
|
|
219
220
|
}) : P.count(n) > 1 ? P.only(null) : null;
|
|
220
221
|
});
|
|
221
222
|
re.displayName = "SlotClone";
|
|
222
|
-
const
|
|
223
|
-
function
|
|
224
|
-
return /* @__PURE__ */
|
|
223
|
+
const tt = ({ children: e }) => /* @__PURE__ */ g(Le, null, e);
|
|
224
|
+
function nt(e) {
|
|
225
|
+
return /* @__PURE__ */ z(e) && e.type === tt;
|
|
225
226
|
}
|
|
226
|
-
function
|
|
227
|
+
function rt(e, t) {
|
|
227
228
|
const n = {
|
|
228
229
|
...t
|
|
229
230
|
};
|
|
@@ -244,7 +245,7 @@ function nt(e, t) {
|
|
|
244
245
|
...n
|
|
245
246
|
};
|
|
246
247
|
}
|
|
247
|
-
function
|
|
248
|
+
function ot(e) {
|
|
248
249
|
const t = e + "CollectionProvider", [n, o] = ae(t), [s, r] = n(t, {
|
|
249
250
|
collectionRef: {
|
|
250
251
|
current: null
|
|
@@ -296,21 +297,21 @@ function rt(e) {
|
|
|
296
297
|
o
|
|
297
298
|
];
|
|
298
299
|
}
|
|
299
|
-
const oe = globalThis != null && globalThis.document ?
|
|
300
|
-
},
|
|
300
|
+
const oe = globalThis != null && globalThis.document ? Ue : () => {
|
|
301
|
+
}, ct = ve.useId || (() => {
|
|
301
302
|
});
|
|
302
|
-
let
|
|
303
|
-
function
|
|
304
|
-
const [t, n] =
|
|
303
|
+
let st = 0;
|
|
304
|
+
function Ce(e) {
|
|
305
|
+
const [t, n] = ve.useState(ct());
|
|
305
306
|
return oe(() => {
|
|
306
307
|
e || n(
|
|
307
|
-
(o) => o ?? String(
|
|
308
|
+
(o) => o ?? String(st++)
|
|
308
309
|
);
|
|
309
310
|
}, [
|
|
310
311
|
e
|
|
311
312
|
]), e || (t ? `radix-${t}` : "");
|
|
312
313
|
}
|
|
313
|
-
const
|
|
314
|
+
const at = [
|
|
314
315
|
"a",
|
|
315
316
|
"button",
|
|
316
317
|
"div",
|
|
@@ -327,7 +328,7 @@ const st = [
|
|
|
327
328
|
"span",
|
|
328
329
|
"svg",
|
|
329
330
|
"ul"
|
|
330
|
-
], G =
|
|
331
|
+
], G = at.reduce((e, t) => {
|
|
331
332
|
const n = /* @__PURE__ */ w((o, s) => {
|
|
332
333
|
const { asChild: r, ...c } = o, a = r ? J : t;
|
|
333
334
|
return N(() => {
|
|
@@ -353,9 +354,9 @@ function ie(e) {
|
|
|
353
354
|
[]
|
|
354
355
|
);
|
|
355
356
|
}
|
|
356
|
-
function
|
|
357
|
+
function ye({ prop: e, defaultProp: t, onChange: n = () => {
|
|
357
358
|
} }) {
|
|
358
|
-
const [o, s] =
|
|
359
|
+
const [o, s] = it({
|
|
359
360
|
defaultProp: t,
|
|
360
361
|
onChange: n
|
|
361
362
|
}), r = e !== void 0, c = r ? e : o, a = ie(n), u = L((i) => {
|
|
@@ -374,8 +375,8 @@ function Ce({ prop: e, defaultProp: t, onChange: n = () => {
|
|
|
374
375
|
u
|
|
375
376
|
];
|
|
376
377
|
}
|
|
377
|
-
function
|
|
378
|
-
const n =
|
|
378
|
+
function it({ defaultProp: e, onChange: t }) {
|
|
379
|
+
const n = F(e), [o] = n, s = R(o), r = ie(t);
|
|
379
380
|
return N(() => {
|
|
380
381
|
s.current !== o && (r(o), s.current = o);
|
|
381
382
|
}, [
|
|
@@ -384,35 +385,35 @@ function at({ defaultProp: e, onChange: t }) {
|
|
|
384
385
|
r
|
|
385
386
|
]), n;
|
|
386
387
|
}
|
|
387
|
-
const
|
|
388
|
-
function
|
|
389
|
-
const t =
|
|
388
|
+
const ut = /* @__PURE__ */ ne(void 0);
|
|
389
|
+
function Se(e) {
|
|
390
|
+
const t = ge(ut);
|
|
390
391
|
return e || t || "ltr";
|
|
391
392
|
}
|
|
392
|
-
const te = "rovingFocusGroup.onEntryFocus",
|
|
393
|
+
const te = "rovingFocusGroup.onEntryFocus", dt = {
|
|
393
394
|
bubbles: !1,
|
|
394
395
|
cancelable: !0
|
|
395
|
-
}, ue = "RovingFocusGroup", [ce,
|
|
396
|
-
|
|
397
|
-
]), [
|
|
396
|
+
}, ue = "RovingFocusGroup", [ce, we, lt] = ot(ue), [ft, Te] = ae(ue, [
|
|
397
|
+
lt
|
|
398
|
+
]), [pt, bt] = ft(ue), $t = /* @__PURE__ */ w((e, t) => /* @__PURE__ */ g(ce.Provider, {
|
|
398
399
|
scope: e.__scopeRovingFocusGroup
|
|
399
400
|
}, /* @__PURE__ */ g(ce.Slot, {
|
|
400
401
|
scope: e.__scopeRovingFocusGroup
|
|
401
|
-
}, /* @__PURE__ */ g(
|
|
402
|
+
}, /* @__PURE__ */ g(mt, C({}, e, {
|
|
402
403
|
ref: t
|
|
403
|
-
}))))),
|
|
404
|
-
const { __scopeRovingFocusGroup: n, orientation: o, loop: s = !1, dir: r, currentTabStopId: c, defaultCurrentTabStopId: a, onCurrentTabStopIdChange: u, onEntryFocus: i, ...p } = e, l = R(null), m = X(t, l), _ =
|
|
404
|
+
}))))), mt = /* @__PURE__ */ w((e, t) => {
|
|
405
|
+
const { __scopeRovingFocusGroup: n, orientation: o, loop: s = !1, dir: r, currentTabStopId: c, defaultCurrentTabStopId: a, onCurrentTabStopIdChange: u, onEntryFocus: i, ...p } = e, l = R(null), m = X(t, l), _ = Se(r), [f = null, h] = ye({
|
|
405
406
|
prop: c,
|
|
406
407
|
defaultProp: a,
|
|
407
408
|
onChange: u
|
|
408
|
-
}), [$, b] =
|
|
409
|
+
}), [$, b] = F(!1), v = ie(i), U = we(n), y = R(!1), [j, V] = F(0);
|
|
409
410
|
return N(() => {
|
|
410
411
|
const x = l.current;
|
|
411
412
|
if (x)
|
|
412
413
|
return x.addEventListener(te, v), () => x.removeEventListener(te, v);
|
|
413
414
|
}, [
|
|
414
415
|
v
|
|
415
|
-
]), /* @__PURE__ */ g(
|
|
416
|
+
]), /* @__PURE__ */ g(pt, {
|
|
416
417
|
scope: n,
|
|
417
418
|
orientation: o,
|
|
418
419
|
dir: _,
|
|
@@ -449,39 +450,39 @@ const te = "rovingFocusGroup.onEntryFocus", ut = {
|
|
|
449
450
|
outline: "none",
|
|
450
451
|
...e.style
|
|
451
452
|
},
|
|
452
|
-
onMouseDown:
|
|
453
|
+
onMouseDown: O(e.onMouseDown, () => {
|
|
453
454
|
y.current = !0;
|
|
454
455
|
}),
|
|
455
|
-
onFocus:
|
|
456
|
+
onFocus: O(e.onFocus, (x) => {
|
|
456
457
|
const W = !y.current;
|
|
457
458
|
if (x.target === x.currentTarget && W && !$) {
|
|
458
|
-
const k = new CustomEvent(te,
|
|
459
|
+
const k = new CustomEvent(te, dt);
|
|
459
460
|
if (x.currentTarget.dispatchEvent(k), !k.defaultPrevented) {
|
|
460
461
|
const D = U().filter(
|
|
461
462
|
(d) => d.focusable
|
|
462
|
-
),
|
|
463
|
+
), K = D.find(
|
|
463
464
|
(d) => d.active
|
|
464
465
|
), Q = D.find(
|
|
465
466
|
(d) => d.id === f
|
|
466
467
|
), Y = [
|
|
467
|
-
|
|
468
|
+
K,
|
|
468
469
|
Q,
|
|
469
470
|
...D
|
|
470
471
|
].filter(Boolean).map(
|
|
471
472
|
(d) => d.ref.current
|
|
472
473
|
);
|
|
473
|
-
|
|
474
|
+
Ne(Y);
|
|
474
475
|
}
|
|
475
476
|
}
|
|
476
477
|
y.current = !1;
|
|
477
478
|
}),
|
|
478
|
-
onBlur:
|
|
479
|
+
onBlur: O(
|
|
479
480
|
e.onBlur,
|
|
480
481
|
() => b(!1)
|
|
481
482
|
)
|
|
482
483
|
})));
|
|
483
|
-
}),
|
|
484
|
-
const { __scopeRovingFocusGroup: n, focusable: o = !0, active: s = !1, tabStopId: r, ...c } = e, a =
|
|
484
|
+
}), _t = "RovingFocusGroupItem", vt = /* @__PURE__ */ w((e, t) => {
|
|
485
|
+
const { __scopeRovingFocusGroup: n, focusable: o = !0, active: s = !1, tabStopId: r, ...c } = e, a = Ce(), u = r || a, i = bt(_t, n), p = i.currentTabStopId === u, l = we(n), { onFocusableItemAdd: m, onFocusableItemRemove: _ } = i;
|
|
485
486
|
return N(() => {
|
|
486
487
|
if (o)
|
|
487
488
|
return m(), () => _();
|
|
@@ -499,20 +500,20 @@ const te = "rovingFocusGroup.onEntryFocus", ut = {
|
|
|
499
500
|
"data-orientation": i.orientation
|
|
500
501
|
}, c, {
|
|
501
502
|
ref: t,
|
|
502
|
-
onMouseDown:
|
|
503
|
+
onMouseDown: O(e.onMouseDown, (f) => {
|
|
503
504
|
o ? i.onItemFocus(u) : f.preventDefault();
|
|
504
505
|
}),
|
|
505
|
-
onFocus:
|
|
506
|
+
onFocus: O(
|
|
506
507
|
e.onFocus,
|
|
507
508
|
() => i.onItemFocus(u)
|
|
508
509
|
),
|
|
509
|
-
onKeyDown:
|
|
510
|
+
onKeyDown: O(e.onKeyDown, (f) => {
|
|
510
511
|
if (f.key === "Tab" && f.shiftKey) {
|
|
511
512
|
i.onItemShiftTab();
|
|
512
513
|
return;
|
|
513
514
|
}
|
|
514
515
|
if (f.target !== f.currentTarget) return;
|
|
515
|
-
const h =
|
|
516
|
+
const h = xt(f, i.orientation, i.dir);
|
|
516
517
|
if (h !== void 0) {
|
|
517
518
|
f.preventDefault();
|
|
518
519
|
let b = l().filter(
|
|
@@ -524,15 +525,15 @@ const te = "rovingFocusGroup.onEntryFocus", ut = {
|
|
|
524
525
|
else if (h === "prev" || h === "next") {
|
|
525
526
|
h === "prev" && b.reverse();
|
|
526
527
|
const v = b.indexOf(f.currentTarget);
|
|
527
|
-
b = i.loop ?
|
|
528
|
+
b = i.loop ? It(b, v + 1) : b.slice(v + 1);
|
|
528
529
|
}
|
|
529
530
|
setTimeout(
|
|
530
|
-
() =>
|
|
531
|
+
() => Ne(b)
|
|
531
532
|
);
|
|
532
533
|
}
|
|
533
534
|
})
|
|
534
535
|
})));
|
|
535
|
-
}),
|
|
536
|
+
}), gt = {
|
|
536
537
|
ArrowLeft: "prev",
|
|
537
538
|
ArrowUp: "prev",
|
|
538
539
|
ArrowRight: "next",
|
|
@@ -542,11 +543,11 @@ const te = "rovingFocusGroup.onEntryFocus", ut = {
|
|
|
542
543
|
PageDown: "last",
|
|
543
544
|
End: "last"
|
|
544
545
|
};
|
|
545
|
-
function
|
|
546
|
+
function ht(e, t) {
|
|
546
547
|
return t !== "rtl" ? e : e === "ArrowLeft" ? "ArrowRight" : e === "ArrowRight" ? "ArrowLeft" : e;
|
|
547
548
|
}
|
|
548
|
-
function
|
|
549
|
-
const o =
|
|
549
|
+
function xt(e, t, n) {
|
|
550
|
+
const o = ht(e.key, n);
|
|
550
551
|
if (!(t === "vertical" && [
|
|
551
552
|
"ArrowLeft",
|
|
552
553
|
"ArrowRight"
|
|
@@ -554,36 +555,36 @@ function ht(e, t, n) {
|
|
|
554
555
|
"ArrowUp",
|
|
555
556
|
"ArrowDown"
|
|
556
557
|
].includes(o)))
|
|
557
|
-
return
|
|
558
|
+
return gt[o];
|
|
558
559
|
}
|
|
559
|
-
function
|
|
560
|
+
function Ne(e) {
|
|
560
561
|
const t = document.activeElement;
|
|
561
562
|
for (const n of e)
|
|
562
563
|
if (n === t || (n.focus(), document.activeElement !== t)) return;
|
|
563
564
|
}
|
|
564
|
-
function
|
|
565
|
+
function It(e, t) {
|
|
565
566
|
return e.map(
|
|
566
567
|
(n, o) => e[(t + o) % e.length]
|
|
567
568
|
);
|
|
568
569
|
}
|
|
569
|
-
const
|
|
570
|
-
function
|
|
571
|
-
return
|
|
570
|
+
const Ct = $t, yt = vt;
|
|
571
|
+
function St(e, t) {
|
|
572
|
+
return Ve((n, o) => {
|
|
572
573
|
const s = t[n][o];
|
|
573
574
|
return s ?? n;
|
|
574
575
|
}, e);
|
|
575
576
|
}
|
|
576
|
-
const
|
|
577
|
-
const { present: t, children: n } = e, o =
|
|
577
|
+
const Ae = (e) => {
|
|
578
|
+
const { present: t, children: n } = e, o = wt(t), s = typeof n == "function" ? n({
|
|
578
579
|
present: o.isPresent
|
|
579
580
|
}) : P.only(n), r = X(o.ref, s.ref);
|
|
580
581
|
return typeof n == "function" || o.isPresent ? /* @__PURE__ */ se(s, {
|
|
581
582
|
ref: r
|
|
582
583
|
}) : null;
|
|
583
584
|
};
|
|
584
|
-
|
|
585
|
-
function
|
|
586
|
-
const [t, n] =
|
|
585
|
+
Ae.displayName = "Presence";
|
|
586
|
+
function wt(e) {
|
|
587
|
+
const [t, n] = F(), o = R({}), s = R(e), r = R("none"), c = e ? "mounted" : "unmounted", [a, u] = St(c, {
|
|
587
588
|
mounted: {
|
|
588
589
|
UNMOUNT: "unmounted",
|
|
589
590
|
ANIMATION_OUT: "unmountSuspended"
|
|
@@ -614,7 +615,7 @@ function St(e) {
|
|
|
614
615
|
if (t) {
|
|
615
616
|
const i = (l) => {
|
|
616
617
|
const _ = Z(o.current).includes(l.animationName);
|
|
617
|
-
l.target === t && _ &&
|
|
618
|
+
l.target === t && _ && Be(
|
|
618
619
|
() => u("ANIMATION_END")
|
|
619
620
|
);
|
|
620
621
|
}, p = (l) => {
|
|
@@ -641,17 +642,17 @@ function St(e) {
|
|
|
641
642
|
function Z(e) {
|
|
642
643
|
return (e == null ? void 0 : e.animationName) || "none";
|
|
643
644
|
}
|
|
644
|
-
const
|
|
645
|
-
|
|
646
|
-
]),
|
|
647
|
-
const { __scopeTabs: n, value: o, onValueChange: s, defaultValue: r, orientation: c = "horizontal", dir: a, activationMode: u = "automatic", ...i } = e, p =
|
|
645
|
+
const Ee = "Tabs", [Tt, nn] = ae(Ee, [
|
|
646
|
+
Te
|
|
647
|
+
]), Pe = Te(), [Nt, de] = Tt(Ee), At = /* @__PURE__ */ w((e, t) => {
|
|
648
|
+
const { __scopeTabs: n, value: o, onValueChange: s, defaultValue: r, orientation: c = "horizontal", dir: a, activationMode: u = "automatic", ...i } = e, p = Se(a), [l, m] = ye({
|
|
648
649
|
prop: o,
|
|
649
650
|
onChange: s,
|
|
650
651
|
defaultProp: r
|
|
651
652
|
});
|
|
652
|
-
return /* @__PURE__ */ g(
|
|
653
|
+
return /* @__PURE__ */ g(Nt, {
|
|
653
654
|
scope: n,
|
|
654
|
-
baseId:
|
|
655
|
+
baseId: Ce(),
|
|
655
656
|
value: l,
|
|
656
657
|
onValueChange: m,
|
|
657
658
|
orientation: c,
|
|
@@ -663,9 +664,9 @@ const Ae = "Tabs", [wt, nn] = ae(Ae, [
|
|
|
663
664
|
}, i, {
|
|
664
665
|
ref: t
|
|
665
666
|
})));
|
|
666
|
-
}),
|
|
667
|
-
const { __scopeTabs: n, loop: o = !0, ...s } = e, r = de(
|
|
668
|
-
return /* @__PURE__ */ g(
|
|
667
|
+
}), Et = "TabsList", Pt = /* @__PURE__ */ w((e, t) => {
|
|
668
|
+
const { __scopeTabs: n, loop: o = !0, ...s } = e, r = de(Et, n), c = Pe(n);
|
|
669
|
+
return /* @__PURE__ */ g(Ct, C({
|
|
669
670
|
asChild: !0
|
|
670
671
|
}, c, {
|
|
671
672
|
orientation: r.orientation,
|
|
@@ -677,9 +678,9 @@ const Ae = "Tabs", [wt, nn] = ae(Ae, [
|
|
|
677
678
|
}, s, {
|
|
678
679
|
ref: t
|
|
679
680
|
})));
|
|
680
|
-
}),
|
|
681
|
-
const { __scopeTabs: n, value: o, disabled: s = !1, ...r } = e, c = de(
|
|
682
|
-
return /* @__PURE__ */ g(
|
|
681
|
+
}), Rt = "TabsTrigger", Mt = /* @__PURE__ */ w((e, t) => {
|
|
682
|
+
const { __scopeTabs: n, value: o, disabled: s = !1, ...r } = e, c = de(Rt, n), a = Pe(n), u = Re(c.baseId, o), i = Me(c.baseId, o), p = o === c.value;
|
|
683
|
+
return /* @__PURE__ */ g(yt, C({
|
|
683
684
|
asChild: !0
|
|
684
685
|
}, a, {
|
|
685
686
|
focusable: !s,
|
|
@@ -695,29 +696,29 @@ const Ae = "Tabs", [wt, nn] = ae(Ae, [
|
|
|
695
696
|
id: u
|
|
696
697
|
}, r, {
|
|
697
698
|
ref: t,
|
|
698
|
-
onMouseDown:
|
|
699
|
+
onMouseDown: O(e.onMouseDown, (l) => {
|
|
699
700
|
!s && l.button === 0 && l.ctrlKey === !1 ? c.onValueChange(o) : l.preventDefault();
|
|
700
701
|
}),
|
|
701
|
-
onKeyDown:
|
|
702
|
+
onKeyDown: O(e.onKeyDown, (l) => {
|
|
702
703
|
[
|
|
703
704
|
" ",
|
|
704
705
|
"Enter"
|
|
705
706
|
].includes(l.key) && c.onValueChange(o);
|
|
706
707
|
}),
|
|
707
|
-
onFocus:
|
|
708
|
+
onFocus: O(e.onFocus, () => {
|
|
708
709
|
const l = c.activationMode !== "manual";
|
|
709
710
|
!p && !s && l && c.onValueChange(o);
|
|
710
711
|
})
|
|
711
712
|
})));
|
|
712
|
-
}),
|
|
713
|
-
const { __scopeTabs: n, value: o, forceMount: s, children: r, ...c } = e, a = de(
|
|
713
|
+
}), Ot = "TabsContent", Ft = /* @__PURE__ */ w((e, t) => {
|
|
714
|
+
const { __scopeTabs: n, value: o, forceMount: s, children: r, ...c } = e, a = de(Ot, n), u = Re(a.baseId, o), i = Me(a.baseId, o), p = o === a.value, l = R(p);
|
|
714
715
|
return N(() => {
|
|
715
716
|
const m = requestAnimationFrame(
|
|
716
717
|
() => l.current = !1
|
|
717
718
|
);
|
|
718
719
|
return () => cancelAnimationFrame(m);
|
|
719
720
|
}, []), /* @__PURE__ */ g(
|
|
720
|
-
|
|
721
|
+
Ae,
|
|
721
722
|
{
|
|
722
723
|
present: s || p
|
|
723
724
|
},
|
|
@@ -738,17 +739,17 @@ const Ae = "Tabs", [wt, nn] = ae(Ae, [
|
|
|
738
739
|
}), m && r)
|
|
739
740
|
);
|
|
740
741
|
});
|
|
741
|
-
function
|
|
742
|
+
function Re(e, t) {
|
|
742
743
|
return `${e}-trigger-${t}`;
|
|
743
744
|
}
|
|
744
|
-
function
|
|
745
|
+
function Me(e, t) {
|
|
745
746
|
return `${e}-content-${t}`;
|
|
746
747
|
}
|
|
747
|
-
const
|
|
748
|
-
function
|
|
748
|
+
const Dt = At, qt = Pt, Lt = Mt, Ut = Ft;
|
|
749
|
+
function Vt(e) {
|
|
749
750
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
750
751
|
}
|
|
751
|
-
var
|
|
752
|
+
var Oe = { exports: {} };
|
|
752
753
|
/*!
|
|
753
754
|
Copyright (c) 2018 Jed Watson.
|
|
754
755
|
Licensed under the MIT License (MIT), see
|
|
@@ -783,29 +784,42 @@ var Me = { exports: {} };
|
|
|
783
784
|
}
|
|
784
785
|
e.exports ? (n.default = n, e.exports = n) : window.classNames = n;
|
|
785
786
|
})();
|
|
786
|
-
})(
|
|
787
|
-
var
|
|
788
|
-
const le = /* @__PURE__ */
|
|
789
|
-
"purpur-tab-content": "_purpur-tab-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
787
|
+
})(Oe);
|
|
788
|
+
var Bt = Oe.exports;
|
|
789
|
+
const le = /* @__PURE__ */ Vt(Bt), Gt = {
|
|
790
|
+
"purpur-tab-content": "_purpur-tab-content_1ugbi_1",
|
|
791
|
+
"purpur-tab-content--force-mount": "_purpur-tab-content--force-mount_1ugbi_15"
|
|
792
|
+
}, jt = le.bind(Gt), me = "purpur-tab-content", kt = w(
|
|
793
|
+
({
|
|
794
|
+
children: e,
|
|
795
|
+
tabId: t,
|
|
796
|
+
"data-testid": n,
|
|
797
|
+
className: o,
|
|
798
|
+
disableForceMount: s,
|
|
799
|
+
...r
|
|
800
|
+
}, c) => /* @__PURE__ */ T(
|
|
801
|
+
Ut,
|
|
793
802
|
{
|
|
794
|
-
ref:
|
|
795
|
-
className:
|
|
803
|
+
ref: c,
|
|
804
|
+
className: jt([
|
|
805
|
+
me,
|
|
806
|
+
o,
|
|
807
|
+
{ [`${me}--force-mount`]: !s }
|
|
808
|
+
]),
|
|
796
809
|
"data-testid": n,
|
|
797
810
|
value: t,
|
|
798
|
-
|
|
811
|
+
forceMount: !s || void 0,
|
|
812
|
+
...r,
|
|
799
813
|
children: e
|
|
800
814
|
}
|
|
801
815
|
)
|
|
802
|
-
),
|
|
816
|
+
), Kt = (e) => !!e && z(e) && !!e.props.name && !!e.props.tabId, zt = {
|
|
803
817
|
"purpur-tab-header": "_purpur-tab-header_18g3c_1",
|
|
804
818
|
"purpur-tab-header--contained": "_purpur-tab-header--contained_18g3c_33",
|
|
805
819
|
"purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_18g3c_33",
|
|
806
820
|
"purpur-tab-header--line": "_purpur-tab-header--line_18g3c_36",
|
|
807
821
|
"purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_18g3c_48"
|
|
808
|
-
}, Wt = le.bind(
|
|
822
|
+
}, Wt = le.bind(zt), _e = "purpur-tab-header", Yt = w(
|
|
809
823
|
({
|
|
810
824
|
index: e,
|
|
811
825
|
tabId: t,
|
|
@@ -815,10 +829,10 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
815
829
|
"data-testid": r,
|
|
816
830
|
children: c
|
|
817
831
|
}, a) => /* @__PURE__ */ T(
|
|
818
|
-
|
|
832
|
+
Lt,
|
|
819
833
|
{
|
|
820
834
|
id: `${t}-trigger`,
|
|
821
|
-
className: Wt([
|
|
835
|
+
className: Wt([_e, `${_e}--${n}${o ? "-negative" : ""}`]),
|
|
822
836
|
value: t,
|
|
823
837
|
"data-testid": r,
|
|
824
838
|
"data-index": e,
|
|
@@ -861,7 +875,7 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
861
875
|
value: u,
|
|
862
876
|
...i
|
|
863
877
|
}) => {
|
|
864
|
-
const [p, l] =
|
|
878
|
+
const [p, l] = F({}), [m, _] = F(0), [f, h] = F(0), $ = P.toArray(e).filter(Kt), b = R(), v = R(new Array($.length)), U = 200, y = t === "line", j = q([
|
|
865
879
|
S,
|
|
866
880
|
`${S}--${t}${n ? "-negative" : ""}`,
|
|
867
881
|
{ [`${S}--fullWidth`]: o },
|
|
@@ -873,10 +887,10 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
873
887
|
N(() => {
|
|
874
888
|
u && k($.findIndex((d) => d.props.tabId === u));
|
|
875
889
|
}, [$, u]);
|
|
876
|
-
const [W, k] =
|
|
890
|
+
const [W, k] = F(x);
|
|
877
891
|
if (new Set(V).size !== V.length)
|
|
878
892
|
throw new Error("tabId must be unique");
|
|
879
|
-
const D = (d, I) => I || a ? `${I || a}-${d}` : void 0,
|
|
893
|
+
const D = (d, I) => I || a ? `${I || a}-${d}` : void 0, K = () => {
|
|
880
894
|
if (!y)
|
|
881
895
|
return;
|
|
882
896
|
const d = v.current[W];
|
|
@@ -897,13 +911,13 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
897
911
|
"aria-hidden": "true",
|
|
898
912
|
tabIndex: -1,
|
|
899
913
|
"data-testid": D("scroll-button"),
|
|
900
|
-
children: /* @__PURE__ */ T(
|
|
914
|
+
children: /* @__PURE__ */ T(xe, { svg: d === "left" ? Xe : Je, size: "md" })
|
|
901
915
|
}
|
|
902
916
|
);
|
|
903
|
-
return N(() => (window.addEventListener("resize",
|
|
904
|
-
window.removeEventListener("resize",
|
|
917
|
+
return N(() => (window.addEventListener("resize", K), () => {
|
|
918
|
+
window.removeEventListener("resize", K);
|
|
905
919
|
}), []), N(() => {
|
|
906
|
-
|
|
920
|
+
K();
|
|
907
921
|
}, [W, o, $.length, t]), N(() => {
|
|
908
922
|
const d = (M) => {
|
|
909
923
|
if (M.every((A) => A.isIntersecting) && M.length === $.length) {
|
|
@@ -911,13 +925,13 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
911
925
|
return;
|
|
912
926
|
}
|
|
913
927
|
M.forEach((A) => {
|
|
914
|
-
const be = Number(A.target.getAttribute("data-index")), Fe = be === 0,
|
|
915
|
-
l((
|
|
916
|
-
...
|
|
928
|
+
const be = Number(A.target.getAttribute("data-index")), Fe = be === 0, De = be === $.length - 1;
|
|
929
|
+
l((qe) => ({
|
|
930
|
+
...qe,
|
|
917
931
|
...Fe && {
|
|
918
932
|
[`${S}__wrapper--scroll-end`]: !A.isIntersecting
|
|
919
933
|
},
|
|
920
|
-
...
|
|
934
|
+
...De && {
|
|
921
935
|
[`${S}__wrapper--scroll-start`]: !A.isIntersecting
|
|
922
936
|
}
|
|
923
937
|
}));
|
|
@@ -930,7 +944,7 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
930
944
|
B.forEach((M) => I.unobserve(M));
|
|
931
945
|
};
|
|
932
946
|
}, [$.length]), /* @__PURE__ */ T(
|
|
933
|
-
|
|
947
|
+
Dt,
|
|
934
948
|
{
|
|
935
949
|
defaultValue: c ?? $[0].props.tabId,
|
|
936
950
|
onValueChange: Q,
|
|
@@ -941,7 +955,7 @@ const le = /* @__PURE__ */ Ut(Vt), Bt = {
|
|
|
941
955
|
children: /* @__PURE__ */ ee("div", { className: q(`${S}__container`), children: [
|
|
942
956
|
/* @__PURE__ */ ee("div", { className: q([`${S}__wrapper`, p]), children: [
|
|
943
957
|
/* @__PURE__ */ ee(
|
|
944
|
-
|
|
958
|
+
qt,
|
|
945
959
|
{
|
|
946
960
|
ref: (d) => {
|
|
947
961
|
b.current = d;
|