@purpurds/tabs 8.6.0 → 8.8.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-header.d.ts +1 -0
- package/dist/tab-header.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 +334 -329
- package/dist/tabs.es.js.map +1 -1
- package/package.json +11 -11
- package/src/tab-header.module.scss +4 -0
- package/src/tab-header.tsx +5 -1
- package/src/tabs.module.scss +1 -1
- package/src/tabs.stories.tsx +164 -143
- package/src/tabs.tsx +2 -1
package/dist/tabs.es.js
CHANGED
|
@@ -1,25 +1,25 @@
|
|
|
1
1
|
import { jsx as m, jsxs as ee } from "react/jsx-runtime";
|
|
2
|
-
import * as
|
|
3
|
-
import O, { forwardRef as be, isValidElement as
|
|
2
|
+
import * as a from "react";
|
|
3
|
+
import O, { forwardRef as be, isValidElement as ke, useRef as te, useState as B, Children as z, useEffect as Y } from "react";
|
|
4
4
|
import "react-dom";
|
|
5
|
-
function
|
|
5
|
+
function We(e) {
|
|
6
6
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
7
7
|
}
|
|
8
|
-
var
|
|
8
|
+
var de = { exports: {} };
|
|
9
9
|
/*!
|
|
10
10
|
Copyright (c) 2018 Jed Watson.
|
|
11
11
|
Licensed under the MIT License (MIT), see
|
|
12
12
|
http://jedwatson.github.io/classnames
|
|
13
13
|
*/
|
|
14
|
-
var
|
|
15
|
-
function
|
|
16
|
-
return
|
|
14
|
+
var fe;
|
|
15
|
+
function Ke() {
|
|
16
|
+
return fe || (fe = 1, (function(e) {
|
|
17
17
|
(function() {
|
|
18
18
|
var t = {}.hasOwnProperty;
|
|
19
19
|
function r() {
|
|
20
|
-
for (var n = "",
|
|
21
|
-
var
|
|
22
|
-
|
|
20
|
+
for (var n = "", c = 0; c < arguments.length; c++) {
|
|
21
|
+
var i = arguments[c];
|
|
22
|
+
i && (n = s(n, o.call(this, i)));
|
|
23
23
|
}
|
|
24
24
|
return n;
|
|
25
25
|
}
|
|
@@ -32,20 +32,20 @@ function ze() {
|
|
|
32
32
|
return r.apply(this, n);
|
|
33
33
|
if (n.toString !== Object.prototype.toString && !n.toString.toString().includes("[native code]"))
|
|
34
34
|
return n.toString();
|
|
35
|
-
var
|
|
36
|
-
for (var
|
|
37
|
-
t.call(n,
|
|
38
|
-
return
|
|
35
|
+
var c = "";
|
|
36
|
+
for (var i in n)
|
|
37
|
+
t.call(n, i) && n[i] && (c = s(c, this && this[i] || i));
|
|
38
|
+
return c;
|
|
39
39
|
}
|
|
40
|
-
function s(n,
|
|
41
|
-
return
|
|
40
|
+
function s(n, c) {
|
|
41
|
+
return c ? n ? n + " " + c : n + c : n;
|
|
42
42
|
}
|
|
43
43
|
e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
|
|
44
44
|
})();
|
|
45
|
-
})(
|
|
45
|
+
})(de)), de.exports;
|
|
46
46
|
}
|
|
47
|
-
var
|
|
48
|
-
const
|
|
47
|
+
var qe = Ke();
|
|
48
|
+
const ze = /* @__PURE__ */ We(qe), Ye = {
|
|
49
49
|
"purpur-icon": "_purpur-icon_8u1lq_1",
|
|
50
50
|
"purpur-icon--xxs": "_purpur-icon--xxs_8u1lq_4",
|
|
51
51
|
"purpur-icon--xs": "_purpur-icon--xs_8u1lq_8",
|
|
@@ -53,7 +53,7 @@ const qe = /* @__PURE__ */ ke(Ke), Ye = {
|
|
|
53
53
|
"purpur-icon--md": "_purpur-icon--md_8u1lq_16",
|
|
54
54
|
"purpur-icon--lg": "_purpur-icon--lg_8u1lq_20",
|
|
55
55
|
"purpur-icon--xl": "_purpur-icon--xl_8u1lq_24"
|
|
56
|
-
}, Ze =
|
|
56
|
+
}, Ze = ze.bind(Ye), pe = "purpur-icon", Xe = "md", He = (e) => e.filter((t) => Object.keys(t).length >= 1).map((t) => `${t.name}="${t.value}"`).join(" "), Je = ({ content: e = "", title: t } = {}) => {
|
|
57
57
|
const r = [
|
|
58
58
|
{ name: "xmlns", value: "http://www.w3.org/2000/svg" },
|
|
59
59
|
{ name: "fill", value: "currentColor" },
|
|
@@ -65,8 +65,8 @@ const qe = /* @__PURE__ */ ke(Ke), Ye = {
|
|
|
65
65
|
const n = Je({
|
|
66
66
|
content: Qe(e.svg),
|
|
67
67
|
title: t
|
|
68
|
-
}),
|
|
69
|
-
return /* @__PURE__ */ m("span", { className:
|
|
68
|
+
}), c = Ze(pe, `${pe}--${o}`, r);
|
|
69
|
+
return /* @__PURE__ */ m("span", { className: c, dangerouslySetInnerHTML: { __html: n }, ...s });
|
|
70
70
|
};
|
|
71
71
|
ge.displayName = "Icon";
|
|
72
72
|
const et = {
|
|
@@ -88,31 +88,31 @@ function A(e, t, { checkForDefaultPrevented: r = !0 } = {}) {
|
|
|
88
88
|
}
|
|
89
89
|
function ie(e, t = []) {
|
|
90
90
|
let r = [];
|
|
91
|
-
function o(n,
|
|
92
|
-
const
|
|
93
|
-
r = [...r,
|
|
94
|
-
const
|
|
91
|
+
function o(n, c) {
|
|
92
|
+
const i = a.createContext(c), d = r.length;
|
|
93
|
+
r = [...r, c];
|
|
94
|
+
const u = (f) => {
|
|
95
95
|
var C;
|
|
96
|
-
const { scope:
|
|
97
|
-
return /* @__PURE__ */ m(h.Provider, { value:
|
|
96
|
+
const { scope: v, children: g, ...I } = f, h = ((C = v == null ? void 0 : v[e]) == null ? void 0 : C[d]) || i, _ = a.useMemo(() => I, Object.values(I));
|
|
97
|
+
return /* @__PURE__ */ m(h.Provider, { value: _, children: g });
|
|
98
98
|
};
|
|
99
|
-
|
|
100
|
-
function l(f,
|
|
99
|
+
u.displayName = n + "Provider";
|
|
100
|
+
function l(f, v) {
|
|
101
101
|
var h;
|
|
102
|
-
const g = ((h =
|
|
102
|
+
const g = ((h = v == null ? void 0 : v[e]) == null ? void 0 : h[d]) || i, I = a.useContext(g);
|
|
103
103
|
if (I) return I;
|
|
104
|
-
if (
|
|
104
|
+
if (c !== void 0) return c;
|
|
105
105
|
throw new Error(`\`${f}\` must be used within \`${n}\``);
|
|
106
106
|
}
|
|
107
|
-
return [
|
|
107
|
+
return [u, l];
|
|
108
108
|
}
|
|
109
109
|
const s = () => {
|
|
110
|
-
const n = r.map((
|
|
111
|
-
return function(
|
|
112
|
-
const d = (
|
|
113
|
-
return
|
|
114
|
-
() => ({ [`__scope${e}`]: { ...
|
|
115
|
-
[
|
|
110
|
+
const n = r.map((c) => a.createContext(c));
|
|
111
|
+
return function(i) {
|
|
112
|
+
const d = (i == null ? void 0 : i[e]) || n;
|
|
113
|
+
return a.useMemo(
|
|
114
|
+
() => ({ [`__scope${e}`]: { ...i, [e]: d } }),
|
|
115
|
+
[i, d]
|
|
116
116
|
);
|
|
117
117
|
};
|
|
118
118
|
};
|
|
@@ -127,16 +127,16 @@ function nt(...e) {
|
|
|
127
127
|
scopeName: s.scopeName
|
|
128
128
|
}));
|
|
129
129
|
return function(n) {
|
|
130
|
-
const
|
|
131
|
-
const f = d(n)[`__scope${
|
|
132
|
-
return { ...
|
|
130
|
+
const c = o.reduce((i, { useScope: d, scopeName: u }) => {
|
|
131
|
+
const f = d(n)[`__scope${u}`];
|
|
132
|
+
return { ...i, ...f };
|
|
133
133
|
}, {});
|
|
134
|
-
return
|
|
134
|
+
return a.useMemo(() => ({ [`__scope${t.scopeName}`]: c }), [c]);
|
|
135
135
|
};
|
|
136
136
|
};
|
|
137
137
|
return r.scopeName = t.scopeName, r;
|
|
138
138
|
}
|
|
139
|
-
function
|
|
139
|
+
function me(e, t) {
|
|
140
140
|
if (typeof e == "function")
|
|
141
141
|
return e(t);
|
|
142
142
|
e != null && (e.current = t);
|
|
@@ -145,110 +145,110 @@ function he(...e) {
|
|
|
145
145
|
return (t) => {
|
|
146
146
|
let r = !1;
|
|
147
147
|
const o = e.map((s) => {
|
|
148
|
-
const n =
|
|
148
|
+
const n = me(s, t);
|
|
149
149
|
return !r && typeof n == "function" && (r = !0), n;
|
|
150
150
|
});
|
|
151
151
|
if (r)
|
|
152
152
|
return () => {
|
|
153
153
|
for (let s = 0; s < o.length; s++) {
|
|
154
154
|
const n = o[s];
|
|
155
|
-
typeof n == "function" ? n() :
|
|
155
|
+
typeof n == "function" ? n() : me(e[s], null);
|
|
156
156
|
}
|
|
157
157
|
};
|
|
158
158
|
};
|
|
159
159
|
}
|
|
160
160
|
function X(...e) {
|
|
161
|
-
return
|
|
161
|
+
return a.useCallback(he(...e), e);
|
|
162
162
|
}
|
|
163
163
|
// @__NO_SIDE_EFFECTS__
|
|
164
|
-
function
|
|
165
|
-
const t = /* @__PURE__ */ rt(e), r =
|
|
166
|
-
const { children: n, ...
|
|
164
|
+
function se(e) {
|
|
165
|
+
const t = /* @__PURE__ */ rt(e), r = a.forwardRef((o, s) => {
|
|
166
|
+
const { children: n, ...c } = o, i = a.Children.toArray(n), d = i.find(st);
|
|
167
167
|
if (d) {
|
|
168
|
-
const
|
|
169
|
-
return /* @__PURE__ */ m(t, { ...
|
|
168
|
+
const u = d.props.children, l = i.map((f) => f === d ? a.Children.count(u) > 1 ? a.Children.only(null) : a.isValidElement(u) ? u.props.children : null : f);
|
|
169
|
+
return /* @__PURE__ */ m(t, { ...c, ref: s, children: a.isValidElement(u) ? a.cloneElement(u, void 0, l) : null });
|
|
170
170
|
}
|
|
171
|
-
return /* @__PURE__ */ m(t, { ...
|
|
171
|
+
return /* @__PURE__ */ m(t, { ...c, ref: s, children: n });
|
|
172
172
|
});
|
|
173
173
|
return r.displayName = `${e}.Slot`, r;
|
|
174
174
|
}
|
|
175
175
|
// @__NO_SIDE_EFFECTS__
|
|
176
176
|
function rt(e) {
|
|
177
|
-
const t =
|
|
177
|
+
const t = a.forwardRef((r, o) => {
|
|
178
178
|
const { children: s, ...n } = r;
|
|
179
|
-
if (
|
|
180
|
-
const
|
|
181
|
-
return s.type !==
|
|
179
|
+
if (a.isValidElement(s)) {
|
|
180
|
+
const c = it(s), i = ct(n, s.props);
|
|
181
|
+
return s.type !== a.Fragment && (i.ref = o ? he(o, c) : c), a.cloneElement(s, i);
|
|
182
182
|
}
|
|
183
|
-
return
|
|
183
|
+
return a.Children.count(s) > 1 ? a.Children.only(null) : null;
|
|
184
184
|
});
|
|
185
185
|
return t.displayName = `${e}.SlotClone`, t;
|
|
186
186
|
}
|
|
187
187
|
var ot = Symbol("radix.slottable");
|
|
188
188
|
function st(e) {
|
|
189
|
-
return
|
|
189
|
+
return a.isValidElement(e) && typeof e.type == "function" && "__radixId" in e.type && e.type.__radixId === ot;
|
|
190
190
|
}
|
|
191
|
-
function
|
|
191
|
+
function ct(e, t) {
|
|
192
192
|
const r = { ...t };
|
|
193
193
|
for (const o in t) {
|
|
194
194
|
const s = e[o], n = t[o];
|
|
195
|
-
/^on[A-Z]/.test(o) ? s && n ? r[o] = (...
|
|
196
|
-
const d = n(...
|
|
197
|
-
return s(...
|
|
195
|
+
/^on[A-Z]/.test(o) ? s && n ? r[o] = (...i) => {
|
|
196
|
+
const d = n(...i);
|
|
197
|
+
return s(...i), d;
|
|
198
198
|
} : s && (r[o] = s) : o === "style" ? r[o] = { ...s, ...n } : o === "className" && (r[o] = [s, n].filter(Boolean).join(" "));
|
|
199
199
|
}
|
|
200
200
|
return { ...e, ...r };
|
|
201
201
|
}
|
|
202
|
-
function
|
|
202
|
+
function it(e) {
|
|
203
203
|
var o, s;
|
|
204
204
|
let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, r = t && "isReactWarning" in t && t.isReactWarning;
|
|
205
205
|
return r ? e.ref : (t = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
|
|
206
206
|
}
|
|
207
|
-
function
|
|
207
|
+
function at(e) {
|
|
208
208
|
const t = e + "CollectionProvider", [r, o] = ie(t), [s, n] = r(
|
|
209
209
|
t,
|
|
210
210
|
{ collectionRef: { current: null }, itemMap: /* @__PURE__ */ new Map() }
|
|
211
|
-
),
|
|
212
|
-
const { scope:
|
|
213
|
-
return /* @__PURE__ */ m(s, { scope:
|
|
211
|
+
), c = (h) => {
|
|
212
|
+
const { scope: _, children: C } = h, N = O.useRef(null), w = O.useRef(/* @__PURE__ */ new Map()).current;
|
|
213
|
+
return /* @__PURE__ */ m(s, { scope: _, itemMap: w, collectionRef: N, children: C });
|
|
214
214
|
};
|
|
215
|
-
|
|
216
|
-
const
|
|
217
|
-
(h,
|
|
218
|
-
const { scope: C, children: N } = h, w = n(
|
|
215
|
+
c.displayName = t;
|
|
216
|
+
const i = e + "CollectionSlot", d = /* @__PURE__ */ se(i), u = O.forwardRef(
|
|
217
|
+
(h, _) => {
|
|
218
|
+
const { scope: C, children: N } = h, w = n(i, C), b = X(_, w.collectionRef);
|
|
219
219
|
return /* @__PURE__ */ m(d, { ref: b, children: N });
|
|
220
220
|
}
|
|
221
221
|
);
|
|
222
|
-
|
|
223
|
-
const l = e + "CollectionItemSlot", f = "data-radix-collection-item",
|
|
224
|
-
(h,
|
|
225
|
-
const { scope: C, children: N, ...w } = h, b = O.useRef(null), R = X(
|
|
226
|
-
return O.useEffect(() => (x.itemMap.set(b, { ref: b, ...w }), () => void x.itemMap.delete(b))), /* @__PURE__ */ m(
|
|
222
|
+
u.displayName = i;
|
|
223
|
+
const l = e + "CollectionItemSlot", f = "data-radix-collection-item", v = /* @__PURE__ */ se(l), g = O.forwardRef(
|
|
224
|
+
(h, _) => {
|
|
225
|
+
const { scope: C, children: N, ...w } = h, b = O.useRef(null), R = X(_, b), x = n(l, C);
|
|
226
|
+
return O.useEffect(() => (x.itemMap.set(b, { ref: b, ...w }), () => void x.itemMap.delete(b))), /* @__PURE__ */ m(v, { [f]: "", ref: R, children: N });
|
|
227
227
|
}
|
|
228
228
|
);
|
|
229
229
|
g.displayName = l;
|
|
230
230
|
function I(h) {
|
|
231
|
-
const
|
|
231
|
+
const _ = n(e + "CollectionConsumer", h);
|
|
232
232
|
return O.useCallback(() => {
|
|
233
|
-
const N =
|
|
233
|
+
const N = _.collectionRef.current;
|
|
234
234
|
if (!N) return [];
|
|
235
235
|
const w = Array.from(N.querySelectorAll(`[${f}]`));
|
|
236
|
-
return Array.from(
|
|
237
|
-
(x,
|
|
236
|
+
return Array.from(_.itemMap.values()).sort(
|
|
237
|
+
(x, P) => w.indexOf(x.ref.current) - w.indexOf(P.ref.current)
|
|
238
238
|
);
|
|
239
|
-
}, [
|
|
239
|
+
}, [_.collectionRef, _.itemMap]);
|
|
240
240
|
}
|
|
241
241
|
return [
|
|
242
|
-
{ Provider:
|
|
242
|
+
{ Provider: c, Slot: u, ItemSlot: g },
|
|
243
243
|
I,
|
|
244
244
|
o
|
|
245
245
|
];
|
|
246
246
|
}
|
|
247
|
-
var H = globalThis != null && globalThis.document ?
|
|
248
|
-
},
|
|
247
|
+
var H = globalThis != null && globalThis.document ? a.useLayoutEffect : () => {
|
|
248
|
+
}, ut = a[" useId ".trim().toString()] || (() => {
|
|
249
249
|
}), lt = 0;
|
|
250
250
|
function we(e) {
|
|
251
|
-
const [t, r] =
|
|
251
|
+
const [t, r] = a.useState(ut());
|
|
252
252
|
return H(() => {
|
|
253
253
|
r((o) => o ?? String(lt++));
|
|
254
254
|
}, [e]), t ? `radix-${t}` : "";
|
|
@@ -271,23 +271,23 @@ var dt = [
|
|
|
271
271
|
"span",
|
|
272
272
|
"svg",
|
|
273
273
|
"ul"
|
|
274
|
-
],
|
|
275
|
-
const r = /* @__PURE__ */
|
|
276
|
-
const { asChild:
|
|
277
|
-
return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(d, { ...
|
|
274
|
+
], j = dt.reduce((e, t) => {
|
|
275
|
+
const r = /* @__PURE__ */ se(`Primitive.${t}`), o = a.forwardRef((s, n) => {
|
|
276
|
+
const { asChild: c, ...i } = s, d = c ? r : t;
|
|
277
|
+
return typeof window < "u" && (window[Symbol.for("radix-ui")] = !0), /* @__PURE__ */ m(d, { ...i, ref: n });
|
|
278
278
|
});
|
|
279
279
|
return o.displayName = `Primitive.${t}`, { ...e, [t]: o };
|
|
280
280
|
}, {});
|
|
281
281
|
function ft(e) {
|
|
282
|
-
const t =
|
|
283
|
-
return
|
|
282
|
+
const t = a.useRef(e);
|
|
283
|
+
return a.useEffect(() => {
|
|
284
284
|
t.current = e;
|
|
285
|
-
}),
|
|
285
|
+
}), a.useMemo(() => (...r) => {
|
|
286
286
|
var o;
|
|
287
287
|
return (o = t.current) == null ? void 0 : o.call(t, ...r);
|
|
288
288
|
}, []);
|
|
289
289
|
}
|
|
290
|
-
var pt =
|
|
290
|
+
var pt = a[" useInsertionEffect ".trim().toString()] || H;
|
|
291
291
|
function Ce({
|
|
292
292
|
prop: e,
|
|
293
293
|
defaultProp: t,
|
|
@@ -295,79 +295,79 @@ function Ce({
|
|
|
295
295
|
},
|
|
296
296
|
caller: o
|
|
297
297
|
}) {
|
|
298
|
-
const [s, n,
|
|
298
|
+
const [s, n, c] = mt({
|
|
299
299
|
defaultProp: t,
|
|
300
300
|
onChange: r
|
|
301
|
-
}),
|
|
301
|
+
}), i = e !== void 0, d = i ? e : s;
|
|
302
302
|
{
|
|
303
|
-
const l =
|
|
304
|
-
|
|
303
|
+
const l = a.useRef(e !== void 0);
|
|
304
|
+
a.useEffect(() => {
|
|
305
305
|
const f = l.current;
|
|
306
|
-
f !==
|
|
307
|
-
`${o} is changing from ${f ? "controlled" : "uncontrolled"} to ${
|
|
308
|
-
), l.current =
|
|
309
|
-
}, [
|
|
306
|
+
f !== i && console.warn(
|
|
307
|
+
`${o} is changing from ${f ? "controlled" : "uncontrolled"} to ${i ? "controlled" : "uncontrolled"}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
|
|
308
|
+
), l.current = i;
|
|
309
|
+
}, [i, o]);
|
|
310
310
|
}
|
|
311
|
-
const
|
|
311
|
+
const u = a.useCallback(
|
|
312
312
|
(l) => {
|
|
313
313
|
var f;
|
|
314
|
-
if (
|
|
315
|
-
const
|
|
316
|
-
|
|
314
|
+
if (i) {
|
|
315
|
+
const v = vt(l) ? l(e) : l;
|
|
316
|
+
v !== e && ((f = c.current) == null || f.call(c, v));
|
|
317
317
|
} else
|
|
318
318
|
n(l);
|
|
319
319
|
},
|
|
320
|
-
[
|
|
320
|
+
[i, e, n, c]
|
|
321
321
|
);
|
|
322
|
-
return [d,
|
|
322
|
+
return [d, u];
|
|
323
323
|
}
|
|
324
324
|
function mt({
|
|
325
325
|
defaultProp: e,
|
|
326
326
|
onChange: t
|
|
327
327
|
}) {
|
|
328
|
-
const [r, o] =
|
|
328
|
+
const [r, o] = a.useState(e), s = a.useRef(r), n = a.useRef(t);
|
|
329
329
|
return pt(() => {
|
|
330
330
|
n.current = t;
|
|
331
|
-
}, [t]),
|
|
332
|
-
var
|
|
333
|
-
s.current !== r && ((
|
|
331
|
+
}, [t]), a.useEffect(() => {
|
|
332
|
+
var c;
|
|
333
|
+
s.current !== r && ((c = n.current) == null || c.call(n, r), s.current = r);
|
|
334
334
|
}, [r, s]), [r, o, n];
|
|
335
335
|
}
|
|
336
|
-
function
|
|
336
|
+
function vt(e) {
|
|
337
337
|
return typeof e == "function";
|
|
338
338
|
}
|
|
339
|
-
var
|
|
339
|
+
var _t = a.createContext(void 0);
|
|
340
340
|
function Se(e) {
|
|
341
|
-
const t =
|
|
341
|
+
const t = a.useContext(_t);
|
|
342
342
|
return e || t || "ltr";
|
|
343
343
|
}
|
|
344
|
-
var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 },
|
|
345
|
-
|
|
344
|
+
var ne = "rovingFocusGroup.onEntryFocus", bt = { bubbles: !1, cancelable: !0 }, U = "RovingFocusGroup", [ce, ye, gt] = at(U), [ht, Ie] = ie(
|
|
345
|
+
U,
|
|
346
346
|
[gt]
|
|
347
|
-
), [wt, Ct] = ht(
|
|
348
|
-
(e, t) => /* @__PURE__ */ m(
|
|
347
|
+
), [wt, Ct] = ht(U), Re = a.forwardRef(
|
|
348
|
+
(e, t) => /* @__PURE__ */ m(ce.Provider, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(ce.Slot, { scope: e.__scopeRovingFocusGroup, children: /* @__PURE__ */ m(St, { ...e, ref: t }) }) })
|
|
349
349
|
);
|
|
350
|
-
Re.displayName =
|
|
351
|
-
var St =
|
|
350
|
+
Re.displayName = U;
|
|
351
|
+
var St = a.forwardRef((e, t) => {
|
|
352
352
|
const {
|
|
353
353
|
__scopeRovingFocusGroup: r,
|
|
354
354
|
orientation: o,
|
|
355
355
|
loop: s = !1,
|
|
356
356
|
dir: n,
|
|
357
|
-
currentTabStopId:
|
|
358
|
-
defaultCurrentTabStopId:
|
|
357
|
+
currentTabStopId: c,
|
|
358
|
+
defaultCurrentTabStopId: i,
|
|
359
359
|
onCurrentTabStopIdChange: d,
|
|
360
|
-
onEntryFocus:
|
|
360
|
+
onEntryFocus: u,
|
|
361
361
|
preventScrollOnEntryFocus: l = !1,
|
|
362
362
|
...f
|
|
363
|
-
} = e,
|
|
364
|
-
prop:
|
|
365
|
-
defaultProp:
|
|
363
|
+
} = e, v = a.useRef(null), g = X(t, v), I = Se(n), [h, _] = Ce({
|
|
364
|
+
prop: c,
|
|
365
|
+
defaultProp: i ?? null,
|
|
366
366
|
onChange: d,
|
|
367
|
-
caller:
|
|
368
|
-
}), [C, N] =
|
|
369
|
-
return
|
|
370
|
-
const y =
|
|
367
|
+
caller: U
|
|
368
|
+
}), [C, N] = a.useState(!1), w = ft(u), b = ye(r), R = a.useRef(!1), [x, P] = a.useState(0);
|
|
369
|
+
return a.useEffect(() => {
|
|
370
|
+
const y = v.current;
|
|
371
371
|
if (y)
|
|
372
372
|
return y.addEventListener(ne, w), () => y.removeEventListener(ne, w);
|
|
373
373
|
}, [w]), /* @__PURE__ */ m(
|
|
@@ -378,21 +378,21 @@ var St = u.forwardRef((e, t) => {
|
|
|
378
378
|
dir: I,
|
|
379
379
|
loop: s,
|
|
380
380
|
currentTabStopId: h,
|
|
381
|
-
onItemFocus:
|
|
382
|
-
(y) =>
|
|
383
|
-
[
|
|
381
|
+
onItemFocus: a.useCallback(
|
|
382
|
+
(y) => _(y),
|
|
383
|
+
[_]
|
|
384
384
|
),
|
|
385
|
-
onItemShiftTab:
|
|
386
|
-
onFocusableItemAdd:
|
|
387
|
-
() =>
|
|
385
|
+
onItemShiftTab: a.useCallback(() => N(!0), []),
|
|
386
|
+
onFocusableItemAdd: a.useCallback(
|
|
387
|
+
() => P((y) => y + 1),
|
|
388
388
|
[]
|
|
389
389
|
),
|
|
390
|
-
onFocusableItemRemove:
|
|
391
|
-
() =>
|
|
390
|
+
onFocusableItemRemove: a.useCallback(
|
|
391
|
+
() => P((y) => y - 1),
|
|
392
392
|
[]
|
|
393
393
|
),
|
|
394
394
|
children: /* @__PURE__ */ m(
|
|
395
|
-
|
|
395
|
+
j.div,
|
|
396
396
|
{
|
|
397
397
|
tabIndex: C || x === 0 ? -1 : 0,
|
|
398
398
|
"data-orientation": o,
|
|
@@ -407,10 +407,10 @@ var St = u.forwardRef((e, t) => {
|
|
|
407
407
|
if (y.target === y.currentTarget && Q && !C) {
|
|
408
408
|
const F = new CustomEvent(ne, bt);
|
|
409
409
|
if (y.currentTarget.dispatchEvent(F), !F.defaultPrevented) {
|
|
410
|
-
const
|
|
410
|
+
const L = b().filter((E) => E.focusable), V = L.find((E) => E.active), G = L.find((E) => E.id === h), W = [V, G, ...L].filter(
|
|
411
411
|
Boolean
|
|
412
412
|
).map((E) => E.ref.current);
|
|
413
|
-
xe(
|
|
413
|
+
xe(W, l);
|
|
414
414
|
}
|
|
415
415
|
}
|
|
416
416
|
R.current = !1;
|
|
@@ -420,58 +420,58 @@ var St = u.forwardRef((e, t) => {
|
|
|
420
420
|
)
|
|
421
421
|
}
|
|
422
422
|
);
|
|
423
|
-
}), Ne = "RovingFocusGroupItem", Te =
|
|
423
|
+
}), Ne = "RovingFocusGroupItem", Te = a.forwardRef(
|
|
424
424
|
(e, t) => {
|
|
425
425
|
const {
|
|
426
426
|
__scopeRovingFocusGroup: r,
|
|
427
427
|
focusable: o = !0,
|
|
428
428
|
active: s = !1,
|
|
429
429
|
tabStopId: n,
|
|
430
|
-
children:
|
|
431
|
-
...
|
|
432
|
-
} = e, d = we(),
|
|
433
|
-
return
|
|
430
|
+
children: c,
|
|
431
|
+
...i
|
|
432
|
+
} = e, d = we(), u = n || d, l = Ct(Ne, r), f = l.currentTabStopId === u, v = ye(r), { onFocusableItemAdd: g, onFocusableItemRemove: I, currentTabStopId: h } = l;
|
|
433
|
+
return a.useEffect(() => {
|
|
434
434
|
if (o)
|
|
435
435
|
return g(), () => I();
|
|
436
436
|
}, [o, g, I]), /* @__PURE__ */ m(
|
|
437
|
-
|
|
437
|
+
ce.ItemSlot,
|
|
438
438
|
{
|
|
439
439
|
scope: r,
|
|
440
|
-
id:
|
|
440
|
+
id: u,
|
|
441
441
|
focusable: o,
|
|
442
442
|
active: s,
|
|
443
443
|
children: /* @__PURE__ */ m(
|
|
444
|
-
|
|
444
|
+
j.span,
|
|
445
445
|
{
|
|
446
446
|
tabIndex: f ? 0 : -1,
|
|
447
447
|
"data-orientation": l.orientation,
|
|
448
|
-
...
|
|
448
|
+
...i,
|
|
449
449
|
ref: t,
|
|
450
|
-
onMouseDown: A(e.onMouseDown, (
|
|
451
|
-
o ? l.onItemFocus(
|
|
450
|
+
onMouseDown: A(e.onMouseDown, (_) => {
|
|
451
|
+
o ? l.onItemFocus(u) : _.preventDefault();
|
|
452
452
|
}),
|
|
453
|
-
onFocus: A(e.onFocus, () => l.onItemFocus(
|
|
454
|
-
onKeyDown: A(e.onKeyDown, (
|
|
455
|
-
if (
|
|
453
|
+
onFocus: A(e.onFocus, () => l.onItemFocus(u)),
|
|
454
|
+
onKeyDown: A(e.onKeyDown, (_) => {
|
|
455
|
+
if (_.key === "Tab" && _.shiftKey) {
|
|
456
456
|
l.onItemShiftTab();
|
|
457
457
|
return;
|
|
458
458
|
}
|
|
459
|
-
if (
|
|
460
|
-
const C = Rt(
|
|
459
|
+
if (_.target !== _.currentTarget) return;
|
|
460
|
+
const C = Rt(_, l.orientation, l.dir);
|
|
461
461
|
if (C !== void 0) {
|
|
462
|
-
if (
|
|
463
|
-
|
|
464
|
-
let w =
|
|
462
|
+
if (_.metaKey || _.ctrlKey || _.altKey || _.shiftKey) return;
|
|
463
|
+
_.preventDefault();
|
|
464
|
+
let w = v().filter((b) => b.focusable).map((b) => b.ref.current);
|
|
465
465
|
if (C === "last") w.reverse();
|
|
466
466
|
else if (C === "prev" || C === "next") {
|
|
467
467
|
C === "prev" && w.reverse();
|
|
468
|
-
const b = w.indexOf(
|
|
468
|
+
const b = w.indexOf(_.currentTarget);
|
|
469
469
|
w = l.loop ? Nt(w, b + 1) : w.slice(b + 1);
|
|
470
470
|
}
|
|
471
471
|
setTimeout(() => xe(w));
|
|
472
472
|
}
|
|
473
473
|
}),
|
|
474
|
-
children: typeof
|
|
474
|
+
children: typeof c == "function" ? c({ isCurrentTabStop: f, hasTabStop: h != null }) : c
|
|
475
475
|
}
|
|
476
476
|
)
|
|
477
477
|
}
|
|
@@ -507,15 +507,15 @@ function Nt(e, t) {
|
|
|
507
507
|
}
|
|
508
508
|
var Tt = Re, xt = Te;
|
|
509
509
|
function Et(e, t) {
|
|
510
|
-
return
|
|
510
|
+
return a.useReducer((r, o) => t[r][o] ?? r, e);
|
|
511
511
|
}
|
|
512
512
|
var Ee = (e) => {
|
|
513
|
-
const { present: t, children: r } = e, o = At(t), s = typeof r == "function" ? r({ present: o.isPresent }) :
|
|
514
|
-
return typeof r == "function" || o.isPresent ?
|
|
513
|
+
const { present: t, children: r } = e, o = At(t), s = typeof r == "function" ? r({ present: o.isPresent }) : a.Children.only(r), n = X(o.ref, $t(s));
|
|
514
|
+
return typeof r == "function" || o.isPresent ? a.cloneElement(s, { ref: n }) : null;
|
|
515
515
|
};
|
|
516
516
|
Ee.displayName = "Presence";
|
|
517
517
|
function At(e) {
|
|
518
|
-
const [t, r] =
|
|
518
|
+
const [t, r] = a.useState(), o = a.useRef(null), s = a.useRef(e), n = a.useRef("none"), c = e ? "mounted" : "unmounted", [i, d] = Et(c, {
|
|
519
519
|
mounted: {
|
|
520
520
|
UNMOUNT: "unmounted",
|
|
521
521
|
ANIMATION_OUT: "unmountSuspended"
|
|
@@ -528,84 +528,84 @@ function At(e) {
|
|
|
528
528
|
MOUNT: "mounted"
|
|
529
529
|
}
|
|
530
530
|
});
|
|
531
|
-
return
|
|
532
|
-
const
|
|
533
|
-
n.current =
|
|
534
|
-
}, [
|
|
535
|
-
const
|
|
531
|
+
return a.useEffect(() => {
|
|
532
|
+
const u = Z(o.current);
|
|
533
|
+
n.current = i === "mounted" ? u : "none";
|
|
534
|
+
}, [i]), H(() => {
|
|
535
|
+
const u = o.current, l = s.current;
|
|
536
536
|
if (l !== e) {
|
|
537
|
-
const
|
|
538
|
-
e ? d("MOUNT") : g === "none" || (
|
|
537
|
+
const v = n.current, g = Z(u);
|
|
538
|
+
e ? d("MOUNT") : g === "none" || (u == null ? void 0 : u.display) === "none" ? d("UNMOUNT") : d(l && v !== g ? "ANIMATION_OUT" : "UNMOUNT"), s.current = e;
|
|
539
539
|
}
|
|
540
540
|
}, [e, d]), H(() => {
|
|
541
541
|
if (t) {
|
|
542
|
-
let
|
|
542
|
+
let u;
|
|
543
543
|
const l = t.ownerDocument.defaultView ?? window, f = (g) => {
|
|
544
544
|
const h = Z(o.current).includes(CSS.escape(g.animationName));
|
|
545
545
|
if (g.target === t && h && (d("ANIMATION_END"), !s.current)) {
|
|
546
|
-
const
|
|
547
|
-
t.style.animationFillMode = "forwards",
|
|
548
|
-
t.style.animationFillMode === "forwards" && (t.style.animationFillMode =
|
|
546
|
+
const _ = t.style.animationFillMode;
|
|
547
|
+
t.style.animationFillMode = "forwards", u = l.setTimeout(() => {
|
|
548
|
+
t.style.animationFillMode === "forwards" && (t.style.animationFillMode = _);
|
|
549
549
|
});
|
|
550
550
|
}
|
|
551
|
-
},
|
|
551
|
+
}, v = (g) => {
|
|
552
552
|
g.target === t && (n.current = Z(o.current));
|
|
553
553
|
};
|
|
554
|
-
return t.addEventListener("animationstart",
|
|
555
|
-
l.clearTimeout(
|
|
554
|
+
return t.addEventListener("animationstart", v), t.addEventListener("animationcancel", f), t.addEventListener("animationend", f), () => {
|
|
555
|
+
l.clearTimeout(u), t.removeEventListener("animationstart", v), t.removeEventListener("animationcancel", f), t.removeEventListener("animationend", f);
|
|
556
556
|
};
|
|
557
557
|
} else
|
|
558
558
|
d("ANIMATION_END");
|
|
559
559
|
}, [t, d]), {
|
|
560
|
-
isPresent: ["mounted", "unmountSuspended"].includes(
|
|
561
|
-
ref:
|
|
562
|
-
o.current =
|
|
560
|
+
isPresent: ["mounted", "unmountSuspended"].includes(i),
|
|
561
|
+
ref: a.useCallback((u) => {
|
|
562
|
+
o.current = u ? getComputedStyle(u) : null, r(u);
|
|
563
563
|
}, [])
|
|
564
564
|
};
|
|
565
565
|
}
|
|
566
566
|
function Z(e) {
|
|
567
567
|
return (e == null ? void 0 : e.animationName) || "none";
|
|
568
568
|
}
|
|
569
|
-
function
|
|
569
|
+
function $t(e) {
|
|
570
570
|
var o, s;
|
|
571
571
|
let t = (o = Object.getOwnPropertyDescriptor(e.props, "ref")) == null ? void 0 : o.get, r = t && "isReactWarning" in t && t.isReactWarning;
|
|
572
572
|
return r ? e.ref : (t = (s = Object.getOwnPropertyDescriptor(e, "ref")) == null ? void 0 : s.get, r = t && "isReactWarning" in t && t.isReactWarning, r ? e.props.ref : e.props.ref || e.ref);
|
|
573
573
|
}
|
|
574
|
-
var J = "Tabs", [
|
|
574
|
+
var J = "Tabs", [Mt] = ie(J, [
|
|
575
575
|
Ie
|
|
576
|
-
]), Ae = Ie(), [
|
|
576
|
+
]), Ae = Ie(), [Pt, ae] = Mt(J), $e = a.forwardRef(
|
|
577
577
|
(e, t) => {
|
|
578
578
|
const {
|
|
579
579
|
__scopeTabs: r,
|
|
580
580
|
value: o,
|
|
581
581
|
onValueChange: s,
|
|
582
582
|
defaultValue: n,
|
|
583
|
-
orientation:
|
|
584
|
-
dir:
|
|
583
|
+
orientation: c = "horizontal",
|
|
584
|
+
dir: i,
|
|
585
585
|
activationMode: d = "automatic",
|
|
586
|
-
...
|
|
587
|
-
} = e, l = Se(
|
|
586
|
+
...u
|
|
587
|
+
} = e, l = Se(i), [f, v] = Ce({
|
|
588
588
|
prop: o,
|
|
589
589
|
onChange: s,
|
|
590
590
|
defaultProp: n ?? "",
|
|
591
591
|
caller: J
|
|
592
592
|
});
|
|
593
593
|
return /* @__PURE__ */ m(
|
|
594
|
-
|
|
594
|
+
Pt,
|
|
595
595
|
{
|
|
596
596
|
scope: r,
|
|
597
597
|
baseId: we(),
|
|
598
598
|
value: f,
|
|
599
|
-
onValueChange:
|
|
600
|
-
orientation:
|
|
599
|
+
onValueChange: v,
|
|
600
|
+
orientation: c,
|
|
601
601
|
dir: l,
|
|
602
602
|
activationMode: d,
|
|
603
603
|
children: /* @__PURE__ */ m(
|
|
604
|
-
|
|
604
|
+
j.div,
|
|
605
605
|
{
|
|
606
606
|
dir: l,
|
|
607
|
-
"data-orientation":
|
|
608
|
-
...
|
|
607
|
+
"data-orientation": c,
|
|
608
|
+
...u,
|
|
609
609
|
ref: t
|
|
610
610
|
}
|
|
611
611
|
)
|
|
@@ -613,20 +613,20 @@ var J = "Tabs", [Pt] = ie(J, [
|
|
|
613
613
|
);
|
|
614
614
|
}
|
|
615
615
|
);
|
|
616
|
-
|
|
617
|
-
var
|
|
616
|
+
$e.displayName = J;
|
|
617
|
+
var Me = "TabsList", Pe = a.forwardRef(
|
|
618
618
|
(e, t) => {
|
|
619
|
-
const { __scopeTabs: r, loop: o = !0, ...s } = e, n =
|
|
619
|
+
const { __scopeTabs: r, loop: o = !0, ...s } = e, n = ae(Me, r), c = Ae(r);
|
|
620
620
|
return /* @__PURE__ */ m(
|
|
621
621
|
Tt,
|
|
622
622
|
{
|
|
623
623
|
asChild: !0,
|
|
624
|
-
...
|
|
624
|
+
...c,
|
|
625
625
|
orientation: n.orientation,
|
|
626
626
|
dir: n.dir,
|
|
627
627
|
loop: o,
|
|
628
628
|
children: /* @__PURE__ */ m(
|
|
629
|
-
|
|
629
|
+
j.div,
|
|
630
630
|
{
|
|
631
631
|
role: "tablist",
|
|
632
632
|
"aria-orientation": n.orientation,
|
|
@@ -638,24 +638,24 @@ var Pe = "TabsList", $e = u.forwardRef(
|
|
|
638
638
|
);
|
|
639
639
|
}
|
|
640
640
|
);
|
|
641
|
-
|
|
642
|
-
var Oe = "TabsTrigger", Fe =
|
|
641
|
+
Pe.displayName = Me;
|
|
642
|
+
var Oe = "TabsTrigger", Fe = a.forwardRef(
|
|
643
643
|
(e, t) => {
|
|
644
|
-
const { __scopeTabs: r, value: o, disabled: s = !1, ...n } = e,
|
|
644
|
+
const { __scopeTabs: r, value: o, disabled: s = !1, ...n } = e, c = ae(Oe, r), i = Ae(r), d = Le(c.baseId, o), u = Ve(c.baseId, o), l = o === c.value;
|
|
645
645
|
return /* @__PURE__ */ m(
|
|
646
646
|
xt,
|
|
647
647
|
{
|
|
648
648
|
asChild: !0,
|
|
649
|
-
...
|
|
649
|
+
...i,
|
|
650
650
|
focusable: !s,
|
|
651
651
|
active: l,
|
|
652
652
|
children: /* @__PURE__ */ m(
|
|
653
|
-
|
|
653
|
+
j.button,
|
|
654
654
|
{
|
|
655
655
|
type: "button",
|
|
656
656
|
role: "tab",
|
|
657
657
|
"aria-selected": l,
|
|
658
|
-
"aria-controls":
|
|
658
|
+
"aria-controls": u,
|
|
659
659
|
"data-state": l ? "active" : "inactive",
|
|
660
660
|
"data-disabled": s ? "" : void 0,
|
|
661
661
|
disabled: s,
|
|
@@ -663,14 +663,14 @@ var Oe = "TabsTrigger", Fe = u.forwardRef(
|
|
|
663
663
|
...n,
|
|
664
664
|
ref: t,
|
|
665
665
|
onMouseDown: A(e.onMouseDown, (f) => {
|
|
666
|
-
!s && f.button === 0 && f.ctrlKey === !1 ?
|
|
666
|
+
!s && f.button === 0 && f.ctrlKey === !1 ? c.onValueChange(o) : f.preventDefault();
|
|
667
667
|
}),
|
|
668
668
|
onKeyDown: A(e.onKeyDown, (f) => {
|
|
669
|
-
[" ", "Enter"].includes(f.key) &&
|
|
669
|
+
[" ", "Enter"].includes(f.key) && c.onValueChange(o);
|
|
670
670
|
}),
|
|
671
671
|
onFocus: A(e.onFocus, () => {
|
|
672
|
-
const f =
|
|
673
|
-
!l && !s && f &&
|
|
672
|
+
const f = c.activationMode !== "manual";
|
|
673
|
+
!l && !s && f && c.onValueChange(o);
|
|
674
674
|
})
|
|
675
675
|
}
|
|
676
676
|
)
|
|
@@ -679,42 +679,42 @@ var Oe = "TabsTrigger", Fe = u.forwardRef(
|
|
|
679
679
|
}
|
|
680
680
|
);
|
|
681
681
|
Fe.displayName = Oe;
|
|
682
|
-
var De = "TabsContent",
|
|
682
|
+
var De = "TabsContent", je = a.forwardRef(
|
|
683
683
|
(e, t) => {
|
|
684
|
-
const { __scopeTabs: r, value: o, forceMount: s, children: n, ...
|
|
685
|
-
return
|
|
686
|
-
const
|
|
687
|
-
return () => cancelAnimationFrame(
|
|
688
|
-
}, []), /* @__PURE__ */ m(Ee, { present: s || l, children: ({ present:
|
|
689
|
-
|
|
684
|
+
const { __scopeTabs: r, value: o, forceMount: s, children: n, ...c } = e, i = ae(De, r), d = Le(i.baseId, o), u = Ve(i.baseId, o), l = o === i.value, f = a.useRef(l);
|
|
685
|
+
return a.useEffect(() => {
|
|
686
|
+
const v = requestAnimationFrame(() => f.current = !1);
|
|
687
|
+
return () => cancelAnimationFrame(v);
|
|
688
|
+
}, []), /* @__PURE__ */ m(Ee, { present: s || l, children: ({ present: v }) => /* @__PURE__ */ m(
|
|
689
|
+
j.div,
|
|
690
690
|
{
|
|
691
691
|
"data-state": l ? "active" : "inactive",
|
|
692
|
-
"data-orientation":
|
|
692
|
+
"data-orientation": i.orientation,
|
|
693
693
|
role: "tabpanel",
|
|
694
694
|
"aria-labelledby": d,
|
|
695
|
-
hidden: !
|
|
696
|
-
id:
|
|
695
|
+
hidden: !v,
|
|
696
|
+
id: u,
|
|
697
697
|
tabIndex: 0,
|
|
698
|
-
...
|
|
698
|
+
...c,
|
|
699
699
|
ref: t,
|
|
700
700
|
style: {
|
|
701
701
|
...e.style,
|
|
702
702
|
animationDuration: f.current ? "0s" : void 0
|
|
703
703
|
},
|
|
704
|
-
children:
|
|
704
|
+
children: v && n
|
|
705
705
|
}
|
|
706
706
|
) });
|
|
707
707
|
}
|
|
708
708
|
);
|
|
709
|
-
|
|
710
|
-
function
|
|
709
|
+
je.displayName = De;
|
|
710
|
+
function Le(e, t) {
|
|
711
711
|
return `${e}-trigger-${t}`;
|
|
712
712
|
}
|
|
713
|
-
function
|
|
713
|
+
function Ve(e, t) {
|
|
714
714
|
return `${e}-content-${t}`;
|
|
715
715
|
}
|
|
716
|
-
var Ot =
|
|
717
|
-
function
|
|
716
|
+
var Ot = $e, Ft = Pe, Dt = Fe, jt = je;
|
|
717
|
+
function Lt(e) {
|
|
718
718
|
return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
|
|
719
719
|
}
|
|
720
720
|
var re = { exports: {} };
|
|
@@ -723,15 +723,15 @@ var re = { exports: {} };
|
|
|
723
723
|
Licensed under the MIT License (MIT), see
|
|
724
724
|
http://jedwatson.github.io/classnames
|
|
725
725
|
*/
|
|
726
|
-
var
|
|
727
|
-
function
|
|
728
|
-
return
|
|
726
|
+
var ve;
|
|
727
|
+
function Vt() {
|
|
728
|
+
return ve || (ve = 1, (function(e) {
|
|
729
729
|
(function() {
|
|
730
730
|
var t = {}.hasOwnProperty;
|
|
731
731
|
function r() {
|
|
732
|
-
for (var n = "",
|
|
733
|
-
var
|
|
734
|
-
|
|
732
|
+
for (var n = "", c = 0; c < arguments.length; c++) {
|
|
733
|
+
var i = arguments[c];
|
|
734
|
+
i && (n = s(n, o.call(this, i)));
|
|
735
735
|
}
|
|
736
736
|
return n;
|
|
737
737
|
}
|
|
@@ -744,28 +744,28 @@ function Bt() {
|
|
|
744
744
|
return r.apply(this, n);
|
|
745
745
|
if (n.toString !== Object.prototype.toString && !n.toString.toString().includes("[native code]"))
|
|
746
746
|
return n.toString();
|
|
747
|
-
var
|
|
748
|
-
for (var
|
|
749
|
-
t.call(n,
|
|
750
|
-
return
|
|
747
|
+
var c = "";
|
|
748
|
+
for (var i in n)
|
|
749
|
+
t.call(n, i) && n[i] && (c = s(c, this && this[i] || i));
|
|
750
|
+
return c;
|
|
751
751
|
}
|
|
752
|
-
function s(n,
|
|
753
|
-
return
|
|
752
|
+
function s(n, c) {
|
|
753
|
+
return c ? n ? n + " " + c : n + c : n;
|
|
754
754
|
}
|
|
755
755
|
e.exports ? (r.default = r, e.exports = r) : window.classNames = r;
|
|
756
756
|
})();
|
|
757
757
|
})(re)), re.exports;
|
|
758
758
|
}
|
|
759
|
-
var
|
|
760
|
-
const ue = /* @__PURE__ */
|
|
759
|
+
var Bt = Vt();
|
|
760
|
+
const ue = /* @__PURE__ */ Lt(Bt), Ut = {
|
|
761
761
|
"purpur-tab-content": "_purpur-tab-content_1ugbi_1",
|
|
762
762
|
"purpur-tab-content--force-mount": "_purpur-tab-content--force-mount_1ugbi_15"
|
|
763
|
-
},
|
|
764
|
-
({ children: e, tabId: t, "data-testid": r, className: o, disableForceMount: s, ...n },
|
|
765
|
-
|
|
763
|
+
}, Gt = ue.bind(Ut), _e = "purpur-tab-content", kt = be(
|
|
764
|
+
({ children: e, tabId: t, "data-testid": r, className: o, disableForceMount: s, ...n }, c) => /* @__PURE__ */ m(
|
|
765
|
+
jt,
|
|
766
766
|
{
|
|
767
|
-
ref:
|
|
768
|
-
className:
|
|
767
|
+
ref: c,
|
|
768
|
+
className: Gt(_e, o, {
|
|
769
769
|
[`${_e}--force-mount`]: !s
|
|
770
770
|
}),
|
|
771
771
|
"data-testid": r,
|
|
@@ -775,57 +775,61 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
|
|
|
775
775
|
children: e
|
|
776
776
|
}
|
|
777
777
|
)
|
|
778
|
-
),
|
|
779
|
-
"purpur-tab-header": "_purpur-tab-
|
|
780
|
-
"purpur-tab-header--contained": "_purpur-tab-header--
|
|
781
|
-
"purpur-tab-header--contained-negative": "_purpur-tab-header--contained-
|
|
782
|
-
"purpur-tab-header--line": "_purpur-tab-header--
|
|
783
|
-
"purpur-tab-header--line-negative": "_purpur-tab-header--line-
|
|
784
|
-
|
|
778
|
+
), Wt = (e) => !!e && ke(e) && !!e.props.name && !!e.props.tabId, Kt = {
|
|
779
|
+
"purpur-tab-header": "_purpur-tab-header_1tc2s_1",
|
|
780
|
+
"purpur-tab-header--contained": "_purpur-tab-header--contained_1tc2s_36",
|
|
781
|
+
"purpur-tab-header--contained-negative": "_purpur-tab-header--contained-negative_1tc2s_36",
|
|
782
|
+
"purpur-tab-header--line": "_purpur-tab-header--line_1tc2s_39",
|
|
783
|
+
"purpur-tab-header--line-negative": "_purpur-tab-header--line-negative_1tc2s_51",
|
|
784
|
+
"purpur-tab-header--full-width": "_purpur-tab-header--full-width_1tc2s_100"
|
|
785
|
+
}, qt = ue.bind(Kt), oe = "purpur-tab-header", zt = be(
|
|
785
786
|
({
|
|
786
787
|
index: e,
|
|
787
788
|
tabId: t,
|
|
788
789
|
variant: r,
|
|
789
790
|
negative: o,
|
|
790
791
|
onFocus: s,
|
|
791
|
-
|
|
792
|
+
fullWidth: n,
|
|
793
|
+
"data-testid": c,
|
|
792
794
|
children: i
|
|
793
|
-
},
|
|
795
|
+
}, d) => /* @__PURE__ */ m(
|
|
794
796
|
Dt,
|
|
795
797
|
{
|
|
796
798
|
id: `${t}-trigger`,
|
|
797
|
-
className:
|
|
799
|
+
className: qt(oe, `${oe}--${r}${o ? "-negative" : ""}`, {
|
|
800
|
+
[`${oe}--full-width`]: n
|
|
801
|
+
}),
|
|
798
802
|
value: t,
|
|
799
|
-
"data-testid":
|
|
803
|
+
"data-testid": c,
|
|
800
804
|
"data-index": e,
|
|
801
|
-
ref:
|
|
805
|
+
ref: d,
|
|
802
806
|
onFocus: s,
|
|
803
807
|
children: i
|
|
804
808
|
}
|
|
805
809
|
)
|
|
806
810
|
), Yt = {
|
|
807
|
-
"purpur-tabs__wrapper": "_purpur-
|
|
808
|
-
"purpur-tabs__scroll-button": "_purpur-tabs__scroll-
|
|
809
|
-
"purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--
|
|
810
|
-
"purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--
|
|
811
|
-
"purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-
|
|
812
|
-
"purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-
|
|
813
|
-
"purpur-tabs--line": "_purpur-tabs--
|
|
814
|
-
"purpur-tabs--line-negative": "_purpur-tabs--line-
|
|
815
|
-
"purpur-tabs__selected-border": "_purpur-tabs__selected-
|
|
816
|
-
"purpur-tabs__content-wrapper": "_purpur-tabs__content-
|
|
817
|
-
"purpur-tabs--contained": "_purpur-tabs--
|
|
818
|
-
"purpur-tabs__list": "_purpur-
|
|
819
|
-
"purpur-tabs--contained-negative": "_purpur-tabs--contained-
|
|
820
|
-
"purpur-tabs__content-container": "_purpur-tabs__content-
|
|
821
|
-
"purpur-tabs--
|
|
822
|
-
}, tn = ["line", "contained"], Zt = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }),
|
|
811
|
+
"purpur-tabs__wrapper": "_purpur-tabs__wrapper_jv2vl_1",
|
|
812
|
+
"purpur-tabs__scroll-button": "_purpur-tabs__scroll-button_jv2vl_9",
|
|
813
|
+
"purpur-tabs__scroll-button--left": "_purpur-tabs__scroll-button--left_jv2vl_71",
|
|
814
|
+
"purpur-tabs__scroll-button--right": "_purpur-tabs__scroll-button--right_jv2vl_74",
|
|
815
|
+
"purpur-tabs__wrapper--scroll-start": "_purpur-tabs__wrapper--scroll-start_jv2vl_77",
|
|
816
|
+
"purpur-tabs__wrapper--scroll-end": "_purpur-tabs__wrapper--scroll-end_jv2vl_80",
|
|
817
|
+
"purpur-tabs--line": "_purpur-tabs--line_jv2vl_83",
|
|
818
|
+
"purpur-tabs--line-negative": "_purpur-tabs--line-negative_jv2vl_83",
|
|
819
|
+
"purpur-tabs__selected-border": "_purpur-tabs__selected-border_jv2vl_91",
|
|
820
|
+
"purpur-tabs__content-wrapper": "_purpur-tabs__content-wrapper_jv2vl_115",
|
|
821
|
+
"purpur-tabs--contained": "_purpur-tabs--contained_jv2vl_123",
|
|
822
|
+
"purpur-tabs__list": "_purpur-tabs__list_jv2vl_123",
|
|
823
|
+
"purpur-tabs--contained-negative": "_purpur-tabs--contained-negative_jv2vl_123",
|
|
824
|
+
"purpur-tabs__content-container": "_purpur-tabs__content-container_jv2vl_126",
|
|
825
|
+
"purpur-tabs--full-width": "_purpur-tabs--full-width_jv2vl_136"
|
|
826
|
+
}, tn = ["line", "contained"], Zt = (e) => new CustomEvent("tabChangeDetail", { detail: { value: e } }), M = ue.bind(Yt), T = "purpur-tabs", Xt = (e, t) => {
|
|
823
827
|
var d;
|
|
824
828
|
if (typeof (e == null ? void 0 : e.getBoundingClientRect) != "function" || typeof (t == null ? void 0 : t.scroll) != "function")
|
|
825
829
|
return;
|
|
826
|
-
const r = e.getBoundingClientRect(), o = t.getBoundingClientRect(), s = t.clientWidth, n = parseInt((d = getComputedStyle(t).borderLeftWidth) == null ? void 0 : d.split("px")[0], 10),
|
|
827
|
-
let
|
|
828
|
-
r.right > o.right && (
|
|
830
|
+
const r = e.getBoundingClientRect(), o = t.getBoundingClientRect(), s = t.clientWidth, n = parseInt((d = getComputedStyle(t).borderLeftWidth) == null ? void 0 : d.split("px")[0], 10), c = o.left + (isNaN(n) ? 0 : n);
|
|
831
|
+
let i;
|
|
832
|
+
r.right > o.right && (i = r.left + t.scrollLeft, i = i + r.width - s + s * 0.1, i = i - c), r.left < o.left && (i = r.left + t.scrollLeft, i = i - s * 0.1, i = i - c), i !== void 0 && t.scroll({ left: i, behavior: "smooth" });
|
|
829
833
|
}, Ht = ({
|
|
830
834
|
children: e,
|
|
831
835
|
variant: t = "line",
|
|
@@ -833,77 +837,77 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
|
|
|
833
837
|
fullWidth: o = !1,
|
|
834
838
|
onChange: s,
|
|
835
839
|
className: n,
|
|
836
|
-
defaultValue:
|
|
837
|
-
animateHeight:
|
|
840
|
+
defaultValue: c,
|
|
841
|
+
animateHeight: i = !1,
|
|
838
842
|
"data-testid": d,
|
|
839
|
-
value:
|
|
843
|
+
value: u,
|
|
840
844
|
...l
|
|
841
845
|
}) => {
|
|
842
|
-
const f = te(null), [
|
|
846
|
+
const f = te(null), [v, g] = B(-1), [I, h] = B({}), [_, C] = B(0), [N, w] = B(0), b = z.toArray(e).filter(Wt), R = te(null), x = te(new Array(b.length)), P = 200, y = t === "line", Q = M(
|
|
843
847
|
T,
|
|
844
848
|
`${T}--${t}${r ? "-negative" : ""}`,
|
|
845
|
-
{ [`${T}--
|
|
849
|
+
{ [`${T}--full-width`]: o },
|
|
846
850
|
n
|
|
847
|
-
), F =
|
|
848
|
-
const p = F.findIndex((S) => S ===
|
|
851
|
+
), F = z.map(b, ({ props: { tabId: p } }) => p), L = () => {
|
|
852
|
+
const p = F.findIndex((S) => S === c);
|
|
849
853
|
return p >= 0 ? p : 0;
|
|
850
854
|
};
|
|
851
855
|
Y(() => {
|
|
852
|
-
|
|
853
|
-
}, [b,
|
|
854
|
-
const [
|
|
856
|
+
u && G(b.findIndex((p) => p.props.tabId === u));
|
|
857
|
+
}, [b, u]);
|
|
858
|
+
const [V, G] = B(L);
|
|
855
859
|
if (new Set(F).size !== F.length)
|
|
856
860
|
throw new Error("tabId must be unique");
|
|
857
|
-
const
|
|
861
|
+
const k = (p, S) => S || d ? `${S || d}-${p}` : void 0, W = () => {
|
|
858
862
|
if (!y)
|
|
859
863
|
return;
|
|
860
|
-
const p = x.current[
|
|
864
|
+
const p = x.current[V];
|
|
861
865
|
C((p == null ? void 0 : p.offsetLeft) || 0), w((p == null ? void 0 : p.getBoundingClientRect().width) || 0);
|
|
862
866
|
}, E = (p) => {
|
|
863
|
-
y && !
|
|
864
|
-
},
|
|
867
|
+
y && !u && G(b.findIndex((S) => S.props.tabId === p)), s == null || s(Zt(p));
|
|
868
|
+
}, Be = (p) => {
|
|
865
869
|
if (R != null && R.current) {
|
|
866
|
-
const { scrollLeft: S } = R.current,
|
|
867
|
-
R.current.scroll({ left: S +
|
|
870
|
+
const { scrollLeft: S } = R.current, $ = p === "left" ? -P : P;
|
|
871
|
+
R.current.scroll({ left: S + $, behavior: "smooth" });
|
|
868
872
|
}
|
|
869
|
-
},
|
|
873
|
+
}, le = ({ side: p }) => /* @__PURE__ */ m(
|
|
870
874
|
"button",
|
|
871
875
|
{
|
|
872
|
-
className:
|
|
873
|
-
onClick: () =>
|
|
876
|
+
className: M(`${T}__scroll-button`, `${T}__scroll-button--${p}`),
|
|
877
|
+
onClick: () => Be(p),
|
|
874
878
|
type: "button",
|
|
875
879
|
"aria-hidden": "true",
|
|
876
880
|
tabIndex: -1,
|
|
877
|
-
"data-testid":
|
|
881
|
+
"data-testid": k("scroll-button"),
|
|
878
882
|
children: /* @__PURE__ */ m(ge, { svg: p === "left" ? et : tt, size: "md" })
|
|
879
883
|
}
|
|
880
884
|
);
|
|
881
885
|
return Y(() => {
|
|
882
886
|
const p = () => {
|
|
883
|
-
if (f.current &&
|
|
884
|
-
const
|
|
885
|
-
g(
|
|
887
|
+
if (f.current && i) {
|
|
888
|
+
const $ = f.current.offsetHeight;
|
|
889
|
+
g($);
|
|
886
890
|
}
|
|
887
891
|
}, S = () => {
|
|
888
|
-
p(),
|
|
892
|
+
p(), W();
|
|
889
893
|
};
|
|
890
894
|
return p(), window.addEventListener("resize", S), () => {
|
|
891
895
|
window.removeEventListener("resize", S);
|
|
892
896
|
};
|
|
893
|
-
}, [
|
|
894
|
-
|
|
895
|
-
}, [
|
|
897
|
+
}, [V, i]), Y(() => {
|
|
898
|
+
W();
|
|
899
|
+
}, [V, o, b.length, t]), Y(() => {
|
|
896
900
|
const p = R.current;
|
|
897
901
|
if (!p) return;
|
|
898
902
|
const S = () => {
|
|
899
|
-
const { scrollLeft:
|
|
903
|
+
const { scrollLeft: $, scrollWidth: K, clientWidth: q } = p, D = K > q, Ue = $ <= 1, Ge = $ + q >= K - 1;
|
|
900
904
|
if (!D) {
|
|
901
905
|
h({});
|
|
902
906
|
return;
|
|
903
907
|
}
|
|
904
908
|
h({
|
|
905
|
-
[`${T}__wrapper--scroll-start`]: !
|
|
906
|
-
[`${T}__wrapper--scroll-end`]: !
|
|
909
|
+
[`${T}__wrapper--scroll-start`]: !Ue,
|
|
910
|
+
[`${T}__wrapper--scroll-end`]: !Ge
|
|
907
911
|
});
|
|
908
912
|
};
|
|
909
913
|
return S(), p.addEventListener("scroll", S, { passive: !0 }), window.addEventListener("resize", S), () => {
|
|
@@ -912,30 +916,30 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
|
|
|
912
916
|
}, []), /* @__PURE__ */ m(
|
|
913
917
|
Ot,
|
|
914
918
|
{
|
|
915
|
-
defaultValue:
|
|
919
|
+
defaultValue: c ?? b[0].props.tabId,
|
|
916
920
|
onValueChange: E,
|
|
917
921
|
"data-testid": d,
|
|
918
922
|
className: Q,
|
|
919
|
-
value:
|
|
923
|
+
value: u,
|
|
920
924
|
...l,
|
|
921
|
-
children: /* @__PURE__ */ ee("div", { className:
|
|
922
|
-
/* @__PURE__ */ ee("div", { className:
|
|
925
|
+
children: /* @__PURE__ */ ee("div", { className: M(`${T}__container`), children: [
|
|
926
|
+
/* @__PURE__ */ ee("div", { className: M(`${T}__wrapper`, I), children: [
|
|
923
927
|
/* @__PURE__ */ ee(
|
|
924
928
|
Ft,
|
|
925
929
|
{
|
|
926
930
|
ref: (p) => {
|
|
927
931
|
R.current = p;
|
|
928
932
|
},
|
|
929
|
-
className:
|
|
933
|
+
className: M(`${T}__list`),
|
|
930
934
|
children: [
|
|
931
|
-
|
|
932
|
-
const { name:
|
|
935
|
+
z.map(b, (p, S) => {
|
|
936
|
+
const { name: $, tabId: K, "data-testid": q } = p.props;
|
|
933
937
|
return /* @__PURE__ */ m(
|
|
934
|
-
|
|
938
|
+
zt,
|
|
935
939
|
{
|
|
936
|
-
"data-testid":
|
|
940
|
+
"data-testid": k("header", q),
|
|
937
941
|
index: S,
|
|
938
|
-
tabId:
|
|
942
|
+
tabId: K,
|
|
939
943
|
ref: (D) => {
|
|
940
944
|
D && (x.current[S] = D);
|
|
941
945
|
},
|
|
@@ -944,40 +948,41 @@ const ue = /* @__PURE__ */ Vt(Ut), Wt = {
|
|
|
944
948
|
},
|
|
945
949
|
variant: t,
|
|
946
950
|
negative: r,
|
|
947
|
-
|
|
951
|
+
fullWidth: o,
|
|
952
|
+
children: $
|
|
948
953
|
}
|
|
949
954
|
);
|
|
950
955
|
}),
|
|
951
956
|
y && /* @__PURE__ */ m(
|
|
952
957
|
"div",
|
|
953
958
|
{
|
|
954
|
-
className:
|
|
959
|
+
className: M(`${T}__selected-border`),
|
|
955
960
|
style: {
|
|
956
961
|
width: N,
|
|
957
|
-
transform: `translateX(${
|
|
962
|
+
transform: `translateX(${_}px)`
|
|
958
963
|
},
|
|
959
|
-
"data-testid":
|
|
964
|
+
"data-testid": k("selected-border")
|
|
960
965
|
}
|
|
961
966
|
)
|
|
962
967
|
]
|
|
963
968
|
}
|
|
964
969
|
),
|
|
965
|
-
/* @__PURE__ */ m(
|
|
966
|
-
/* @__PURE__ */ m(
|
|
970
|
+
/* @__PURE__ */ m(le, { side: "left" }),
|
|
971
|
+
/* @__PURE__ */ m(le, { side: "right" })
|
|
967
972
|
] }),
|
|
968
973
|
/* @__PURE__ */ m(
|
|
969
974
|
"div",
|
|
970
975
|
{
|
|
971
|
-
className:
|
|
972
|
-
style: { height:
|
|
973
|
-
children: /* @__PURE__ */ m("div", { ref: f, className:
|
|
976
|
+
className: i ? M(`${T}__content-wrapper`) : "",
|
|
977
|
+
style: { height: i && v > -1 ? `${v}px` : "auto" },
|
|
978
|
+
children: /* @__PURE__ */ m("div", { ref: f, className: M(`${T}__content-container`), children: z.map(b, (p) => p) })
|
|
974
979
|
}
|
|
975
980
|
)
|
|
976
981
|
] })
|
|
977
982
|
}
|
|
978
983
|
);
|
|
979
984
|
};
|
|
980
|
-
Ht.Content =
|
|
985
|
+
Ht.Content = kt;
|
|
981
986
|
export {
|
|
982
987
|
Ht as Tabs,
|
|
983
988
|
Zt as createTabChangeDetailEvent,
|