@tedi-design-system/react 14.4.0-rc.8 → 15.0.0-rc.1

package/src/tedi/components/form/file-upload/file-upload.es.js

@@ -1,134 +1,153 @@
-import { jsxs as c, Fragment as F, jsx as e } from "react/jsx-runtime";
-import N from "../../../../../external/classnames/index.es.js";
-import V from "react";
-import { useFileUpload as W } from "../../../helpers/hooks/use-file-upload.es.js";
-import { Text as q } from "../../base/typography/text/text.es.js";
+import { jsxs as u, Fragment as N, jsx as i } from "react/jsx-runtime";
+import p from "../../../../../external/classnames/index.es.js";
+import q from "react";
+import { useFileUpload as A } from "../../../helpers/hooks/use-file-upload.es.js";
+import { Text as E } from "../../base/typography/text/text.es.js";
 import { Button as C } from "../../buttons/button/button.es.js";
-import { ClosingButton as A } from "../../buttons/closing-button/closing-button.es.js";
-import { FormLabel as E } from "../form-label/form-label.es.js";
-import { Separator as G } from "../../misc/separator/separator.es.js";
-import { Tag as J } from "../../tags/tag/tag.es.js";
-import { FeedbackText as x } from "../feedback-text/feedback-text.es.js";
-import i from "./file-upload.module.scss.es.js";
-import { useLabels as K } from "../../../providers/label-provider/use-labels.es.js";
-import { useBreakpoint as P, isBreakpointBelow as Q } from "../../../helpers/hooks/use-breakpoint.es.js";
-import { Row as X } from "../../layout/grid/row.es.js";
-import { Col as B } from "../../layout/grid/col.es.js";
-const ue = (L) => {
-  const { getLabel: p } = K(), {
-    id: r,
+import { ClosingButton as G } from "../../buttons/closing-button/closing-button.es.js";
+import { FormLabel as J } from "../form-label/form-label.es.js";
+import { Separator as K } from "../../misc/separator/separator.es.js";
+import { Tag as P } from "../../tags/tag/tag.es.js";
+import { FeedbackText as L } from "../feedback-text/feedback-text.es.js";
+import l from "./file-upload.module.scss.es.js";
+import { useLabels as Q } from "../../../providers/label-provider/use-labels.es.js";
+import { useBreakpoint as X, isBreakpointBelow as Y } from "../../../helpers/hooks/use-breakpoint.es.js";
+import { Row as Z } from "../../layout/grid/row.es.js";
+import { Col as x } from "../../layout/grid/col.es.js";
+const he = (B) => {
+  const { getLabel: n } = Q(), {
+    id: s,
     name: k,
-    accept: _,
-    multiple: g,
-    onChange: u,
-    className: T,
-    defaultFiles: w,
-    onDelete: z,
-    hasClearButton: I = !0,
-    files: n,
-    readOnly: f,
+    accept: g,
+    multiple: b,
+    onChange: f,
+    className: $,
+    defaultFiles: T,
+    onDelete: w,
+    hasClearButton: z = !0,
+    files: m,
+    readOnly: h,
     disabled: o = !1,
-    maxSize: R,
-    validateIndividually: U = !1,
-    size: s = "default",
-    helper: l,
-    ...j
-  } = L, { innerFiles: b, uploadErrorHelper: t, onFileChange: M, onFileRemove: S, handleClear: y } = W({
-    accept: _,
-    maxSize: R,
-    multiple: g,
-    validateIndividually: U,
-    defaultFiles: w,
-    onChange: u,
-    onDelete: z,
-    files: n
-  }), $ = P(), D = N(i["tedi-file-upload"], { [i["tedi-file-upload--disabled"]]: o }, T), m = l ? (l == null ? void 0 : l.id) ?? `${r}-helper` : void 0, d = V.useMemo(() => n && u ? n : b, [n, b, u]), O = (a, h) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
-    J,
-    {
-      color: a.isValid === !1 ? "danger" : "primary",
-      onClose: !a.isLoading && !o && !f ? () => S(a) : void 0,
-      isLoading: a.isLoading,
-      children: a.name
+    maxSize: I,
+    validateIndividually: R = !1,
+    size: c = "default",
+    helper: a,
+    ...U
+  } = B, { innerFiles: v, uploadErrorHelper: t, onFileChange: V, onFileRemove: j, handleClear: y, announcement: M } = A({
+    accept: g,
+    maxSize: I,
+    multiple: b,
+    validateIndividually: R,
+    defaultFiles: T,
+    onChange: f,
+    onDelete: w,
+    files: m
+  }), S = X(), D = p(l["tedi-file-upload"], { [l["tedi-file-upload--disabled"]]: o }, $), _ = a ? (a == null ? void 0 : a.id) ?? `${s}-helper` : void 0, d = q.useMemo(() => m && f ? m : v, [m, v, f]), O = (e, r) => {
+    const W = e.isValid === !1 ? `${e.name} (${n("file-upload.failed")})` : e.name;
+    return /* @__PURE__ */ i("li", { children: /* @__PURE__ */ i(
+      P,
+      {
+        color: e.isValid === !1 ? "danger" : "primary",
+        onClose: !e.isLoading && !o && !h ? () => j(e) : void 0,
+        isLoading: e.isLoading,
+        "aria-label": W,
+        children: e.name
+      }
+    ) }, r);
+  }, F = () => {
+    if (d.length > 1)
+      return /* @__PURE__ */ i("ul", { className: p(l["tedi-file-upload__items"], l["tedi-file-upload__truncate-list"]), children: d.map((e, r) => O(e, r)) });
+    if (d.length === 1) {
+      const e = d[0], r = e.isValid === !1 ? `${e.name} (${n("file-upload.failed")})` : e.name;
+      return /* @__PURE__ */ i(
+        E,
+        {
+          "aria-label": r,
+          className: p(l["tedi-file-upload__items"], l["tedi-file-upload__truncate"]),
+          children: e.name
+        }
+      );
     }
-  ) }, h), v = () => d.length > 1 ? /* @__PURE__ */ e("ul", { className: i["tedi-file-upload__items"], children: d.map((a, h) => O(a, h)) }) : d.length === 1 ? /* @__PURE__ */ e(q, { className: i["tedi-file-upload__items"], children: d[0].name }) : null;
-  return /* @__PURE__ */ c(F, { children: [
-    /* @__PURE__ */ e("div", { className: i["tedi-file-upload__label-wrapper"], children: /* @__PURE__ */ e(
-      E,
+    return null;
+  };
+  return /* @__PURE__ */ u(N, { children: [
+    /* @__PURE__ */ i("div", { className: l["tedi-file-upload__label-wrapper"], children: /* @__PURE__ */ i(
+      J,
       {
-        id: r,
-        ...j,
-        renderWithoutLabel: f,
-        className: i["tedi-file-upload__label"],
-        size: s
+        id: s,
+        ...U,
+        renderWithoutLabel: h,
+        className: l["tedi-file-upload__label"],
+        size: c
       }
     ) }),
-    f ? v() : /* @__PURE__ */ e(
+    /* @__PURE__ */ i("div", { "aria-live": "polite", "aria-atomic": "true", className: "sr-only", children: M }),
+    h ? F() : /* @__PURE__ */ i(
       "div",
       {
-        className: N(
-          i["tedi-file-upload__container"],
+        className: p(
+          l["tedi-file-upload__container"],
           {
-            [i["tedi-file-upload--disabled"]]: o,
-            [i["tedi-file-upload--error"]]: ((t == null ? void 0 : t.type) || (l == null ? void 0 : l.type)) === "error",
-            [i["tedi-file-upload--valid"]]: ((t == null ? void 0 : t.type) || (l == null ? void 0 : l.type)) === "valid"
+            [l["tedi-file-upload--disabled"]]: o,
+            [l["tedi-file-upload--error"]]: ((t == null ? void 0 : t.type) || (a == null ? void 0 : a.type)) === "error",
+            [l["tedi-file-upload--valid"]]: ((t == null ? void 0 : t.type) || (a == null ? void 0 : a.type)) === "valid"
           },
-          { [i[`tedi-file-upload__container--${s}`]]: s }
+          { [l[`tedi-file-upload__container--${c}`]]: c }
         ),
-        children: /* @__PURE__ */ e("div", { className: i["tedi-file-upload__content"], children: /* @__PURE__ */ c(X, { children: [
-          /* @__PURE__ */ e(B, { className: "display-flex", children: v() }),
-          /* @__PURE__ */ e(B, { xs: 12, md: "auto", children: /* @__PURE__ */ c("div", { className: D, children: [
-            /* @__PURE__ */ e(
+        children: /* @__PURE__ */ i("div", { className: l["tedi-file-upload__content"], children: /* @__PURE__ */ u(Z, { children: [
+          /* @__PURE__ */ i(x, { className: "display-flex", children: F() }),
+          /* @__PURE__ */ i(x, { xs: 12, md: "auto", children: /* @__PURE__ */ u("div", { className: D, children: [
+            /* @__PURE__ */ i(
               "input",
               {
-                id: r,
+                id: s,
                 type: "file",
                 name: k,
-                accept: _,
-                onChange: M,
-                multiple: g,
+                accept: g,
+                onChange: V,
+                multiple: b,
                 disabled: o,
-                "aria-invalid": !!t
+                "aria-invalid": !!t && t.type === "error",
+                "aria-describedby": _
               }
             ),
-            I && d.length > 0 && !o && /* @__PURE__ */ c(F, { children: [
-              Q($, "md") ? /* @__PURE__ */ e(
+            z && d.length > 0 && !o && /* @__PURE__ */ u(N, { children: [
+              Y(S, "md") ? /* @__PURE__ */ i(
                 C,
                 {
                   visualType: "neutral",
                   iconLeft: "close",
-                  "aria-describedby": m,
                   disabled: o,
                   onClick: y,
-                  className: i["tedi-file-upload__button"],
-                  children: p("clear")
+                  className: l["tedi-file-upload__button"],
+                  children: n("clear")
                 }
-              ) : /* @__PURE__ */ e(A, { onClick: y, size: "medium", title: p("clear") }),
-              /* @__PURE__ */ e(G, { axis: "vertical", height: 1.5, spacing: 0.5, color: "primary" })
+              ) : /* @__PURE__ */ i(G, { onClick: y, size: "medium", title: n("clear") }),
+              /* @__PURE__ */ i(K, { axis: "vertical", height: 1.5, spacing: 0.5, color: "primary" })
             ] }),
-            /* @__PURE__ */ e(
+            /* @__PURE__ */ i(
               C,
               {
                 visualType: "neutral",
                 iconLeft: "file_upload",
-                "aria-describedby": m,
                 disabled: o,
                 onClick: () => {
-                  var a;
-                  return (a = document.getElementById(r)) == null ? void 0 : a.click();
+                  var e;
+                  return (e = document.getElementById(s)) == null ? void 0 : e.click();
                 },
-                className: i["tedi-file-upload__button"],
-                size: s,
-                children: p("file-upload.add")
+                className: l["tedi-file-upload__button"],
+                size: c,
+                children: n("file-upload.add")
               }
             )
           ] }) })
         ] }) })
       }
     ),
-    l ? /* @__PURE__ */ e(x, { ...l, id: m }) : t ? /* @__PURE__ */ e(x, { ...t, id: m }) : null
+    a ? /* @__PURE__ */ i(L, { ...a, id: _ }) : t ? /* @__PURE__ */ i(L, { ...t, id: _ }) : null
   ] });
 };
 export {
-  ue as FileUpload,
-  ue as default
+  he as FileUpload,
+  he as default
 };

package/src/tedi/components/form/file-upload/file-upload.module.scss.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-file-upload":"tedi-file-upload-115f37c2","tedi-file-upload__items":"tedi-file-upload__items-c73c19e5","tedi-file-upload__container":"tedi-file-upload__container-6b0f28a8","tedi-file-upload__container--default":"tedi-file-upload__container--default-56af0d96","tedi-file-upload__button":"tedi-file-upload__button-f37449e6","tedi-file-upload__container--small":"tedi-file-upload__container--small-4d5cd36e","tedi-file-upload--disabled":"tedi-file-upload--disabled-88f4fdcd","tedi-file-upload--error":"tedi-file-upload--error-388cda6f","tedi-file-upload--valid":"tedi-file-upload--valid-28d5eb71","tedi-file-upload__content":"tedi-file-upload__content-8b6bf324"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-file-upload":"tedi-file-upload-115f37c2","tedi-file-upload__items":"tedi-file-upload__items-c73c19e5","tedi-file-upload__container":"tedi-file-upload__container-6b0f28a8","tedi-file-upload__container--default":"tedi-file-upload__container--default-56af0d96","tedi-file-upload__button":"tedi-file-upload__button-f37449e6","tedi-file-upload__container--small":"tedi-file-upload__container--small-4d5cd36e","tedi-file-upload--disabled":"tedi-file-upload--disabled-88f4fdcd","tedi-file-upload--error":"tedi-file-upload--error-388cda6f","tedi-file-upload--valid":"tedi-file-upload--valid-28d5eb71","tedi-file-upload__content":"tedi-file-upload__content-8b6bf324","tedi-file-upload__items--truncate":"tedi-file-upload__items--truncate-5c249a01","tedi-file-upload__tag--truncate":"tedi-file-upload__tag--truncate-4c99cb2b"};exports.default=e;

package/src/tedi/components/form/file-upload/file-upload.module.scss.es.js

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

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

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

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("react/jsx-runtime"),l=require("../../../../../external/classnames/index.cjs.js"),x=require("react"),h=require("../../buttons/button/button.cjs.js"),q=require("../textfield/textfield.cjs.js"),i=require("./search.module.scss.cjs.js"),r=x.forwardRef(({placeholder:d,isClearable:u=!0,searchIcon:c="search",onSearch:e,onChange:n,button:t,...s},f)=>{const o=p=>{p.key==="Enter"&&(e==null||e(s.value))},m=()=>{e==null||e(s.value)},_={...s,ref:f,inputClassName:l.default(i.default["tedi-search__input"],t&&i.default["tedi-search__input--has-button"]),placeholder:d,isClearable:u,onKeyPress:o,onChange:n,...t?{}:{icon:c}};return a.jsxs("div",{className:l.default(i.default["tedi-search__wrapper"],s.className),children:[a.jsx(q.TextField,{..._}),t&&a.jsx(h.Button,{...t,onClick:m,className:l.default(i.default["tedi-search__button"],t.className),children:t.children})]})});r.displayName="Search";exports.Search=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),r=require("../../../../../external/classnames/index.cjs.js"),y=require("react"),N=require("../../buttons/button/button.cjs.js"),j=require("../textfield/textfield.cjs.js"),t=require("./search.module.scss.cjs.js"),v=require("../../../providers/label-provider/use-labels.cjs.js"),u=y.forwardRef(({placeholder:c,isClearable:d=!0,searchIcon:n="search",onSearch:a,onChange:o,button:e,ariaLabel:f,...s},h)=>{const{getLabel:l}=v.useLabels(),m=q=>{q.key==="Enter"&&(a==null||a(s.value))},_=()=>{a==null||a(s.value)},x={...s,ref:h,inputClassName:r.default(t.default["tedi-search__input"],e&&t.default["tedi-search__input--has-button"]),placeholder:c,isClearable:d,onKeyDown:m,onChange:o,...e?{}:{icon:n}},b=c||l("search"),p=f??b;return i.jsxs("div",{className:r.default(t.default["tedi-search__wrapper"],s.className),role:"search","aria-label":p,children:[i.jsx(j.TextField,{...x}),e&&i.jsx(N.Button,{...e,onClick:_,className:r.default(t.default["tedi-search__button"],e.className),"aria-label":e.children?void 0:l("search"),children:e.children??l("search")})]})});u.displayName="Search";exports.Search=u;

package/src/tedi/components/form/search/search.d.ts

@@ -15,5 +15,10 @@ export interface SearchProps extends Omit<TextFieldProps, 'isTextArea' | 'icon'
      * Optional button properties.
      */
     button?: Partial<ButtonProps>;
+    /**
+     * For accessibility: search field name (accessible name). Recommended to always set.
+     * E.g., "Search products" or "Search site".
+     */
+    ariaLabel?: string;
 }
 export declare const Search: React.ForwardRefExoticComponent<SearchProps & React.RefAttributes<TextFieldForwardRef>>;

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

@@ -1,40 +1,42 @@
-import { jsxs as N, jsx as a } from "react/jsx-runtime";
-import t from "../../../../../external/classnames/index.es.js";
-import { forwardRef as u } from "react";
-import { Button as x } from "../../buttons/button/button.es.js";
-import { TextField as y } from "../textfield/textfield.es.js";
+import { jsxs as y, jsx as c } from "react/jsx-runtime";
+import l from "../../../../../external/classnames/index.es.js";
+import { forwardRef as v } from "react";
+import { Button as w } from "../../buttons/button/button.es.js";
+import { TextField as L } from "../textfield/textfield.es.js";
 import r from "./search.module.scss.es.js";
-const h = u(
-  ({ placeholder: l, isClearable: m = !0, searchIcon: d = "search", onSearch: s, onChange: p, button: e, ...i }, c) => {
-    const o = (n) => {
-      n.key === "Enter" && (s == null || s(i.value));
-    }, f = () => {
-      s == null || s(i.value);
+import { useLabels as k } from "../../../providers/label-provider/use-labels.es.js";
+const C = v(
+  ({ placeholder: t, isClearable: m = !0, searchIcon: o = "search", onSearch: s, onChange: d, button: e, ariaLabel: p, ...a }, n) => {
+    const { getLabel: i } = k(), f = (x) => {
+      x.key === "Enter" && (s == null || s(a.value));
+    }, h = () => {
+      s == null || s(a.value);
     }, _ = {
-      ...i,
-      ref: c,
-      inputClassName: t(r["tedi-search__input"], e && r["tedi-search__input--has-button"]),
-      placeholder: l,
+      ...a,
+      ref: n,
+      inputClassName: l(r["tedi-search__input"], e && r["tedi-search__input--has-button"]),
+      placeholder: t,
       isClearable: m,
-      onKeyPress: o,
-      onChange: p,
-      ...e ? {} : { icon: d }
-    };
-    return /* @__PURE__ */ N("div", { className: t(r["tedi-search__wrapper"], i.className), children: [
-      /* @__PURE__ */ a(y, { ..._ }),
-      e && /* @__PURE__ */ a(
-        x,
+      onKeyDown: f,
+      onChange: d,
+      ...e ? {} : { icon: o }
+    }, u = t || i("search"), N = p ?? u;
+    return /* @__PURE__ */ y("div", { className: l(r["tedi-search__wrapper"], a.className), role: "search", "aria-label": N, children: [
+      /* @__PURE__ */ c(L, { ..._ }),
+      e && /* @__PURE__ */ c(
+        w,
         {
           ...e,
-          onClick: f,
-          className: t(r["tedi-search__button"], e.className),
-          children: e.children
+          onClick: h,
+          className: l(r["tedi-search__button"], e.className),
+          "aria-label": e.children ? void 0 : i("search"),
+          children: e.children ?? i("search")
         }
       )
     ] });
   }
 );
-h.displayName = "Search";
+C.displayName = "Search";
 export {
-  h as Search
+  C as Search
 };

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

@@ -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"),y=require("../../../../../../../external/classnames/index.cjs.js"),m=require("react"),I=require("../../../../navigation/link/link.cjs.js"),n=require("./sidenav-dropdown.module.scss.cjs.js"),N=require("../../../../../../../external/@floating-ui/dom/dist/floating-ui.dom.cjs.js"),v=require("../../../../../../../external/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs.js"),k=({trigger:h,groups:_,onOpenChange:l})=>{const[o,c]=m.useState(!1),{refs:f,floatingStyles:g,context:u}=d.useFloating({open:o,middleware:[v.offset({mainAxis:8}),v.flip()],whileElementsMounted:N.autoUpdate,placement:"right-start",onOpenChange:e=>{c(e),l==null||l(e)},strategy:"fixed"}),{getReferenceProps:x,getFloatingProps:b}=d.useInteractions([d.useClick(u),d.useDismiss(u)]),p=e=>{var i;const a=e.subItemGroups||e.subItems;return s.jsxs("li",{role:"none",className:y.default(n.default["tedi-sidenav-dropdown__item"],a&&n.default["tedi-sidenav-dropdown__item--has-children"]),children:[s.jsxs(I.Link,{...e,role:"menuitem",className:n.default["tedi-sidenav-dropdown__link"],"data-active":e.isActive,"aria-current":e.isActive?"page":void 0,noStyle:!0,onClick:t=>{var r;(r=e.onClick)==null||r.call(e,t),c(!1)},children:[e.children,a&&s.jsx("span",{className:n.default["tedi-sidenav__bullet"]})]}),a&&s.jsx("ul",{className:n.default["tedi-sidenav-dropdown__list"],role:"menu",children:(e.subItemGroups??(e.subItems?[{subItems:e.subItems}]:[])).map((t,r)=>s.jsxs(m.Fragment,{children:[t.subHeading&&s.jsx("div",{className:n.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:t.subHeading}),t.subItems.map(w=>p(w))]},r))})]},e.key||e.href||((i=e.children)==null?void 0:i.toString()))},j=e=>{(e.key==="Enter"||e.key===" ")&&(e.preventDefault(),c(a=>!a))};return s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:f.setReference,...x(),role:"button",tabIndex:-1,"aria-haspopup":"menu","aria-expanded":o,onKeyDown:j,children:h}),o&&s.jsx(d.FloatingOverlay,{children:s.jsx(d.FloatingPortal,{children:s.jsx(d.FloatingFocusManager,{context:u,modal:!1,children:s.jsx("div",{ref:f.setFloating,style:g,className:n.default["tedi-sidenav-dropdown"],role:"menu",...b(),children:_.map((e,a)=>s.jsxs("div",{className:n.default["tedi-sidenav-dropdown__group"],children:[e.subHeading&&s.jsx("div",{className:n.default["tedi-sidenav-dropdown__heading"],role:"presentation",children:e.subHeading}),s.jsx("ul",{className:n.default["tedi-sidenav-dropdown__list"],role:"menu",children:e.subItems.map(i=>p(i))})]},a))})})})})]})};exports.SideNavDropdown=k;
+"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;