@tedi-design-system/react 19.0.1-rc.1 → 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 (58) hide show
  1. package/bundle-stats.html +1 -1
  2. package/external/hoist-non-react-statics/external/react-is/cjs/react-is.development.cjs.js +1 -1
  3. package/external/hoist-non-react-statics/external/react-is/cjs/react-is.development.es.js +1 -1
  4. package/external/hoist-non-react-statics/external/react-is/cjs/react-is.production.min.cjs.js +1 -1
  5. package/external/hoist-non-react-statics/external/react-is/cjs/react-is.production.min.es.js +1 -1
  6. package/external/hoist-non-react-statics/external/react-is/index.cjs.js +1 -1
  7. package/external/hoist-non-react-statics/external/react-is/index.es.js +1 -1
  8. package/external/prop-types/external/react-is/cjs/react-is.development.cjs.js +1 -1
  9. package/external/prop-types/external/react-is/cjs/react-is.development.es.js +1 -1
  10. package/external/prop-types/external/react-is/cjs/react-is.production.min.cjs.js +1 -1
  11. package/external/prop-types/external/react-is/cjs/react-is.production.min.es.js +1 -1
  12. package/external/prop-types/external/react-is/index.cjs.js +1 -1
  13. package/external/prop-types/external/react-is/index.es.js +1 -1
  14. package/index.css +1 -1
  15. package/package.json +1 -1
  16. package/src/community/components/vertical-stepper/step-item/step-item.d.ts +6 -0
  17. package/src/community/components/vertical-stepper/sub-item/sub-item.d.ts +6 -0
  18. package/src/community/components/vertical-stepper/vertical-stepper.d.ts +6 -0
  19. package/src/tedi/components/navigation/card-stepper/card-stepper-step.cjs.js +1 -0
  20. package/src/tedi/components/navigation/card-stepper/card-stepper-step.d.ts +86 -0
  21. package/src/tedi/components/navigation/card-stepper/card-stepper-step.es.js +5 -0
  22. package/src/tedi/components/navigation/card-stepper/card-stepper.cjs.js +1 -0
  23. package/src/tedi/components/navigation/card-stepper/card-stepper.d.ts +130 -0
  24. package/src/tedi/components/navigation/card-stepper/card-stepper.es.js +200 -0
  25. package/src/tedi/components/navigation/card-stepper/card-stepper.module.scss.cjs.js +1 -0
  26. package/src/tedi/components/navigation/card-stepper/card-stepper.module.scss.es.js +26 -0
  27. package/src/tedi/components/navigation/card-stepper/index.d.ts +2 -0
  28. package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.cjs.js +1 -1
  29. package/src/tedi/components/navigation/table-of-contents/components/table-of-contents-collapsible/table-of-contents-collapsible.es.js +36 -58
  30. package/src/tedi/components/navigation/vertical-stepper/index.d.ts +3 -0
  31. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.cjs.js +1 -0
  32. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.d.ts +10 -0
  33. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-context.es.js +8 -0
  34. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.cjs.js +1 -0
  35. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.d.ts +74 -0
  36. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-item.es.js +109 -0
  37. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.cjs.js +1 -0
  38. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.d.ts +47 -0
  39. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper-sub-item.es.js +65 -0
  40. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.cjs.js +1 -0
  41. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.d.ts +28 -0
  42. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.es.js +32 -0
  43. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.module.scss.cjs.js +1 -0
  44. package/src/tedi/components/navigation/vertical-stepper/vertical-stepper.module.scss.es.js +34 -0
  45. package/src/tedi/components/overlays/sheet/sheet.cjs.js +1 -0
  46. package/src/tedi/components/overlays/sheet/sheet.d.ts +65 -0
  47. package/src/tedi/components/overlays/sheet/sheet.es.js +41 -0
  48. package/src/tedi/components/overlays/sheet/sheet.module.scss.cjs.js +1 -0
  49. package/src/tedi/components/overlays/sheet/sheet.module.scss.es.js +8 -0
  50. package/src/tedi/components/overlays/tooltip/tooltip.cjs.js +1 -1
  51. package/src/tedi/components/overlays/tooltip/tooltip.d.ts +1 -1
  52. package/src/tedi/components/overlays/tooltip/tooltip.es.js +1 -1
  53. package/src/tedi/index.d.ts +2 -0
  54. package/src/tedi/providers/label-provider/labels-map.cjs.js +1 -1
  55. package/src/tedi/providers/label-provider/labels-map.d.ts +42 -0
  56. package/src/tedi/providers/label-provider/labels-map.es.js +113 -71
  57. package/tedi.cjs.js +1 -1
  58. 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;