@stihl-design-system/components 1.0.0-RC.40 → 1.0.0-RC.41
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/{accordion.nt0Foequ.js → accordion.CiiPLwYQ.js} +1 -1
- package/{actionbutton.Ctea6drN.js → actionbutton.DKb4ph1c.js} +1 -1
- package/{actionlink.VX1OMtm-.js → actionlink.DEGta2h9.js} +1 -1
- package/{chipgroup.i5SOv6LA.js → chipgroup.CSjQHeeW.js} +17 -17
- package/chunks/Accordion.Q50G9LZ3.js +172 -0
- package/chunks/ActionButton.BEMy35Lh.js +188 -0
- package/chunks/ActionLink.DECHT42B.js +161 -0
- package/chunks/{NavigationTabList.C2f-lWex.js → NavigationTabList.ltT6igtk.js} +23 -22
- package/chunks/NavigationTabs.DsVepb7H.js +63 -0
- package/chunks/Tabs.DfH2q9EL.js +84 -0
- package/components/Accordion/Accordion.d.ts +2 -0
- package/components/Accordion/Accordion.utils.d.ts +2 -2
- package/components/ActionButton/ActionButton.d.ts +2 -0
- package/components/ActionButton/ActionButton.utils.d.ts +2 -2
- package/components/ActionLink/ActionLink.d.ts +2 -0
- package/components/ActionLink/ActionLink.utils.d.ts +2 -2
- package/components/ChipGroup/ChipGroup.d.ts +7 -1
- package/components/ChipGroup/ChipGroup.utils.d.ts +2 -2
- package/components/NavigationTabs/NavigationTabs.d.ts +3 -0
- package/components/Tabs/Tabs.d.ts +3 -0
- package/index.es.js +6 -6
- package/{navigationtablist.CKPpQrme.js → navigationtablist.Cd9hZzFQ.js} +1 -1
- package/{navigationtabs.VUAOwesQ.js → navigationtabs.DHG-TeF2.js} +2 -2
- package/package.json +1 -1
- package/{tablist.hMHdX1V8.js → tablist.DPiNeY3_.js} +66 -65
- package/{tabs.t-gR7dGc.js → tabs.Cxzm6ZZ-.js} +2 -2
- package/chunks/Accordion.B-0pf8Fq.js +0 -168
- package/chunks/ActionButton.wdWh7E2b.js +0 -182
- package/chunks/ActionLink.DwUP-Kgm.js +0 -155
- package/chunks/NavigationTabs.D2QrnlL2.js +0 -62
- package/chunks/Tabs.2JTenRcr.js +0 -83
- /package/components/Accordion/{Acordion.utils.test.d.ts → Accordion.utils.test.d.ts} +0 -0
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as k, jsx as
|
|
3
|
-
import { c as
|
|
4
|
-
import { useState as E, useRef as
|
|
5
|
-
import { g as
|
|
2
|
+
import { jsxs as k, jsx as p } from "react/jsx-runtime";
|
|
3
|
+
import { c as D } from "./chunks/index.DQOqod3i.js";
|
|
4
|
+
import { useState as E, useRef as g, useEffect as ot } from "react";
|
|
5
|
+
import { g as h, i as C } from "./chunks/is-animation-disabled.B-V_68K-.js";
|
|
6
6
|
import { h as nt } from "./chunks/has-window.ut_-aShB.js";
|
|
7
7
|
import { g as st } from "./chunks/helpers.CexwVao7.js";
|
|
8
8
|
import { u as W } from "./chunks/useIsomorphicLayoutEffect.CnJ9AMFS.js";
|
|
@@ -11,26 +11,26 @@ import { D as X } from "./chunks/Button.DpGeheky.js";
|
|
|
11
11
|
import { D as ct } from "./chunks/Icon.m6sMB6vl.js";
|
|
12
12
|
import { NumberIndicator as it } from "./numberindicator.ZGVRSmqf.js";
|
|
13
13
|
import { g as at, a as j } from "./chunks/TabPane.utils.DG16Y2uD.js";
|
|
14
|
-
import { s as
|
|
15
|
-
const
|
|
14
|
+
import { s as c, N as lt } from "./chunks/NavigationTabList.ltT6igtk.js";
|
|
15
|
+
const b = 48, Lt = ({
|
|
16
16
|
aria: q,
|
|
17
|
-
id:
|
|
17
|
+
id: L,
|
|
18
18
|
selectedTabIndex: n,
|
|
19
19
|
setSelectedTabIndex: F,
|
|
20
20
|
tabs: l,
|
|
21
21
|
alignment: I = "left",
|
|
22
22
|
className: G,
|
|
23
23
|
defaultSelectedTabIndex: Q = 0,
|
|
24
|
-
isNavigation:
|
|
24
|
+
isNavigation: T,
|
|
25
25
|
onTabChange: z,
|
|
26
26
|
...J
|
|
27
27
|
}) => {
|
|
28
|
-
const [A, u] = E(Q), [U, V] = E(!1), [Y, Z] = E(!1),
|
|
28
|
+
const [A, u] = E(Q), [U, V] = E(!1), [Y, Z] = E(!1), d = g([]), v = g(null), s = g(null), i = g(null), w = g(!1), H = g(n), N = () => {
|
|
29
29
|
P(), x();
|
|
30
30
|
};
|
|
31
31
|
W(() => {
|
|
32
|
-
const e = new ResizeObserver(
|
|
33
|
-
return
|
|
32
|
+
const e = new ResizeObserver(N);
|
|
33
|
+
return s.current && e.observe(s.current), () => {
|
|
34
34
|
e.disconnect();
|
|
35
35
|
};
|
|
36
36
|
}, []), W(() => {
|
|
@@ -43,46 +43,46 @@ const g = 48, Lt = ({
|
|
|
43
43
|
// utility small demi - Number indicator
|
|
44
44
|
];
|
|
45
45
|
Promise.all(e.map((o) => document.fonts.load(o))).then(() => {
|
|
46
|
-
|
|
46
|
+
S(n), R("next", n, "instant"), P(), w.current = !0;
|
|
47
47
|
}).catch((o) => {
|
|
48
48
|
throw new Error(st("DSTabs", `The component requires the fonts to be loaded: ${o}`));
|
|
49
49
|
});
|
|
50
50
|
const t = () => {
|
|
51
|
-
!w.current || !
|
|
51
|
+
!w.current || !i.current || (r.matches ? i.current.style.transitionDuration = "0s" : i.current.style.transitionDuration = "");
|
|
52
52
|
}, r = window.matchMedia("(prefers-reduced-motion: reduce)");
|
|
53
|
-
return r.addEventListener("change", t),
|
|
54
|
-
r.removeEventListener("change", t),
|
|
53
|
+
return r.addEventListener("change", t), s.current?.addEventListener("scroll", N), () => {
|
|
54
|
+
r.removeEventListener("change", t), s.current?.removeEventListener("scroll", N);
|
|
55
55
|
};
|
|
56
56
|
}, [l, I]), W(() => {
|
|
57
|
-
if (w.current && (
|
|
57
|
+
if (w.current && (S(n), T)) {
|
|
58
58
|
const e = M(n);
|
|
59
59
|
u(n), R(e, n);
|
|
60
60
|
}
|
|
61
61
|
H.current = n;
|
|
62
62
|
}, [n]), ot(() => {
|
|
63
|
-
w.current &&
|
|
63
|
+
w.current && d.current[A]?.focus();
|
|
64
64
|
}, [A]);
|
|
65
|
-
const
|
|
65
|
+
const y = (e) => {
|
|
66
66
|
const t = M(e);
|
|
67
67
|
F(e), u(e), R(t, e), z && z(e);
|
|
68
68
|
}, M = (e) => {
|
|
69
|
-
const t =
|
|
69
|
+
const t = h(s.current), r = h(d.current[e]);
|
|
70
70
|
let o = "next";
|
|
71
|
-
return r.left -
|
|
71
|
+
return r.left - b < t.left ? o = "prev" : r.right + b > t.right ? o = "next" : o = n < e ? "next" : "prev", o;
|
|
72
72
|
}, P = () => {
|
|
73
|
-
if (
|
|
74
|
-
const e =
|
|
73
|
+
if (s.current && v.current) {
|
|
74
|
+
const e = h(s.current), t = h(v.current);
|
|
75
75
|
V(t.left < e.left), Z(t.right > e.right + 4);
|
|
76
76
|
}
|
|
77
77
|
}, O = (e = 0) => {
|
|
78
|
-
nt &&
|
|
79
|
-
|
|
78
|
+
nt && i.current && !C() && setTimeout(() => {
|
|
79
|
+
i.current && (i.current.style.transitionDuration = "250ms");
|
|
80
80
|
}, e);
|
|
81
81
|
}, x = () => {
|
|
82
|
-
|
|
83
|
-
},
|
|
84
|
-
const t =
|
|
85
|
-
t && (w.current ? (t.style.width = `${r.width}px`, t.style.transform = `translateX(${
|
|
82
|
+
i.current && (i.current.style.transitionDuration = "0s", S(H.current), O());
|
|
83
|
+
}, S = (e) => {
|
|
84
|
+
const t = i.current, r = h(d.current[e]), o = h(v.current), f = r.left - o.left;
|
|
85
|
+
t && (w.current ? (t.style.width = `${r.width}px`, t.style.transform = `translateX(${f}px)`) : (t.style.transitionDuration = "0s", t.style.transform = `translateX(${f}px)`, t.style.width = `${r.width}px`, O(50)));
|
|
86
86
|
}, _ = (e, t) => {
|
|
87
87
|
let r;
|
|
88
88
|
switch (e.key) {
|
|
@@ -100,7 +100,7 @@ const g = 48, Lt = ({
|
|
|
100
100
|
break;
|
|
101
101
|
case "Enter":
|
|
102
102
|
case " ":
|
|
103
|
-
|
|
103
|
+
y(t);
|
|
104
104
|
return;
|
|
105
105
|
default:
|
|
106
106
|
return;
|
|
@@ -121,7 +121,7 @@ const g = 48, Lt = ({
|
|
|
121
121
|
r = t + 1 > l.length - 1 ? t : t + 1, u(r), t !== l.length - 1 && e.preventDefault();
|
|
122
122
|
break;
|
|
123
123
|
case "Enter":
|
|
124
|
-
|
|
124
|
+
y(t);
|
|
125
125
|
return;
|
|
126
126
|
default:
|
|
127
127
|
return;
|
|
@@ -131,77 +131,78 @@ const g = 48, Lt = ({
|
|
|
131
131
|
setTimeout(() => R(o, r), 0);
|
|
132
132
|
}
|
|
133
133
|
}, R = (e, t, r = "smooth") => {
|
|
134
|
-
const o =
|
|
134
|
+
const o = d.current[t], f = s.current, a = h(o), m = h(f);
|
|
135
135
|
let B;
|
|
136
|
-
if (!(!o || !
|
|
136
|
+
if (!(!o || !f)) {
|
|
137
137
|
if (e === "prev") {
|
|
138
|
-
if (
|
|
138
|
+
if (a.left - b > m.left)
|
|
139
139
|
return;
|
|
140
|
-
B = o.offsetLeft -
|
|
140
|
+
B = o.offsetLeft - b;
|
|
141
141
|
} else {
|
|
142
|
-
if (
|
|
142
|
+
if (a.right + b < m.right)
|
|
143
143
|
return;
|
|
144
|
-
B = o.offsetLeft + o.offsetWidth -
|
|
144
|
+
B = o.offsetLeft + o.offsetWidth - m.width + b;
|
|
145
145
|
}
|
|
146
|
-
|
|
146
|
+
f.scrollTo({
|
|
147
147
|
left: B,
|
|
148
148
|
behavior: C() ? "instant" : r
|
|
149
149
|
});
|
|
150
150
|
}
|
|
151
151
|
}, $ = (e) => {
|
|
152
152
|
const t = et(e);
|
|
153
|
-
|
|
153
|
+
s.current?.scrollTo({
|
|
154
154
|
left: t,
|
|
155
155
|
behavior: C() ? "instant" : "smooth"
|
|
156
156
|
});
|
|
157
157
|
}, et = (e) => {
|
|
158
|
-
if (!
|
|
158
|
+
if (!v.current || !s.current)
|
|
159
159
|
return 0;
|
|
160
160
|
const {
|
|
161
161
|
scrollLeft: t,
|
|
162
162
|
offsetWidth: r
|
|
163
|
-
} =
|
|
163
|
+
} = s.current, o = Math.round(r * 0.2);
|
|
164
164
|
return e === "next" ? t + o : t - o;
|
|
165
|
-
}, K =
|
|
166
|
-
[
|
|
167
|
-
}), rt =
|
|
168
|
-
return /* @__PURE__ */ k("div", { className:
|
|
169
|
-
/* @__PURE__ */ k(rt, { className:
|
|
170
|
-
|
|
165
|
+
}, K = D(c.scroller, {
|
|
166
|
+
[c.scrollerCentered]: I === "center"
|
|
167
|
+
}), rt = T ? "nav" : "div";
|
|
168
|
+
return /* @__PURE__ */ k("div", { className: D(c.tabsWrapper, G), ...J, children: [
|
|
169
|
+
/* @__PURE__ */ k(rt, { className: c.scrollWrapper, ref: s, ...q, children: [
|
|
170
|
+
T ? /* @__PURE__ */ p(lt, { tabs: l, tabRefs: d, scrollerRef: v, handleNavigationKeydown: tt, scrollerClass: K, selectedTabIndex: n, setSelectedTab: y }) : /* @__PURE__ */ p("div", { role: "tablist", className: K, ref: v, children: l.map(({
|
|
171
171
|
id: e,
|
|
172
172
|
label: t,
|
|
173
173
|
iconName: r,
|
|
174
|
-
numberIndicatorValue: o
|
|
175
|
-
|
|
174
|
+
numberIndicatorValue: o,
|
|
175
|
+
numberIndicatorAriaLabel: f
|
|
176
|
+
}, a) => /* @__PURE__ */ k(
|
|
176
177
|
"button",
|
|
177
178
|
{
|
|
178
|
-
id: j(
|
|
179
|
+
id: j(L, e),
|
|
179
180
|
role: "tab",
|
|
180
|
-
"aria-selected": n ===
|
|
181
|
-
"aria-controls": at(
|
|
182
|
-
tabIndex: n ===
|
|
183
|
-
className:
|
|
184
|
-
ref: (
|
|
185
|
-
|
|
181
|
+
"aria-selected": n === a,
|
|
182
|
+
"aria-controls": at(L, e, a),
|
|
183
|
+
tabIndex: n === a ? 0 : -1,
|
|
184
|
+
className: c.tab,
|
|
185
|
+
ref: (m) => {
|
|
186
|
+
d.current[a] = m;
|
|
186
187
|
},
|
|
187
|
-
onClick: () =>
|
|
188
|
-
onKeyDown: (
|
|
188
|
+
onClick: () => y(a),
|
|
189
|
+
onKeyDown: (m) => _(m, a),
|
|
189
190
|
type: "button",
|
|
190
191
|
children: [
|
|
191
|
-
r && /* @__PURE__ */
|
|
192
|
+
r && /* @__PURE__ */ p(ct, { name: r, "aria-hidden": "true" }),
|
|
192
193
|
t,
|
|
193
|
-
o && /* @__PURE__ */
|
|
194
|
+
o && /* @__PURE__ */ p(it, { "aria-label": f, label: o })
|
|
194
195
|
]
|
|
195
196
|
},
|
|
196
|
-
j(
|
|
197
|
+
j(L, e)
|
|
197
198
|
)) }),
|
|
198
|
-
/* @__PURE__ */
|
|
199
|
+
/* @__PURE__ */ p("span", { className: c.indicator, ref: i })
|
|
199
200
|
] }),
|
|
200
|
-
/* @__PURE__ */
|
|
201
|
-
[
|
|
201
|
+
/* @__PURE__ */ p(X, { variant: "filled", className: D(c.scrollButton, {
|
|
202
|
+
[c.scrollButtonHidden]: !U
|
|
202
203
|
}), hideLabel: !0, iconName: "chevron-left", tabIndex: -1, size: "small", onClick: () => $("prev"), type: "button", children: "Left" }),
|
|
203
|
-
/* @__PURE__ */
|
|
204
|
-
[
|
|
204
|
+
/* @__PURE__ */ p(X, { variant: "filled", className: D(c.scrollButton, c.scrollButtonRight, {
|
|
205
|
+
[c.scrollButtonHidden]: !Y
|
|
205
206
|
}), hideLabel: !0, iconName: "chevron-right", tabIndex: -1, size: "small", onClick: () => $("next"), type: "button", children: "Right" })
|
|
206
207
|
] });
|
|
207
208
|
};
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
import "react/jsx-runtime";
|
|
3
3
|
import "./chunks/index.cKLI89Eg.js";
|
|
4
4
|
import "react";
|
|
5
|
-
import "./tablist.
|
|
5
|
+
import "./tablist.DPiNeY3_.js";
|
|
6
6
|
import "./tabpane.7vMXUKFX.js";
|
|
7
7
|
import "./chunks/TabPane.utils.DG16Y2uD.js";
|
|
8
|
-
import { D as a } from "./chunks/Tabs.
|
|
8
|
+
import { D as a } from "./chunks/Tabs.DfH2q9EL.js";
|
|
9
9
|
export {
|
|
10
10
|
a as DSTabs
|
|
11
11
|
};
|
|
@@ -1,168 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsx as l, jsxs as q } from "react/jsx-runtime";
|
|
3
|
-
import { d as ye } from "./index.cKLI89Eg.js";
|
|
4
|
-
import { c as W } from "./index.DQOqod3i.js";
|
|
5
|
-
import { forwardRef as fe, useRef as ge, useState as Se, useImperativeHandle as Ce, useEffect as _e } from "react";
|
|
6
|
-
import { DSHeading as ve } from "../heading.BHSklXho.js";
|
|
7
|
-
import { D as We } from "./Icon.m6sMB6vl.js";
|
|
8
|
-
import { NumberIndicator as Oe } from "../numberindicator.ZGVRSmqf.js";
|
|
9
|
-
import { g as ie } from "./helpers.CexwVao7.js";
|
|
10
|
-
import '../assets/Accordion.Cr1dbVTH.css';const Ne = "ds-accordion_details_2g22m_1", we = "ds-accordion_summary_2g22m_117", De = "ds-accordion_summary--utility--m_2g22m_156", xe = "ds-accordion_summary--flush_2g22m_185", Ie = "ds-accordion_summary--small_2g22m_253", Ee = "ds-accordion_summary--x-small_2g22m_257", Ae = "ds-accordion_summary-content-wrapper_2g22m_262", Xe = "ds-accordion_summary-content-wrapper--flush_2g22m_268", be = "ds-accordion_summary-content-wrapper--chevron-left_2g22m_272", Fe = "ds-accordion_summary-content-wrapper--x-small_2g22m_276", Te = "ds-accordion_heading-summary-wrapper_2g22m_280", Pe = "ds-accordion_heading-summary_2g22m_280", Re = "ds-accordion_heading-summary--x-small_2g22m_290", Le = "ds-accordion_hint_2g22m_294", je = "ds-accordion_icon_2g22m_308", ze = "ds-accordion_icon--open_2g22m_319", Me = "ds-accordion_icon--open-caret_2g22m_330", He = "ds-accordion_content-wrapper_2g22m_342", Ue = "ds-accordion_content-wrapper--flush_2g22m_348", Ve = "ds-accordion_content-wrapper--small_2g22m_352", qe = "ds-accordion_content-wrapper--x-small_2g22m_356", t = {
|
|
11
|
-
details: Ne,
|
|
12
|
-
summary: we,
|
|
13
|
-
summaryUtilityM: De,
|
|
14
|
-
summaryFlush: xe,
|
|
15
|
-
summarySmall: Ie,
|
|
16
|
-
summaryXSmall: Ee,
|
|
17
|
-
summaryContentWrapper: Ae,
|
|
18
|
-
summaryContentWrapperFlush: Xe,
|
|
19
|
-
summaryContentWrapperChevronLeft: be,
|
|
20
|
-
summaryContentWrapperXSmall: Fe,
|
|
21
|
-
headingSummaryWrapper: Te,
|
|
22
|
-
headingSummary: Pe,
|
|
23
|
-
headingSummaryXSmall: Re,
|
|
24
|
-
hint: Le,
|
|
25
|
-
icon: je,
|
|
26
|
-
iconOpen: ze,
|
|
27
|
-
iconOpenCaret: Me,
|
|
28
|
-
contentWrapper: He,
|
|
29
|
-
contentWrapperFlush: Ue,
|
|
30
|
-
contentWrapperSmall: Ve,
|
|
31
|
-
contentWrapperXSmall: qe
|
|
32
|
-
}, tt = ["medium", "small", "x-small"], rt = ["chevron", "caret"], nt = ["left", "right"], Ze = ({
|
|
33
|
-
children: O,
|
|
34
|
-
hint: Z,
|
|
35
|
-
numberIndicatorValue: e,
|
|
36
|
-
summary: n
|
|
37
|
-
}) => {
|
|
38
|
-
if (!O)
|
|
39
|
-
throw new Error(ie("DSAccordion", "The component requires children to be set."));
|
|
40
|
-
if (!n)
|
|
41
|
-
throw new Error(ie("DSAccordion", "The summary prop is required. Please add the summary prop to the DSAccordion component."));
|
|
42
|
-
if (Z && (e || e === ""))
|
|
43
|
-
throw new Error(ie("DSAccordion", "The hint and numberIndicator props cannot be used together. Please remove either the hint prop or the numberIndicatorValue prop."));
|
|
44
|
-
}, $e = fe((O, Z) => {
|
|
45
|
-
const e = ye.c(73);
|
|
46
|
-
let n, i, o, s, p, r, N, w, D, x;
|
|
47
|
-
e[0] !== O ? ({
|
|
48
|
-
children: n,
|
|
49
|
-
summary: r,
|
|
50
|
-
chevronPosition: N,
|
|
51
|
-
className: i,
|
|
52
|
-
hint: o,
|
|
53
|
-
isFlush: w,
|
|
54
|
-
isOpen: D,
|
|
55
|
-
numberIndicatorValue: s,
|
|
56
|
-
size: x,
|
|
57
|
-
...p
|
|
58
|
-
} = O, e[0] = O, e[1] = n, e[2] = i, e[3] = o, e[4] = s, e[5] = p, e[6] = r, e[7] = N, e[8] = w, e[9] = D, e[10] = x) : (n = e[1], i = e[2], o = e[3], s = e[4], p = e[5], r = e[6], N = e[7], w = e[8], D = e[9], x = e[10]);
|
|
59
|
-
const pe = N === void 0 ? "right" : N, a = w === void 0 ? !1 : w, c = D === void 0 ? !1 : D, d = x === void 0 ? "medium" : x;
|
|
60
|
-
process.env.NODE_ENV !== "production" && Ze({
|
|
61
|
-
children: n,
|
|
62
|
-
hint: o,
|
|
63
|
-
numberIndicatorValue: s,
|
|
64
|
-
summary: r
|
|
65
|
-
});
|
|
66
|
-
const $ = pe === "right" ? "chevron" : "caret", m = ge(null), [de, ue] = Se(c);
|
|
67
|
-
let E;
|
|
68
|
-
e[11] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (E = () => m.current, e[11] = E) : E = e[11], Ce(Z, E);
|
|
69
|
-
let A;
|
|
70
|
-
e[12] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (A = () => {
|
|
71
|
-
m.current && ue(m.current.open);
|
|
72
|
-
}, e[12] = A) : A = e[12];
|
|
73
|
-
let X;
|
|
74
|
-
e[13] !== c ? (X = [c], e[13] = c, e[14] = X) : X = e[14], _e(A, X);
|
|
75
|
-
let b, F;
|
|
76
|
-
e[15] === /* @__PURE__ */ Symbol.for("react.memo_cache_sentinel") ? (b = () => {
|
|
77
|
-
const he = () => {
|
|
78
|
-
m.current && ue(m.current.open);
|
|
79
|
-
};
|
|
80
|
-
return m.current?.addEventListener("toggle", he), () => {
|
|
81
|
-
m.current?.removeEventListener("toggle", he);
|
|
82
|
-
};
|
|
83
|
-
}, F = [], e[15] = b, e[16] = F) : (b = e[15], F = e[16]), _e(b, F);
|
|
84
|
-
let T, P, R;
|
|
85
|
-
const I = typeof r == "object" && r !== void 0;
|
|
86
|
-
I && ({
|
|
87
|
-
headingSize: T,
|
|
88
|
-
headingTag: P,
|
|
89
|
-
headingText: R
|
|
90
|
-
} = r);
|
|
91
|
-
let L;
|
|
92
|
-
e[17] !== i ? (L = W(t.details, i), e[17] = i, e[18] = L) : L = e[18];
|
|
93
|
-
const k = L, B = d === "small", G = d === "x-small", J = !I;
|
|
94
|
-
let j;
|
|
95
|
-
e[19] !== a || e[20] !== B || e[21] !== G || e[22] !== J ? (j = W(t.summary, {
|
|
96
|
-
[t.summaryFlush]: a,
|
|
97
|
-
[t.summarySmall]: B,
|
|
98
|
-
[t.summaryXSmall]: G,
|
|
99
|
-
[t.summaryUtilityM]: J
|
|
100
|
-
}), e[19] = a, e[20] = B, e[21] = G, e[22] = J, e[23] = j) : j = e[23];
|
|
101
|
-
const K = j, Q = pe === "left", Y = d === "x-small";
|
|
102
|
-
let z;
|
|
103
|
-
e[24] !== a || e[25] !== Q || e[26] !== Y ? (z = W(t.summaryContentWrapper, {
|
|
104
|
-
[t.summaryContentWrapperFlush]: a,
|
|
105
|
-
[t.summaryContentWrapperChevronLeft]: Q,
|
|
106
|
-
[t.summaryContentWrapperXSmall]: Y
|
|
107
|
-
}), e[24] = a, e[25] = Q, e[26] = Y, e[27] = z) : z = e[27];
|
|
108
|
-
const ee = z, te = d === "x-small";
|
|
109
|
-
let M;
|
|
110
|
-
e[28] !== te ? (M = W(t.headingSummary, {
|
|
111
|
-
[t.headingSummaryXSmall]: te
|
|
112
|
-
}), e[28] = te, e[29] = M) : M = e[29];
|
|
113
|
-
const re = M, ne = $ === "chevron" && de, se = $ === "caret" && de;
|
|
114
|
-
let H;
|
|
115
|
-
e[30] !== ne || e[31] !== se ? (H = W(t.icon, {
|
|
116
|
-
[t.iconOpen]: ne,
|
|
117
|
-
[t.iconOpenCaret]: se
|
|
118
|
-
}), e[30] = ne, e[31] = se, e[32] = H) : H = e[32];
|
|
119
|
-
const ae = H, oe = d === "small", me = d === "x-small";
|
|
120
|
-
let U;
|
|
121
|
-
e[33] !== a || e[34] !== oe || e[35] !== me ? (U = W(t.contentWrapper, {
|
|
122
|
-
[t.contentWrapperFlush]: a,
|
|
123
|
-
[t.contentWrapperSmall]: oe,
|
|
124
|
-
[t.contentWrapperXSmall]: me
|
|
125
|
-
}), e[33] = a, e[34] = oe, e[35] = me, e[36] = U) : U = e[36];
|
|
126
|
-
const ce = U;
|
|
127
|
-
let u;
|
|
128
|
-
e[37] !== T || e[38] !== P || e[39] !== R || e[40] !== I || e[41] !== r ? (u = I ? /* @__PURE__ */ l(ve, { tag: P, size: T, children: R }) : r, e[37] = T, e[38] = P, e[39] = R, e[40] = I, e[41] = r, e[42] = u) : u = e[42];
|
|
129
|
-
let h;
|
|
130
|
-
e[43] !== s ? (h = (s || s?.trim() === "") && /* @__PURE__ */ l("div", { children: /* @__PURE__ */ l(Oe, { label: s }) }), e[43] = s, e[44] = h) : h = e[44];
|
|
131
|
-
let _;
|
|
132
|
-
e[45] !== re || e[46] !== u || e[47] !== h ? (_ = /* @__PURE__ */ q("div", { className: re, children: [
|
|
133
|
-
u,
|
|
134
|
-
h
|
|
135
|
-
] }), e[45] = re, e[46] = u, e[47] = h, e[48] = _) : _ = e[48];
|
|
136
|
-
let y;
|
|
137
|
-
e[49] !== o ? (y = o && /* @__PURE__ */ l("div", { className: t.hint, children: o }), e[49] = o, e[50] = y) : y = e[50];
|
|
138
|
-
let f;
|
|
139
|
-
e[51] !== _ || e[52] !== y ? (f = /* @__PURE__ */ q("div", { className: t.headingSummaryWrapper, children: [
|
|
140
|
-
_,
|
|
141
|
-
y
|
|
142
|
-
] }), e[51] = _, e[52] = y, e[53] = f) : f = e[53];
|
|
143
|
-
const le = $ === "chevron" ? "chevron-down" : "caret-right";
|
|
144
|
-
let g;
|
|
145
|
-
e[54] !== ae || e[55] !== le ? (g = /* @__PURE__ */ l(We, { name: le, "aria-hidden": "true", className: ae }), e[54] = ae, e[55] = le, e[56] = g) : g = e[56];
|
|
146
|
-
let S;
|
|
147
|
-
e[57] !== ee || e[58] !== f || e[59] !== g ? (S = /* @__PURE__ */ q("div", { className: ee, children: [
|
|
148
|
-
f,
|
|
149
|
-
g
|
|
150
|
-
] }), e[57] = ee, e[58] = f, e[59] = g, e[60] = S) : S = e[60];
|
|
151
|
-
let C;
|
|
152
|
-
e[61] !== K || e[62] !== S ? (C = /* @__PURE__ */ l("summary", { className: K, children: S }), e[61] = K, e[62] = S, e[63] = C) : C = e[63];
|
|
153
|
-
let v;
|
|
154
|
-
e[64] !== n || e[65] !== ce ? (v = /* @__PURE__ */ l("div", { className: ce, children: n }), e[64] = n, e[65] = ce, e[66] = v) : v = e[66];
|
|
155
|
-
let V;
|
|
156
|
-
return e[67] !== k || e[68] !== c || e[69] !== p || e[70] !== C || e[71] !== v ? (V = /* @__PURE__ */ q("details", { ...p, ref: m, className: k, open: c, children: [
|
|
157
|
-
C,
|
|
158
|
-
v
|
|
159
|
-
] }), e[67] = k, e[68] = c, e[69] = p, e[70] = C, e[71] = v, e[72] = V) : V = e[72], V;
|
|
160
|
-
});
|
|
161
|
-
$e.displayName = "DSAccordion";
|
|
162
|
-
export {
|
|
163
|
-
tt as A,
|
|
164
|
-
nt as C,
|
|
165
|
-
$e as D,
|
|
166
|
-
rt as a,
|
|
167
|
-
Ze as v
|
|
168
|
-
};
|
|
@@ -1,182 +0,0 @@
|
|
|
1
|
-
"use client";
|
|
2
|
-
import { jsxs as $, jsx as p, Fragment as At } from "react/jsx-runtime";
|
|
3
|
-
import { d as zt } from "./index.cKLI89Eg.js";
|
|
4
|
-
import { c as S } from "./index.DQOqod3i.js";
|
|
5
|
-
import { forwardRef as St } from "react";
|
|
6
|
-
import { D as Tt } from "./Icon.m6sMB6vl.js";
|
|
7
|
-
import { NumberIndicator as wt } from "../numberindicator.ZGVRSmqf.js";
|
|
8
|
-
import { Tooltip as Nt } from "../tooltip._lP4aMV2.js";
|
|
9
|
-
import { g as C } from "./helpers.CexwVao7.js";
|
|
10
|
-
import '../assets/ActionButton.BLOWs6IZ.css';const Ct = "ds-action-button_root_19zdv_1", Ot = "ds-action-button_root--indent-level-1_19zdv_75", Pt = "ds-action-button_root--active_19zdv_78", Dt = "ds-action-button_root--active--with-marker_19zdv_81", Bt = "ds-action-button_root--icon--top_19zdv_84", kt = "ds-action-button_root--stretched_19zdv_110", Lt = "ds-action-button_active-marker_19zdv_115", Et = "ds-action-button_active-marker--with-indent_19zdv_127", xt = "ds-action-button_icon-wrapper_19zdv_131", Mt = "ds-action-button_icon-wrapper--x-large_19zdv_134", Ut = "ds-action-button_icon-wrapper--with-number-indicator_19zdv_137", Vt = "ds-action-button_icon-wrapper--with-number-indicator--with-value_19zdv_145", Rt = "ds-action-button_label_19zdv_149", yt = "ds-action-button_label--bold_19zdv_160", Ht = "ds-action-button_label--active_19zdv_171", Xt = "ds-action-button_label--icon-top_19zdv_182", jt = "ds-action-button_number-indicator_19zdv_205", Ft = "ds-action-button_label-wrapper_19zdv_209", Gt = "ds-action-button_label-wrapper--icon-top_19zdv_214", Zt = "ds-action-button_chevron_19zdv_218", $t = "ds-action-button_chevron--icon-position-top_19zdv_233", qt = "ds-action-button_chevron--up_19zdv_239", Jt = "ds-action-button_chevron--right_19zdv_250", Kt = "ds-action-button_chevron--left_19zdv_261", o = {
|
|
11
|
-
root: Ct,
|
|
12
|
-
rootIndentLevel1: Ot,
|
|
13
|
-
rootActive: Pt,
|
|
14
|
-
rootActiveWithMarker: Dt,
|
|
15
|
-
rootIconTop: Bt,
|
|
16
|
-
rootStretched: kt,
|
|
17
|
-
activeMarker: Lt,
|
|
18
|
-
activeMarkerWithIndent: Et,
|
|
19
|
-
iconWrapper: xt,
|
|
20
|
-
iconWrapperXLarge: Mt,
|
|
21
|
-
iconWrapperWithNumberIndicator: Ut,
|
|
22
|
-
iconWrapperWithNumberIndicatorWithValue: Vt,
|
|
23
|
-
label: Rt,
|
|
24
|
-
labelBold: yt,
|
|
25
|
-
labelActive: Ht,
|
|
26
|
-
labelIconTop: Xt,
|
|
27
|
-
numberIndicator: jt,
|
|
28
|
-
labelWrapper: Ft,
|
|
29
|
-
labelWrapperIconTop: Gt,
|
|
30
|
-
chevron: Zt,
|
|
31
|
-
chevronIconPositionTop: $t,
|
|
32
|
-
chevronUp: qt,
|
|
33
|
-
chevronRight: Jt,
|
|
34
|
-
chevronLeft: Kt
|
|
35
|
-
}, so = ["left", "top"], lo = ["large", "x-large"], po = [0, 1], ho = ["normal", "bold"], vo = ["up", "down", "right", "left"], Qt = ({
|
|
36
|
-
iconName: u,
|
|
37
|
-
iconSize: f,
|
|
38
|
-
iconSource: t,
|
|
39
|
-
iconPosition: d,
|
|
40
|
-
indentLevel: r,
|
|
41
|
-
stretched: h,
|
|
42
|
-
weight: v
|
|
43
|
-
}) => {
|
|
44
|
-
if (u && !t && f === "x-large" && console.warn(C("DSActionButton", 'An "iconSize" prop set to "x-large" has no effect when "iconName" is set. Please remove the "iconSize" prop or provide a custom icon via the "iconSource" prop.')), d === "top") {
|
|
45
|
-
if (!u && !t)
|
|
46
|
-
throw new Error(C("DSActionButton", 'The "iconPosition" prop should not be set to "top", when no "iconName" or "iconSource" prop was provided. Please either remove the "iconPosition" prop or set a valid icon via the "iconName" or "iconSource" prop.'));
|
|
47
|
-
f === "x-large" && console.warn(C("DSActionButton", 'An "iconSize" prop set to "x-large" has no effect when "iconPosition" is set to "top". Please remove the "iconSize" prop.')), v === "bold" && console.warn(C("DSActionButton", 'A "weight" prop set to "bold" with "iconPosition" set to "top" has no effect. Please remove the "weight" prop.')), r === 1 && console.warn(C("DSActionButton", 'An "indentLevel" prop set to "1" with "iconPosition" set to "top" has no effect. Please remove the "indentLevel" prop.')), h && console.warn(C("DSActionButton", 'A "stretched" prop set to "true" with "iconPosition" set to "top" has no effect. Please remove the "stretched" prop.'));
|
|
48
|
-
}
|
|
49
|
-
}, Yt = St((u, f) => {
|
|
50
|
-
const t = zt.c(93);
|
|
51
|
-
let d, r, h, v, c, a, n, _, m, O, P, D, B, k, L, E, b;
|
|
52
|
-
t[0] !== u ? ({
|
|
53
|
-
children: h,
|
|
54
|
-
aria: d,
|
|
55
|
-
chevronDirection: r,
|
|
56
|
-
className: v,
|
|
57
|
-
disabled: O,
|
|
58
|
-
iconName: c,
|
|
59
|
-
iconPosition: P,
|
|
60
|
-
iconSize: D,
|
|
61
|
-
iconSource: a,
|
|
62
|
-
indentLevel: B,
|
|
63
|
-
isActive: k,
|
|
64
|
-
numberIndicatorValue: n,
|
|
65
|
-
stretched: L,
|
|
66
|
-
weight: E,
|
|
67
|
-
tooltip: b,
|
|
68
|
-
onClick: _,
|
|
69
|
-
...m
|
|
70
|
-
} = u, t[0] = u, t[1] = d, t[2] = r, t[3] = h, t[4] = v, t[5] = c, t[6] = a, t[7] = n, t[8] = _, t[9] = m, t[10] = O, t[11] = P, t[12] = D, t[13] = B, t[14] = k, t[15] = L, t[16] = E, t[17] = b) : (d = t[1], r = t[2], h = t[3], v = t[4], c = t[5], a = t[6], n = t[7], _ = t[8], m = t[9], O = t[10], P = t[11], D = t[12], B = t[13], k = t[14], L = t[15], E = t[16], b = t[17]);
|
|
71
|
-
const i = O === void 0 ? !1 : O, e = P === void 0 ? "left" : P, x = D === void 0 ? "large" : D, q = B === void 0 ? 0 : B, I = k === void 0 ? !1 : k, Wt = L === void 0 ? !1 : L, gt = E === void 0 ? "normal" : E;
|
|
72
|
-
process.env.NODE_ENV !== "production" && Qt({
|
|
73
|
-
iconName: c,
|
|
74
|
-
iconSize: x,
|
|
75
|
-
iconSource: a,
|
|
76
|
-
iconPosition: e,
|
|
77
|
-
indentLevel: q,
|
|
78
|
-
stretched: Wt,
|
|
79
|
-
weight: gt
|
|
80
|
-
});
|
|
81
|
-
let M;
|
|
82
|
-
t[18] !== n ? (M = n?.trim(), t[18] = n, t[19] = M) : M = t[19];
|
|
83
|
-
const s = M === "", J = e === "top", K = q === 1, Q = I && !i, Y = I && !i && e === "left", tt = Wt === !0 && e === "left";
|
|
84
|
-
let U;
|
|
85
|
-
t[20] !== v || t[21] !== K || t[22] !== Q || t[23] !== Y || t[24] !== tt || t[25] !== J ? (U = S(o.root, v, {
|
|
86
|
-
[o.rootIconTop]: J,
|
|
87
|
-
[o.rootIndentLevel1]: K,
|
|
88
|
-
[o.rootActive]: Q,
|
|
89
|
-
[o.rootActiveWithMarker]: Y,
|
|
90
|
-
[o.rootStretched]: tt
|
|
91
|
-
}), t[20] = v, t[21] = K, t[22] = Q, t[23] = Y, t[24] = tt, t[25] = J, t[26] = U) : U = t[26];
|
|
92
|
-
const ot = U, et = q === 1;
|
|
93
|
-
let V;
|
|
94
|
-
t[27] !== et ? (V = S(o.activeMarker, {
|
|
95
|
-
[o.activeMarkerWithIndent]: et
|
|
96
|
-
}), t[27] = et, t[28] = V) : V = t[28];
|
|
97
|
-
const nt = V, it = I && !i, rt = gt === "bold", ct = e === "top";
|
|
98
|
-
let R;
|
|
99
|
-
t[29] !== it || t[30] !== rt || t[31] !== ct ? (R = S(o.label, {
|
|
100
|
-
[o.labelActive]: it,
|
|
101
|
-
[o.labelBold]: rt,
|
|
102
|
-
[o.labelIconTop]: ct
|
|
103
|
-
}), t[29] = it, t[30] = rt, t[31] = ct, t[32] = R) : R = t[32];
|
|
104
|
-
const at = R, st = e === "top";
|
|
105
|
-
let y;
|
|
106
|
-
t[33] !== st ? (y = S(o.labelWrapper, {
|
|
107
|
-
[o.labelWrapperIconTop]: st
|
|
108
|
-
}), t[33] = st, t[34] = y) : y = t[34];
|
|
109
|
-
const lt = y, pt = e === "top", dt = r === "up", ht = r === "right", vt = r === "left";
|
|
110
|
-
let H;
|
|
111
|
-
t[35] !== pt || t[36] !== dt || t[37] !== ht || t[38] !== vt ? (H = S(o.chevron, {
|
|
112
|
-
[o.chevronIconPositionTop]: pt,
|
|
113
|
-
[o.chevronUp]: dt,
|
|
114
|
-
[o.chevronRight]: ht,
|
|
115
|
-
[o.chevronLeft]: vt
|
|
116
|
-
}), t[35] = pt, t[36] = dt, t[37] = ht, t[38] = vt, t[39] = H) : H = t[39];
|
|
117
|
-
const _t = H, bt = x === "x-large", ut = (c || a) && (n || s), ft = (c || a) && !s;
|
|
118
|
-
let X;
|
|
119
|
-
t[40] !== bt || t[41] !== ut || t[42] !== ft ? (X = S(o.iconWrapper, {
|
|
120
|
-
[o.iconWrapperXLarge]: bt,
|
|
121
|
-
[o.iconWrapperWithNumberIndicator]: ut,
|
|
122
|
-
[o.iconWrapperWithNumberIndicatorWithValue]: ft
|
|
123
|
-
}), t[40] = bt, t[41] = ut, t[42] = ft, t[43] = X) : X = t[43];
|
|
124
|
-
const mt = X;
|
|
125
|
-
let j;
|
|
126
|
-
t[44] !== i || t[45] !== _ ? (j = (l) => {
|
|
127
|
-
if (i) {
|
|
128
|
-
l.preventDefault();
|
|
129
|
-
return;
|
|
130
|
-
}
|
|
131
|
-
_ && _(l);
|
|
132
|
-
}, t[44] = i, t[45] = _, t[46] = j) : j = t[46];
|
|
133
|
-
const It = j;
|
|
134
|
-
let N;
|
|
135
|
-
t[47] !== nt || t[48] !== e || t[49] !== I ? (N = I && e === "left" && /* @__PURE__ */ p("div", { className: nt }), t[47] = nt, t[48] = e, t[49] = I, t[50] = N) : N = t[50];
|
|
136
|
-
let W;
|
|
137
|
-
t[51] !== i || t[52] !== c || t[53] !== e || t[54] !== x || t[55] !== a || t[56] !== mt || t[57] !== s || t[58] !== n ? (W = (c || a) && /* @__PURE__ */ p(At, { children: /* @__PURE__ */ $("span", { className: mt, children: [
|
|
138
|
-
/* @__PURE__ */ p(Tt, { name: c, theme: "light", source: a, "aria-hidden": "true", size: c || e === "top" ? "large" : x }),
|
|
139
|
-
!i && (e === "left" && s || e === "top" && (n || s)) && /* @__PURE__ */ p(wt, { variant: "highlight", label: n })
|
|
140
|
-
] }) }), t[51] = i, t[52] = c, t[53] = e, t[54] = x, t[55] = a, t[56] = mt, t[57] = s, t[58] = n, t[59] = W) : W = t[59];
|
|
141
|
-
let g;
|
|
142
|
-
t[60] !== h || t[61] !== at ? (g = /* @__PURE__ */ p("span", { className: at, children: h }), t[60] = h, t[61] = at, t[62] = g) : g = t[62];
|
|
143
|
-
let T;
|
|
144
|
-
t[63] !== _t || t[64] !== r ? (T = r && /* @__PURE__ */ p(Tt, { name: "chevron-down", theme: "light", "aria-hidden": "true", className: _t }), t[63] = _t, t[64] = r, t[65] = T) : T = t[65];
|
|
145
|
-
let w;
|
|
146
|
-
t[66] !== lt || t[67] !== g || t[68] !== T ? (w = /* @__PURE__ */ $("div", { className: lt, children: [
|
|
147
|
-
g,
|
|
148
|
-
T
|
|
149
|
-
] }), t[66] = lt, t[67] = g, t[68] = T, t[69] = w) : w = t[69];
|
|
150
|
-
let A;
|
|
151
|
-
t[70] !== i || t[71] !== e || t[72] !== s || t[73] !== n ? (A = e === "left" && !i && n && !s && /* @__PURE__ */ p(wt, { variant: "default", label: n, className: o.numberIndicator }), t[70] = i, t[71] = e, t[72] = s, t[73] = n, t[74] = A) : A = t[74];
|
|
152
|
-
let F;
|
|
153
|
-
t[75] !== d || t[76] !== i || t[77] !== It || t[78] !== f || t[79] !== m || t[80] !== ot || t[81] !== N || t[82] !== W || t[83] !== w || t[84] !== A ? (F = /* @__PURE__ */ $("button", { className: ot, type: "button", onClick: It, ...d, ...m, "aria-disabled": i, ref: f, children: [
|
|
154
|
-
N,
|
|
155
|
-
W,
|
|
156
|
-
w,
|
|
157
|
-
A
|
|
158
|
-
] }), t[75] = d, t[76] = i, t[77] = It, t[78] = f, t[79] = m, t[80] = ot, t[81] = N, t[82] = W, t[83] = w, t[84] = A, t[85] = F) : F = t[85];
|
|
159
|
-
const G = F;
|
|
160
|
-
if (b) {
|
|
161
|
-
let l;
|
|
162
|
-
t[86] !== G ? (l = /* @__PURE__ */ p(Nt.Anchor, { children: G }), t[86] = G, t[87] = l) : l = t[87];
|
|
163
|
-
let z;
|
|
164
|
-
t[88] !== b ? (z = /* @__PURE__ */ p(Nt.Content, { children: b }), t[88] = b, t[89] = z) : z = t[89];
|
|
165
|
-
let Z;
|
|
166
|
-
return t[90] !== l || t[91] !== z ? (Z = /* @__PURE__ */ $(Nt, { placement: "top", tooltipOffset: 6, children: [
|
|
167
|
-
l,
|
|
168
|
-
z
|
|
169
|
-
] }), t[90] = l, t[91] = z, t[92] = Z) : Z = t[92], Z;
|
|
170
|
-
}
|
|
171
|
-
return G;
|
|
172
|
-
});
|
|
173
|
-
Yt.displayName = "DSActionButton";
|
|
174
|
-
export {
|
|
175
|
-
so as A,
|
|
176
|
-
Yt as D,
|
|
177
|
-
lo as a,
|
|
178
|
-
po as b,
|
|
179
|
-
ho as c,
|
|
180
|
-
vo as d,
|
|
181
|
-
Qt as v
|
|
182
|
-
};
|