@televet/kibble-ui 5.0.25-beta.13 → 5.0.25-beta.2
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/chunks/tab.types-BTbceOSr.js +2 -0
- package/dist/chunks/{tab.types-DGGOGGIo.js.map → tab.types-BTbceOSr.js.map} +1 -1
- package/dist/chunks/{tab.types-CCzf31Vv.js → tab.types-bJ04v7AW.js} +152 -156
- package/dist/chunks/{tab.types-CCzf31Vv.js.map → tab.types-bJ04v7AW.js.map} +1 -1
- package/dist/cjs/components/Tabs/index.cjs +1 -1
- package/dist/cjs/components/index.cjs +1 -1
- package/dist/cjs/index.cjs +1 -1
- package/dist/esm/components/Tabs/index.js +1 -1
- package/dist/esm/components/index.js +1 -1
- package/dist/esm/index.js +1 -1
- package/package.json +1 -1
- package/dist/chunks/tab.types-DGGOGGIo.js +0 -2
|
@@ -3,13 +3,12 @@ import { I as L } from "./icon.component-PV_nHBId.js";
|
|
|
3
3
|
import { N as Y } from "./notificationCounter.component-6Q3q8jWj.js";
|
|
4
4
|
import { W as G } from "./heading.component-CpSAN3cv.js";
|
|
5
5
|
import { c as J } from "./create-slot-recipe-context-D_FXDJGp.js";
|
|
6
|
-
import { useState as Q, useEffect as Z, forwardRef as
|
|
7
|
-
import { a as te, b as x, d as
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
6
|
+
import { useState as Q, useEffect as Z, forwardRef as m, useId as ee } from "react";
|
|
7
|
+
import { a as te, b as x, d as y, e as ae, c as N, u as se, f as oe, g as re, n as ne } from "./use-locale-context-DmcfCmf9.js";
|
|
8
|
+
import { u as ie, s as $, R as j } from "./render-strategy-DLvzMQD1.js";
|
|
9
|
+
import { a6 as h, s as ce, aa as le, E as ue, b2 as de, r as T, aR as ge, aS as fe, a1 as pe, f as be, c as b, a3 as ve, z as Te, O as me, j as ye, l as he, b5 as Re, q as Ce, aD as Pe, _ as Ve, $ as Ee } from "./index-BcafYtXX.js";
|
|
10
10
|
import { c as Ae, d as Ie } from "./index-DcmJgLUo.js";
|
|
11
|
-
|
|
12
|
-
function Fe(e, t) {
|
|
11
|
+
function xe(e, t) {
|
|
13
12
|
const [s, a] = Q(e);
|
|
14
13
|
return Z(() => {
|
|
15
14
|
const r = setTimeout(() => {
|
|
@@ -24,40 +23,40 @@ const [B, F] = te({
|
|
|
24
23
|
name: "TabsContext",
|
|
25
24
|
hookName: "useTabsContext",
|
|
26
25
|
providerName: "<TabsProvider />"
|
|
27
|
-
}), k =
|
|
28
|
-
const [s, a] = x()(e, ["value"]), r = F(), o =
|
|
26
|
+
}), k = m((e, t) => {
|
|
27
|
+
const [s, a] = x()(e, ["value"]), r = F(), o = ie(), n = Ae({
|
|
29
28
|
...o,
|
|
30
|
-
present:
|
|
29
|
+
present: xe(r.value === e.value, 0),
|
|
31
30
|
immediate: !0
|
|
32
|
-
}),
|
|
33
|
-
return /* @__PURE__ */ c.jsx(Ie, { value: n, children: n.unmounted ? null : /* @__PURE__ */ c.jsx(
|
|
31
|
+
}), d = h(r.getContentProps(s), n.getPresenceProps(), a);
|
|
32
|
+
return /* @__PURE__ */ c.jsx(Ie, { value: n, children: n.unmounted ? null : /* @__PURE__ */ c.jsx(y.div, { ...d, ref: ae(n.ref, t) }) });
|
|
34
33
|
});
|
|
35
34
|
k.displayName = "TabContent";
|
|
36
|
-
const D =
|
|
37
|
-
const s = F(), a =
|
|
38
|
-
return /* @__PURE__ */ c.jsx(
|
|
35
|
+
const D = m((e, t) => {
|
|
36
|
+
const s = F(), a = h(s.getIndicatorProps(), e);
|
|
37
|
+
return /* @__PURE__ */ c.jsx(y.div, { ...a, ref: t });
|
|
39
38
|
});
|
|
40
39
|
D.displayName = "TabIndicator";
|
|
41
|
-
const U =
|
|
42
|
-
const s = F(), a =
|
|
43
|
-
return /* @__PURE__ */ c.jsx(
|
|
40
|
+
const U = m((e, t) => {
|
|
41
|
+
const s = F(), a = h(s.getListProps(), e);
|
|
42
|
+
return /* @__PURE__ */ c.jsx(y.div, { ...a, ref: t });
|
|
44
43
|
});
|
|
45
44
|
U.displayName = "TabList";
|
|
46
|
-
const W =
|
|
47
|
-
const [s, a] = x()(e, ["disabled", "value"]), r = F(), o =
|
|
48
|
-
return /* @__PURE__ */ c.jsx(
|
|
45
|
+
const W = m((e, t) => {
|
|
46
|
+
const [s, a] = x()(e, ["disabled", "value"]), r = F(), o = h(r.getTriggerProps(s), a);
|
|
47
|
+
return /* @__PURE__ */ c.jsx(y.button, { ...o, ref: t });
|
|
49
48
|
});
|
|
50
49
|
W.displayName = "TabTrigger";
|
|
51
|
-
var
|
|
52
|
-
const s = `[role=tab][data-ownedby='${CSS.escape(
|
|
53
|
-
return
|
|
54
|
-
},
|
|
50
|
+
var Fe = be("tabs").parts("root", "list", "trigger", "content", "indicator"), C = Fe.build(), _e = (e) => e.ids?.root ?? `tabs:${e.id}`, P = (e) => e.ids?.list ?? `tabs:${e.id}:list`, _ = (e, t) => e.ids?.content ?? `tabs:${e.id}:content-${t}`, v = (e, t) => e.ids?.trigger ?? `tabs:${e.id}:trigger-${t}`, M = (e) => e.ids?.indicator ?? `tabs:${e.id}:indicator`, Ne = (e) => e.getById(P(e)), we = (e, t) => e.getById(_(e, t)), I = (e, t) => e.getById(v(e, t)), O = (e) => e.getById(M(e)), V = (e) => {
|
|
51
|
+
const s = `[role=tab][data-ownedby='${CSS.escape(P(e))}']:not([disabled])`;
|
|
52
|
+
return Ce(Ne(e), s);
|
|
53
|
+
}, Se = (e) => Ee(V(e)), Le = (e) => Ve(V(e)), Oe = (e, t) => fe(V(e), v(e, t.value), t.loopFocus), $e = (e, t) => ge(V(e), v(e, t.value), t.loopFocus), X = (e) => ({
|
|
55
54
|
left: e?.offsetLeft ?? 0,
|
|
56
55
|
top: e?.offsetTop ?? 0,
|
|
57
56
|
width: e?.offsetWidth ?? 0,
|
|
58
57
|
height: e?.offsetHeight ?? 0
|
|
59
|
-
}),
|
|
60
|
-
const s =
|
|
58
|
+
}), je = (e, t) => {
|
|
59
|
+
const s = Re(V(e), v(e, t));
|
|
61
60
|
return H(X(s));
|
|
62
61
|
}, H = (e) => ({
|
|
63
62
|
width: `${e.width}px`,
|
|
@@ -65,8 +64,8 @@ var _e = pe("tabs").parts("root", "list", "trigger", "content", "indicator"), P
|
|
|
65
64
|
left: `${e.left}px`,
|
|
66
65
|
top: `${e.top}px`
|
|
67
66
|
});
|
|
68
|
-
function
|
|
69
|
-
const { state: s, send: a, context: r, prop: o, scope: n } = e,
|
|
67
|
+
function Be(e, t) {
|
|
68
|
+
const { state: s, send: a, context: r, prop: o, scope: n } = e, d = o("translations"), u = s.matches("focused"), g = o("orientation") === "vertical", A = o("orientation") === "horizontal", w = o("composite");
|
|
70
69
|
function S(i) {
|
|
71
70
|
return {
|
|
72
71
|
selected: r.get("value") === i.value,
|
|
@@ -84,7 +83,7 @@ function ke(e, t) {
|
|
|
84
83
|
a({ type: "CLEAR_VALUE" });
|
|
85
84
|
},
|
|
86
85
|
setIndicatorRect(i) {
|
|
87
|
-
const l =
|
|
86
|
+
const l = v(n, i);
|
|
88
87
|
a({ type: "SET_INDICATOR_RECT", id: l });
|
|
89
88
|
},
|
|
90
89
|
syncTabIndex() {
|
|
@@ -102,37 +101,37 @@ function ke(e, t) {
|
|
|
102
101
|
},
|
|
103
102
|
getRootProps() {
|
|
104
103
|
return t.element({
|
|
105
|
-
...
|
|
106
|
-
id:
|
|
104
|
+
...C.root.attrs,
|
|
105
|
+
id: _e(n),
|
|
107
106
|
"data-orientation": o("orientation"),
|
|
108
|
-
"data-focus":
|
|
107
|
+
"data-focus": b(u),
|
|
109
108
|
dir: o("dir")
|
|
110
109
|
});
|
|
111
110
|
},
|
|
112
111
|
getListProps() {
|
|
113
112
|
return t.element({
|
|
114
|
-
...
|
|
115
|
-
id:
|
|
113
|
+
...C.list.attrs,
|
|
114
|
+
id: P(n),
|
|
116
115
|
role: "tablist",
|
|
117
116
|
dir: o("dir"),
|
|
118
|
-
"data-focus":
|
|
117
|
+
"data-focus": b(u),
|
|
119
118
|
"aria-orientation": o("orientation"),
|
|
120
119
|
"data-orientation": o("orientation"),
|
|
121
|
-
"aria-label":
|
|
120
|
+
"aria-label": d?.listLabel,
|
|
122
121
|
onKeyDown(i) {
|
|
123
|
-
if (i.defaultPrevented || !
|
|
122
|
+
if (i.defaultPrevented || !me(i) || ye(i)) return;
|
|
124
123
|
const l = {
|
|
125
124
|
ArrowDown() {
|
|
126
|
-
|
|
125
|
+
A || a({ type: "ARROW_NEXT", key: "ArrowDown" });
|
|
127
126
|
},
|
|
128
127
|
ArrowUp() {
|
|
129
|
-
|
|
128
|
+
A || a({ type: "ARROW_PREV", key: "ArrowUp" });
|
|
130
129
|
},
|
|
131
130
|
ArrowLeft() {
|
|
132
|
-
|
|
131
|
+
g || a({ type: "ARROW_PREV", key: "ArrowLeft" });
|
|
133
132
|
},
|
|
134
133
|
ArrowRight() {
|
|
135
|
-
|
|
134
|
+
g || a({ type: "ARROW_NEXT", key: "ArrowRight" });
|
|
136
135
|
},
|
|
137
136
|
Home() {
|
|
138
137
|
a({ type: "HOME" });
|
|
@@ -141,13 +140,13 @@ function ke(e, t) {
|
|
|
141
140
|
a({ type: "END" });
|
|
142
141
|
}
|
|
143
142
|
};
|
|
144
|
-
let
|
|
143
|
+
let f = he(i, {
|
|
145
144
|
dir: o("dir"),
|
|
146
145
|
orientation: o("orientation")
|
|
147
146
|
});
|
|
148
|
-
const
|
|
149
|
-
if (
|
|
150
|
-
i.preventDefault(),
|
|
147
|
+
const p = l[f];
|
|
148
|
+
if (p) {
|
|
149
|
+
i.preventDefault(), p(i);
|
|
151
150
|
return;
|
|
152
151
|
}
|
|
153
152
|
}
|
|
@@ -155,56 +154,56 @@ function ke(e, t) {
|
|
|
155
154
|
},
|
|
156
155
|
getTriggerState: S,
|
|
157
156
|
getTriggerProps(i) {
|
|
158
|
-
const { value: l, disabled:
|
|
157
|
+
const { value: l, disabled: f } = i, p = S(i);
|
|
159
158
|
return t.button({
|
|
160
|
-
...
|
|
159
|
+
...C.trigger.attrs,
|
|
161
160
|
role: "tab",
|
|
162
161
|
type: "button",
|
|
163
|
-
disabled:
|
|
162
|
+
disabled: f,
|
|
164
163
|
dir: o("dir"),
|
|
165
164
|
"data-orientation": o("orientation"),
|
|
166
|
-
"data-disabled":
|
|
167
|
-
"aria-disabled":
|
|
165
|
+
"data-disabled": b(f),
|
|
166
|
+
"aria-disabled": f,
|
|
168
167
|
"data-value": l,
|
|
169
|
-
"aria-selected":
|
|
170
|
-
"data-selected":
|
|
171
|
-
"data-focus":
|
|
172
|
-
"aria-controls":
|
|
173
|
-
"data-ownedby":
|
|
174
|
-
"data-ssr":
|
|
175
|
-
id:
|
|
176
|
-
tabIndex:
|
|
168
|
+
"aria-selected": p.selected,
|
|
169
|
+
"data-selected": b(p.selected),
|
|
170
|
+
"data-focus": b(p.focused),
|
|
171
|
+
"aria-controls": p.selected ? _(n, l) : void 0,
|
|
172
|
+
"data-ownedby": P(n),
|
|
173
|
+
"data-ssr": b(r.get("ssr")),
|
|
174
|
+
id: v(n, l),
|
|
175
|
+
tabIndex: p.selected && w ? 0 : -1,
|
|
177
176
|
onFocus() {
|
|
178
177
|
a({ type: "TAB_FOCUS", value: l });
|
|
179
178
|
},
|
|
180
|
-
onBlur(
|
|
181
|
-
|
|
179
|
+
onBlur(R) {
|
|
180
|
+
R.relatedTarget?.getAttribute("role") !== "tab" && a({ type: "TAB_BLUR" });
|
|
182
181
|
},
|
|
183
|
-
onClick(
|
|
184
|
-
|
|
182
|
+
onClick(R) {
|
|
183
|
+
R.defaultPrevented || ve(R) || f || (Te() && R.currentTarget.focus(), a({ type: "TAB_CLICK", value: l }));
|
|
185
184
|
}
|
|
186
185
|
});
|
|
187
186
|
},
|
|
188
187
|
getContentProps(i) {
|
|
189
|
-
const { value: l } = i,
|
|
188
|
+
const { value: l } = i, f = r.get("value") === l;
|
|
190
189
|
return t.element({
|
|
191
|
-
...
|
|
190
|
+
...C.content.attrs,
|
|
192
191
|
dir: o("dir"),
|
|
193
192
|
id: _(n, l),
|
|
194
193
|
tabIndex: w ? 0 : -1,
|
|
195
|
-
"aria-labelledby":
|
|
194
|
+
"aria-labelledby": v(n, l),
|
|
196
195
|
role: "tabpanel",
|
|
197
|
-
"data-ownedby":
|
|
198
|
-
"data-selected":
|
|
196
|
+
"data-ownedby": P(n),
|
|
197
|
+
"data-selected": b(f),
|
|
199
198
|
"data-orientation": o("orientation"),
|
|
200
|
-
hidden: !
|
|
199
|
+
hidden: !f
|
|
201
200
|
});
|
|
202
201
|
},
|
|
203
202
|
getIndicatorProps() {
|
|
204
203
|
const i = r.get("indicatorRect"), l = r.get("indicatorTransition");
|
|
205
204
|
return t.element({
|
|
206
205
|
id: M(n),
|
|
207
|
-
...
|
|
206
|
+
...C.indicator.attrs,
|
|
208
207
|
dir: o("dir"),
|
|
209
208
|
"data-orientation": o("orientation"),
|
|
210
209
|
style: {
|
|
@@ -218,13 +217,13 @@ function ke(e, t) {
|
|
|
218
217
|
transitionProperty: "var(--transition-property)",
|
|
219
218
|
transitionDuration: l ? "var(--transition-duration, 150ms)" : "0ms",
|
|
220
219
|
transitionTimingFunction: "var(--transition-timing-function)",
|
|
221
|
-
[
|
|
220
|
+
[A ? "left" : "top"]: A ? "var(--left)" : "var(--top)"
|
|
222
221
|
}
|
|
223
222
|
});
|
|
224
223
|
}
|
|
225
224
|
};
|
|
226
225
|
}
|
|
227
|
-
var { createMachine:
|
|
226
|
+
var { createMachine: ke } = ce(), De = ke({
|
|
228
227
|
props({ props: e }) {
|
|
229
228
|
return {
|
|
230
229
|
dir: "ltr",
|
|
@@ -233,7 +232,7 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
233
232
|
loopFocus: !0,
|
|
234
233
|
composite: !0,
|
|
235
234
|
navigate(t) {
|
|
236
|
-
|
|
235
|
+
pe(t.node);
|
|
237
236
|
},
|
|
238
237
|
defaultValue: null,
|
|
239
238
|
...e
|
|
@@ -358,7 +357,7 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
358
357
|
},
|
|
359
358
|
actions: {
|
|
360
359
|
selectFocusedTab({ context: e, prop: t }) {
|
|
361
|
-
|
|
360
|
+
T(() => {
|
|
362
361
|
const s = e.get("focusedValue");
|
|
363
362
|
if (!s) return;
|
|
364
363
|
const r = t("deselectable") && e.get("value") === s ? null : s;
|
|
@@ -381,23 +380,23 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
381
380
|
e.set("value", null);
|
|
382
381
|
},
|
|
383
382
|
focusFirstTab({ scope: e }) {
|
|
384
|
-
|
|
385
|
-
|
|
383
|
+
T(() => {
|
|
384
|
+
Se(e)?.focus();
|
|
386
385
|
});
|
|
387
386
|
},
|
|
388
387
|
focusLastTab({ scope: e }) {
|
|
389
|
-
|
|
390
|
-
|
|
388
|
+
T(() => {
|
|
389
|
+
Le(e)?.focus();
|
|
391
390
|
});
|
|
392
391
|
},
|
|
393
392
|
focusNextTab({ context: e, prop: t, scope: s, event: a }) {
|
|
394
393
|
const r = a.value ?? e.get("focusedValue");
|
|
395
394
|
if (!r) return;
|
|
396
|
-
const o =
|
|
395
|
+
const o = Oe(s, {
|
|
397
396
|
value: r,
|
|
398
397
|
loopFocus: t("loopFocus")
|
|
399
398
|
});
|
|
400
|
-
|
|
399
|
+
T(() => {
|
|
401
400
|
t("composite") ? o?.focus() : o?.dataset.value != null && e.set("focusedValue", o.dataset.value);
|
|
402
401
|
});
|
|
403
402
|
},
|
|
@@ -408,17 +407,17 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
408
407
|
value: r,
|
|
409
408
|
loopFocus: t("loopFocus")
|
|
410
409
|
});
|
|
411
|
-
|
|
410
|
+
T(() => {
|
|
412
411
|
t("composite") ? o?.focus() : o?.dataset.value != null && e.set("focusedValue", o.dataset.value);
|
|
413
412
|
});
|
|
414
413
|
},
|
|
415
414
|
syncTabIndex({ context: e, scope: t }) {
|
|
416
|
-
|
|
415
|
+
T(() => {
|
|
417
416
|
const s = e.get("value");
|
|
418
417
|
if (!s) return;
|
|
419
|
-
const a =
|
|
418
|
+
const a = we(t, s);
|
|
420
419
|
if (!a) return;
|
|
421
|
-
|
|
420
|
+
Pe(a).length > 0 ? a.removeAttribute("tabindex") : a.setAttribute("tabindex", "0");
|
|
422
421
|
});
|
|
423
422
|
},
|
|
424
423
|
cleanupObserver({ refs: e }) {
|
|
@@ -435,7 +434,7 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
435
434
|
e.set("indicatorTransition", !1);
|
|
436
435
|
return;
|
|
437
436
|
}
|
|
438
|
-
I(s, a) && (e.set("indicatorRect",
|
|
437
|
+
I(s, a) && (e.set("indicatorRect", je(s, a)), de(() => {
|
|
439
438
|
e.set("indicatorTransition", !1);
|
|
440
439
|
}));
|
|
441
440
|
},
|
|
@@ -452,22 +451,22 @@ var { createMachine: De } = ie(), Ue = De({
|
|
|
452
451
|
}
|
|
453
452
|
const o = I(s, r), n = O(s);
|
|
454
453
|
if (!o || !n) return;
|
|
455
|
-
const
|
|
456
|
-
measure(
|
|
457
|
-
return X(
|
|
454
|
+
const d = ue([o], {
|
|
455
|
+
measure(u) {
|
|
456
|
+
return X(u);
|
|
458
457
|
},
|
|
459
|
-
onEntry({ rects:
|
|
460
|
-
const [
|
|
461
|
-
e.set("indicatorRect", H(
|
|
458
|
+
onEntry({ rects: u }) {
|
|
459
|
+
const [g] = u;
|
|
460
|
+
e.set("indicatorRect", H(g));
|
|
462
461
|
}
|
|
463
462
|
});
|
|
464
|
-
t.set("indicatorCleanup",
|
|
463
|
+
t.set("indicatorCleanup", d);
|
|
465
464
|
},
|
|
466
465
|
navigateIfNeeded({ context: e, prop: t, scope: s }) {
|
|
467
466
|
const a = e.get("value");
|
|
468
467
|
if (!a) return;
|
|
469
468
|
const r = I(s, a);
|
|
470
|
-
|
|
469
|
+
le(r) && t("navigate")?.({ value: a, node: r, href: r.href });
|
|
471
470
|
}
|
|
472
471
|
}
|
|
473
472
|
}
|
|
@@ -491,16 +490,16 @@ N()([
|
|
|
491
490
|
]);
|
|
492
491
|
N()(["disabled", "value"]);
|
|
493
492
|
N()(["value"]);
|
|
494
|
-
const
|
|
493
|
+
const Ue = (e) => {
|
|
495
494
|
const t = ee(), { getRootNode: s } = se(), { dir: a } = oe(), r = {
|
|
496
495
|
id: t,
|
|
497
496
|
dir: a,
|
|
498
497
|
getRootNode: s,
|
|
499
498
|
...e
|
|
500
|
-
}, o = re(
|
|
501
|
-
return
|
|
502
|
-
}, K =
|
|
503
|
-
const [s, a] =
|
|
499
|
+
}, o = re(De, r);
|
|
500
|
+
return Be(o, ne);
|
|
501
|
+
}, K = m((e, t) => {
|
|
502
|
+
const [s, a] = $(e), [r, o] = x()(a, [
|
|
504
503
|
"activationMode",
|
|
505
504
|
"composite",
|
|
506
505
|
"defaultValue",
|
|
@@ -514,55 +513,55 @@ const We = (e) => {
|
|
|
514
513
|
"orientation",
|
|
515
514
|
"translations",
|
|
516
515
|
"value"
|
|
517
|
-
]), n =
|
|
518
|
-
return /* @__PURE__ */ c.jsx(B, { value: n, children: /* @__PURE__ */ c.jsx(
|
|
516
|
+
]), n = Ue(r), d = h(n.getRootProps(), o);
|
|
517
|
+
return /* @__PURE__ */ c.jsx(B, { value: n, children: /* @__PURE__ */ c.jsx(j, { value: s, children: /* @__PURE__ */ c.jsx(y.div, { ...d, ref: t }) }) });
|
|
519
518
|
});
|
|
520
519
|
K.displayName = "TabsRoot";
|
|
521
|
-
const q =
|
|
522
|
-
const [s, a] =
|
|
523
|
-
return /* @__PURE__ */ c.jsx(B, { value: r, children: /* @__PURE__ */ c.jsx(
|
|
520
|
+
const q = m((e, t) => {
|
|
521
|
+
const [s, a] = $(e), [{ value: r }, o] = x()(a, ["value"]), n = h(r.getRootProps(), o);
|
|
522
|
+
return /* @__PURE__ */ c.jsx(B, { value: r, children: /* @__PURE__ */ c.jsx(j, { value: s, children: /* @__PURE__ */ c.jsx(y.div, { ...n, ref: t }) }) });
|
|
524
523
|
});
|
|
525
524
|
q.displayName = "TabsRootProvider";
|
|
526
525
|
const {
|
|
527
526
|
withProvider: z,
|
|
528
|
-
withContext:
|
|
527
|
+
withContext: E
|
|
529
528
|
} = J({ key: "tabs" });
|
|
530
529
|
z(q, "root", { forwardAsChild: !0 });
|
|
531
|
-
const
|
|
530
|
+
const We = z(
|
|
532
531
|
K,
|
|
533
532
|
"root",
|
|
534
533
|
{ forwardAsChild: !0 }
|
|
535
|
-
),
|
|
534
|
+
), Me = E(
|
|
536
535
|
W,
|
|
537
536
|
"trigger",
|
|
538
537
|
{ forwardAsChild: !0 }
|
|
539
|
-
),
|
|
538
|
+
), Xe = E(
|
|
540
539
|
k,
|
|
541
540
|
"content",
|
|
542
541
|
{ forwardAsChild: !0 }
|
|
543
542
|
);
|
|
544
|
-
|
|
545
|
-
const
|
|
543
|
+
E("div", "contentGroup");
|
|
544
|
+
const He = E(
|
|
546
545
|
U,
|
|
547
546
|
"list",
|
|
548
547
|
{ forwardAsChild: !0 }
|
|
549
548
|
);
|
|
550
|
-
|
|
549
|
+
E(
|
|
551
550
|
D,
|
|
552
551
|
"indicator",
|
|
553
552
|
{ forwardAsChild: !0 }
|
|
554
553
|
);
|
|
555
|
-
const
|
|
554
|
+
const Ke = {
|
|
556
555
|
xs: "sm",
|
|
557
556
|
sm: "md",
|
|
558
557
|
md: "md",
|
|
559
558
|
lg: "lg"
|
|
560
|
-
},
|
|
559
|
+
}, qe = {
|
|
561
560
|
xs: "xs",
|
|
562
561
|
sm: "xs",
|
|
563
562
|
md: "sm",
|
|
564
563
|
lg: "md"
|
|
565
|
-
},
|
|
564
|
+
}, ze = ({
|
|
566
565
|
iconName: e,
|
|
567
566
|
iconPosition: t = "left",
|
|
568
567
|
label: s,
|
|
@@ -570,8 +569,8 @@ const qe = {
|
|
|
570
569
|
showNotificationCounter: r,
|
|
571
570
|
size: o = "md",
|
|
572
571
|
["data-testid"]: n = "kibble-tab",
|
|
573
|
-
...
|
|
574
|
-
}) => /* @__PURE__ */ c.jsxs(
|
|
572
|
+
...d
|
|
573
|
+
}) => /* @__PURE__ */ c.jsxs(Me, { className: "Tab", "data-testid": n, ...d, children: [
|
|
575
574
|
!!e && t === "left" && /* @__PURE__ */ c.jsx(
|
|
576
575
|
L,
|
|
577
576
|
{
|
|
@@ -582,7 +581,7 @@ const qe = {
|
|
|
582
581
|
variant: "default"
|
|
583
582
|
}
|
|
584
583
|
),
|
|
585
|
-
/* @__PURE__ */ c.jsx(G, { as: "span", className: "Tab__Label", "data-testid": `${n}-label`, size:
|
|
584
|
+
/* @__PURE__ */ c.jsx(G, { as: "span", className: "Tab__Label", "data-testid": `${n}-label`, size: qe[o], children: s }),
|
|
586
585
|
!!e && t === "right" && /* @__PURE__ */ c.jsx(L, { className: "Tab__Icon", "data-testid": `${n}-icon-right`, name: e, size: o }),
|
|
587
586
|
r && /* @__PURE__ */ c.jsx(
|
|
588
587
|
Y,
|
|
@@ -590,10 +589,10 @@ const qe = {
|
|
|
590
589
|
className: "Tab__NotificationCounter",
|
|
591
590
|
"data-testid": `${n}-notification-counter`,
|
|
592
591
|
...a,
|
|
593
|
-
size:
|
|
592
|
+
size: Ke[o]
|
|
594
593
|
}
|
|
595
594
|
)
|
|
596
|
-
] }),
|
|
595
|
+
] }), nt = ({
|
|
597
596
|
align: e = "start",
|
|
598
597
|
onChange: t,
|
|
599
598
|
scrollable: s = !1,
|
|
@@ -601,45 +600,42 @@ const qe = {
|
|
|
601
600
|
tabs: r,
|
|
602
601
|
tabsContent: o,
|
|
603
602
|
["data-testid"]: n = "kibble-tabs",
|
|
604
|
-
...
|
|
605
|
-
}) =>
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
justify: e || u.justify,
|
|
623
|
-
size: a,
|
|
624
|
-
onValueChange: ({ value: d }) => t?.(d),
|
|
625
|
-
...u,
|
|
626
|
-
children: [
|
|
627
|
-
s ? /* @__PURE__ */ c.jsx(xe, { overflowX: "auto", scrollbarWidth: "none", children: g }) : g,
|
|
628
|
-
!!o && o.map((d, f) => /* @__PURE__ */ c.jsx(
|
|
629
|
-
He,
|
|
630
|
-
{
|
|
631
|
-
"data-testid": `${n}-content-${r[f].value}`,
|
|
632
|
-
...d
|
|
603
|
+
...d
|
|
604
|
+
}) => /* @__PURE__ */ c.jsxs(
|
|
605
|
+
We,
|
|
606
|
+
{
|
|
607
|
+
className: "Tabs",
|
|
608
|
+
"data-testid": n,
|
|
609
|
+
justify: e || d.justify,
|
|
610
|
+
size: a,
|
|
611
|
+
onValueChange: ({ value: u }) => t?.(u),
|
|
612
|
+
...d,
|
|
613
|
+
children: [
|
|
614
|
+
/* @__PURE__ */ c.jsx(
|
|
615
|
+
He,
|
|
616
|
+
{
|
|
617
|
+
className: "Tabs__List",
|
|
618
|
+
"data-testid": `${n}-trigger-list`,
|
|
619
|
+
...s && {
|
|
620
|
+
css: { overflowX: "auto", flexWrap: "nowrap", scrollbarWidth: "none" }
|
|
633
621
|
},
|
|
634
|
-
`${n}-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
622
|
+
children: r.map((u, g) => /* @__PURE__ */ c.jsx(ze, { ...u, "data-testid": `${n}-trigger-${u.value}`, size: a }, `tab-${g}`))
|
|
623
|
+
}
|
|
624
|
+
),
|
|
625
|
+
!!o && o.map((u, g) => /* @__PURE__ */ c.jsx(
|
|
626
|
+
Xe,
|
|
627
|
+
{
|
|
628
|
+
"data-testid": `${n}-content-${r[g].value}`,
|
|
629
|
+
...u
|
|
630
|
+
},
|
|
631
|
+
`${n}-tabContent-${g}`
|
|
632
|
+
))
|
|
633
|
+
]
|
|
634
|
+
}
|
|
635
|
+
), it = ["xs", "sm", "md", "lg"], ct = ["left", "right"];
|
|
640
636
|
export {
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
637
|
+
nt as T,
|
|
638
|
+
ct as a,
|
|
639
|
+
it as t
|
|
644
640
|
};
|
|
645
|
-
//# sourceMappingURL=tab.types-
|
|
641
|
+
//# sourceMappingURL=tab.types-bJ04v7AW.js.map
|