@tedi-design-system/react 16.0.0-rc.1 → 16.0.0-rc.10

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 (39) hide show
  1. package/bundle-stats.html +1 -1
  2. package/index.css +1 -1
  3. package/package.json +1 -1
  4. package/src/tedi/components/buttons/button-group/button-group.cjs.js +1 -1
  5. package/src/tedi/components/buttons/button-group/button-group.d.ts +4 -0
  6. package/src/tedi/components/buttons/button-group/button-group.es.js +31 -22
  7. package/src/tedi/components/buttons/button-group/button-group.module.scss.cjs.js +1 -1
  8. package/src/tedi/components/buttons/button-group/button-group.module.scss.es.js +2 -0
  9. package/src/tedi/components/buttons/info-button/info-button.cjs.js +1 -1
  10. package/src/tedi/components/buttons/info-button/info-button.d.ts +4 -3
  11. package/src/tedi/components/buttons/info-button/info-button.es.js +17 -16
  12. package/src/tedi/components/form/checkbox/checkbox.cjs.js +1 -1
  13. package/src/tedi/components/form/checkbox/checkbox.es.js +61 -59
  14. package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.cjs.js +1 -1
  15. package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.es.js +61 -58
  16. package/src/tedi/components/form/choice-input.types.d.ts +5 -1
  17. package/src/tedi/components/form/form-label/form-label.d.ts +1 -1
  18. package/src/tedi/components/form/radio/radio.cjs.js +1 -1
  19. package/src/tedi/components/form/radio/radio.es.js +55 -53
  20. package/src/tedi/components/layout/sidenav/components/sidenav-dropdown/sidenav-dropdown.cjs.js +1 -1
  21. package/src/tedi/components/layout/sidenav/components/sidenav-dropdown/sidenav-dropdown.d.ts +2 -1
  22. package/src/tedi/components/layout/sidenav/components/sidenav-dropdown/sidenav-dropdown.es.js +37 -35
  23. package/src/tedi/components/layout/sidenav/components/sidenav-item/sidenav-item.cjs.js +1 -1
  24. package/src/tedi/components/layout/sidenav/components/sidenav-item/sidenav-item.es.js +20 -19
  25. package/src/tedi/components/layout/sidenav/sidenav.d.ts +2 -1
  26. package/src/tedi/components/notifications/alert/alert.cjs.js +1 -1
  27. package/src/tedi/components/notifications/alert/alert.d.ts +8 -1
  28. package/src/tedi/components/notifications/alert/alert.es.js +17 -15
  29. package/src/tedi/components/notifications/alert/alert.module.scss.cjs.js +1 -1
  30. package/src/tedi/components/notifications/alert/alert.module.scss.es.js +2 -0
  31. package/src/tedi/components/overlays/overlay/overlay-content.cjs.js +1 -1
  32. package/src/tedi/components/overlays/overlay/overlay-content.es.js +13 -11
  33. package/src/tedi/components/overlays/overlay/overlay-trigger.cjs.js +1 -1
  34. package/src/tedi/components/overlays/overlay/overlay-trigger.es.js +21 -17
  35. package/src/tedi/components/overlays/overlay/overlay.cjs.js +1 -1
  36. package/src/tedi/components/overlays/overlay/overlay.d.ts +2 -0
  37. package/src/tedi/components/overlays/overlay/overlay.es.js +114 -88
  38. package/src/tedi/components/overlays/tooltip/tooltip.cjs.js +1 -1
  39. package/src/tedi/components/overlays/tooltip/tooltip.es.js +21 -14
@@ -1,47 +1,48 @@
1
- import { jsxs as s, jsx as d } from "react/jsx-runtime";
2
- import n from "../../../../../external/classnames/index.es.js";
3
- import m from "react";
4
- import { FeedbackText as B } from "../feedback-text/feedback-text.es.js";
5
- import { FormLabel as M } from "../form-label/form-label.es.js";
1
+ import { jsxs as l, jsx as d } from "react/jsx-runtime";
2
+ import c from "../../../../../external/classnames/index.es.js";
3
+ import s from "react";
4
+ import { FeedbackText as M } from "../feedback-text/feedback-text.es.js";
5
+ import { FormLabel as q } from "../form-label/form-label.es.js";
6
6
  import i from "./radio.module.scss.es.js";
7
7
  import { Row as v } from "../../layout/grid/row.es.js";
8
- import { Col as N } from "../../layout/grid/col.es.js";
9
- const J = (C) => {
8
+ import { Col as k } from "../../layout/grid/col.es.js";
9
+ const K = (N) => {
10
10
  const {
11
- id: a,
12
- label: o,
13
- value: h,
14
- className: g,
15
- disabled: f,
16
- onChange: r,
17
- hideLabel: y,
18
- helper: t,
19
- checked: l,
20
- defaultChecked: R,
21
- hover: x,
22
- name: j,
11
+ id: o,
12
+ label: n,
13
+ value: m,
14
+ className: C,
15
+ disabled: h,
16
+ onChange: a,
17
+ hideLabel: g,
18
+ helper: r,
19
+ checked: t,
20
+ defaultChecked: y,
21
+ hover: R,
22
+ name: x,
23
23
  tooltip: p,
24
- size: u = "default",
25
- invalid: w,
26
- ...F
27
- } = C, [_, I] = m.useState(R || !1), c = m.useRef(null), L = m.useMemo(() => r && typeof l < "u" ? l : _, [r, _, l]), $ = (e) => {
28
- typeof l > "u" && I(e == null ? void 0 : e.target.checked), r == null || r(h, e == null ? void 0 : e.target.checked);
29
- }, b = t ? t.id ?? `${a}-helper` : void 0, z = p ? `${a}-tooltip` : void 0, k = n(i["tedi-radio"], { [i["tedi-radio--disabled"]]: f });
30
- return /* @__PURE__ */ s("div", { "data-name": "radio", ...F, children: [
31
- /* @__PURE__ */ s(v, { gutter: 0, children: [
32
- /* @__PURE__ */ d(N, { width: "auto", children: /* @__PURE__ */ s("div", { className: i["tedi-radio__outer-indicator-wrapper"], children: [
24
+ size: f = "default",
25
+ invalid: j,
26
+ required: w,
27
+ ...I
28
+ } = N, [u, L] = s.useState(y || !1), _ = s.useRef(null), $ = s.useMemo(() => a && typeof t < "u" ? t : u, [a, u, t]), z = (e) => {
29
+ typeof t > "u" && L(e == null ? void 0 : e.target.checked), a == null || a(m, e == null ? void 0 : e.target.checked);
30
+ }, b = r ? r.id ?? `${o}-helper` : void 0, B = p ? `${o}-tooltip` : void 0, F = c(i["tedi-radio__label"], { [i["tedi-radio--disabled"]]: h });
31
+ return /* @__PURE__ */ l("div", { "data-name": "radio", ...I, children: [
32
+ /* @__PURE__ */ l(v, { gutter: 0, children: [
33
+ /* @__PURE__ */ d(k, { width: "auto", children: /* @__PURE__ */ l("div", { className: i["tedi-radio__outer-indicator-wrapper"], children: [
33
34
  /* @__PURE__ */ d(
34
35
  "input",
35
36
  {
36
- id: a,
37
- value: h,
38
- name: j,
37
+ id: o,
38
+ value: m,
39
+ name: x,
39
40
  type: "radio",
40
- disabled: f,
41
- checked: L,
42
- onChange: $,
41
+ disabled: h,
42
+ checked: $,
43
+ onChange: z,
43
44
  className: i["tedi-radio__input"],
44
- "aria-describedby": [b, z].filter(Boolean).join(" ")
45
+ "aria-describedby": [b, B].filter(Boolean).join(" ")
45
46
  }
46
47
  ),
47
48
  /* @__PURE__ */ d(
@@ -50,36 +51,37 @@ const J = (C) => {
50
51
  "aria-hidden": "true",
51
52
  onClick: () => {
52
53
  var e;
53
- return (e = c.current) == null ? void 0 : e.click();
54
+ return (e = _.current) == null ? void 0 : e.click();
54
55
  },
55
- className: n(
56
+ className: c(
56
57
  i["tedi-radio__indicator"],
57
- { [i["tedi-radio__indicator--hover"]]: x },
58
- { [i[`tedi-radio__indicator--size-${u}`]]: u },
59
- { [i["tedi-radio__indicator--invalid"]]: w },
60
- g
58
+ { [i["tedi-radio__indicator--hover"]]: R },
59
+ { [i[`tedi-radio__indicator--size-${f}`]]: f },
60
+ { [i["tedi-radio__indicator--invalid"]]: j },
61
+ C
61
62
  ),
62
63
  "data-testid": "radio-indicator"
63
64
  }
64
65
  )
65
66
  ] }) }),
66
- /* @__PURE__ */ d(N, { children: o && typeof o == "string" ? /* @__PURE__ */ d(
67
- M,
67
+ n && /* @__PURE__ */ d(k, { children: /* @__PURE__ */ d(
68
+ q,
68
69
  {
69
- ref: c,
70
- className: k,
71
- id: a,
70
+ ref: _,
71
+ className: F,
72
+ id: o,
72
73
  "data-testid": "radio-label",
73
- hideLabel: y,
74
- label: o,
75
- tooltip: p
74
+ hideLabel: g,
75
+ label: n,
76
+ tooltip: p,
77
+ required: w
76
78
  }
77
- ) : /* @__PURE__ */ d("label", { ref: c, htmlFor: a, className: k, "data-testid": "radio-label", children: o }) })
79
+ ) })
78
80
  ] }),
79
- t && /* @__PURE__ */ d(B, { id: b, ...t, className: n(i["tedi-radio__helper"], t.className) })
81
+ r && /* @__PURE__ */ d(M, { id: b, ...r, className: c(i["tedi-radio__helper"], r.className) })
80
82
  ] });
81
83
  };
82
84
  export {
83
- J as Radio,
84
- J as default
85
+ K as Radio,
86
+ K as default
85
87
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),d=require("../../../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),N=require("../../../../../../../external/classnames/index.cjs.js"),v=require("react"),k=require("../../../../navigation/link/link.cjs.js"),a=require("./sidenav-dropdown.module.scss.cjs.js"),D=require("../../../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),h=require("../../../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),q=require("../../../../../providers/label-provider/use-labels.cjs.js"),F=({trigger:b,groups:g,onOpenChange:o})=>{const{getLabel:x}=q.useLabels(),[u,r]=v.useState(!1),{refs:c,floatingStyles:_,context:f}=d.useFloating({open:u,middleware:[h.offset({mainAxis:8}),h.flip()],whileElementsMounted:D.autoUpdate,placement:"right-start",onOpenChange:e=>{r(e),o==null||o(e)},strategy:"fixed"}),{getReferenceProps:j,getFloatingProps:w}=d.useInteractions([d.useClick(f),d.useDismiss(f)]),p=e=>{var m;const n=e.subItemGroups||e.subItems,t=e.key||e.href||((m=e.children)==null?void 0:m.toString());return s.jsxs("li",{role:"none",className:N.default(a.default["tedi-sidenav-dropdown__item"],n&&a.default["tedi-sidenav-dropdown__item--has-children"]),children:[s.jsxs(k.Link,{...e,role:"menuitem","aria-haspopup":n?"true":void 0,"aria-expanded":n?!1:void 0,"aria-controls":n?`${t}-submenu`:void 0,className:a.default["tedi-sidenav-dropdown__link"],"data-active":e.isActive,"aria-current":e.isActive?"page":void 0,noStyle:!0,onClick:i=>{var l;(l=e.onClick)==null||l.call(e,i),r(!1)},children:[e.children,n&&s.jsx("span",{className:a.default["tedi-sidenav__bullet"]})]}),n&&s.jsx("ul",{id:`${t}-submenu`,className:a.default["tedi-sidenav-dropdown__list"],role:"menu","aria-label":x("sidenav.submenu"),children:(e.subItemGroups??(e.subItems?[{subItems:e.subItems}]:[])).map((i,l)=>s.jsxs(v.Fragment,{children:[i.subHeading&&s.jsx("div",{className:a.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:i.subHeading}),i.subItems.map(I=>p(I))]},l))})]},t)},y=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),r(n=>!n)),e.key==="Escape"&&(e.preventDefault(),r(!1),c.setReference(null))};return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:c.setReference,...j(),role:"button",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":u,onKeyDown:y,children:b}),u&&s.jsx(d.FloatingOverlay,{children:s.jsx(d.FloatingPortal,{children:s.jsx(d.FloatingFocusManager,{context:f,modal:!1,children:s.jsx("div",{ref:c.setFloating,style:_,className:a.default["tedi-sidenav-dropdown"],role:"menu",...w(),children:g.map((e,n)=>s.jsxs("div",{className:a.default["tedi-sidenav-dropdown__group"],children:[e.subHeading&&s.jsx("div",{className:a.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:e.subHeading}),s.jsx("ul",{className:a.default["tedi-sidenav-dropdown__list"],role:"menu",children:e.subItems.map(t=>p(t))})]},n))})})})})]})};exports.SideNavDropdown=F;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),d=require("../../../../../../../external/@floating-ui/react/dist/floating-ui.react.cjs.js"),k=require("../../../../../../../external/classnames/index.cjs.js"),m=require("react"),D=require("../../../../navigation/link/link.cjs.js"),a=require("./sidenav-dropdown.module.scss.cjs.js"),q=require("../../../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),h=require("../../../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),F=require("../../../../../providers/label-provider/use-labels.cjs.js"),S=({trigger:b,groups:g,onOpenChange:u,as:x})=>{const{getLabel:_}=F.useLabels(),[r,l]=m.useState(!1),{refs:c,floatingStyles:j,context:f}=d.useFloating({open:r,middleware:[h.offset({mainAxis:8}),h.flip()],whileElementsMounted:q.autoUpdate,placement:"right-start",onOpenChange:e=>{l(e),u==null||u(e)},strategy:"fixed"}),{getReferenceProps:w,getFloatingProps:y}=d.useInteractions([d.useClick(f),d.useDismiss(f)]),p=e=>{var v;const n=e.subItemGroups||e.subItems,t=e.key||e.href||((v=e.children)==null?void 0:v.toString());return s.jsxs("li",{role:"none",className:k.default(a.default["tedi-sidenav-dropdown__item"],n&&a.default["tedi-sidenav-dropdown__item--has-children"]),children:[s.jsxs(D.Link,{...e,role:"menuitem","aria-haspopup":n?"true":void 0,"aria-expanded":n?r:void 0,"aria-controls":n?`${t}-submenu`:void 0,className:a.default["tedi-sidenav-dropdown__link"],"data-active":e.isActive,"aria-current":e.isActive?"page":void 0,noStyle:!0,onClick:i=>{var o;(o=e.onClick)==null||o.call(e,i),l(!1)},as:e.as??x,children:[e.children,n&&s.jsx("span",{className:a.default["tedi-sidenav__bullet"]})]}),n&&s.jsx("ul",{id:`${t}-submenu`,className:a.default["tedi-sidenav-dropdown__list"],role:"menu","aria-label":_("sidenav.submenu"),children:(e.subItemGroups??(e.subItems?[{subItems:e.subItems}]:[])).map((i,o)=>s.jsxs(m.Fragment,{children:[i.subHeading&&s.jsx("div",{className:a.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:i.subHeading}),i.subItems.map(N=>p(N))]},o))})]},t)},I=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),l(n=>!n)),e.key==="Escape"&&(e.preventDefault(),l(!1),c.setReference(null))};return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:c.setReference,...w(),role:"button",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":r,onKeyDown:I,children:b}),r&&s.jsx(d.FloatingOverlay,{children:s.jsx(d.FloatingPortal,{children:s.jsx(d.FloatingFocusManager,{context:f,modal:!1,children:s.jsx("div",{ref:c.setFloating,style:j,className:a.default["tedi-sidenav-dropdown"],role:"menu",...y(),children:g.map((e,n)=>s.jsxs("div",{className:a.default["tedi-sidenav-dropdown__group"],children:[e.subHeading&&s.jsx("div",{className:a.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:e.subHeading}),s.jsx("ul",{className:a.default["tedi-sidenav-dropdown__list"],role:"menu",children:e.subItems.map(t=>p(t))})]},n))})})})})]})};exports.SideNavDropdown=S;
@@ -4,10 +4,11 @@ type SideNavDropdownProps<C extends React.ElementType = 'a'> = {
4
4
  trigger: React.ReactNode;
5
5
  groups: Group<C>[];
6
6
  onOpenChange?: (isOpen: boolean) => void;
7
+ as?: C;
7
8
  };
8
9
  type Group<C extends React.ElementType> = {
9
10
  subHeading?: string;
10
11
  subItems: SideNavItemProps<C>[];
11
12
  };
12
- export declare const SideNavDropdown: <C extends React.ElementType = "a">({ trigger, groups, onOpenChange, }: SideNavDropdownProps<C>) => import("react/jsx-runtime").JSX.Element;
13
+ export declare const SideNavDropdown: <C extends React.ElementType = "a">({ trigger, groups, onOpenChange, as, }: SideNavDropdownProps<C>) => import("react/jsx-runtime").JSX.Element;
13
14
  export {};
@@ -1,54 +1,56 @@
1
- import { jsxs as d, Fragment as N, jsx as a } from "react/jsx-runtime";
2
- import { useFloating as k, useInteractions as F, useClick as x, useDismiss as D, FloatingOverlay as S, FloatingPortal as H, FloatingFocusManager as R } from "../../../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
3
- import A from "../../../../../../../external/classnames/index.es.js";
4
- import E, { useState as L } from "react";
5
- import { Link as P } from "../../../../navigation/link/link.es.js";
1
+ import { jsxs as d, Fragment as k, jsx as a } from "react/jsx-runtime";
2
+ import { useFloating as F, useInteractions as x, useClick as D, useDismiss as S, FloatingOverlay as H, FloatingPortal as R, FloatingFocusManager as A } from "../../../../../../../external/@floating-ui/react/dist/floating-ui.react.es.js";
3
+ import E from "../../../../../../../external/classnames/index.es.js";
4
+ import L, { useState as P } from "react";
5
+ import { Link as j } from "../../../../navigation/link/link.es.js";
6
6
  import n from "./sidenav-dropdown.module.scss.es.js";
7
- import { autoUpdate as j } from "../../../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
8
- import { offset as G, flip as K } from "../../../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
9
- import { useLabels as M } from "../../../../../providers/label-provider/use-labels.es.js";
10
- const V = ({
7
+ import { autoUpdate as G } from "../../../../../../../external/@floating-ui/dom/dist/floating-ui.dom.es.js";
8
+ import { offset as K, flip as M } from "../../../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.es.js";
9
+ import { useLabels as $ } from "../../../../../providers/label-provider/use-labels.es.js";
10
+ const W = ({
11
11
  trigger: v,
12
12
  groups: h,
13
- onOpenChange: l
13
+ onOpenChange: c,
14
+ as: b
14
15
  }) => {
15
- const { getLabel: b } = M(), [c, o] = L(!1), { refs: u, floatingStyles: _, context: m } = k({
16
- open: c,
17
- middleware: [G({ mainAxis: 8 }), K()],
18
- whileElementsMounted: j,
16
+ const { getLabel: _ } = $(), [o, t] = P(!1), { refs: u, floatingStyles: g, context: m } = F({
17
+ open: o,
18
+ middleware: [K({ mainAxis: 8 }), M()],
19
+ whileElementsMounted: G,
19
20
  placement: "right-start",
20
21
  onOpenChange: (e) => {
21
- o(e), l == null || l(e);
22
+ t(e), c == null || c(e);
22
23
  },
23
24
  strategy: "fixed"
24
- }), { getReferenceProps: g, getFloatingProps: w } = F([x(m), D(m)]), p = (e) => {
25
+ }), { getReferenceProps: w, getFloatingProps: y } = x([D(m), S(m)]), p = (e) => {
25
26
  var f;
26
27
  const s = e.subItemGroups || e.subItems, r = e.key || e.href || ((f = e.children) == null ? void 0 : f.toString());
27
28
  return /* @__PURE__ */ d(
28
29
  "li",
29
30
  {
30
31
  role: "none",
31
- className: A(
32
+ className: E(
32
33
  n["tedi-sidenav-dropdown__item"],
33
34
  s && n["tedi-sidenav-dropdown__item--has-children"]
34
35
  ),
35
36
  children: [
36
37
  /* @__PURE__ */ d(
37
- P,
38
+ j,
38
39
  {
39
40
  ...e,
40
41
  role: "menuitem",
41
42
  "aria-haspopup": s ? "true" : void 0,
42
- "aria-expanded": s ? !1 : void 0,
43
+ "aria-expanded": s ? o : void 0,
43
44
  "aria-controls": s ? `${r}-submenu` : void 0,
44
45
  className: n["tedi-sidenav-dropdown__link"],
45
46
  "data-active": e.isActive,
46
47
  "aria-current": e.isActive ? "page" : void 0,
47
48
  noStyle: !0,
48
49
  onClick: (i) => {
49
- var t;
50
- (t = e.onClick) == null || t.call(e, i), o(!1);
50
+ var l;
51
+ (l = e.onClick) == null || l.call(e, i), t(!1);
51
52
  },
53
+ as: e.as ?? b,
52
54
  children: [
53
55
  e.children,
54
56
  s && /* @__PURE__ */ a("span", { className: n["tedi-sidenav__bullet"] })
@@ -61,42 +63,42 @@ const V = ({
61
63
  id: `${r}-submenu`,
62
64
  className: n["tedi-sidenav-dropdown__list"],
63
65
  role: "menu",
64
- "aria-label": b("sidenav.submenu"),
65
- children: (e.subItemGroups ?? (e.subItems ? [{ subItems: e.subItems }] : [])).map((i, t) => /* @__PURE__ */ d(E.Fragment, { children: [
66
+ "aria-label": _("sidenav.submenu"),
67
+ children: (e.subItemGroups ?? (e.subItems ? [{ subItems: e.subItems }] : [])).map((i, l) => /* @__PURE__ */ d(L.Fragment, { children: [
66
68
  i.subHeading && /* @__PURE__ */ a("div", { className: n["tedi-sidenav-dropdown__heading"], role: "presentation", children: i.subHeading }),
67
- i.subItems.map((I) => p(I))
68
- ] }, t))
69
+ i.subItems.map((N) => p(N))
70
+ ] }, l))
69
71
  }
70
72
  )
71
73
  ]
72
74
  },
73
75
  r
74
76
  );
75
- }, y = (e) => {
76
- (e.key === "Enter" || e.key === " ") && (e.preventDefault(), o((s) => !s)), e.key === "Escape" && (e.preventDefault(), o(!1), u.setReference(null));
77
+ }, I = (e) => {
78
+ (e.key === "Enter" || e.key === " ") && (e.preventDefault(), t((s) => !s)), e.key === "Escape" && (e.preventDefault(), t(!1), u.setReference(null));
77
79
  };
78
- return /* @__PURE__ */ d(N, { children: [
80
+ return /* @__PURE__ */ d(k, { children: [
79
81
  /* @__PURE__ */ a(
80
82
  "div",
81
83
  {
82
84
  ref: u.setReference,
83
- ...g(),
85
+ ...w(),
84
86
  role: "button",
85
87
  tabIndex: -1,
86
88
  "aria-haspopup": "menu",
87
- "aria-expanded": c,
88
- onKeyDown: y,
89
+ "aria-expanded": o,
90
+ onKeyDown: I,
89
91
  children: v
90
92
  }
91
93
  ),
92
- c && /* @__PURE__ */ a(S, { children: /* @__PURE__ */ a(H, { children: /* @__PURE__ */ a(R, { context: m, modal: !1, children: /* @__PURE__ */ a(
94
+ o && /* @__PURE__ */ a(H, { children: /* @__PURE__ */ a(R, { children: /* @__PURE__ */ a(A, { context: m, modal: !1, children: /* @__PURE__ */ a(
93
95
  "div",
94
96
  {
95
97
  ref: u.setFloating,
96
- style: _,
98
+ style: g,
97
99
  className: n["tedi-sidenav-dropdown"],
98
100
  role: "menu",
99
- ...w(),
101
+ ...y(),
100
102
  children: h.map((e, s) => /* @__PURE__ */ d("div", { className: n["tedi-sidenav-dropdown__group"], children: [
101
103
  e.subHeading && /* @__PURE__ */ a("div", { className: n["tedi-sidenav-dropdown__heading"], role: "presentation", children: e.subHeading }),
102
104
  /* @__PURE__ */ a("ul", { className: n["tedi-sidenav-dropdown__list"], role: "menu", children: e.subItems.map((r) => p(r)) })
@@ -106,5 +108,5 @@ const V = ({
106
108
  ] });
107
109
  };
108
110
  export {
109
- V as SideNavDropdown
111
+ W as SideNavDropdown
110
112
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),o=require("../../../../../../../external/classnames/index.cjs.js"),D=require("../../../../base/icon/icon.cjs.js"),E=require("../../../../buttons/collapse/collapse.cjs.js"),C=require("../../../../navigation/link/link.cjs.js"),s=require("../../sidenav.module.scss.cjs.js"),W=require("../sidenav-dropdown/sidenav-dropdown.cjs.js"),J=require("../../../../../providers/label-provider/use-labels.cjs.js"),g=require("../../../../overlays/tooltip/tooltip.cjs.js"),M=O=>{const{icon:t,children:l,isActive:j,onClick:N,subItems:S,subItemGroups:P,as:T,onItemClick:p,className:B,level:r=1,isCollapsed:c=!1,isDefaultOpen:$=!1,sideNavItemSize:z="default",...u}=O,{getLabel:q}=J.useLabels(),[n,w]=x.useState($??!1),[y,F]=x.useState(!1),v=x.useId(),m=P??(S?[{subItems:S}]:null),d=!!m,H=o.default(s.default["tedi-sidenav__item"],s.default[`tedi-sidenav__item--${z}`],{[s.default[`tedi-sidenav__item--level-${r}`]]:r>1,[s.default["tedi-sidenav__item--current"]]:j,[s.default["tedi-sidenav__item--has-children"]]:d},B),_=a=>{const i={color:"white",className:o.default(s.default["tedi-sidenav__icon"])},h=typeof a=="string"?{...i,name:a}:{...i,...a,className:o.default(i.className,a==null?void 0:a.className)};return e.jsx(D.Icon,{...h})},K=a=>{N==null||N(a),d||p==null||p()},b=a=>{w(a)},A=a=>{(a.key==="Enter"||a.key===" ")&&(a.preventDefault(),w(f=>{const i=!f;return b(i),i}))},G=d&&(u.href||u.to),k={...u,as:T,onClick:K,className:o.default(s.default["tedi-sidenav__link"],G&&s.default["tedi-sidenav__link--has-children-link"]),noStyle:!0,role:"menuitem","aria-current":j?"page":void 0,"aria-label":c&&typeof l=="string"?l:void 0,...d?{"aria-haspopup":"true","aria-expanded":n,"aria-controls":v}:{}},I=()=>!c&&(m==null?void 0:m.map((a,f)=>{var i;return e.jsxs("div",{children:[(a==null?void 0:a.subHeading)&&e.jsx("div",{className:s.default["tedi-sidenav__subheading"],children:a.subHeading}),e.jsx("ul",{className:s.default["tedi-sidenav__list"],role:"menu",children:(i=a.subItems)==null?void 0:i.map((h,R)=>x.createElement(M,{as:T,...h,key:R,level:r+1,onItemClick:p,isCollapsed:c,className:o.default(s.default["tedi-sidenav__sub-item"],h.className)}))})]},f)})),L=e.jsx("li",{"data-name":"sidenav-item",className:H,children:d&&c?e.jsx(W.SideNavDropdown,{trigger:e.jsx(g.Tooltip.Trigger,{children:e.jsxs("span",{className:o.default(s.default["tedi-sidenav__link"],y&&s.default["tedi-sidenav__link--active"]),children:[t&&_(t),e.jsx(D.Icon,{name:y?"chevron_right":"expand_more",color:"white",className:s.default["tedi-sidenav__toggle-icon"],size:18}),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:l})]})}),groups:m,onOpenChange:F}):d&&r===1?u.href||u.to?e.jsxs(e.Fragment,{children:[e.jsxs(C.Link,{...k,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:l})]}),e.jsx("div",{className:s.default["tedi-sidenav__link-collapse-wrapper"],children:e.jsx(E.Collapse,{id:v,hideCollapseText:!0,open:n,onToggle:b,toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:n,children:l}),className:s.default["tedi-sidenav__collapse"],children:I()})})]}):e.jsx(E.Collapse,{id:v,hideCollapseText:!0,open:n,onToggle:b,className:s.default["tedi-sidenav__collapse"],toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:n,children:l}),title:e.jsxs("span",{className:o.default(s.default["tedi-sidenav__link"],n&&s.default["tedi-sidenav__link--active"]),role:"button","aria-expanded":n,"aria-controls":v,"aria-current":j?"page":void 0,onKeyDown:A,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:l})]}),children:I()}):d?e.jsxs(e.Fragment,{children:[e.jsxs(C.Link,{...k,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:l}),e.jsx("i",{className:s.default["tedi-sidenav__bullet"]})]}),I()]}):e.jsx(g.Tooltip.Trigger,{children:e.jsxs(C.Link,{...k,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:l})]})})});return r===1&&c?e.jsxs(g.Tooltip,{placement:"right",focusManager:{order:["content"]},children:[e.jsx(g.Tooltip.Content,{maxWidth:"medium",children:l}),L]}):L};exports.SideNavItem=M;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),x=require("react"),o=require("../../../../../../../external/classnames/index.cjs.js"),D=require("../../../../base/icon/icon.cjs.js"),E=require("../../../../buttons/collapse/collapse.cjs.js"),S=require("../../../../navigation/link/link.cjs.js"),s=require("../../sidenav.module.scss.cjs.js"),W=require("../sidenav-dropdown/sidenav-dropdown.cjs.js"),J=require("../../../../../providers/label-provider/use-labels.cjs.js"),g=require("../../../../overlays/tooltip/tooltip.cjs.js"),M=O=>{const{icon:t,children:i,isActive:j,onClick:N,subItems:T,subItemGroups:P,as:b,onItemClick:v,className:B,level:r=1,isCollapsed:c=!1,isDefaultOpen:$=!1,sideNavItemSize:z="default",...u}=O,{getLabel:q}=J.useLabels(),[n,w]=x.useState($??!1),[y,F]=x.useState(!1),p=x.useId(),m=P??(T?[{subItems:T}]:null),d=!!m,H=o.default(s.default["tedi-sidenav__item"],s.default[`tedi-sidenav__item--${z}`],{[s.default[`tedi-sidenav__item--level-${r}`]]:r>1,[s.default["tedi-sidenav__item--current"]]:j,[s.default["tedi-sidenav__item--has-children"]]:d},B),_=a=>{const l={color:"white",className:o.default(s.default["tedi-sidenav__icon"])},h=typeof a=="string"?{...l,name:a}:{...l,...a,className:o.default(l.className,a==null?void 0:a.className)};return e.jsx(D.Icon,{...h})},K=a=>{N==null||N(a),d||v==null||v()},k=a=>{w(a)},A=a=>{(a.key==="Enter"||a.key===" ")&&(a.preventDefault(),w(f=>{const l=!f;return k(l),l}))},G=d&&(u.href||u.to),I={...u,as:b,onClick:K,className:o.default(s.default["tedi-sidenav__link"],G&&s.default["tedi-sidenav__link--has-children-link"]),noStyle:!0,role:"menuitem","aria-current":j?"page":void 0,"aria-label":c&&typeof i=="string"?i:void 0,...d?{"aria-haspopup":"true","aria-expanded":n,"aria-controls":p}:{}},C=()=>!c&&(m==null?void 0:m.map((a,f)=>{var l;return e.jsxs("div",{children:[(a==null?void 0:a.subHeading)&&e.jsx("div",{className:s.default["tedi-sidenav__subheading"],children:a.subHeading}),e.jsx("ul",{className:s.default["tedi-sidenav__list"],role:"menu",children:(l=a.subItems)==null?void 0:l.map((h,R)=>x.createElement(M,{as:b,...h,key:R,level:r+1,onItemClick:v,isCollapsed:c,className:o.default(s.default["tedi-sidenav__sub-item"],h.className)}))})]},f)})),L=e.jsx("li",{"data-name":"sidenav-item",className:H,children:d&&c?e.jsx(W.SideNavDropdown,{trigger:e.jsx(g.Tooltip.Trigger,{children:e.jsxs("span",{className:o.default(s.default["tedi-sidenav__link"],y&&s.default["tedi-sidenav__link--active"]),children:[t&&_(t),e.jsx(D.Icon,{name:y?"chevron_right":"expand_more",color:"white",className:s.default["tedi-sidenav__toggle-icon"],size:18}),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i})]})}),as:b,groups:m,onOpenChange:F}):d&&r===1?u.href||u.to?e.jsxs(e.Fragment,{children:[e.jsxs(S.Link,{...I,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i})]}),e.jsx("div",{className:s.default["tedi-sidenav__link-collapse-wrapper"],children:e.jsx(E.Collapse,{id:p,hideCollapseText:!0,open:n,onToggle:k,toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:n,children:i}),className:s.default["tedi-sidenav__collapse"],children:C()})})]}):e.jsx(E.Collapse,{id:p,hideCollapseText:!0,open:n,onToggle:k,className:s.default["tedi-sidenav__collapse"],toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:n,children:i}),title:e.jsxs("span",{className:o.default(s.default["tedi-sidenav__link"],n&&s.default["tedi-sidenav__link--active"]),role:"button","aria-expanded":n,"aria-controls":p,"aria-current":j?"page":void 0,onKeyDown:A,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i})]}),children:C()}):d?e.jsxs(e.Fragment,{children:[e.jsxs(S.Link,{...I,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i}),e.jsx("i",{className:s.default["tedi-sidenav__bullet"]})]}),C()]}):e.jsx(g.Tooltip.Trigger,{children:e.jsxs(S.Link,{...I,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i})]})})});return r===1&&c?e.jsxs(g.Tooltip,{placement:"right",focusManager:void 0,children:[e.jsx(g.Tooltip.Content,{maxWidth:"medium",children:i}),L]}):L};exports.SideNavItem=M;
@@ -3,7 +3,7 @@ import Q, { useState as O, createElement as R } from "react";
3
3
  import o from "../../../../../../../external/classnames/index.es.js";
4
4
  import { Icon as P } from "../../../../base/icon/icon.es.js";
5
5
  import { Collapse as B } from "../../../../buttons/collapse/collapse.es.js";
6
- import { Link as w } from "../../../../navigation/link/link.es.js";
6
+ import { Link as y } from "../../../../navigation/link/link.es.js";
7
7
  import e from "../../sidenav.module.scss.es.js";
8
8
  import { SideNavDropdown as U } from "../sidenav-dropdown/sidenav-dropdown.es.js";
9
9
  import { useLabels as V } from "../../../../../providers/label-provider/use-labels.es.js";
@@ -14,9 +14,9 @@ const X = (j) => {
14
14
  children: n,
15
15
  isActive: b,
16
16
  onClick: I,
17
- subItems: y,
17
+ subItems: S,
18
18
  subItemGroups: z,
19
- as: S,
19
+ as: k,
20
20
  onItemClick: h,
21
21
  className: H,
22
22
  level: c = 1,
@@ -24,7 +24,7 @@ const X = (j) => {
24
24
  isDefaultOpen: K = !1,
25
25
  sideNavItemSize: $ = "default",
26
26
  ..._
27
- } = j, { getLabel: T } = V(), [d, D] = O(K ?? !1), [L, A] = O(!1), u = Q.useId(), p = z ?? (y ? [{ subItems: y }] : null), r = !!p, F = o(
27
+ } = j, { getLabel: T } = V(), [d, D] = O(K ?? !1), [L, A] = O(!1), u = Q.useId(), p = z ?? (S ? [{ subItems: S }] : null), r = !!p, F = o(
28
28
  e["tedi-sidenav__item"],
29
29
  e[`tedi-sidenav__item--${$}`],
30
30
  {
@@ -45,16 +45,16 @@ const X = (j) => {
45
45
  return /* @__PURE__ */ s(P, { ...N });
46
46
  }, G = (a) => {
47
47
  I == null || I(a), r || h == null || h();
48
- }, k = (a) => {
48
+ }, C = (a) => {
49
49
  D(a);
50
50
  }, W = (a) => {
51
51
  (a.key === "Enter" || a.key === " ") && (a.preventDefault(), D((g) => {
52
52
  const t = !g;
53
- return k(t), t;
53
+ return C(t), t;
54
54
  }));
55
- }, q = r && (_.href || _.to), C = {
55
+ }, q = r && (_.href || _.to), x = {
56
56
  ..._,
57
- as: S,
57
+ as: k,
58
58
  onClick: G,
59
59
  className: o(e["tedi-sidenav__link"], q && e["tedi-sidenav__link--has-children-link"]),
60
60
  noStyle: !0,
@@ -66,14 +66,14 @@ const X = (j) => {
66
66
  "aria-expanded": d,
67
67
  "aria-controls": u
68
68
  } : {}
69
- }, x = () => !m && (p == null ? void 0 : p.map((a, g) => {
69
+ }, w = () => !m && (p == null ? void 0 : p.map((a, g) => {
70
70
  var t;
71
71
  return /* @__PURE__ */ l("div", { children: [
72
72
  (a == null ? void 0 : a.subHeading) && /* @__PURE__ */ s("div", { className: e["tedi-sidenav__subheading"], children: a.subHeading }),
73
73
  /* @__PURE__ */ s("ul", { className: e["tedi-sidenav__list"], role: "menu", children: (t = a.subItems) == null ? void 0 : t.map((N, J) => /* @__PURE__ */ R(
74
74
  X,
75
75
  {
76
- as: S,
76
+ as: k,
77
77
  ...N,
78
78
  key: J,
79
79
  level: c + 1,
@@ -105,11 +105,12 @@ const X = (j) => {
105
105
  ]
106
106
  }
107
107
  ) }),
108
+ as: k,
108
109
  groups: p,
109
110
  onOpenChange: A
110
111
  }
111
112
  ) : r && c === 1 ? _.href || _.to ? /* @__PURE__ */ l(M, { children: [
112
- /* @__PURE__ */ l(w, { ...C, children: [
113
+ /* @__PURE__ */ l(y, { ...x, children: [
113
114
  i && v(i),
114
115
  /* @__PURE__ */ s("span", { className: e["tedi-sidenav__title"], children: n })
115
116
  ] }),
@@ -119,13 +120,13 @@ const X = (j) => {
119
120
  id: u,
120
121
  hideCollapseText: !0,
121
122
  open: d,
122
- onToggle: k,
123
+ onToggle: C,
123
124
  toggleLabel: T("sidenav.toggleSubmenuChildren", {
124
125
  isCollapsedInternal: d,
125
126
  children: n
126
127
  }),
127
128
  className: e["tedi-sidenav__collapse"],
128
- children: x()
129
+ children: w()
129
130
  }
130
131
  ) })
131
132
  ] }) : /* @__PURE__ */ s(
@@ -134,7 +135,7 @@ const X = (j) => {
134
135
  id: u,
135
136
  hideCollapseText: !0,
136
137
  open: d,
137
- onToggle: k,
138
+ onToggle: C,
138
139
  className: e["tedi-sidenav__collapse"],
139
140
  toggleLabel: T("sidenav.toggleSubmenuChildren", {
140
141
  isCollapsedInternal: d,
@@ -158,20 +159,20 @@ const X = (j) => {
158
159
  ]
159
160
  }
160
161
  ),
161
- children: x()
162
+ children: w()
162
163
  }
163
164
  ) : r ? /* @__PURE__ */ l(M, { children: [
164
- /* @__PURE__ */ l(w, { ...C, children: [
165
+ /* @__PURE__ */ l(y, { ...x, children: [
165
166
  i && v(i),
166
167
  /* @__PURE__ */ s("span", { className: e["tedi-sidenav__title"], children: n }),
167
168
  /* @__PURE__ */ s("i", { className: e["tedi-sidenav__bullet"] })
168
169
  ] }),
169
- x()
170
- ] }) : /* @__PURE__ */ s(f.Trigger, { children: /* @__PURE__ */ l(w, { ...C, children: [
170
+ w()
171
+ ] }) : /* @__PURE__ */ s(f.Trigger, { children: /* @__PURE__ */ l(y, { ...x, children: [
171
172
  i && v(i),
172
173
  /* @__PURE__ */ s("span", { className: e["tedi-sidenav__title"], children: n })
173
174
  ] }) }) });
174
- return c === 1 && m ? /* @__PURE__ */ l(f, { placement: "right", focusManager: { order: ["content"] }, children: [
175
+ return c === 1 && m ? /* @__PURE__ */ l(f, { placement: "right", focusManager: void 0, children: [
175
176
  /* @__PURE__ */ s(f.Content, { maxWidth: "medium", children: n }),
176
177
  E
177
178
  ] }) : E;
@@ -86,13 +86,14 @@ export declare const SideNav: (<C extends React.ElementType = "a">(props: SideNa
86
86
  level?: number;
87
87
  isCollapsed?: boolean;
88
88
  }) => import("react/jsx-runtime").JSX.Element;
89
- Dropdown: <C extends React.ElementType = "a">({ trigger, groups, onOpenChange, }: {
89
+ Dropdown: <C extends React.ElementType = "a">({ trigger, groups, onOpenChange, as, }: {
90
90
  trigger: React.ReactNode;
91
91
  groups: {
92
92
  subHeading?: string;
93
93
  subItems: SideNavItemProps<C>[];
94
94
  }[];
95
95
  onOpenChange?: (isOpen: boolean) => void;
96
+ as?: C | undefined;
96
97
  }) => import("react/jsx-runtime").JSX.Element;
97
98
  Mobile: <C extends React.ElementType = "a">({ navItems, ariaLabel, linkAs, isOpen, onClose, showOverlay, id, className, }: {
98
99
  navItems: SideNavItemProps<C>[];
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),S=require("../../../../../external/classnames/index.cjs.js"),w=require("react"),C=require("../../base/icon/icon.cjs.js"),M=require("../../base/typography/heading/heading.cjs.js"),N=require("../../buttons/closing-button/closing-button.cjs.js"),t=require("./alert.module.scss.cjs.js"),P=require("../../../helpers/hooks/use-is-mounted.cjs.js"),k=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),y=require("../../layout/vertical-spacing/vertical-spacing.cjs.js"),z=require("../../layout/grid/row.cjs.js"),f=require("../../layout/grid/col.cjs.js"),p=a=>{const{getCurrentBreakpointProps:g}=k.useBreakpointProps(a.defaultServerBreakpoint),{children:s,role:i="alert",title:r,className:m,type:l="info",icon:o,onClose:c,isGlobal:h=!1,noSideBorders:j=!1,titleElement:q="h3",...x}=g(a),v=S.default(t.default["tedi-alert"],t.default[`tedi-alert--${l}`],{[t.default["tedi-alert--global"]]:h,[t.default["tedi-alert--no-side-borders"]]:j},m),_=P.useIsMounted(),b=n=>{const u={size:18},I=typeof n=="string"?{...u,name:n}:{...u,...n};return e.jsx(C.Icon,{...I,className:t.default["tedi-alert__icon"]})},B=i==="alert"?"assertive":i==="status"?"polite":"off",d=w.useId();return _?e.jsx("div",{role:i,"data-name":"alert","aria-label":`${l} alert`,"aria-live":B,"aria-labelledby":r?d:void 0,...x,className:v,children:e.jsxs(y.VerticalSpacing,{size:.25,children:[e.jsxs(z.Row,{gutterX:2,alignItems:r?"center":"start",children:[e.jsxs(f.Col,{grow:1,className:t.default["tedi-alert__content"],children:[o&&b(o),e.jsx("div",{className:"tedi-alert__content-wrapper",children:r?e.jsx(M.Heading,{element:q,id:d,modifiers:["h5"],children:r}):s})]}),c&&e.jsx(f.Col,{width:"auto",children:e.jsx(N.ClosingButton,{onClick:c,iconSize:18})})]}),r&&s&&e.jsx("div",{className:"tedi-alert__content-wrapper",children:s})]})}):null};exports.Alert=p;exports.default=p;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),w=require("../../../../../external/classnames/index.cjs.js"),C=require("react"),M=require("../../base/icon/icon.cjs.js"),N=require("../../base/typography/heading/heading.cjs.js"),P=require("../../buttons/closing-button/closing-button.cjs.js"),t=require("./alert.module.scss.cjs.js"),k=require("../../../helpers/hooks/use-is-mounted.cjs.js"),z=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),y=require("../../layout/vertical-spacing/vertical-spacing.cjs.js"),$=require("../../layout/grid/row.cjs.js"),f=require("../../layout/grid/col.cjs.js"),p=l=>{const{getCurrentBreakpointProps:g}=z.useBreakpointProps(l.defaultServerBreakpoint),{children:s,role:i="alert",title:r,className:m,type:n="info",icon:o,onClose:c,isGlobal:h=!1,noSideBorders:j=!1,titleElement:q="h3",size:x="default",...v}=g(l),_=w.default(t.default["tedi-alert"],t.default[`tedi-alert--${n}`],t.default[`tedi-alert--size-${x}`],{[t.default["tedi-alert--global"]]:h,[t.default["tedi-alert--no-side-borders"]]:j},m),b=k.useIsMounted(),B=a=>{const u={size:18},S=typeof a=="string"?{...u,name:a}:{...u,...a};return e.jsx(M.Icon,{...S,className:t.default["tedi-alert__icon"]})},I=i==="alert"?"assertive":i==="status"?"polite":"off",d=C.useId();return b?e.jsx("div",{role:i,"data-name":"alert","aria-label":`${n} alert`,"aria-live":I,"aria-labelledby":r?d:void 0,...v,className:_,children:e.jsxs(y.VerticalSpacing,{size:.25,children:[e.jsxs($.Row,{gutterX:2,alignItems:r?"center":"start",children:[e.jsxs(f.Col,{grow:1,className:t.default["tedi-alert__content"],children:[o&&B(o),e.jsx("div",{className:"tedi-alert__content-wrapper",children:r?e.jsx(N.Heading,{element:q,id:d,modifiers:["h5"],children:r}):s})]}),c&&e.jsx(f.Col,{width:"auto",children:e.jsx(P.ClosingButton,{onClick:c,iconSize:18})})]}),r&&s&&e.jsx("div",{className:"tedi-alert__content-wrapper",children:s})]})}):null};exports.Alert=p;exports.default=p;
@@ -20,6 +20,13 @@ type AlertBreakpointProps = {
20
20
  * @default false
21
21
  */
22
22
  noSideBorders?: boolean;
23
+ /**
24
+ * Alert size variant.
25
+ * - 'default': Standard alert size with padding and border radius.
26
+ * - 'small': More compact alert size with reduced padding.
27
+ * @default default
28
+ */
29
+ size?: 'default' | 'small';
23
30
  };
24
31
  export interface AlertProps extends BreakpointSupport<AlertBreakpointProps> {
25
32
  /**
@@ -69,7 +76,7 @@ export interface AlertProps extends BreakpointSupport<AlertBreakpointProps> {
69
76
  * // For secondary notifications
70
77
  * titleElement="h4"
71
78
  *
72
- * @default 'h3'
79
+ * @default h3
73
80
  */
74
81
  titleElement?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
75
82
  }
@@ -5,13 +5,13 @@ import { Icon as P } from "../../base/icon/icon.es.js";
5
5
  import { Heading as S } from "../../base/typography/heading/heading.es.js";
6
6
  import { ClosingButton as x } from "../../buttons/closing-button/closing-button.es.js";
7
7
  import t from "./alert.module.scss.es.js";
8
- import { useIsMounted as z } from "../../../helpers/hooks/use-is-mounted.es.js";
9
- import { useBreakpointProps as M } from "../../../helpers/hooks/use-breakpoint-props.es.js";
8
+ import { useIsMounted as M } from "../../../helpers/hooks/use-is-mounted.es.js";
9
+ import { useBreakpointProps as $ } from "../../../helpers/hooks/use-breakpoint-props.es.js";
10
10
  import { VerticalSpacing as j } from "../../layout/vertical-spacing/vertical-spacing.es.js";
11
11
  import { Row as E } from "../../layout/grid/row.es.js";
12
12
  import { Col as f } from "../../layout/grid/col.es.js";
13
- const K = (s) => {
14
- const { getCurrentBreakpointProps: u } = M(s.defaultServerBreakpoint), {
13
+ const O = (s) => {
14
+ const { getCurrentBreakpointProps: u } = $(s.defaultServerBreakpoint), {
15
15
  children: o,
16
16
  role: i = "alert",
17
17
  title: r,
@@ -22,33 +22,35 @@ const K = (s) => {
22
22
  isGlobal: g = !1,
23
23
  noSideBorders: _ = !1,
24
24
  titleElement: v = "h3",
25
- ...I
26
- } = u(s), N = k(
25
+ size: I = "default",
26
+ ...N
27
+ } = u(s), b = k(
27
28
  t["tedi-alert"],
28
29
  t[`tedi-alert--${n}`],
30
+ t[`tedi-alert--size-${I}`],
29
31
  {
30
32
  [t["tedi-alert--global"]]: g,
31
33
  [t["tedi-alert--no-side-borders"]]: _
32
34
  },
33
35
  h
34
- ), b = z(), B = (a) => {
36
+ ), B = M(), w = (a) => {
35
37
  const p = { size: 18 }, C = typeof a == "string" ? { ...p, name: a } : { ...p, ...a };
36
38
  return /* @__PURE__ */ e(P, { ...C, className: t["tedi-alert__icon"] });
37
- }, w = i === "alert" ? "assertive" : i === "status" ? "polite" : "off", m = y.useId();
38
- return b ? /* @__PURE__ */ e(
39
+ }, z = i === "alert" ? "assertive" : i === "status" ? "polite" : "off", m = y.useId();
40
+ return B ? /* @__PURE__ */ e(
39
41
  "div",
40
42
  {
41
43
  role: i,
42
44
  "data-name": "alert",
43
45
  "aria-label": `${n} alert`,
44
- "aria-live": w,
46
+ "aria-live": z,
45
47
  "aria-labelledby": r ? m : void 0,
46
- ...I,
47
- className: N,
48
+ ...N,
49
+ className: b,
48
50
  children: /* @__PURE__ */ l(j, { size: 0.25, children: [
49
51
  /* @__PURE__ */ l(E, { gutterX: 2, alignItems: r ? "center" : "start", children: [
50
52
  /* @__PURE__ */ l(f, { grow: 1, className: t["tedi-alert__content"], children: [
51
- d && B(d),
53
+ d && w(d),
52
54
  /* @__PURE__ */ e("div", { className: "tedi-alert__content-wrapper", children: r ? /* @__PURE__ */ e(S, { element: v, id: m, modifiers: ["h5"], children: r }) : o })
53
55
  ] }),
54
56
  c && /* @__PURE__ */ e(f, { width: "auto", children: /* @__PURE__ */ e(x, { onClick: c, iconSize: 18 }) })
@@ -59,6 +61,6 @@ const K = (s) => {
59
61
  ) : null;
60
62
  };
61
63
  export {
62
- K as Alert,
63
- K as default
64
+ O as Alert,
65
+ O as default
64
66
  };
@@ -1 +1 @@
1
- "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-alert":"tedi-alert-8ca3e7b9","tedi-alert__content":"tedi-alert__content-d480ed20","tedi-alert__icon":"tedi-alert__icon-f9ab1feb","tedi-alert--info":"tedi-alert--info-bcd40044","tedi-alert--success":"tedi-alert--success-e6d21f49","tedi-alert--warning":"tedi-alert--warning-88456526","tedi-alert--danger":"tedi-alert--danger-b9a2aa60","tedi-alert--global":"tedi-alert--global-14ff86d0","tedi-alert--no-side-borders":"tedi-alert--no-side-borders-a15a1df0"};exports.default=e;
1
+ "use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-alert":"tedi-alert-8ca3e7b9","tedi-alert__content":"tedi-alert__content-d480ed20","tedi-alert__icon":"tedi-alert__icon-f9ab1feb","tedi-alert--size-default":"tedi-alert--size-default-6a9ebe2c","tedi-alert--size-small":"tedi-alert--size-small-4c763cad","tedi-alert--info":"tedi-alert--info-bcd40044","tedi-alert--success":"tedi-alert--success-e6d21f49","tedi-alert--warning":"tedi-alert--warning-88456526","tedi-alert--danger":"tedi-alert--danger-b9a2aa60","tedi-alert--global":"tedi-alert--global-14ff86d0","tedi-alert--no-side-borders":"tedi-alert--no-side-borders-a15a1df0"};exports.default=e;
@@ -2,6 +2,8 @@ const e = {
2
2
  "tedi-alert": "tedi-alert-8ca3e7b9",
3
3
  "tedi-alert__content": "tedi-alert__content-d480ed20",
4
4
  "tedi-alert__icon": "tedi-alert__icon-f9ab1feb",
5
+ "tedi-alert--size-default": "tedi-alert--size-default-6a9ebe2c",
6
+ "tedi-alert--size-small": "tedi-alert--size-small-4c763cad",
5
7
  "tedi-alert--info": "tedi-alert--info-bcd40044",
6
8
  "tedi-alert--success": "tedi-alert--success-e6d21f49",
7
9
  "tedi-alert--warning": "tedi-alert--warning-88456526",