@tedi-design-system/react 19.0.1-rc.2 → 19.1.0-rc.1

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.
Files changed (49) hide show
  1. package/_virtual/index.es13.js +2 -2
  2. package/_virtual/index.es14.js +2 -2
  3. package/bundle-stats.html +1 -1
  4. package/external/react-is/index.cjs.js +1 -1
  5. package/external/react-is/index.es.js +1 -1
  6. package/external/toposort/index.cjs.js +1 -1
  7. package/external/toposort/index.es.js +1 -1
  8. package/index.css +1 -1
  9. package/package.json +1 -1
  10. package/src/community/components/vertical-stepper/step-item/step-item.d.ts +6 -0
  11. package/src/community/components/vertical-stepper/sub-item/sub-item.d.ts +6 -0
  12. package/src/community/components/vertical-stepper/vertical-stepper.d.ts +6 -0
  13. package/src/tedi/components/navigation/card-stepper/card-stepper-step.cjs.js +1 -0
  14. package/src/tedi/components/navigation/card-stepper/card-stepper-step.d.ts +86 -0
  15. package/src/tedi/components/navigation/card-stepper/card-stepper-step.es.js +5 -0
  16. package/src/tedi/components/navigation/card-stepper/card-stepper.cjs.js +1 -0
  17. package/src/tedi/components/navigation/card-stepper/card-stepper.d.ts +130 -0
  18. package/src/tedi/components/navigation/card-stepper/card-stepper.es.js +200 -0
  19. package/src/tedi/components/navigation/card-stepper/card-stepper.module.scss.cjs.js +1 -0
  20. package/src/tedi/components/navigation/card-stepper/card-stepper.module.scss.es.js +26 -0
  21. package/src/tedi/components/navigation/card-stepper/index.d.ts +2 -0
  22. package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.cjs.js +1 -1
  23. package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.es.js +36 -58
  24. package/src/tedi/components/navigation/vertical-stepper/index.d.ts +3 -0
  25. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.cjs.js +1 -0
  26. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.d.ts +10 -0
  27. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.es.js +8 -0
  28. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.cjs.js +1 -0
  29. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.d.ts +74 -0
  30. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.es.js +109 -0
  31. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.cjs.js +1 -0
  32. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.d.ts +47 -0
  33. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.es.js +65 -0
  34. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.cjs.js +1 -0
  35. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.d.ts +28 -0
  36. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.es.js +32 -0
  37. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.module.scss.cjs.js +1 -0
  38. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.module.scss.es.js +34 -0
  39. package/src/tedi/components/overlays/sheet/sheet.cjs.js +1 -0
  40. package/src/tedi/components/overlays/sheet/sheet.d.ts +65 -0
  41. package/src/tedi/components/overlays/sheet/sheet.es.js +41 -0
  42. package/src/tedi/components/overlays/sheet/sheet.module.scss.cjs.js +1 -0
  43. package/src/tedi/components/overlays/sheet/sheet.module.scss.es.js +8 -0
  44. package/src/tedi/index.d.ts +2 -0
  45. package/src/tedi/providers/label-provider/labels-map.cjs.js +1 -1
  46. package/src/tedi/providers/label-provider/labels-map.d.ts +42 -0
  47. package/src/tedi/providers/label-provider/labels-map.es.js +113 -71
  48. package/tedi.cjs.js +1 -1
  49. package/tedi.es.js +282 -272
@@ -1,80 +1,58 @@
1
- import { jsxs as i, jsx as e } from "react/jsx-runtime";
1
+ import { jsxs as r, jsx as e } from "react/jsx-runtime";
2
2
  import k from "../../../../../../../external/classnames/index.es.js";
3
- import { useState as B, useRef as E, useEffect as H, useMemo as f } from "react";
4
- import { Text as T } from "../../../../base/typography/text/text.es.js";
3
+ import { useState as v, useEffect as y, useMemo as c } from "react";
4
+ import { Text as g } from "../../../../base/typography/text/text.es.js";
5
5
  import { CollapseButton as _ } from "../../../../buttons/collapse-button/collapse-button.es.js";
6
- import { childrenToNodes as j, buildActiveTrail as M, TableOfContentsContext as R } from "../../table-of-contents.es.js";
6
+ import { Sheet as j } from "../../../../overlays/sheet/sheet.es.js";
7
+ import { childrenToNodes as H, buildActiveTrail as S, TableOfContentsContext as A } from "../../table-of-contents.es.js";
7
8
  import t from "../../table-of-contents.module.scss.es.js";
8
- import { TableOfContentsList as A } from "../table-of-contents-list/table-of-contents-list.es.js";
9
+ import { TableOfContentsList as B } from "../table-of-contents-list/table-of-contents-list.es.js";
9
10
  import { useLabels as I } from "../../../../../providers/label-provider/use-labels.es.js";
10
- import { Modal as r } from "../../../../overlays/modal/modal.es.js";
11
- const P = (C) => {
12
- const { children: m, heading: b, ariaLabel: N, activeId: l, numbered: p = !1, sticky: x = !0, className: L } = C, { getLabel: o } = I(), [n, s] = B(!1), u = E(null);
13
- H(() => {
14
- const d = u.current;
15
- if (!n || !d) return;
16
- const g = (y) => {
17
- y.target.closest("a, button") && s(!1);
11
+ const M = (N) => {
12
+ const { children: d, heading: m, ariaLabel: C, activeId: n, numbered: f = !1, sticky: L = !0, className: T } = N, { getLabel: b } = I(), [o, a] = v(!1), [s, O] = v(null);
13
+ y(() => {
14
+ if (!o || !s) return;
15
+ const u = (E) => {
16
+ E.target.closest("a, button") && a(!1);
18
17
  };
19
- return d.addEventListener("click", g), () => d.removeEventListener("click", g);
20
- }, [n]);
21
- const a = (b === void 0 ? o("table-of-contents.title") : b) ?? o("table-of-contents.title"), h = N || a, c = f(() => j(m), [m]), v = f(() => M(c, l), [c, l]), O = f(
22
- () => ({ activeId: l, numbered: p, ariaLabel: h, activeTrail: v }),
23
- [l, p, h, v]
18
+ return s.addEventListener("click", u), () => s.removeEventListener("click", u);
19
+ }, [o, s]);
20
+ const l = (m === void 0 ? b("table-of-contents.title") : m) ?? b("table-of-contents.title"), p = C || l, i = c(() => H(d), [d]), h = c(() => S(i, n), [i, n]), x = c(
21
+ () => ({ activeId: n, numbered: f, ariaLabel: p, activeTrail: h }),
22
+ [n, f, p, h]
24
23
  );
25
- return /* @__PURE__ */ i(R.Provider, { value: O, children: [
26
- /* @__PURE__ */ i(
24
+ return /* @__PURE__ */ r(A.Provider, { value: x, children: [
25
+ /* @__PURE__ */ r(
27
26
  "div",
28
27
  {
29
28
  className: k(
30
29
  t["tedi-table-of-contents__bar"],
31
- { [t["tedi-table-of-contents__bar--static"]]: !x },
32
- L
30
+ { [t["tedi-table-of-contents__bar--static"]]: !L },
31
+ T
33
32
  ),
34
33
  children: [
35
- /* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: a }),
36
- /* @__PURE__ */ e(
37
- _,
38
- {
39
- open: n,
40
- onOpenChange: s,
41
- openText: o("open"),
42
- closeText: o("close"),
43
- underline: !1,
44
- "aria-haspopup": "dialog"
45
- }
46
- )
34
+ /* @__PURE__ */ e(g, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: l }),
35
+ /* @__PURE__ */ e(_, { open: o, onOpenChange: a, underline: !1, "aria-haspopup": "dialog" })
47
36
  ]
48
37
  }
49
38
  ),
50
- /* @__PURE__ */ e(r, { open: n, onToggle: s, children: /* @__PURE__ */ i(
51
- r.Content,
39
+ /* @__PURE__ */ e(
40
+ j,
52
41
  {
53
- position: "bottom",
54
- fullscreen: "edge",
55
- "aria-label": a,
42
+ open: o,
43
+ onToggle: a,
44
+ ariaLabel: l,
56
45
  className: t["tedi-table-of-contents__sheet"],
57
- children: [
58
- /* @__PURE__ */ e(r.Header, { closeButton: !1, children: /* @__PURE__ */ i("div", { className: t["tedi-table-of-contents__sheet-header"], children: [
59
- /* @__PURE__ */ e(T, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: a }),
60
- /* @__PURE__ */ e(
61
- _,
62
- {
63
- open: n,
64
- onOpenChange: s,
65
- openText: o("open"),
66
- closeText: o("close"),
67
- underline: !1
68
- }
69
- )
70
- ] }) }),
71
- /* @__PURE__ */ e(r.Body, { children: /* @__PURE__ */ e("div", { ref: u, className: t["tedi-table-of-contents"], children: /* @__PURE__ */ e(A, { nodes: c, heading: null }) }) })
72
- ]
46
+ header: /* @__PURE__ */ r("div", { className: t["tedi-table-of-contents__sheet-header"], children: [
47
+ /* @__PURE__ */ e(g, { modifiers: "bold", className: t["tedi-table-of-contents__bar-title"], children: l }),
48
+ /* @__PURE__ */ e(_, { open: o, onOpenChange: a, underline: !1 })
49
+ ] }),
50
+ children: /* @__PURE__ */ e("div", { ref: O, className: t["tedi-table-of-contents"], children: /* @__PURE__ */ e(B, { nodes: i, heading: null }) })
73
51
  }
74
- ) })
52
+ )
75
53
  ] });
76
54
  };
77
- P.displayName = "TableOfContentsCollapsible";
55
+ M.displayName = "TableOfContentsCollapsible";
78
56
  export {
79
- P as TableOfContentsCollapsible
57
+ M as TableOfContentsCollapsible
80
58
  };
@@ -0,0 +1,3 @@
1
+ export * from './vertical-stepper';
2
+ export * from './vertical-stepper-item';
3
+ export * from './vertical-stepper-sub-item';
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext({compact:!1}),r=()=>e.useContext(t);exports.VerticalStepperContext=t;exports.useVerticalStepperContext=r;
@@ -0,0 +1,10 @@
1
+ import { default as React } from 'react';
2
+ export interface VerticalStepperContextValue {
3
+ /**
4
+ * Compact density — smaller indicators and tighter rows. Provided by the
5
+ * parent `VerticalStepper` so items and sub-items render in the same size.
6
+ */
7
+ compact: boolean;
8
+ }
9
+ export declare const VerticalStepperContext: React.Context<VerticalStepperContextValue>;
10
+ export declare const useVerticalStepperContext: () => VerticalStepperContextValue;
@@ -0,0 +1,8 @@
1
+ import t from "react";
2
+ const e = t.createContext({
3
+ compact: !1
4
+ }), c = () => t.useContext(e);
5
+ export {
6
+ e as VerticalStepperContext,
7
+ c as useVerticalStepperContext
8
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),D=require("../../../../../external/classnames/index.cjs.js"),r=require("react"),l=require("../../base/icon/icon.cjs.js"),O=require("../../base/typography/text/text.cjs.js"),P=require("../../buttons/collapse-button/collapse-button.cjs.js"),t=require("./vertical-stepper.module.scss.cjs.js"),A=require("./vertical-stepper-context.cjs.js"),G=require("../../../providers/label-provider/use-labels.cjs.js"),z=r.forwardRef((T,k)=>{const{getLabel:i}=G.useLabels(),{compact:a}=A.useVerticalStepperContext(),{title:n,description:m,state:s="default",current:_=!1,href:c,onClick:v,as:L,endSlot:h,children:x,open:f,defaultOpen:V,onToggle:d,className:$,index:w}=T,o=`tedi-vertical-stepper-sublist-${r.useId()}`,b=r.Children.count(x)>0,j=s==="disabled",N=!j&&(c!==void 0||v!==void 0),p=L??(c?"a":"button"),[B,R]=r.useState(V??!1),u=f??B,E=()=>{const C=!u;f===void 0&&R(C),d==null||d(C)},F=D.default(t.default["tedi-vertical-stepper__item"],t.default[`tedi-vertical-stepper__item--${s}`],{[t.default["tedi-vertical-stepper__item--current"]]:_,[t.default["tedi-vertical-stepper__item--has-children"]]:b},$),M=e.jsx("span",{className:t.default["tedi-vertical-stepper__indicator"],children:a?s==="completed"?e.jsx(l.Icon,{name:"check",size:16,color:"white",label:i("stepper.completed")}):s==="error"?e.jsx(l.Icon,{name:"priority_high",size:16,color:"white",label:i("stepper.error")}):null:e.jsx("span",{className:t.default["tedi-vertical-stepper__number"],children:w})}),g=e.jsxs(O.Text,{element:"span",className:t.default["tedi-vertical-stepper__label"],children:[e.jsx("span",{className:t.default["tedi-vertical-stepper__label-text"],children:n}),!a&&s==="completed"&&e.jsx(l.Icon,{name:"check",color:"success",size:16,display:"inline",label:i("stepper.completed"),className:t.default["tedi-vertical-stepper__label-icon"]}),!a&&s==="error"&&e.jsx(l.Icon,{name:"error",color:"danger",size:16,display:"inline",label:i("stepper.error"),className:t.default["tedi-vertical-stepper__label-icon"]}),j&&e.jsxs("span",{className:"visually-hidden",children:[" (",i("stepper.disabled"),")"]})]}),I=m&&e.jsx(O.Text,{element:"span",modifiers:"small",color:"tertiary",className:t.default["tedi-vertical-stepper__description"],children:m}),S=h&&e.jsx("div",{className:t.default["tedi-vertical-stepper__end-slot"],children:h}),y=_?"step":void 0,q=N?e.jsx(p,{href:p==="a"?c:void 0,type:p==="button"?"button":void 0,onClick:v,"aria-current":y,className:t.default["tedi-vertical-stepper__link"],children:g}):g;return e.jsxs("li",{ref:k,"aria-current":N?void 0:y,className:F,children:[M,e.jsx("div",{className:t.default["tedi-vertical-stepper__content"],children:b?e.jsxs(e.Fragment,{children:[e.jsxs("div",{className:t.default["tedi-vertical-stepper__toggle"],children:[q,e.jsx(P.CollapseButton,{id:`${o}-toggle`,hideText:!0,size:"small",open:u,onOpenChange:E,"aria-controls":o,"aria-label":typeof n=="string"?n:void 0,className:t.default["tedi-vertical-stepper__toggle-button"]})]}),I,S,e.jsx("ul",{id:o,hidden:!u,className:t.default["tedi-vertical-stepper__sub-list"],children:x})]}):e.jsxs(e.Fragment,{children:[q,I,S]})})]})});z.displayName="VerticalStepperItem";exports.VerticalStepperItem=z;
@@ -0,0 +1,74 @@
1
+ import { default as React } from 'react';
2
+ export type VerticalStepperItemState = 'default' | 'completed' | 'error' | 'disabled';
3
+ export interface VerticalStepperItemProps {
4
+ /**
5
+ * Step title.
6
+ */
7
+ title: React.ReactNode;
8
+ /**
9
+ * Optional secondary line rendered under the title.
10
+ */
11
+ description?: React.ReactNode;
12
+ /**
13
+ * Visual / semantic state of the step.
14
+ * - `completed` — green indicator + check icon
15
+ * - `error` — red indicator + error icon
16
+ * - `disabled` — muted, non-interactive
17
+ * @default default
18
+ */
19
+ state?: VerticalStepperItemState;
20
+ /**
21
+ * Marks the step as the active one — blue indicator, bold blue title and
22
+ * `aria-current="step"`. Independent from `state`.
23
+ * @default false
24
+ */
25
+ current?: boolean;
26
+ /**
27
+ * Navigates when set; renders the title as an anchor. Works for steps with
28
+ * sub-steps too — the title navigates and a separate toggle expands the list.
29
+ */
30
+ href?: string;
31
+ /**
32
+ * Click handler. Without `href` the title renders as a `<button>`. Works for
33
+ * steps with sub-steps too (alongside the expand toggle).
34
+ */
35
+ onClick?: (event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => void;
36
+ /**
37
+ * Element used for the interactive title. Defaults to `'a'` when `href` is set,
38
+ * otherwise `'button'`. Ignored for `disabled` steps.
39
+ */
40
+ as?: 'a' | 'button';
41
+ /**
42
+ * Content rendered at the end of the item, below the title / description — a
43
+ * `StatusBadge`, `Link`, `Button`, `Text`, etc. (Figma: "related assets".)
44
+ */
45
+ endSlot?: React.ReactNode;
46
+ /**
47
+ * `VerticalStepper.SubItem` elements. When present the step becomes an
48
+ * expandable section: the title toggles the (collapsible) sub-step list.
49
+ */
50
+ children?: React.ReactNode;
51
+ /**
52
+ * Controlled open state of the sub-step list. Use with `onToggle`.
53
+ */
54
+ open?: boolean;
55
+ /**
56
+ * Initial open state of the sub-step list (uncontrolled).
57
+ */
58
+ defaultOpen?: boolean;
59
+ /**
60
+ * Fired when the sub-step list is toggled.
61
+ */
62
+ onToggle?: (open: boolean) => void;
63
+ /**
64
+ * Additional class name applied to the `<li>`.
65
+ */
66
+ className?: string;
67
+ /**
68
+ * Step number, injected automatically by `VerticalStepper`. Do not set manually.
69
+ * @internal
70
+ */
71
+ index?: number;
72
+ }
73
+ export declare const VerticalStepperItem: React.ForwardRefExoticComponent<VerticalStepperItemProps & React.RefAttributes<HTMLLIElement>>;
74
+ export default VerticalStepperItem;
@@ -0,0 +1,109 @@
1
+ import { jsx as t, jsxs as r, Fragment as k } from "react/jsx-runtime";
2
+ import q from "../../../../../external/classnames/index.es.js";
3
+ import A, { forwardRef as G, useId as H, useState as J } from "react";
4
+ import { Icon as l } from "../../base/icon/icon.es.js";
5
+ import { Text as w } from "../../base/typography/text/text.es.js";
6
+ import { CollapseButton as K } from "../../buttons/collapse-button/collapse-button.es.js";
7
+ import e from "./vertical-stepper.module.scss.es.js";
8
+ import { useVerticalStepperContext as P } from "./vertical-stepper-context.es.js";
9
+ import { useLabels as Q } from "../../../providers/label-provider/use-labels.es.js";
10
+ const U = G((L, T) => {
11
+ const { getLabel: s } = Q(), { compact: a } = P(), {
12
+ title: c,
13
+ description: _,
14
+ state: i = "default",
15
+ current: h = !1,
16
+ href: n,
17
+ onClick: v,
18
+ as: V,
19
+ endSlot: u,
20
+ children: b,
21
+ open: f,
22
+ defaultOpen: $,
23
+ onToggle: o,
24
+ className: j,
25
+ index: B
26
+ } = L, p = `tedi-vertical-stepper-sublist-${H()}`, N = A.Children.count(b) > 0, g = i === "disabled", x = !g && (n !== void 0 || v !== void 0), d = V ?? (n ? "a" : "button"), [E, R] = J($ ?? !1), m = f ?? E, D = () => {
27
+ const O = !m;
28
+ f === void 0 && R(O), o == null || o(O);
29
+ }, F = q(
30
+ e["tedi-vertical-stepper__item"],
31
+ e[`tedi-vertical-stepper__item--${i}`],
32
+ {
33
+ [e["tedi-vertical-stepper__item--current"]]: h,
34
+ [e["tedi-vertical-stepper__item--has-children"]]: N
35
+ },
36
+ j
37
+ ), M = /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__indicator"], children: a ? i === "completed" ? /* @__PURE__ */ t(l, { name: "check", size: 16, color: "white", label: s("stepper.completed") }) : i === "error" ? /* @__PURE__ */ t(l, { name: "priority_high", size: 16, color: "white", label: s("stepper.error") }) : null : /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__number"], children: B }) }), y = /* @__PURE__ */ r(w, { element: "span", className: e["tedi-vertical-stepper__label"], children: [
38
+ /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__label-text"], children: c }),
39
+ !a && i === "completed" && /* @__PURE__ */ t(
40
+ l,
41
+ {
42
+ name: "check",
43
+ color: "success",
44
+ size: 16,
45
+ display: "inline",
46
+ label: s("stepper.completed"),
47
+ className: e["tedi-vertical-stepper__label-icon"]
48
+ }
49
+ ),
50
+ !a && i === "error" && /* @__PURE__ */ t(
51
+ l,
52
+ {
53
+ name: "error",
54
+ color: "danger",
55
+ size: 16,
56
+ display: "inline",
57
+ label: s("stepper.error"),
58
+ className: e["tedi-vertical-stepper__label-icon"]
59
+ }
60
+ ),
61
+ g && /* @__PURE__ */ r("span", { className: "visually-hidden", children: [
62
+ " (",
63
+ s("stepper.disabled"),
64
+ ")"
65
+ ] })
66
+ ] }), I = _ && /* @__PURE__ */ t(w, { element: "span", modifiers: "small", color: "tertiary", className: e["tedi-vertical-stepper__description"], children: _ }), C = u && /* @__PURE__ */ t("div", { className: e["tedi-vertical-stepper__end-slot"], children: u }), S = h ? "step" : void 0, z = x ? /* @__PURE__ */ t(
67
+ d,
68
+ {
69
+ href: d === "a" ? n : void 0,
70
+ type: d === "button" ? "button" : void 0,
71
+ onClick: v,
72
+ "aria-current": S,
73
+ className: e["tedi-vertical-stepper__link"],
74
+ children: y
75
+ }
76
+ ) : y;
77
+ return /* @__PURE__ */ r("li", { ref: T, "aria-current": x ? void 0 : S, className: F, children: [
78
+ M,
79
+ /* @__PURE__ */ t("div", { className: e["tedi-vertical-stepper__content"], children: N ? /* @__PURE__ */ r(k, { children: [
80
+ /* @__PURE__ */ r("div", { className: e["tedi-vertical-stepper__toggle"], children: [
81
+ z,
82
+ /* @__PURE__ */ t(
83
+ K,
84
+ {
85
+ id: `${p}-toggle`,
86
+ hideText: !0,
87
+ size: "small",
88
+ open: m,
89
+ onOpenChange: D,
90
+ "aria-controls": p,
91
+ "aria-label": typeof c == "string" ? c : void 0,
92
+ className: e["tedi-vertical-stepper__toggle-button"]
93
+ }
94
+ )
95
+ ] }),
96
+ I,
97
+ C,
98
+ /* @__PURE__ */ t("ul", { id: p, hidden: !m, className: e["tedi-vertical-stepper__sub-list"], children: b })
99
+ ] }) : /* @__PURE__ */ r(k, { children: [
100
+ z,
101
+ I,
102
+ C
103
+ ] }) })
104
+ ] });
105
+ });
106
+ U.displayName = "VerticalStepperItem";
107
+ export {
108
+ U as VerticalStepperItem
109
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),j=require("../../../../../external/classnames/index.cjs.js"),N=require("react"),u=require("../../base/icon/icon.cjs.js"),S=require("../../base/typography/text/text.cjs.js"),e=require("./vertical-stepper.module.scss.cjs.js"),q=require("../../../providers/label-provider/use-labels.cjs.js"),m=N.forwardRef((b,_)=>{const{getLabel:a}=q.useLabels(),{title:v,state:s="default",current:l=!1,href:r,onClick:c,as:f,endSlot:n,className:x}=b,d=!(s==="disabled"||s==="informative")&&(r!==void 0||c!==void 0),i=f??(r?"a":"button"),h=j.default(e.default["tedi-vertical-stepper__sub-item"],e.default[`tedi-vertical-stepper__sub-item--${s}`],{[e.default["tedi-vertical-stepper__sub-item--current"]]:l},x),o=t.jsxs(S.Text,{element:"span",className:e.default["tedi-vertical-stepper__label"],children:[t.jsx("span",{className:e.default["tedi-vertical-stepper__label-text"],children:v}),s==="completed"&&t.jsx(u.Icon,{name:"check",color:"success",size:16,display:"inline",label:a("stepper.completed"),className:e.default["tedi-vertical-stepper__label-icon"]}),s==="error"&&t.jsx(u.Icon,{name:"error",color:"danger",size:16,display:"inline",label:a("stepper.error"),className:e.default["tedi-vertical-stepper__label-icon"]}),s==="disabled"&&t.jsxs("span",{className:"visually-hidden",children:[" (",a("stepper.disabled"),")"]})]}),p=l?"step":void 0;return t.jsxs("li",{ref:_,"aria-current":d?void 0:p,className:h,children:[t.jsx("span",{className:e.default["tedi-vertical-stepper__sub-indicator"],"aria-hidden":"true",children:t.jsx("span",{className:e.default["tedi-vertical-stepper__sub-dot"]})}),t.jsxs("span",{className:e.default["tedi-vertical-stepper__content"],children:[d?t.jsx(i,{href:i==="a"?r:void 0,type:i==="button"?"button":void 0,onClick:c,"aria-current":p,className:e.default["tedi-vertical-stepper__link"],children:o}):o,n&&t.jsx("div",{className:e.default["tedi-vertical-stepper__end-slot"],children:n})]})]})});m.displayName="VerticalStepperSubItem";exports.VerticalStepperSubItem=m;
@@ -0,0 +1,47 @@
1
+ import { default as React } from 'react';
2
+ export type VerticalStepperSubItemState = 'default' | 'completed' | 'error' | 'disabled' | 'informative';
3
+ export interface VerticalStepperSubItemProps {
4
+ /**
5
+ * Sub-step label.
6
+ */
7
+ title: React.ReactNode;
8
+ /**
9
+ * Visual / semantic state of the sub-step.
10
+ * - `completed` — green dot, trailing check icon
11
+ * - `error` — red dot, trailing error icon
12
+ * - `disabled` — muted, non-interactive
13
+ * - `informative` — read-only row (no link), e.g. "filled in by an official"
14
+ * @default default
15
+ */
16
+ state?: VerticalStepperSubItemState;
17
+ /**
18
+ * Marks the sub-step as the active one — blue ring dot, bold blue label and
19
+ * `aria-current="step"`. Independent from `state`.
20
+ * @default false
21
+ */
22
+ current?: boolean;
23
+ /**
24
+ * Navigates when set; renders the label as an anchor. Mutually usable with `onClick`.
25
+ */
26
+ href?: string;
27
+ /**
28
+ * Click handler. Without `href` the label renders as a `<button>`.
29
+ */
30
+ onClick?: (event: React.MouseEvent<HTMLAnchorElement | HTMLButtonElement>) => void;
31
+ /**
32
+ * Element used for the interactive label. Defaults to `'a'` when `href` is set,
33
+ * otherwise `'button'`. Ignored for `disabled` / `informative` rows (rendered as text).
34
+ */
35
+ as?: 'a' | 'button';
36
+ /**
37
+ * Content rendered at the end of the sub-item, below the label — a `StatusBadge`,
38
+ * `Link`, `Button`, `Text`, etc. (Figma: "related assets".)
39
+ */
40
+ endSlot?: React.ReactNode;
41
+ /**
42
+ * Additional class name applied to the `<li>`.
43
+ */
44
+ className?: string;
45
+ }
46
+ export declare const VerticalStepperSubItem: React.ForwardRefExoticComponent<VerticalStepperSubItemProps & React.RefAttributes<HTMLLIElement>>;
47
+ export default VerticalStepperSubItem;
@@ -0,0 +1,65 @@
1
+ import { jsxs as s, jsx as t } from "react/jsx-runtime";
2
+ import S from "../../../../../external/classnames/index.es.js";
3
+ import { forwardRef as y } from "react";
4
+ import { Icon as _ } from "../../base/icon/icon.es.js";
5
+ import { Text as x } from "../../base/typography/text/text.es.js";
6
+ import e from "./vertical-stepper.module.scss.es.js";
7
+ import { useLabels as I } from "../../../providers/label-provider/use-labels.es.js";
8
+ const k = y((b, u) => {
9
+ const { getLabel: a } = I(), { title: v, state: r = "default", current: c = !1, href: i, onClick: n, as: f, endSlot: p, className: N } = b, o = !(r === "disabled" || r === "informative") && (i !== void 0 || n !== void 0), l = f ?? (i ? "a" : "button"), h = S(
10
+ e["tedi-vertical-stepper__sub-item"],
11
+ e[`tedi-vertical-stepper__sub-item--${r}`],
12
+ { [e["tedi-vertical-stepper__sub-item--current"]]: c },
13
+ N
14
+ ), d = /* @__PURE__ */ s(x, { element: "span", className: e["tedi-vertical-stepper__label"], children: [
15
+ /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__label-text"], children: v }),
16
+ r === "completed" && /* @__PURE__ */ t(
17
+ _,
18
+ {
19
+ name: "check",
20
+ color: "success",
21
+ size: 16,
22
+ display: "inline",
23
+ label: a("stepper.completed"),
24
+ className: e["tedi-vertical-stepper__label-icon"]
25
+ }
26
+ ),
27
+ r === "error" && /* @__PURE__ */ t(
28
+ _,
29
+ {
30
+ name: "error",
31
+ color: "danger",
32
+ size: 16,
33
+ display: "inline",
34
+ label: a("stepper.error"),
35
+ className: e["tedi-vertical-stepper__label-icon"]
36
+ }
37
+ ),
38
+ r === "disabled" && /* @__PURE__ */ s("span", { className: "visually-hidden", children: [
39
+ " (",
40
+ a("stepper.disabled"),
41
+ ")"
42
+ ] })
43
+ ] }), m = c ? "step" : void 0;
44
+ return /* @__PURE__ */ s("li", { ref: u, "aria-current": o ? void 0 : m, className: h, children: [
45
+ /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__sub-indicator"], "aria-hidden": "true", children: /* @__PURE__ */ t("span", { className: e["tedi-vertical-stepper__sub-dot"] }) }),
46
+ /* @__PURE__ */ s("span", { className: e["tedi-vertical-stepper__content"], children: [
47
+ o ? /* @__PURE__ */ t(
48
+ l,
49
+ {
50
+ href: l === "a" ? i : void 0,
51
+ type: l === "button" ? "button" : void 0,
52
+ onClick: n,
53
+ "aria-current": m,
54
+ className: e["tedi-vertical-stepper__link"],
55
+ children: d
56
+ }
57
+ ) : d,
58
+ p && /* @__PURE__ */ t("div", { className: e["tedi-vertical-stepper__end-slot"], children: p })
59
+ ] })
60
+ ] });
61
+ });
62
+ k.displayName = "VerticalStepperSubItem";
63
+ export {
64
+ k as VerticalStepperSubItem
65
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),S=require("../../../../../external/classnames/index.cjs.js"),t=require("react"),l=require("./vertical-stepper.module.scss.cjs.js"),b=require("./vertical-stepper-context.cjs.js"),c=require("./vertical-stepper-item.cjs.js"),v=require("./vertical-stepper-sub-item.cjs.js"),n=t.forwardRef((p,s)=>{const{children:o,compact:a=!1,"aria-label":u,className:m}=p;let i=0;const d=t.Children.map(o,e=>t.isValidElement(e)&&e.type===c.VerticalStepperItem?(i+=1,t.cloneElement(e,{index:i})):e);return r.jsx(b.VerticalStepperContext.Provider,{value:{compact:a},children:r.jsx("nav",{"aria-label":u,children:r.jsx("ol",{ref:s,className:S.default(l.default["tedi-vertical-stepper"],{[l.default["tedi-vertical-stepper--compact"]]:a},m),children:d})})})});n.displayName="VerticalStepper";const V=Object.assign(n,{Item:c.VerticalStepperItem,SubItem:v.VerticalStepperSubItem});exports.VerticalStepper=V;
@@ -0,0 +1,28 @@
1
+ import { default as React } from 'react';
2
+ import { VerticalStepperItemProps } from './vertical-stepper-item';
3
+ export interface VerticalStepperProps {
4
+ /**
5
+ * `VerticalStepper.Item` elements (and optional `Separator`s between them).
6
+ * Items are auto-numbered in source order.
7
+ */
8
+ children: React.ReactNode;
9
+ /**
10
+ * Compact density — smaller indicators and tighter rows. Completed / error
11
+ * steps show their state icon inside the indicator instead of the number.
12
+ * @default false
13
+ */
14
+ compact?: boolean;
15
+ /**
16
+ * Accessible name for the `<nav>` landmark.
17
+ */
18
+ 'aria-label'?: string;
19
+ /**
20
+ * Additional class name applied to the `<ol>`.
21
+ */
22
+ className?: string;
23
+ }
24
+ export declare const VerticalStepper: React.ForwardRefExoticComponent<VerticalStepperProps & React.RefAttributes<HTMLOListElement>> & {
25
+ Item: React.ForwardRefExoticComponent<VerticalStepperItemProps & React.RefAttributes<HTMLLIElement>>;
26
+ SubItem: React.ForwardRefExoticComponent<import('./vertical-stepper-sub-item').VerticalStepperSubItemProps & React.RefAttributes<HTMLLIElement>>;
27
+ };
28
+ export default VerticalStepper;
@@ -0,0 +1,32 @@
1
+ import { jsx as r } from "react/jsx-runtime";
2
+ import u from "../../../../../external/classnames/index.es.js";
3
+ import t, { forwardRef as b } from "react";
4
+ import l from "./vertical-stepper.module.scss.es.js";
5
+ import { VerticalStepperContext as S } from "./vertical-stepper-context.es.js";
6
+ import { VerticalStepperItem as p } from "./vertical-stepper-item.es.js";
7
+ import { VerticalStepperSubItem as V } from "./vertical-stepper-sub-item.es.js";
8
+ const m = b((o, c) => {
9
+ const { children: n, compact: a = !1, "aria-label": s, className: d } = o;
10
+ let i = 0;
11
+ const f = t.Children.map(n, (e) => t.isValidElement(e) && e.type === p ? (i += 1, t.cloneElement(e, { index: i })) : e);
12
+ return /* @__PURE__ */ r(S.Provider, { value: { compact: a }, children: /* @__PURE__ */ r("nav", { "aria-label": s, children: /* @__PURE__ */ r(
13
+ "ol",
14
+ {
15
+ ref: c,
16
+ className: u(
17
+ l["tedi-vertical-stepper"],
18
+ { [l["tedi-vertical-stepper--compact"]]: a },
19
+ d
20
+ ),
21
+ children: f
22
+ }
23
+ ) }) });
24
+ });
25
+ m.displayName = "VerticalStepper";
26
+ const j = Object.assign(m, {
27
+ Item: p,
28
+ SubItem: V
29
+ });
30
+ export {
31
+ j as VerticalStepper
32
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-vertical-stepper":"tedi-vertical-stepper-cc48e08e","tedi-vertical-stepper__item":"tedi-vertical-stepper__item-5359847f","tedi-vertical-stepper__item--has-children":"tedi-vertical-stepper__item--has-children-83e7ee73","tedi-vertical-stepper__indicator":"tedi-vertical-stepper__indicator-041dc249","tedi-vertical-stepper__number":"tedi-vertical-stepper__number-a8243903","tedi-vertical-stepper__content":"tedi-vertical-stepper__content-0be415df","tedi-vertical-stepper__link":"tedi-vertical-stepper__link-fe115434","tedi-vertical-stepper__label-text":"tedi-vertical-stepper__label-text-173ed5d2","tedi-vertical-stepper__item--default":"tedi-vertical-stepper__item--default-a0855686","tedi-vertical-stepper__item--completed":"tedi-vertical-stepper__item--completed-6afeb234","tedi-vertical-stepper__item--error":"tedi-vertical-stepper__item--error-ffa453e0","tedi-vertical-stepper__toggle":"tedi-vertical-stepper__toggle-5f7111e6","tedi-vertical-stepper__toggle-button":"tedi-vertical-stepper__toggle-button-f9acf14c","tedi-vertical-stepper__label":"tedi-vertical-stepper__label-b58a742d","tedi-vertical-stepper__label-icon":"tedi-vertical-stepper__label-icon-4dc08a47","tedi-vertical-stepper__description":"tedi-vertical-stepper__description-13aceaa3","tedi-vertical-stepper__end-slot":"tedi-vertical-stepper__end-slot-9333f737","tedi-vertical-stepper__item--disabled":"tedi-vertical-stepper__item--disabled-bd12c124","tedi-vertical-stepper__item--current":"tedi-vertical-stepper__item--current-959ca498","tedi-vertical-stepper__sub-list":"tedi-vertical-stepper__sub-list-4d058866","tedi-vertical-stepper__sub-item":"tedi-vertical-stepper__sub-item-a036a2cd","tedi-vertical-stepper__sub-indicator":"tedi-vertical-stepper__sub-indicator-49af9ca3","tedi-vertical-stepper__sub-dot":"tedi-vertical-stepper__sub-dot-2bf34163","tedi-vertical-stepper__sub-item--completed":"tedi-vertical-stepper__sub-item--completed-91a65a8a","tedi-vertical-stepper__sub-item--error":"tedi-vertical-stepper__sub-item--error-488deabe","tedi-vertical-stepper__sub-item--informative":"tedi-vertical-stepper__sub-item--informative-6efb4c22","tedi-vertical-stepper__sub-item--disabled":"tedi-vertical-stepper__sub-item--disabled-fa41df61","tedi-vertical-stepper__sub-item--current":"tedi-vertical-stepper__sub-item--current-4b39be16","tedi-vertical-stepper--compact":"tedi-vertical-stepper--compact-9310cb8d"};exports.default=e;
@@ -0,0 +1,34 @@
1
+ const e = {
2
+ "tedi-vertical-stepper": "tedi-vertical-stepper-cc48e08e",
3
+ "tedi-vertical-stepper__item": "tedi-vertical-stepper__item-5359847f",
4
+ "tedi-vertical-stepper__item--has-children": "tedi-vertical-stepper__item--has-children-83e7ee73",
5
+ "tedi-vertical-stepper__indicator": "tedi-vertical-stepper__indicator-041dc249",
6
+ "tedi-vertical-stepper__number": "tedi-vertical-stepper__number-a8243903",
7
+ "tedi-vertical-stepper__content": "tedi-vertical-stepper__content-0be415df",
8
+ "tedi-vertical-stepper__link": "tedi-vertical-stepper__link-fe115434",
9
+ "tedi-vertical-stepper__label-text": "tedi-vertical-stepper__label-text-173ed5d2",
10
+ "tedi-vertical-stepper__item--default": "tedi-vertical-stepper__item--default-a0855686",
11
+ "tedi-vertical-stepper__item--completed": "tedi-vertical-stepper__item--completed-6afeb234",
12
+ "tedi-vertical-stepper__item--error": "tedi-vertical-stepper__item--error-ffa453e0",
13
+ "tedi-vertical-stepper__toggle": "tedi-vertical-stepper__toggle-5f7111e6",
14
+ "tedi-vertical-stepper__toggle-button": "tedi-vertical-stepper__toggle-button-f9acf14c",
15
+ "tedi-vertical-stepper__label": "tedi-vertical-stepper__label-b58a742d",
16
+ "tedi-vertical-stepper__label-icon": "tedi-vertical-stepper__label-icon-4dc08a47",
17
+ "tedi-vertical-stepper__description": "tedi-vertical-stepper__description-13aceaa3",
18
+ "tedi-vertical-stepper__end-slot": "tedi-vertical-stepper__end-slot-9333f737",
19
+ "tedi-vertical-stepper__item--disabled": "tedi-vertical-stepper__item--disabled-bd12c124",
20
+ "tedi-vertical-stepper__item--current": "tedi-vertical-stepper__item--current-959ca498",
21
+ "tedi-vertical-stepper__sub-list": "tedi-vertical-stepper__sub-list-4d058866",
22
+ "tedi-vertical-stepper__sub-item": "tedi-vertical-stepper__sub-item-a036a2cd",
23
+ "tedi-vertical-stepper__sub-indicator": "tedi-vertical-stepper__sub-indicator-49af9ca3",
24
+ "tedi-vertical-stepper__sub-dot": "tedi-vertical-stepper__sub-dot-2bf34163",
25
+ "tedi-vertical-stepper__sub-item--completed": "tedi-vertical-stepper__sub-item--completed-91a65a8a",
26
+ "tedi-vertical-stepper__sub-item--error": "tedi-vertical-stepper__sub-item--error-488deabe",
27
+ "tedi-vertical-stepper__sub-item--informative": "tedi-vertical-stepper__sub-item--informative-6efb4c22",
28
+ "tedi-vertical-stepper__sub-item--disabled": "tedi-vertical-stepper__sub-item--disabled-fa41df61",
29
+ "tedi-vertical-stepper__sub-item--current": "tedi-vertical-stepper__sub-item--current-4b39be16",
30
+ "tedi-vertical-stepper--compact": "tedi-vertical-stepper--compact-9310cb8d"
31
+ };
32
+ export {
33
+ e as default
34
+ };
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),j=require("../../../../../external/classnames/index.cjs.js"),m=require("react"),b=require("../../base/typography/text/text.cjs.js"),f=require("../../buttons/closing-button/closing-button.cjs.js"),t=require("../modal/modal.cjs.js"),d=require("./sheet.module.scss.cjs.js"),i=({open:r,onToggle:a,defaultOpen:n,title:s,header:l,closeButton:c=!0,ariaLabel:u,className:h,children:x})=>{const o=m.useId();return e.jsx(t.Modal,{open:r,onToggle:a,defaultOpen:n,children:e.jsxs(t.Modal.Content,{position:"bottom",fullscreen:"edge","aria-label":u,"aria-labelledby":!l&&s!==void 0&&s!==null?o:void 0,className:j.default(d.default["tedi-sheet"],h),children:[l?e.jsx(t.Modal.Header,{children:l}):e.jsx(t.Modal.Header,{children:e.jsxs("div",{className:d.default["tedi-sheet__header"],children:[e.jsx(b.Text,{id:o,modifiers:"bold",color:"secondary",className:d.default["tedi-sheet__title"],children:s}),c&&e.jsx(t.Modal.Closer,{children:e.jsx(f.ClosingButton,{size:"small"})})]})}),e.jsx(t.Modal.Body,{children:x})]})})};i.displayName="Sheet";exports.Sheet=i;