@tedi-design-system/react 17.1.0-rc.9 → 17.2.0-rc.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "17.1.0-rc.9",
+  "version": "17.2.0-rc.1",
   "type": "module",
   "sideEffects": false,
   "exports": {
@@ -43,7 +43,7 @@
     "@mui/material": "^5.15.13",
     "@mui/x-date-pickers": "^5.0.20",
     "@tanstack/react-table": "^8.13.2",
-    "@tedi-design-system/core": "6.0.1",
+    "@tedi-design-system/core": "6.4.0",
     "classnames": "^2.5.1",
     "draft-js": "^0.11.7",
     "draftjs-md-converter": "^1.5.2",

package/src/community/components/layout/breadcrumbs/breadcrumbs.d.ts

@@ -17,6 +17,9 @@ type ConditionalTypes<C extends React.ElementType> = {
     linkAs?: never;
     crumbs: CrumbProps<IntentionalAny>[];
 };
+/**
+ * @deprecated Use Breadcrumbs from `@tedi-design-system/react/tedi` instead.
+ */
 export type BreadcrumbsProps<C extends React.ElementType = 'a'> = ConditionalTypes<C> & {
     /**
      * Additional custom class.
@@ -29,5 +32,8 @@ export type BreadcrumbsProps<C extends React.ElementType = 'a'> = ConditionalTyp
      */
     showMinimalCrumbs?: boolean | Layouts;
 };
+/**
+ * @deprecated Use Breadcrumbs from `@tedi-design-system/react/tedi` instead.
+ */
 export declare const Breadcrumbs: <C extends React.ElementType = "a">(props: BreadcrumbsProps<C>) => JSX.Element | null;
 export default Breadcrumbs;

package/src/community/components/layout/breadcrumbs/crumb/crumb.d.ts

@@ -1,5 +1,8 @@
 import { default as React } from 'react';
 import { AnchorProps } from '../../../anchor/anchor';
+/**
+ * @deprecated Use Breadcrumbs from `@tedi-design-system/react/tedi` instead.
+ */
 export type CrumbProps<C extends React.ElementType = 'a'> = {
     /**
      * If crumb is last/current page;
@@ -7,6 +10,9 @@ export type CrumbProps<C extends React.ElementType = 'a'> = {
      */
     isLast?: boolean;
 } & AnchorProps<C>;
+/**
+ * @deprecated Use Breadcrumbs from `@tedi-design-system/react/tedi` instead.
+ */
 declare const Crumb: <C extends React.ElementType = "a">(props: CrumbProps<C> & {
     singleCrumb?: boolean;
 }) => JSX.Element;

package/src/tedi/components/buttons/button-content/button-content.d.ts

@@ -22,7 +22,7 @@ export type ButtonContentProps<C extends React.ElementType, P extends Record<str
      */
     fullWidth?: boolean;
     /**
-     * Color schema for button. PS text-color works only with link type links.
+     * Color scheme of the button. The 'text' value is only supported when visualType is 'link'.
      * @default default
      */
     color?: ButtonColor;

package/src/tedi/components/buttons/button-content/button-content.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-btn":"tedi-btn-f8b478d7","tedi-btn--small":"tedi-btn--small-e94b9068","tedi-btn--icon-only":"tedi-btn--icon-only-ca6a5cf1","tedi-btn--large":"tedi-btn--large-7e783e1a","tedi-btn--neutral":"tedi-btn--neutral-c8726f60","tedi-btn--default":"tedi-btn--default-9fd10888","tedi-btn--danger":"tedi-btn--danger-9c01f2b8","tedi-btn__text":"tedi-btn__text-a9860fef","tedi-btn--primary":"tedi-btn--primary-8ae5fe2e","tedi-btn--is-active":"tedi-btn--is-active-a575ad1a","tedi-btn--is-hovered":"tedi-btn--is-hovered-5b87ccb5","tedi-btn--secondary":"tedi-btn--secondary-770ac807","tedi-btn--success":"tedi-btn--success-92db7606","tedi-btn--inverted":"tedi-btn--inverted-fd168601","tedi-btn--link":"tedi-btn--link-33d9c4c6","tedi-btn--text-color":"tedi-btn--text-color-f85da3c7","tedi-btn__inner":"tedi-btn__inner-ee6403e9","tedi-btn__icon--left":"tedi-btn__icon--left-63fdbc12","tedi-btn__icon--right":"tedi-btn__icon--right-67cbf204","tedi-btn__icon-responsive":"tedi-btn__icon-responsive-91341acf","tedi-btn--is-loading":"tedi-btn--is-loading-4ead0e89","tedi-btn--icon":"tedi-btn--icon-dbc3eb30","tedi-btn__icon":"tedi-btn__icon-cffac719","tedi-btn__icon-standalone--link":"tedi-btn__icon-standalone--link-d6b6714d","tedi-btn__spinner":"tedi-btn__spinner-abd3f027","tedi-btn--underline":"tedi-btn--underline-bf1600fb","tedi-btn--no-style":"tedi-btn--no-style-f6dfaa4d","tedi-btn--full-width":"tedi-btn--full-width-f1e5f1b3"};exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-btn":"tedi-btn-f8b478d7","tedi-btn--small":"tedi-btn--small-e94b9068","tedi-btn--icon-only":"tedi-btn--icon-only-ca6a5cf1","tedi-btn--large":"tedi-btn--large-7e783e1a","tedi-btn--neutral":"tedi-btn--neutral-c8726f60","tedi-btn--default":"tedi-btn--default-9fd10888","tedi-btn--danger":"tedi-btn--danger-9c01f2b8","tedi-btn__text":"tedi-btn__text-a9860fef","tedi-btn--primary":"tedi-btn--primary-8ae5fe2e","tedi-btn--is-active":"tedi-btn--is-active-a575ad1a","tedi-btn--is-hovered":"tedi-btn--is-hovered-5b87ccb5","tedi-btn--secondary":"tedi-btn--secondary-770ac807","tedi-btn--success":"tedi-btn--success-92db7606","tedi-btn--inverted":"tedi-btn--inverted-fd168601","tedi-btn--link":"tedi-btn--link-33d9c4c6","tedi-btn--text":"tedi-btn--text-af7055b9","tedi-btn__inner":"tedi-btn__inner-ee6403e9","tedi-btn__icon--left":"tedi-btn__icon--left-63fdbc12","tedi-btn__icon--right":"tedi-btn__icon--right-67cbf204","tedi-btn__icon-responsive":"tedi-btn__icon-responsive-91341acf","tedi-btn--is-loading":"tedi-btn--is-loading-4ead0e89","tedi-btn--icon":"tedi-btn--icon-dbc3eb30","tedi-btn__icon":"tedi-btn__icon-cffac719","tedi-btn__icon-standalone--link":"tedi-btn__icon-standalone--link-d6b6714d","tedi-btn__spinner":"tedi-btn__spinner-abd3f027","tedi-btn--underline":"tedi-btn--underline-bf1600fb","tedi-btn--no-style":"tedi-btn--no-style-f6dfaa4d","tedi-btn--full-width":"tedi-btn--full-width-f1e5f1b3"};exports.default=t;

package/src/tedi/components/buttons/button-content/button-content.module.scss.es.js

@@ -14,7 +14,7 @@ const t = {
   "tedi-btn--success": "tedi-btn--success-92db7606",
   "tedi-btn--inverted": "tedi-btn--inverted-fd168601",
   "tedi-btn--link": "tedi-btn--link-33d9c4c6",
-  "tedi-btn--text-color": "tedi-btn--text-color-f85da3c7",
+  "tedi-btn--text": "tedi-btn--text-af7055b9",
   "tedi-btn__inner": "tedi-btn__inner-ee6403e9",
   "tedi-btn__icon--left": "tedi-btn__icon--left-63fdbc12",
   "tedi-btn__icon--right": "tedi-btn__icon--right-67cbf204",

package/src/tedi/components/buttons/button-group/button-group.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),y=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),C=require("../../../providers/label-provider/use-labels.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),x=b=>{const{getLabel:k}=C.useLabels(),{children:q,className:w,type:c="primary",onSelectionChange:i,stretch:I=!1,ariaLabel:v,size:f="default",enableMobileDropdown:N=!1,mobileBreakpoint:R="md",dropdownLabel:h=k("sidenav.submenu"),dropdownLabelMode:A="static"}=b,D=L.useBreakpoint(),M=L.isBreakpointBelow(D,R),m=_.Children.toArray(q).filter(e=>_.isValidElement(e)&&e.type===y.Button),t=m.find(e=>e.props.isActive),B=A==="static"?h:(t==null?void 0:t.props.children)??h,a=t==null?void 0:t.props.iconLeft,d=t==null?void 0:t.props.icon;return M&&N?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(y.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),B]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:s=>{var p,j;e.props.disabled||(s.type==="click"&&((j=(p=e.props).onClick)==null||j.call(p,s)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:I},w),role:"group","aria-label":v,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,onClick:u=>{var s,p;(p=(s=e.props).onClick)==null||p.call(s,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=x;exports.default=x;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const o=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),_=require("react"),n=require("../../base/icon/icon.cjs.js"),x=require("../button/button.cjs.js"),r=require("./button-group.module.scss.cjs.js"),L=require("../../../helpers/hooks/use-breakpoint.cjs.js"),C=require("../../../providers/label-provider/use-labels.cjs.js"),l=require("../../overlays/dropdown/dropdown.cjs.js"),b=k=>{const{getLabel:j}=C.useLabels(),{children:q,className:w,type:c="primary",onSelectionChange:i,stretch:v=!1,ariaLabel:I,size:f="default",enableMobileDropdown:A=!1,mobileBreakpoint:N="md",dropdownLabel:y=j("sidenav.submenu"),dropdownLabelMode:R="static"}=k,B=L.useBreakpoint(),D=L.isBreakpointBelow(B,N),m=_.Children.toArray(q).filter(e=>_.isValidElement(e)&&e.type===x.Button),s=m.find(e=>e.props.isActive),M=R==="static"?y:(s==null?void 0:s.props.children)??y,a=s==null?void 0:s.props.iconLeft,d=s==null?void 0:s.props.icon;return D&&A?o.jsxs(l.Dropdown,{width:"trigger",children:[o.jsx(l.Dropdown.Trigger,{children:o.jsxs(x.Button,{visualType:c,className:g.default(r.default["tedi-button-group__dropdown-trigger"],r.default[`tedi-button-group__dropdown-trigger--${c}`],w),noStyle:!0,fullWidth:!0,children:[a?o.jsx(n.Icon,{name:typeof a=="string"?a:a.name,color:"inherit"}):d?o.jsx(n.Icon,{name:typeof d=="string"?d:d.name,color:"inherit"}):o.jsx(n.Icon,{name:"menu",color:"inherit"}),M]})}),o.jsx(l.Dropdown.Content,{children:m.map((e,u)=>o.jsxs(l.Dropdown.Item,{index:u,active:e==null?void 0:e.props.isActive,disabled:e==null?void 0:e.props.disabled,onClick:t=>{var p,h;e.props.disabled||(t.type==="click"&&((h=(p=e.props).onClick)==null||h.call(p,t)),e.props.id&&(i==null||i(e.props.id)))},className:r.default["tedi-button-group__dropdown-item"],children:[e.props.iconLeft&&o.jsx(n.Icon,{name:typeof e.props.iconLeft=="string"?e.props.iconLeft:e.props.iconLeft.name,color:"inherit"}),e.props.children,e.props.iconRight&&o.jsx(n.Icon,{name:typeof e.props.iconRight=="string"?e.props.iconRight:e.props.iconRight.name,color:"inherit"}),e.props.isActive&&o.jsx("span",{className:"sr-only",children:j("button-group.selected")})]},e.props.id||u))})]}):o.jsx("div",{className:g.default(r.default["tedi-button-group"],r.default[`tedi-button-group--${c}`],{[r.default["tedi-button-group--stretch"]]:v},w),role:"group","aria-label":I,children:m.map(e=>_.cloneElement(e,{className:g.default(r.default["tedi-button-group__item"],{[r.default["tedi-button-group__item--active"]]:e.props.isActive,[r.default["tedi-button-group__item--disabled"]]:e.props.disabled,[r.default[`tedi-button-group__item--size-${f}`]]:f},e.props.className),size:f,"aria-pressed":!!e.props.isActive,onClick:u=>{var t,p;(p=(t=e.props).onClick)==null||p.call(t,u),e.props.id&&(i==null||i(e.props.id))}}))})};exports.ButtonGroup=b;exports.default=b;

package/src/tedi/components/buttons/button-group/button-group.es.js

@@ -1,36 +1,36 @@
 import { jsxs as g, jsx as i } from "react/jsx-runtime";
-import _ from "../../../../../external/classnames/index.es.js";
-import { Children as x, isValidElement as z, cloneElement as D } from "react";
+import y from "../../../../../external/classnames/index.es.js";
+import { Children as x, isValidElement as z, cloneElement as B } from "react";
 import { Icon as a } from "../../base/icon/icon.es.js";
-import { Button as w } from "../button/button.es.js";
+import { Button as k } from "../button/button.es.js";
 import r from "./button-group.module.scss.es.js";
-import { useBreakpoint as E, isBreakpointBelow as T } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { useLabels as V } from "../../../providers/label-provider/use-labels.es.js";
-import { Dropdown as m } from "../../overlays/dropdown/dropdown.es.js";
-const P = (k) => {
-  const { getLabel: N } = V(), {
-    children: b,
+import { useBreakpoint as D, isBreakpointBelow as E } from "../../../helpers/hooks/use-breakpoint.es.js";
+import { useLabels as T } from "../../../providers/label-provider/use-labels.es.js";
+import { Dropdown as d } from "../../overlays/dropdown/dropdown.es.js";
+const P = (N) => {
+  const { getLabel: _ } = T(), {
+    children: v,
     className: h,
-    type: c = "primary",
+    type: m = "primary",
     onSelectionChange: p,
-    stretch: v = !1,
-    ariaLabel: A,
+    stretch: A = !1,
+    ariaLabel: b,
     size: u = "default",
     enableMobileDropdown: I = !1,
     mobileBreakpoint: R = "md",
-    dropdownLabel: y = N("sidenav.submenu"),
+    dropdownLabel: L = _("sidenav.submenu"),
     dropdownLabelMode: C = "static"
-  } = k, M = E(), $ = T(M, R), f = x.toArray(b).filter(
-    (o) => z(o) && o.type === w
-  ), e = f.find((o) => o.props.isActive), j = C === "static" ? y : (e == null ? void 0 : e.props.children) ?? y, n = e == null ? void 0 : e.props.iconLeft, l = e == null ? void 0 : e.props.icon;
-  return $ && I ? /* @__PURE__ */ g(m, { width: "trigger", children: [
-    /* @__PURE__ */ i(m.Trigger, { children: /* @__PURE__ */ g(
-      w,
+  } = N, M = D(), $ = E(M, R), f = x.toArray(v).filter(
+    (o) => z(o) && o.type === k
+  ), e = f.find((o) => o.props.isActive), j = C === "static" ? L : (e == null ? void 0 : e.props.children) ?? L, n = e == null ? void 0 : e.props.iconLeft, l = e == null ? void 0 : e.props.icon;
+  return $ && I ? /* @__PURE__ */ g(d, { width: "trigger", children: [
+    /* @__PURE__ */ i(d.Trigger, { children: /* @__PURE__ */ g(
+      k,
       {
-        visualType: c,
-        className: _(
+        visualType: m,
+        className: y(
           r["tedi-button-group__dropdown-trigger"],
-          r[`tedi-button-group__dropdown-trigger--${c}`],
+          r[`tedi-button-group__dropdown-trigger--${m}`],
           h
         ),
         noStyle: !0,
@@ -41,15 +41,15 @@ const P = (k) => {
         ]
       }
     ) }),
-    /* @__PURE__ */ i(m.Content, { children: f.map((o, d) => /* @__PURE__ */ g(
-      m.Item,
+    /* @__PURE__ */ i(d.Content, { children: f.map((o, c) => /* @__PURE__ */ g(
+      d.Item,
       {
-        index: d,
+        index: c,
         active: o == null ? void 0 : o.props.isActive,
         disabled: o == null ? void 0 : o.props.disabled,
         onClick: (s) => {
-          var t, L;
-          o.props.disabled || (s.type === "click" && ((L = (t = o.props).onClick) == null || L.call(t, s)), o.props.id && (p == null || p(o.props.id)));
+          var t, w;
+          o.props.disabled || (s.type === "click" && ((w = (t = o.props).onClick) == null || w.call(t, s)), o.props.id && (p == null || p(o.props.id)));
         },
         className: r["tedi-button-group__dropdown-item"],
         children: [
@@ -67,25 +67,26 @@ const P = (k) => {
               name: typeof o.props.iconRight == "string" ? o.props.iconRight : o.props.iconRight.name,
               color: "inherit"
             }
-          )
+          ),
+          o.props.isActive && /* @__PURE__ */ i("span", { className: "sr-only", children: _("button-group.selected") })
         ]
       },
-      o.props.id || d
+      o.props.id || c
     )) })
   ] }) : /* @__PURE__ */ i(
     "div",
     {
-      className: _(
+      className: y(
         r["tedi-button-group"],
-        r[`tedi-button-group--${c}`],
-        { [r["tedi-button-group--stretch"]]: v },
+        r[`tedi-button-group--${m}`],
+        { [r["tedi-button-group--stretch"]]: A },
         h
       ),
       role: "group",
-      "aria-label": A,
+      "aria-label": b,
       children: f.map(
-        (o) => D(o, {
-          className: _(
+        (o) => B(o, {
+          className: y(
             r["tedi-button-group__item"],
             {
               [r["tedi-button-group__item--active"]]: o.props.isActive,
@@ -95,9 +96,10 @@ const P = (k) => {
             o.props.className
           ),
           size: u,
-          onClick: (d) => {
+          "aria-pressed": !!o.props.isActive,
+          onClick: (c) => {
             var s, t;
-            (t = (s = o.props).onClick) == null || t.call(s, d), o.props.id && (p == null || p(o.props.id));
+            (t = (s = o.props).onClick) == null || t.call(s, c), o.props.id && (p == null || p(o.props.id));
           }
         })
       )

package/src/tedi/components/buttons/floating-button/floating-button.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-btn":"tedi-btn-46574e9e","tedi-btn--small":"tedi-btn--small-97569c3a","tedi-btn--icon-only":"tedi-btn--icon-only-687afb86","tedi-btn--large":"tedi-btn--large-30b2336f","tedi-btn--neutral":"tedi-btn--neutral-dfb5e967","tedi-btn--default":"tedi-btn--default-1bab37cf","tedi-btn--danger":"tedi-btn--danger-ce1411e6","tedi-btn__text":"tedi-btn__text-24c50120","tedi-btn--primary":"tedi-btn--primary-d127e524","tedi-btn--is-active":"tedi-btn--is-active-05d20ecf","tedi-btn--is-hovered":"tedi-btn--is-hovered-d798316b","tedi-btn--secondary":"tedi-btn--secondary-ca5af8db","tedi-btn--success":"tedi-btn--success-470ed017","tedi-btn--inverted":"tedi-btn--inverted-b218d4df","tedi-btn--link":"tedi-btn--link-5c908f1f","tedi-btn--text-color":"tedi-btn--text-color-dd311f47","tedi-btn__inner":"tedi-btn__inner-df9867b5","tedi-btn__icon--left":"tedi-btn__icon--left-a9b176d3","tedi-btn__icon--right":"tedi-btn__icon--right-bccdacec","tedi-btn__icon-responsive":"tedi-btn__icon-responsive-201b5d44","tedi-btn--is-loading":"tedi-btn--is-loading-6534cc98","tedi-btn--icon":"tedi-btn--icon-21bbe29b","tedi-btn__icon":"tedi-btn__icon-8ff68f98","tedi-btn__icon-standalone--link":"tedi-btn__icon-standalone--link-3ad337b4","tedi-btn__spinner":"tedi-btn__spinner-ac3c6e8f","tedi-btn--underline":"tedi-btn--underline-281af007","tedi-btn--no-style":"tedi-btn--no-style-ed02c4bd","tedi-btn--full-width":"tedi-btn--full-width-90cbf5a9","tedi-floating-button":"tedi-floating-button-3c8f9de2","tedi-floating-button--horizontal":"tedi-floating-button--horizontal-48509abb","tedi-floating-button--vertical":"tedi-floating-button--vertical-0ff466d5","tedi-floating-button--primary":"tedi-floating-button--primary-7c6e48ad","tedi-floating-button--secondary":"tedi-floating-button--secondary-f7a0cd3f","tedi-floating-button--medium":"tedi-floating-button--medium-cddc5b75","tedi-floating-button--icon-only":"tedi-floating-button--icon-only-17b35563","tedi-floating-button--large":"tedi-floating-button--large-a688151c"};exports.default=t;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t={"tedi-btn":"tedi-btn-46574e9e","tedi-btn--small":"tedi-btn--small-97569c3a","tedi-btn--icon-only":"tedi-btn--icon-only-687afb86","tedi-btn--large":"tedi-btn--large-30b2336f","tedi-btn--neutral":"tedi-btn--neutral-dfb5e967","tedi-btn--default":"tedi-btn--default-1bab37cf","tedi-btn--danger":"tedi-btn--danger-ce1411e6","tedi-btn__text":"tedi-btn__text-24c50120","tedi-btn--primary":"tedi-btn--primary-d127e524","tedi-btn--is-active":"tedi-btn--is-active-05d20ecf","tedi-btn--is-hovered":"tedi-btn--is-hovered-d798316b","tedi-btn--secondary":"tedi-btn--secondary-ca5af8db","tedi-btn--success":"tedi-btn--success-470ed017","tedi-btn--inverted":"tedi-btn--inverted-b218d4df","tedi-btn--link":"tedi-btn--link-5c908f1f","tedi-btn--text":"tedi-btn--text-9b2f7e3a","tedi-btn__inner":"tedi-btn__inner-df9867b5","tedi-btn__icon--left":"tedi-btn__icon--left-a9b176d3","tedi-btn__icon--right":"tedi-btn__icon--right-bccdacec","tedi-btn__icon-responsive":"tedi-btn__icon-responsive-201b5d44","tedi-btn--is-loading":"tedi-btn--is-loading-6534cc98","tedi-btn--icon":"tedi-btn--icon-21bbe29b","tedi-btn__icon":"tedi-btn__icon-8ff68f98","tedi-btn__icon-standalone--link":"tedi-btn__icon-standalone--link-3ad337b4","tedi-btn__spinner":"tedi-btn__spinner-ac3c6e8f","tedi-btn--underline":"tedi-btn--underline-281af007","tedi-btn--no-style":"tedi-btn--no-style-ed02c4bd","tedi-btn--full-width":"tedi-btn--full-width-90cbf5a9","tedi-floating-button":"tedi-floating-button-3c8f9de2","tedi-floating-button--horizontal":"tedi-floating-button--horizontal-48509abb","tedi-floating-button--vertical":"tedi-floating-button--vertical-0ff466d5","tedi-floating-button--primary":"tedi-floating-button--primary-7c6e48ad","tedi-floating-button--secondary":"tedi-floating-button--secondary-f7a0cd3f","tedi-floating-button--medium":"tedi-floating-button--medium-cddc5b75","tedi-floating-button--icon-only":"tedi-floating-button--icon-only-17b35563","tedi-floating-button--large":"tedi-floating-button--large-a688151c"};exports.default=t;

package/src/tedi/components/buttons/floating-button/floating-button.module.scss.es.js

@@ -14,7 +14,7 @@ const t = {
   "tedi-btn--success": "tedi-btn--success-470ed017",
   "tedi-btn--inverted": "tedi-btn--inverted-b218d4df",
   "tedi-btn--link": "tedi-btn--link-5c908f1f",
-  "tedi-btn--text-color": "tedi-btn--text-color-dd311f47",
+  "tedi-btn--text": "tedi-btn--text-9b2f7e3a",
   "tedi-btn__inner": "tedi-btn__inner-df9867b5",
   "tedi-btn__icon--left": "tedi-btn__icon--left-a9b176d3",
   "tedi-btn__icon--right": "tedi-btn__icon--right-bccdacec",

package/src/tedi/components/cards/card/card-stories-templates.d.ts

@@ -1,4 +1,4 @@
-import { StoryFn } from '@storybook/react/*';
+import { StoryFn } from '@storybook/react';
 import { CardStory } from './card.stories';
 export declare const HeaderTypesTemplate: StoryFn<CardStory>;
 export declare const DefaultCardTemplates: StoryFn<CardStory>;

package/src/tedi/components/layout/header/components/header-language/header-language.d.ts

@@ -0,0 +1,45 @@
+import { TediLanguage } from '../../../../../providers/label-provider';
+export interface Language {
+    /** Display text shown in the language selector (e.g. 'EST', 'ENG'). */
+    label: string;
+    /**
+     * Locale code for this language. When present, `setLocale` from the LabelProvider
+     * is called with this value on selection. Ignored when `onClick` is provided.
+     */
+    locale?: TediLanguage;
+    /**
+     * Custom click handler. When provided, it takes full control of what happens on select —
+     * the component only updates its displayed label and provides `onToggle` so the handler
+     * can decide when to close the popover.
+     */
+    onClick?: (props: {
+        onToggle: (open: boolean) => void;
+    }) => void;
+    /** Whether this language is currently active. Used to set `aria-current` on the option. */
+    isSelected?: boolean;
+    /** Accessible label for screen readers (e.g. 'Estonian', 'English'). */
+    'aria-label'?: string;
+}
+export interface HeaderLanguageProps {
+    /**
+     * List of available languages to display in the selector dropdown.
+     * Each language object accepts:
+     * - `label` — display text (e.g. 'EST', 'ENG')
+     * - `locale` — locale code passed to `setLocale` on selection (ignored when `onClick` is provided)
+     * - `onClick` — custom click handler that takes full control of selection behavior
+     * - `isSelected` — marks the language as currently active (`aria-current`)
+     * - `aria-label` — accessible label for screen readers (e.g. 'Estonian', 'English')
+     */
+    languages: Language[];
+    /** Initially displayed language label. Falls back to the label matching the current locale, or the first item. */
+    currentLanguage?: string;
+    /** Label for the language selector.
+     * Falls back to the default i18n label when not provided.
+     **/
+    selectLabel?: string;
+}
+export declare const HeaderLanguage: {
+    (props: HeaderLanguageProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderLanguage;

package/src/tedi/components/layout/header/components/header-login/header-login.d.ts

@@ -0,0 +1,22 @@
+import { BreakpointSupport } from '../../../../../helpers';
+interface HeaderLoginBreakpointProps {
+    /**
+     * Controls the visual size of the login button.
+     * `'small'` renders a compact icon button (used on mobile), `'default'` renders a full-width link.
+     * Automatically falls back to `'small'` on mobile viewports when not specified.
+     */
+    size?: 'default' | 'small';
+    /** Custom label text for the login button. Falls back to the `header.login` or `header.login.mobile` translation key. */
+    label?: string;
+}
+export interface HeaderLoginProps extends BreakpointSupport<HeaderLoginBreakpointProps> {
+    /** Click handler fired when the login button is activated. */
+    onClick?: () => void;
+    /** URL to navigate to when the login button is clicked. */
+    href?: string;
+}
+export declare const HeaderLogin: {
+    (props: HeaderLoginProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderLogin;

package/src/tedi/components/layout/header/components/header-logout/header-logout.d.ts

@@ -0,0 +1,22 @@
+import { BreakpointSupport } from '../../../../../helpers';
+interface HeaderLogoutBreakpointProps {
+    /**
+     * Controls the visual size of the logout button.
+     * `'small'` renders a compact icon button (used on mobile), `'default'` renders a full-width link with icon.
+     * Automatically falls back to `'small'` on mobile viewports when not specified.
+     */
+    size?: 'default' | 'small';
+    /** Custom label text for the logout button. Falls back to the `header.logout` or `header.logout.mobile` translation key. */
+    label?: string;
+}
+export interface HeaderLogoutProps extends BreakpointSupport<HeaderLogoutBreakpointProps> {
+    /** Click handler fired when the logout button is activated. */
+    onClick?: () => void;
+    /** URL to navigate to when the logout button is clicked. */
+    href?: string;
+}
+export declare const HeaderLogout: {
+    (props: HeaderLogoutProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderLogout;

package/src/tedi/components/layout/header/components/header-mobile-button/header-mobile-button.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+import { IconWithoutBackgroundProps } from '../../../../base/icon/icon';
+interface HeaderMobileButtonProps {
+    /** Click handler for the button. */
+    onClick?: () => void;
+    /** If provided, the button renders as a link navigating to this URL. */
+    href?: string;
+    /**
+     * Icon displayed inside the button.
+     * Can be a material icon name (e.g. 'menu') or a full IconWithoutBackgroundProps object for more control.
+     */
+    icon: string | IconWithoutBackgroundProps;
+    /** Label text displayed below the icon. */
+    label?: string;
+    /** Whether the button is in a selected state. */
+    selected?: boolean;
+    /** Whether the button is disabled. */
+    disabled?: boolean;
+}
+declare const HeaderMobileButton: React.ForwardRefExoticComponent<HeaderMobileButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export default HeaderMobileButton;

package/src/tedi/components/layout/header/components/header-profile/header-profile.d.ts

@@ -0,0 +1,43 @@
+import { Breakpoint, BreakpointSupport } from '../../../../../helpers';
+interface HeaderProfileContextValue {
+    activeRoleId: string | null;
+    setActiveRoleId: (id: string | null) => void;
+}
+export declare const useHeaderProfile: () => HeaderProfileContextValue | null;
+interface HeaderProfileBreakpointProps {
+    /**
+     * Defines the breakpoint from which the profile menu is displayed as a popover.
+     * Below this breakpoint, it is rendered as a modal.
+     *
+     * @default lg
+     */
+    showPopover?: Breakpoint;
+    /** Custom label text for the profile button. Falls back to the `header.profile` translation key. */
+    label?: string;
+}
+export interface HeaderProfileProps extends BreakpointSupport<HeaderProfileBreakpointProps> {
+    /** Content rendered inside the profile popover or modal (e.g. navigation links, logout button). */
+    children: React.ReactNode;
+    /**
+     * Whether to display a text label next to the profile icon on non-mobile viewports.
+     * @default false
+     */
+    showLabel?: boolean;
+    /**
+     * Whether the profile button is disabled. Prevents opening the popover or modal.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Removes default item styles from the mobile modal content.
+     * When `true`, children are rendered without padding, borders, or background applied by the component.
+     * Use when the content requires custom item styling.
+     * @default false
+     */
+    noStyle?: boolean;
+}
+export declare const HeaderProfile: {
+    (props: HeaderProfileProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderProfile;

package/src/tedi/components/layout/header/components/header-role/header-role-representatives.d.ts

@@ -0,0 +1,79 @@
+import { default as React } from 'react';
+import { IconProps } from '../../../../base/icon/icon';
+export interface Representative {
+    /** Unique identifier for the representative. */
+    id: string;
+    /** Display name shown in the header and selection list. */
+    name: string;
+    /** Additional context shown below the name (e.g. role, organization, personal code). */
+    description?: string;
+    /**
+     * Icon displayed next to the representative in the selection list. Accepts either a
+     * Material Icon name as a string (`'person'`) for the common case, or a full
+     * `IconProps` object (`{ name: 'person', size: 18 }`) when explicit props are needed.
+     */
+    icon?: string | IconProps;
+}
+interface HeaderRoleRepresentativesProps {
+    /** Unique id for the collapsible panel, used for aria-controls on the toggle. */
+    id?: string;
+    /** Id of the toggle button, used for aria-labelledby on the panel. */
+    toggleId?: string;
+    /** List of representatives to display in the selection list. */
+    representatives: Representative[];
+    /** Currently selected representative. */
+    representative?: Representative;
+    /** Current value of the search input. */
+    inputValue: string;
+    /** Callback to update the search input value. */
+    setInputValue: (value: string) => void;
+    /** Callback to update the selected representative. */
+    setRepresentative: (rep: Representative) => void;
+    /** Callback to control the open/closed state of the role selection. */
+    setIsRoleSelectionOpen: (open: boolean) => void;
+    /** Callback fired when the role selection is toggled. Handles both state update and external notification. */
+    onRoleSelectionToggle?: () => void;
+    /** Whether the role selection panel is currently open. */
+    isRoleSelectionOpen: boolean;
+    /** Whether the representatives belong to an organization context. Affects the search input label. */
+    isOrganization?: boolean;
+    /**
+     * Label for the search input when selecting a representative.
+     * Falls back to i18n labels when not provided.
+     */
+    searchLabel?: string;
+    /**
+     * Label for the search input when selecting an organization representative.
+     * Overrides both the default and `searchLabel` when `isOrganization` is true.
+     */
+    organizationSearchLabel?: string;
+    /** Optional id for the search input. Falls back to a generated unique id. */
+    searchId?: string;
+    /** Whether to keep the role selection open after selecting a representative. */
+    keepOpenOnSelect?: boolean;
+    /**
+     * Whether to display the search input above the representative list.
+     * @default false
+     */
+    showSearch?: boolean;
+    /**
+     * Whether the search input shows a clear button.
+     * @default false
+     */
+    searchClearable?: boolean;
+    /**
+     * Whether to clear the search input when a representative is selected.
+     * @default true
+     */
+    clearSearchOnSelect?: boolean;
+    /**
+     * Custom content rendered when the filtered representative list is empty.
+     * Falls back to the default "no results" label when not provided.
+     */
+    noResultsContent?: React.ReactNode;
+}
+declare const HeaderRoleRepresentatives: {
+    (props: HeaderRoleRepresentativesProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderRoleRepresentatives;

package/src/tedi/components/layout/header/components/header-role/header-role.d.ts

@@ -0,0 +1,74 @@
+import { default as React } from 'react';
+import { Representative } from './header-role-representatives';
+export interface HeaderRoleProps {
+    /**
+     * Descriptive label rendered above the representative name (e.g. plain text, Tag, or any ReactNode).
+     */
+    label?: React.ReactNode;
+    /**
+     * Whether to display the selected representative's description text in the header area.
+     * Does not affect the description shown in the selection list items.
+     * @default true
+     */
+    showDescription?: boolean;
+    /** List of selectable representatives. */
+    representatives: Representative[];
+    /** Whether the role represents an organization. */
+    isOrganization?: boolean;
+    /** Custom labels for the accordion toggle button. */
+    accordionLabels?: {
+        open?: string;
+        close?: string;
+    };
+    /**
+     * Label for the search input when selecting a representative.
+     * Falls back to i18n labels when not provided.
+     */
+    searchLabel?: string;
+    /**
+     * Label for the search input when selecting an organization representative.
+     * Overrides both the default and `searchLabel` when `isOrganization` is true.
+     */
+    organizationSearchLabel?: string;
+    /** Optional id for the search input. Falls back to a generated unique id. */
+    searchId?: string;
+    /** Callback fired when the role selection accordion or popover is toggled. */
+    onRoleSelectionToggle?: (isOpen: boolean) => void;
+    /** Callback fired when a representative is selected. */
+    onRepresentativeChange?: (representative: Representative) => void;
+    /**
+     * Whether to display the search input above the representative list.
+     * @default false
+     */
+    showSearch?: boolean;
+    /**
+     * Whether the search input shows a clear button.
+     * @default false
+     */
+    searchClearable?: boolean;
+    /**
+     * Whether to clear the search input when a representative is selected.
+     * @default true
+     */
+    clearSearchOnSelect?: boolean;
+    /**
+     * Custom content rendered inside the role selection popover (desktop) or accordion (tablet and mobile).
+     * When provided, replaces the default representative list entirely.
+     */
+    children?: React.ReactNode;
+    /**
+     * Whether to show the role selection toggle and dropdown.
+     * When omitted, defaults to showing the selection when there are multiple representatives.
+     */
+    showRoleSwitch?: boolean;
+    /**
+     * Custom content rendered when the filtered representative list is empty.
+     * Falls back to the default "no results" label when not provided.
+     */
+    noResultsContent?: React.ReactNode;
+}
+export declare const HeaderRole: {
+    (props: HeaderRoleProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderRole;

package/src/tedi/components/layout/header/components/header-search/header-search.d.ts

@@ -0,0 +1,28 @@
+type MobileSearchVariant = 'modal' | 'inline';
+export interface HeaderSearchProps {
+    /** Search input or form content rendered inside the search area. */
+    children: React.ReactNode;
+    /**
+     * How the search is presented on mobile viewports.
+     * `'modal'` opens a full-screen overlay with a close button, `'inline'` renders the search directly in the header bottom area.
+     * @default modal
+     */
+    mobileVariant?: MobileSearchVariant;
+    /** Custom label overrides for the search button and modal title. */
+    mobileLabels?: {
+        /** Label for the mobile search toggle button. Falls back to the `header.search` translation key. */
+        button?: string;
+        /** Title displayed at the top of the mobile search modal. Falls back to the `header.search` translation key. */
+        modalTitle?: string;
+    };
+    /**
+     * Whether the mobile search button is disabled. Prevents opening the search modal.
+     * @default false
+     */
+    disabled?: boolean;
+}
+export declare const HeaderSearch: {
+    (props: HeaderSearchProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default HeaderSearch;