@tedi-design-system/react 16.0.0-rc.9 → 16.0.0

package/src/tedi/components/form/number-field/number-field.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),v=require("../../../../../external/classnames/index.cjs.js"),o=require("react"),J=require("../../base/typography/text/text.cjs.js"),K=require("../../buttons/button/button.cjs.js"),Q=require("../feedback-text/feedback-text.cjs.js"),X=require("../form-label/form-label.cjs.js"),n=require("./number-field.module.scss.cjs.js"),Y=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),Z=require("../../../providers/label-provider/use-labels.cjs.js"),I=N=>{const{getCurrentBreakpointProps:P}=Y.useBreakpointProps(N.defaultServerBreakpoint),{id:x,label:S,hideLabel:U,required:q,className:j,size:_,inputMode:E="numeric",decimalPlaces:F,min:i,max:u,step:c=1,defaultValue:$,value:B,onChange:a,suffix:h,fullWidth:z=!1,disabled:m=!1,invalid:M=!1,helper:s,input:f}=P(N),{getLabel:k}=Z.useLabels(),b=o.useRef(null),[L,T]=o.useState(""),[V,g]=o.useState($??0),r=o.useMemo(()=>a&&typeof B<"u"?B:V,[a,B,V]),w=s?`${x}-helper`:void 0,C=o.useCallback(e=>{const t=i!==void 0&&e<i,d=u!==void 0&&e>u;return M||t||d||(s==null?void 0:s.type)==="error"},[M,s,u,i]),y=e=>Math.min(u??1/0,Math.max(i??-1/0,e)),R=e=>{const t=k("numberField.quantityUpdated",e);T(t),setTimeout(()=>{T("")},5e3)},W=e=>F!==void 0?parseFloat(e.toFixed(F)):e,A=e=>{let t=r;e==="increment"&&(t=t+c),e==="decrement"&&(t=t-c),t=y(t),t=W(t),R(t),a==null||a(t),g(t)},D=({currentTarget:{value:e}})=>{a==null||a(y(+e)),g(y(+e))},O=e=>{const t=e==="increment"?u!==void 0&&r>=u:i!==void 0&&r<=i,d=v.default(n.default["tedi-number-field__button"],n.default[`tedi-number-field__button--${e}`],{[n.default["tedi-number-field__button--disabled"]]:t||m}),p=k(`numberField.${e}`,c);return l.jsx(K.Button,{"aria-label":p,onClick:()=>A(e),disabled:t||m,visualType:"secondary",className:d,icon:{name:e==="increment"?"add":"remove"},size:_==="small"?"small":void 0,children:e==="increment"?"+":"-"})},G=()=>{const e=v.default(n.default["tedi-number-field__input-wrapper"],{[n.default["tedi-number-field__input-wrapper--with-suffix"]]:h,[n.default["tedi-number-field__input-wrapper--full-width"]]:z}),t=v.default(n.default["tedi-number-field__input"],f==null?void 0:f.className),d=()=>{var p;return(p=b==null?void 0:b.current)==null?void 0:p.focus()};return l.jsxs("div",{className:e,onClick:d,children:[l.jsx("input",{ref:b,id:x,"aria-describedby":w,"aria-invalid":C(r)?"true":"false",type:"number",inputMode:E,value:r,min:i,max:u,required:q,step:c,disabled:m,onChange:D,className:t,...f}),h&&l.jsx(J.Text,{element:"span",modifiers:"small",color:"tertiary",className:n.default["tedi-number-field__suffix"],children:h})]})},H=v.default(n.default["tedi-number-field"],{[n.default["tedi-number-field--invalid"]]:C(r)},{[n.default["tedi-number-field--disabled"]]:m},{[n.default["tedi-number-field--small"]]:_==="small"},j);return l.jsxs("div",{"data-name":"number-field",className:j,children:[l.jsx(X.FormLabel,{id:x,label:S,required:q,hideLabel:U,size:_}),l.jsxs("div",{className:H,children:[O("decrement"),G(),O("increment")]}),s&&l.jsx(Q.FeedbackText,{...s,id:w}),L&&l.jsx("div",{"aria-live":"polite",className:"sr-only",children:L})]})};I.displayName="NumberField";exports.NumberField=I;exports.default=I;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const l=require("react/jsx-runtime"),v=require("../../../../../external/classnames/index.cjs.js"),o=require("react"),J=require("../../base/typography/text/text.cjs.js"),K=require("../../buttons/button/button.cjs.js"),Q=require("../feedback-text/feedback-text.cjs.js"),X=require("../form-label/form-label.cjs.js"),n=require("./number-field.module.scss.cjs.js"),Y=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),Z=require("../../../providers/label-provider/use-labels.cjs.js"),y=I=>{const{getCurrentBreakpointProps:P}=Y.useBreakpointProps(I.defaultServerBreakpoint),{id:x,label:S,hideLabel:U,required:q,className:j,size:_,inputMode:E="numeric",decimalPlaces:k,min:i,max:u,step:c=1,defaultValue:$,value:B,onChange:a,suffix:h,fullWidth:z=!1,disabled:m=!1,invalid:F=!1,helper:d,input:f}=P(I),{getLabel:M}=Z.useLabels(),b=o.useRef(null),[L,T]=o.useState(""),[V,g]=o.useState($??0),s=o.useMemo(()=>a&&typeof B<"u"?B:V,[a,B,V]),w=d?`${x}-helper`:void 0,C=o.useCallback(e=>{const t=i!==void 0&&e<i,r=u!==void 0&&e>u;return F||t||r||(d==null?void 0:d.type)==="error"},[F,d,u,i]),N=e=>Math.min(u??1/0,Math.max(i??-1/0,e)),R=e=>{const t=M("numberField.quantityUpdated",e);T(t),setTimeout(()=>{T("")},5e3)},W=e=>k!==void 0?parseFloat(e.toFixed(k)):e,A=e=>{let t=s;e==="increment"&&(t=t+c),e==="decrement"&&(t=t-c),t=N(t),t=W(t),R(t),a==null||a(t),g(t)},D=({currentTarget:{value:e}})=>{a==null||a(N(+e)),g(N(+e))},O=e=>{const t=e==="increment"?u!==void 0&&s>=u:i!==void 0&&s<=i,r=v.default(n.default["tedi-number-field__button"],n.default[`tedi-number-field__button--${e}`],{[n.default["tedi-number-field__button--disabled"]]:t||m}),p=M(`numberField.${e}`,c);return l.jsx(K.Button,{"aria-label":p,onClick:()=>A(e),disabled:t||m,visualType:"secondary",className:r,icon:{name:e==="increment"?"add":"remove"},size:_==="small"?"small":void 0,children:e==="increment"?"+":"-"})},G=()=>{const e=v.default(n.default["tedi-number-field__input-wrapper"],{[n.default["tedi-number-field__input-wrapper--with-suffix"]]:h,[n.default["tedi-number-field__input-wrapper--full-width"]]:z}),t=v.default(n.default["tedi-number-field__input"],f==null?void 0:f.className),r=()=>{var p;return(p=b==null?void 0:b.current)==null?void 0:p.focus()};return l.jsxs("div",{className:e,onClick:r,children:[l.jsx("input",{ref:b,id:x,"aria-describedby":w,"aria-invalid":C(s)?"true":"false",type:"number",inputMode:E,value:s,min:i,max:u,required:q,step:c,disabled:m,onChange:D,className:t,...f}),h&&l.jsx(J.Text,{element:"span",modifiers:"small",color:"tertiary",className:n.default["tedi-number-field__suffix"],children:h})]})},H=v.default(n.default["tedi-number-field"],{[n.default["tedi-number-field--invalid"]]:C(s)},{[n.default["tedi-number-field--disabled"]]:m},{[n.default["tedi-number-field--small"]]:_==="small"},j);return l.jsxs("div",{"data-name":"number-field",className:j,children:[l.jsx(X.FormLabel,{id:x,label:S,required:q,hideLabel:U,size:_}),l.jsxs("div",{className:H,children:[O("decrement"),G(),O("increment")]}),d&&l.jsx(Q.FeedbackText,{className:n.default["tedi-number-field__feedback"],...d,id:w}),L&&l.jsx("div",{"aria-live":"polite",className:"sr-only",children:L})]})};y.displayName="NumberField";exports.NumberField=y;exports.default=y;

package/src/tedi/components/form/number-field/number-field.es.js

@@ -1,4 +1,4 @@
-import { jsxs as y, jsx as d } from "react/jsx-runtime";
+import { jsxs as N, jsx as d } from "react/jsx-runtime";
 import b from "../../../../../external/classnames/index.es.js";
 import { useRef as K, useState as O, useMemo as Q, useCallback as R } from "react";
 import { Text as X } from "../../base/typography/text/text.es.js";
@@ -8,59 +8,59 @@ import { FormLabel as ee } from "../form-label/form-label.es.js";
 import n from "./number-field.module.scss.es.js";
 import { useBreakpointProps as te } from "../../../helpers/hooks/use-breakpoint-props.es.js";
 import { useLabels as ne } from "../../../providers/label-provider/use-labels.es.js";
-const ie = (N) => {
-  const { getCurrentBreakpointProps: P } = te(N.defaultServerBreakpoint), {
+const ie = (y) => {
+  const { getCurrentBreakpointProps: P } = te(y.defaultServerBreakpoint), {
     id: v,
     label: $,
     hideLabel: j,
     required: x,
-    className: F,
+    className: k,
     size: _,
     inputMode: q = "numeric",
-    decimalPlaces: M,
+    decimalPlaces: F,
     min: r,
     max: a,
-    step: o = 1,
+    step: u = 1,
     defaultValue: z,
     value: h,
     onChange: i,
     suffix: B,
     fullWidth: S = !1,
-    disabled: u = !1,
-    invalid: k = !1,
+    disabled: o = !1,
+    invalid: M = !1,
     helper: l,
     input: m
-  } = P(N), { getLabel: V } = ne(), c = K(null), [w, L] = O(""), [T, C] = O(z ?? 0), s = Q(
+  } = P(y), { getLabel: V } = ne(), c = K(null), [w, L] = O(""), [T, C] = O(z ?? 0), s = Q(
     () => i && typeof h < "u" ? h : T,
     [i, h, T]
   ), U = l ? `${v}-helper` : void 0, g = R(
     (e) => {
-      const t = r !== void 0 && e < r, p = a !== void 0 && e > a;
-      return k || t || p || (l == null ? void 0 : l.type) === "error";
+      const t = r !== void 0 && e < r, f = a !== void 0 && e > a;
+      return M || t || f || (l == null ? void 0 : l.type) === "error";
     },
-    [k, l, a, r]
+    [M, l, a, r]
   ), I = (e) => Math.min(a ?? 1 / 0, Math.max(r ?? -1 / 0, e)), W = (e) => {
     const t = V("numberField.quantityUpdated", e);
     L(t), setTimeout(() => {
       L("");
     }, 5e3);
-  }, A = (e) => M !== void 0 ? parseFloat(e.toFixed(M)) : e, D = (e) => {
+  }, A = (e) => F !== void 0 ? parseFloat(e.toFixed(F)) : e, D = (e) => {
     let t = s;
-    e === "increment" && (t = t + o), e === "decrement" && (t = t - o), t = I(t), t = A(t), W(t), i == null || i(t), C(t);
+    e === "increment" && (t = t + u), e === "decrement" && (t = t - u), t = I(t), t = A(t), W(t), i == null || i(t), C(t);
   }, G = ({ currentTarget: { value: e } }) => {
     i == null || i(I(+e)), C(I(+e));
   }, E = (e) => {
-    const t = e === "increment" ? a !== void 0 && s >= a : r !== void 0 && s <= r, p = b(n["tedi-number-field__button"], n[`tedi-number-field__button--${e}`], {
-      [n["tedi-number-field__button--disabled"]]: t || u
-    }), f = V(`numberField.${e}`, o);
+    const t = e === "increment" ? a !== void 0 && s >= a : r !== void 0 && s <= r, f = b(n["tedi-number-field__button"], n[`tedi-number-field__button--${e}`], {
+      [n["tedi-number-field__button--disabled"]]: t || o
+    }), p = V(`numberField.${e}`, u);
     return /* @__PURE__ */ d(
       Y,
       {
-        "aria-label": f,
+        "aria-label": p,
         onClick: () => D(e),
-        disabled: t || u,
+        disabled: t || o,
         visualType: "secondary",
-        className: p,
+        className: f,
         icon: { name: e === "increment" ? "add" : "remove" },
         size: _ === "small" ? "small" : void 0,
         children: e === "increment" ? "+" : "-"
@@ -71,9 +71,9 @@ const ie = (N) => {
       [n["tedi-number-field__input-wrapper--with-suffix"]]: B,
       [n["tedi-number-field__input-wrapper--full-width"]]: S
     }), t = b(n["tedi-number-field__input"], m == null ? void 0 : m.className);
-    return /* @__PURE__ */ y("div", { className: e, onClick: () => {
-      var f;
-      return (f = c == null ? void 0 : c.current) == null ? void 0 : f.focus();
+    return /* @__PURE__ */ N("div", { className: e, onClick: () => {
+      var p;
+      return (p = c == null ? void 0 : c.current) == null ? void 0 : p.focus();
     }, children: [
       /* @__PURE__ */ d(
         "input",
@@ -88,8 +88,8 @@ const ie = (N) => {
           min: r,
           max: a,
           required: x,
-          step: o,
-          disabled: u,
+          step: u,
+          disabled: o,
           onChange: G,
           className: t,
           ...m
@@ -100,18 +100,18 @@ const ie = (N) => {
   }, J = b(
     n["tedi-number-field"],
     { [n["tedi-number-field--invalid"]]: g(s) },
-    { [n["tedi-number-field--disabled"]]: u },
+    { [n["tedi-number-field--disabled"]]: o },
     { [n["tedi-number-field--small"]]: _ === "small" },
-    F
+    k
   );
-  return /* @__PURE__ */ y("div", { "data-name": "number-field", className: F, children: [
+  return /* @__PURE__ */ N("div", { "data-name": "number-field", className: k, children: [
     /* @__PURE__ */ d(ee, { id: v, label: $, required: x, hideLabel: j, size: _ }),
-    /* @__PURE__ */ y("div", { className: J, children: [
+    /* @__PURE__ */ N("div", { className: J, children: [
       E("decrement"),
       H(),
       E("increment")
     ] }),
-    l && /* @__PURE__ */ d(Z, { ...l, id: U }),
+    l && /* @__PURE__ */ d(Z, { className: n["tedi-number-field__feedback"], ...l, id: U }),
     w && /* @__PURE__ */ d("div", { "aria-live": "polite", className: "sr-only", children: w })
   ] });
 };

package/src/tedi/components/form/number-field/number-field.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-number-field":"tedi-number-field-dd7196c9","tedi-number-field--disabled":"tedi-number-field--disabled-f19e7ff7","tedi-number-field__button":"tedi-number-field__button-e276fac1","tedi-number-field__input-wrapper":"tedi-number-field__input-wrapper-400bdcf6","tedi-number-field__button__disabled":"tedi-number-field__button__disabled-c7b3b631","tedi-number-field__button--decrement":"tedi-number-field__button--decrement-152a6e1b","tedi-number-field__button--increment":"tedi-number-field__button--increment-8bd8e08f","tedi-number-field--invalid":"tedi-number-field--invalid-0c9ed153","tedi-number-field__input":"tedi-number-field__input-1b10ec1e","tedi-number-field--small":"tedi-number-field--small-e0a3a881","tedi-number-field__input-wrapper--full-width":"tedi-number-field__input-wrapper--full-width-1847e7b8","tedi-number-field__input-wrapper--with-suffix":"tedi-number-field__input-wrapper--with-suffix-81f89bd3","tedi-number-field__suffix":"tedi-number-field__suffix-eb5be3bc"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-number-field":"tedi-number-field-dd7196c9","tedi-number-field--disabled":"tedi-number-field--disabled-f19e7ff7","tedi-number-field__button":"tedi-number-field__button-e276fac1","tedi-number-field__input-wrapper":"tedi-number-field__input-wrapper-400bdcf6","tedi-number-field__button__disabled":"tedi-number-field__button__disabled-c7b3b631","tedi-number-field__button--decrement":"tedi-number-field__button--decrement-152a6e1b","tedi-number-field__button--increment":"tedi-number-field__button--increment-8bd8e08f","tedi-number-field--invalid":"tedi-number-field--invalid-0c9ed153","tedi-number-field__input":"tedi-number-field__input-1b10ec1e","tedi-number-field--small":"tedi-number-field--small-e0a3a881","tedi-number-field__input-wrapper--full-width":"tedi-number-field__input-wrapper--full-width-1847e7b8","tedi-number-field__input-wrapper--with-suffix":"tedi-number-field__input-wrapper--with-suffix-81f89bd3","tedi-number-field__suffix":"tedi-number-field__suffix-eb5be3bc","tedi-number-field__input-wrapper__feedback":"tedi-number-field__input-wrapper__feedback-9a3f41dc"};exports.default=e;

package/src/tedi/components/form/number-field/number-field.module.scss.es.js

@@ -11,7 +11,8 @@ const e = {
   "tedi-number-field--small": "tedi-number-field--small-e0a3a881",
   "tedi-number-field__input-wrapper--full-width": "tedi-number-field__input-wrapper--full-width-1847e7b8",
   "tedi-number-field__input-wrapper--with-suffix": "tedi-number-field__input-wrapper--with-suffix-81f89bd3",
-  "tedi-number-field__suffix": "tedi-number-field__suffix-eb5be3bc"
+  "tedi-number-field__suffix": "tedi-number-field__suffix-eb5be3bc",
+  "tedi-number-field__input-wrapper__feedback": "tedi-number-field__input-wrapper__feedback-9a3f41dc"
 };
 export {
   e as default

package/src/tedi/components/form/radio/radio.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const d=require("react/jsx-runtime"),l=require("../../../../../external/classnames/index.cjs.js"),s=require("react"),T=require("../feedback-text/feedback-text.cjs.js"),$=require("../form-label/form-label.cjs.js"),i=require("./radio.module.scss.cjs.js"),z=require("../../layout/grid/row.cjs.js"),p=require("../../layout/grid/col.cjs.js"),x=j=>{const{id:r,label:c,value:n,className:k,disabled:u,onChange:a,hideLabel:q,helper:t,checked:o,defaultChecked:C,hover:g,name:N,tooltip:f,size:h="default",invalid:R,required:y,...w}=j,[_,L]=s.useState(C||!1),b=s.useRef(null),M=s.useMemo(()=>a&&typeof o<"u"?o:_,[a,_,o]),v=e=>{typeof o>"u"&&L(e==null?void 0:e.target.checked),a==null||a(n,e==null?void 0:e.target.checked)},m=t?t.id??`${r}-helper`:void 0,I=f?`${r}-tooltip`:void 0,S=l.default(i.default["tedi-radio__label"],{[i.default["tedi-radio--disabled"]]:u});return d.jsxs("div",{"data-name":"radio",...w,children:[d.jsxs(z.Row,{gutter:0,children:[d.jsx(p.Col,{width:"auto",children:d.jsxs("div",{className:i.default["tedi-radio__outer-indicator-wrapper"],children:[d.jsx("input",{id:r,value:n,name:N,type:"radio",disabled:u,checked:M,onChange:v,className:i.default["tedi-radio__input"],"aria-describedby":[m,I].filter(Boolean).join(" ")}),d.jsx("div",{"aria-hidden":"true",onClick:()=>{var e;return(e=b.current)==null?void 0:e.click()},className:l.default(i.default["tedi-radio__indicator"],{[i.default["tedi-radio__indicator--hover"]]:g},{[i.default[`tedi-radio__indicator--size-${h}`]]:h},{[i.default["tedi-radio__indicator--invalid"]]:R},k),"data-testid":"radio-indicator"})]})}),c&&d.jsx(p.Col,{children:d.jsx($.FormLabel,{ref:b,className:S,id:r,"data-testid":"radio-label",hideLabel:q,label:c,tooltip:f,required:y})})]}),t&&d.jsx(T.FeedbackText,{id:m,...t,className:l.default(i.default["tedi-radio__helper"],t.className)})]})};exports.Radio=x;exports.default=x;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),l=require("../../../../../external/classnames/index.cjs.js"),c=require("react"),T=require("../feedback-text/feedback-text.cjs.js"),$=require("../form-label/form-label.cjs.js"),e=require("./radio.module.scss.cjs.js"),z=require("../../layout/grid/row.cjs.js"),p=require("../../layout/grid/col.cjs.js"),x=j=>{const{id:r,label:u,value:n,className:k,disabled:s,onChange:i,hideLabel:q,helper:t,checked:o,defaultChecked:C,hover:N,name:g,tooltip:f,size:h="default",invalid:R,required:y,...w}=j,[_,L]=c.useState(C||!1),b=c.useRef(null),M=c.useMemo(()=>i&&typeof o<"u"?o:_,[i,_,o]),v=d=>{typeof o>"u"&&L(d==null?void 0:d.target.checked),i==null||i(n,d==null?void 0:d.target.checked)},m=t?t.id??`${r}-helper`:void 0,I=f?`${r}-tooltip`:void 0,S=l.default(e.default["tedi-radio__label"],{[e.default["tedi-radio--disabled"]]:s});return a.jsxs("div",{className:l.default(e.default["tedi-radio"],{[e.default["tedi-radio--disabled"]]:s}),"data-name":"radio",...w,children:[a.jsxs(z.Row,{gutter:0,children:[a.jsx(p.Col,{width:"auto",children:a.jsxs("div",{className:e.default["tedi-radio__outer-indicator-wrapper"],children:[a.jsx("input",{id:r,value:n,name:g,type:"radio",disabled:s,checked:M,onChange:v,className:e.default["tedi-radio__input"],"aria-describedby":[m,I].filter(Boolean).join(" ")}),a.jsx("div",{"aria-hidden":"true",onClick:()=>{var d;return(d=b.current)==null?void 0:d.click()},className:l.default(e.default["tedi-radio__indicator"],{[e.default["tedi-radio__indicator--hover"]]:N},{[e.default[`tedi-radio__indicator--size-${h}`]]:h},{[e.default["tedi-radio__indicator--invalid"]]:R},k),"data-testid":"radio-indicator"})]})}),u&&a.jsx(p.Col,{children:a.jsx($.FormLabel,{ref:b,className:S,id:r,"data-testid":"radio-label",hideLabel:q,label:u,tooltip:f,required:y})})]}),t&&a.jsx(T.FeedbackText,{id:m,...t,className:l.default(e.default["tedi-radio__helper"],t.className)})]})};exports.Radio=x;exports.default=x;

package/src/tedi/components/form/radio/radio.es.js

@@ -1,18 +1,18 @@
-import { jsxs as l, jsx as d } from "react/jsx-runtime";
-import c from "../../../../../external/classnames/index.es.js";
-import s from "react";
+import { jsxs as s, jsx as d } from "react/jsx-runtime";
+import l from "../../../../../external/classnames/index.es.js";
+import n from "react";
 import { FeedbackText as M } from "../feedback-text/feedback-text.es.js";
 import { FormLabel as q } from "../form-label/form-label.es.js";
-import i from "./radio.module.scss.es.js";
+import e from "./radio.module.scss.es.js";
 import { Row as v } from "../../layout/grid/row.es.js";
 import { Col as k } from "../../layout/grid/col.es.js";
 const K = (N) => {
   const {
     id: o,
-    label: n,
-    value: m,
+    label: m,
+    value: h,
     className: C,
-    disabled: h,
+    disabled: c,
     onChange: a,
     hideLabel: g,
     helper: r,
@@ -25,61 +25,69 @@ const K = (N) => {
     invalid: j,
     required: w,
     ...I
-  } = N, [u, L] = s.useState(y || !1), _ = s.useRef(null), $ = s.useMemo(() => a && typeof t < "u" ? t : u, [a, u, t]), z = (e) => {
-    typeof t > "u" && L(e == null ? void 0 : e.target.checked), a == null || a(m, e == null ? void 0 : e.target.checked);
-  }, 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 });
-  return /* @__PURE__ */ l("div", { "data-name": "radio", ...I, children: [
-    /* @__PURE__ */ l(v, { gutter: 0, children: [
-      /* @__PURE__ */ d(k, { width: "auto", children: /* @__PURE__ */ l("div", { className: i["tedi-radio__outer-indicator-wrapper"], children: [
-        /* @__PURE__ */ d(
-          "input",
-          {
-            id: o,
-            value: m,
-            name: x,
-            type: "radio",
-            disabled: h,
-            checked: $,
-            onChange: z,
-            className: i["tedi-radio__input"],
-            "aria-describedby": [b, B].filter(Boolean).join(" ")
-          }
-        ),
-        /* @__PURE__ */ d(
-          "div",
-          {
-            "aria-hidden": "true",
-            onClick: () => {
-              var e;
-              return (e = _.current) == null ? void 0 : e.click();
-            },
-            className: c(
-              i["tedi-radio__indicator"],
-              { [i["tedi-radio__indicator--hover"]]: R },
-              { [i[`tedi-radio__indicator--size-${f}`]]: f },
-              { [i["tedi-radio__indicator--invalid"]]: j },
-              C
+  } = N, [u, L] = n.useState(y || !1), _ = n.useRef(null), $ = n.useMemo(() => a && typeof t < "u" ? t : u, [a, u, t]), z = (i) => {
+    typeof t > "u" && L(i == null ? void 0 : i.target.checked), a == null || a(h, i == null ? void 0 : i.target.checked);
+  }, b = r ? r.id ?? `${o}-helper` : void 0, B = p ? `${o}-tooltip` : void 0, F = l(e["tedi-radio__label"], { [e["tedi-radio--disabled"]]: c });
+  return /* @__PURE__ */ s(
+    "div",
+    {
+      className: l(e["tedi-radio"], { [e["tedi-radio--disabled"]]: c }),
+      "data-name": "radio",
+      ...I,
+      children: [
+        /* @__PURE__ */ s(v, { gutter: 0, children: [
+          /* @__PURE__ */ d(k, { width: "auto", children: /* @__PURE__ */ s("div", { className: e["tedi-radio__outer-indicator-wrapper"], children: [
+            /* @__PURE__ */ d(
+              "input",
+              {
+                id: o,
+                value: h,
+                name: x,
+                type: "radio",
+                disabled: c,
+                checked: $,
+                onChange: z,
+                className: e["tedi-radio__input"],
+                "aria-describedby": [b, B].filter(Boolean).join(" ")
+              }
             ),
-            "data-testid": "radio-indicator"
-          }
-        )
-      ] }) }),
-      n && /* @__PURE__ */ d(k, { children: /* @__PURE__ */ d(
-        q,
-        {
-          ref: _,
-          className: F,
-          id: o,
-          "data-testid": "radio-label",
-          hideLabel: g,
-          label: n,
-          tooltip: p,
-          required: w
-        }
-      ) })
-    ] }),
-    r && /* @__PURE__ */ d(M, { id: b, ...r, className: c(i["tedi-radio__helper"], r.className) })
-  ] });
+            /* @__PURE__ */ d(
+              "div",
+              {
+                "aria-hidden": "true",
+                onClick: () => {
+                  var i;
+                  return (i = _.current) == null ? void 0 : i.click();
+                },
+                className: l(
+                  e["tedi-radio__indicator"],
+                  { [e["tedi-radio__indicator--hover"]]: R },
+                  { [e[`tedi-radio__indicator--size-${f}`]]: f },
+                  { [e["tedi-radio__indicator--invalid"]]: j },
+                  C
+                ),
+                "data-testid": "radio-indicator"
+              }
+            )
+          ] }) }),
+          m && /* @__PURE__ */ d(k, { children: /* @__PURE__ */ d(
+            q,
+            {
+              ref: _,
+              className: F,
+              id: o,
+              "data-testid": "radio-label",
+              hideLabel: g,
+              label: m,
+              tooltip: p,
+              required: w
+            }
+          ) })
+        ] }),
+        r && /* @__PURE__ */ d(M, { id: b, ...r, className: l(e["tedi-radio__helper"], r.className) })
+      ]
+    }
+  );
 };
 export {
   K as Radio,

package/src/tedi/components/form/textfield/textfield.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-textfield":"tedi-textfield-376bbeed","tedi-textfield__inner":"tedi-textfield__inner-98791cdd","tedi-textfield__input":"tedi-textfield__input-ade0f9a6","tedi-textfield--invalid":"tedi-textfield--invalid-290ce18d","tedi-textfield--valid":"tedi-textfield--valid-273af8c0","tedi-textfield--clearable":"tedi-textfield--clearable-f47f0508","tedi-textfield--with-icon":"tedi-textfield--with-icon-db2c6f01","tedi-textfield__input--hidden-arrows":"tedi-textfield__input--hidden-arrows-609217f7","tedi-textfield__right-area":"tedi-textfield__right-area-6ac81c6b","tedi-textfield--small":"tedi-textfield--small-4ffcc517","tedi-textfield--large":"tedi-textfield--large-0e4d788c","tedi-textfield__separator":"tedi-textfield__separator-63d1ba14","tedi-textfield__icon-wrapper":"tedi-textfield__icon-wrapper-4935814e","tedi-textfield--inline":"tedi-textfield--inline-7ed55c4e","tedi-textfield__icon":"tedi-textfield__icon-05d4adc8","tedi-textfield__feedback-wrapper":"tedi-textfield__feedback-wrapper-9d47f9c6"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-textfield":"tedi-textfield-376bbeed","tedi-textfield__inner":"tedi-textfield__inner-98791cdd","tedi-textfield__input":"tedi-textfield__input-ade0f9a6","tedi-textfield--invalid":"tedi-textfield--invalid-290ce18d","tedi-textfield--valid":"tedi-textfield--valid-273af8c0","tedi-textfield--clearable":"tedi-textfield--clearable-f47f0508","tedi-textfield--with-icon":"tedi-textfield--with-icon-db2c6f01","tedi-textfield--small":"tedi-textfield--small-4ffcc517","tedi-textfield--large":"tedi-textfield--large-0e4d788c","tedi-textfield__right-area":"tedi-textfield__right-area-6ac81c6b","tedi-textfield__icon-wrapper":"tedi-textfield__icon-wrapper-4935814e","tedi-textfield--inline":"tedi-textfield--inline-7ed55c4e","tedi-textfield__icon":"tedi-textfield__icon-05d4adc8","tedi-textfield__feedback-wrapper":"tedi-textfield__feedback-wrapper-9d47f9c6"};exports.default=e;

package/src/tedi/components/form/textfield/textfield.module.scss.es.js

@@ -6,11 +6,9 @@ const e = {
   "tedi-textfield--valid": "tedi-textfield--valid-273af8c0",
   "tedi-textfield--clearable": "tedi-textfield--clearable-f47f0508",
   "tedi-textfield--with-icon": "tedi-textfield--with-icon-db2c6f01",
-  "tedi-textfield__input--hidden-arrows": "tedi-textfield__input--hidden-arrows-609217f7",
-  "tedi-textfield__right-area": "tedi-textfield__right-area-6ac81c6b",
   "tedi-textfield--small": "tedi-textfield--small-4ffcc517",
   "tedi-textfield--large": "tedi-textfield--large-0e4d788c",
-  "tedi-textfield__separator": "tedi-textfield__separator-63d1ba14",
+  "tedi-textfield__right-area": "tedi-textfield__right-area-6ac81c6b",
   "tedi-textfield__icon-wrapper": "tedi-textfield__icon-wrapper-4935814e",
   "tedi-textfield--inline": "tedi-textfield--inline-7ed55c4e",
   "tedi-textfield__icon": "tedi-textfield__icon-05d4adc8",

package/src/tedi/components/layout/sidenav/components/sidenav-dropdown/sidenav-dropdown.d.ts

@@ -7,7 +7,7 @@ type SideNavDropdownProps<C extends React.ElementType = 'a'> = {
     as?: C;
 };
 type Group<C extends React.ElementType> = {
-    subHeading?: string;
+    subHeading?: React.ReactNode;
     subItems: SideNavItemProps<C>[];
 };
 export declare const SideNavDropdown: <C extends React.ElementType = "a">({ trigger, groups, onOpenChange, as, }: SideNavDropdownProps<C>) => import("react/jsx-runtime").JSX.Element;

package/src/tedi/components/layout/sidenav/components/sidenav-item/sidenav-item.cjs.js

@@ -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"),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;
+"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"),T=require("../../../../navigation/link/link.cjs.js"),s=require("../../sidenav.module.scss.cjs.js"),J=require("../sidenav-dropdown/sidenav-dropdown.cjs.js"),Q=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:S,subItemGroups:P,as:b,onItemClick:v,className:B,level:r=1,isCollapsed:c=!1,isDefaultOpen:$=!1,sideNavItemSize:z="default",...u}=O,{getLabel:q}=Q.useLabels(),[d,w]=x.useState($??!1),[y,F]=x.useState(!1),p=x.useId(),m=P??(S?[{subItems:S}]:null),n=!!m,H=r>1&&n,K=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"]]:n,[s.default["tedi-sidenav__item--with-tree"]]:H},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})},A=a=>{N==null||N(a),n||v==null||v()},I=a=>{w(a)},G=a=>{(a.key==="Enter"||a.key===" ")&&(a.preventDefault(),w(f=>{const l=!f;return I(l),l}))},R=n&&(u.href||u.to),k={...u,as:b,onClick:A,className:o.default(s.default["tedi-sidenav__link"],R&&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,...n?{"aria-haspopup":"true","aria-expanded":d,"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,W)=>x.createElement(M,{as:b,...h,key:W,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:K,children:n&&c?e.jsx(J.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}):n&&r===1?u.href||u.to?e.jsxs(e.Fragment,{children:[e.jsxs(T.Link,{...k,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:d,onToggle:I,toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:d,children:i}),className:s.default["tedi-sidenav__collapse"],children:C()})})]}):e.jsx(E.Collapse,{id:p,hideCollapseText:!0,open:d,onToggle:I,className:s.default["tedi-sidenav__collapse"],toggleLabel:q("sidenav.toggleSubmenuChildren",{isCollapsedInternal:d,children:i}),title:e.jsxs("span",{className:o.default(s.default["tedi-sidenav__link"],d&&s.default["tedi-sidenav__link--active"]),role:"button","aria-expanded":d,"aria-controls":p,"aria-current":j?"page":void 0,onKeyDown:G,children:[t&&_(t),e.jsx("span",{className:s.default["tedi-sidenav__title"],children:i})]}),children:C()}):n?e.jsxs(e.Fragment,{children:[e.jsxs(T.Link,{...k,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(T.Link,{...k,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;

package/src/tedi/components/layout/sidenav/components/sidenav-item/sidenav-item.d.ts

@@ -15,7 +15,7 @@ export type SideNavItemProps<C extends React.ElementType = 'a'> = LinkProps<C> &
      * Grouped submenu items (preferred for headings)
      */
     subItemGroups?: {
-        subHeading?: string;
+        subHeading?: React.ReactNode;
         subItems: SideNavItemProps<C>[];
     }[];
     /**