@tedi-design-system/react 18.1.0-rc.9 → 18.1.1-rc.1

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

@@ -1,145 +1,150 @@
-import { jsxs as L, jsx as c } from "react/jsx-runtime";
-import _ from "../../../../../external/classnames/index.es.js";
-import { useCallback as D, useRef as W, useState as S, useEffect as se } from "react";
-import { Text as oe } from "../../base/typography/text/text.es.js";
-import { Button as de } from "../../buttons/button/button.es.js";
-import { FeedbackText as ue } from "../feedback-text/feedback-text.es.js";
-import { FormLabel as ce } from "../form-label/form-label.es.js";
+import { jsxs as $, jsx as c } from "react/jsx-runtime";
+import F from "../../../../../external/classnames/index.es.js";
+import { useId as pe, useCallback as z, useRef as v, useState as C, useEffect as P } from "react";
+import { Text as be } from "../../base/typography/text/text.es.js";
+import { Button as ve } from "../../buttons/button/button.es.js";
+import { FeedbackText as Ne } from "../feedback-text/feedback-text.es.js";
+import { FormLabel as _e } from "../form-label/form-label.es.js";
 import n from "./number-field.module.scss.es.js";
-import { useBreakpointProps as me } from "../../../helpers/hooks/use-breakpoint-props.es.js";
-import { useLabels as fe } from "../../../providers/label-provider/use-labels.es.js";
-const pe = (T) => {
-  const { getCurrentBreakpointProps: A } = me(T.defaultServerBreakpoint), { getLabel: w, locale: R } = fe(), G = R === "en" ? "." : ",", {
-    id: y,
-    label: H,
-    hideLabel: J,
-    required: E,
-    className: U,
-    size: B,
-    inputMode: K,
-    decimalPlaces: f,
-    decimalSeparator: I = G,
-    min: l,
-    max: s,
-    step: x = 1,
-    defaultValue: O,
-    value: d,
-    onChange: i,
-    suffix: h,
-    fullWidth: Q = !1,
-    disabled: p = !1,
-    invalid: F = !1,
-    helper: r,
-    input: b
-  } = A(T), X = K ?? (f && f > 0 || I === "," ? "decimal" : "numeric"), m = D(
-    (e) => e === void 0 ? "" : I === "," ? String(e).replace(".", ",") : String(e),
-    [I]
-  ), v = W(null), M = W(!1), [$, g] = S(""), [Y, k] = S(O), [Z, N] = S(() => m(d ?? O)), a = i && typeof d < "u" ? d : Y;
-  se(() => {
-    !M.current && typeof d < "u" && N(m(d));
-  }, [d, m]);
-  const z = r ? `${y}-helper` : void 0, P = D(
+import { useBreakpointProps as ye } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useLabels as Be } from "../../../providers/label-provider/use-labels.es.js";
+const Ie = (j) => {
+  const { getCurrentBreakpointProps: Q } = ye(j.defaultServerBreakpoint), { getLabel: T, locale: X } = Be(), Y = X === "en" ? "." : ",", {
+    id: Z,
+    label: M,
+    hideLabel: ee,
+    required: q,
+    className: A,
+    size: k,
+    inputMode: te,
+    decimalPlaces: N,
+    decimalSeparator: S = Y,
+    min: a,
+    max: l,
+    step: V = 1,
+    defaultValue: D,
+    value: u,
+    onChange: o,
+    suffix: w,
+    fullWidth: re = !1,
+    disabled: _ = !1,
+    invalid: E = !1,
+    helper: i,
+    input: y
+  } = Q(j), ne = pe(), L = Z ?? ne, ie = te ?? (N && N > 0 || S === "," ? "decimal" : "numeric"), m = z(
+    (e) => e === void 0 ? "" : S === "," ? String(e).replace(".", ",") : String(e),
+    [S]
+  ), B = v(null), I = v(!1), [oe, g] = C(""), [ae, O] = C(D), [le, h] = C(() => m(u ?? D)), x = u !== void 0, r = x ? u : ae, f = v(), p = v(), R = v(r);
+  P(() => {
+    !I.current && typeof u < "u" && h(m(u));
+  }, [u, m]);
+  const W = i ? `${L}-helper` : void 0, H = z(
     (e) => {
       if (e === void 0)
-        return F || (r == null ? void 0 : r.type) === "error";
-      const t = l !== void 0 && e < l, o = s !== void 0 && e > s;
-      return F || t || o || (r == null ? void 0 : r.type) === "error";
+        return E || (i == null ? void 0 : i.type) === "error";
+      const t = a !== void 0 && e < a, s = l !== void 0 && e > l;
+      return E || t || s || (i == null ? void 0 : i.type) === "error";
     },
-    [F, r, s, l]
-  ), j = (e) => Math.min(s ?? 1 / 0, Math.max(l ?? -1 / 0, e)), ee = (e) => {
-    const t = w("numberField.quantityUpdated", e);
-    g(t), setTimeout(() => {
-      g("");
-    }, 5e3);
-  }, q = (e) => f !== void 0 ? parseFloat(e.toFixed(f)) : e, te = (e) => {
-    let t = a ?? 0;
-    e === "increment" && (t = t + x), e === "decrement" && (t = t - x), t = j(t), t = q(t), ee(t), i == null || i(t), k(t), N(m(t));
-  }, ne = ({ currentTarget: { value: e } }) => {
-    if (N(e), e === "") {
-      a !== void 0 && (i == null || i(void 0), k(void 0));
+    [E, i, l, a]
+  ), U = (e) => Math.min(l ?? 1 / 0, Math.max(a ?? -1 / 0, e)), G = z((e) => {
+    e && (g(""), f.current && clearTimeout(f.current), p.current && clearTimeout(p.current), f.current = setTimeout(() => {
+      g(e), p.current = setTimeout(() => g(""), 5e3);
+    }, 100));
+  }, []);
+  P(() => () => {
+    f.current && clearTimeout(f.current), p.current && clearTimeout(p.current);
+  }, []), P(() => {
+    R.current !== r && (!I.current && r !== void 0 && G(T("numberField.quantityUpdated", r)), R.current = r);
+  }, [r, G, T]);
+  const J = (e) => N !== void 0 ? parseFloat(e.toFixed(N)) : e, se = (e) => {
+    let t = r ?? 0;
+    e === "increment" && (t = t + V), e === "decrement" && (t = t - V), t = U(t), t = J(t), o == null || o(t), x || O(t), h(m(t));
+  }, ue = ({ currentTarget: { value: e } }) => {
+    if (h(e), e === "") {
+      r !== void 0 && (o == null || o(void 0), x || O(void 0));
       return;
     }
     const t = e.replace(",", ".");
     if (!/^-?(\d+(\.\d*)?|\.\d+)$/.test(t))
       return;
-    const o = parseFloat(t);
-    if (Number.isNaN(o)) return;
-    const u = j(o), V = q(u);
-    V !== a && (i == null || i(V), k(V));
-  }, ie = () => {
-    M.current = !0;
-  }, re = () => {
-    M.current = !1, N(m(a));
-  }, C = (e) => {
-    const t = a !== void 0 && (e === "increment" ? s !== void 0 && a >= s : l !== void 0 && a <= l), o = _(n["tedi-number-field__button"], n[`tedi-number-field__button--${e}`], {
-      [n["tedi-number-field__button--disabled"]]: t || p
-    }), u = w(`numberField.${e}`, x);
+    const s = parseFloat(t);
+    if (Number.isNaN(s)) return;
+    const d = U(s), b = J(d);
+    b !== r && (o == null || o(b), x || O(b));
+  }, de = () => {
+    I.current = !0;
+  }, ce = () => {
+    I.current = !1, h(m(r));
+  }, K = (e) => {
+    const t = r !== void 0 && (e === "increment" ? l !== void 0 && r >= l : a !== void 0 && r <= a), s = F(n["tedi-number-field__button"], n[`tedi-number-field__button--${e}`], {
+      [n["tedi-number-field__button--disabled"]]: t || _
+    }), d = typeof M == "string" ? M : void 0, b = T(`numberField.${e}`, V, d);
     return /* @__PURE__ */ c(
-      de,
+      ve,
       {
-        "aria-label": u,
-        onClick: () => te(e),
-        disabled: t || p,
+        "aria-label": b,
+        onClick: () => se(e),
+        disabled: t || _,
         visualType: "secondary",
-        className: o,
+        className: s,
         icon: { name: e === "increment" ? "add" : "remove" },
-        size: B === "small" ? "small" : void 0,
+        size: k === "small" ? "small" : void 0,
         children: e === "increment" ? "+" : "-"
       }
     );
-  }, ae = () => {
-    const e = _(n["tedi-number-field__input-wrapper"], {
-      [n["tedi-number-field__input-wrapper--with-suffix"]]: h,
-      [n["tedi-number-field__input-wrapper--full-width"]]: Q
-    }), t = _(n["tedi-number-field__input"], b == null ? void 0 : b.className);
-    return /* @__PURE__ */ L("div", { className: e, onClick: () => {
-      var u;
-      return (u = v == null ? void 0 : v.current) == null ? void 0 : u.focus();
+  }, me = () => {
+    const e = F(n["tedi-number-field__input-wrapper"], {
+      [n["tedi-number-field__input-wrapper--with-suffix"]]: w,
+      [n["tedi-number-field__input-wrapper--full-width"]]: re
+    }), t = F(n["tedi-number-field__input"], y == null ? void 0 : y.className);
+    return /* @__PURE__ */ $("div", { className: e, onClick: () => {
+      var d;
+      return (d = B == null ? void 0 : B.current) == null ? void 0 : d.focus();
     }, children: [
       /* @__PURE__ */ c(
         "input",
         {
-          ref: v,
-          id: y,
+          ref: B,
+          id: L,
           role: "spinbutton",
-          "aria-valuemin": l,
-          "aria-valuemax": s,
-          "aria-valuenow": a,
-          "aria-describedby": z,
-          "aria-invalid": P(a) ? "true" : "false",
+          "aria-valuemin": a,
+          "aria-valuemax": l,
+          "aria-valuenow": r,
+          "aria-describedby": W,
+          "aria-invalid": H(r) ? "true" : "false",
           type: "text",
-          inputMode: X,
-          value: Z,
-          required: E,
-          disabled: p,
-          onChange: ne,
-          onFocus: ie,
-          onBlur: re,
+          inputMode: ie,
+          value: le,
+          required: q,
+          disabled: _,
+          onChange: ue,
+          onFocus: de,
+          onBlur: ce,
           className: t,
-          ...b
+          ...y
         }
       ),
-      h && /* @__PURE__ */ c(oe, { element: "span", modifiers: "small", color: "tertiary", className: n["tedi-number-field__suffix"], children: h })
+      w && /* @__PURE__ */ c(be, { element: "span", modifiers: "small", color: "tertiary", className: n["tedi-number-field__suffix"], children: w })
     ] });
-  }, le = _(
+  }, fe = F(
     n["tedi-number-field"],
-    { [n["tedi-number-field--invalid"]]: P(a) },
-    { [n["tedi-number-field--disabled"]]: p },
-    { [n["tedi-number-field--small"]]: B === "small" },
-    U
+    { [n["tedi-number-field--invalid"]]: H(r) },
+    { [n["tedi-number-field--disabled"]]: _ },
+    { [n["tedi-number-field--small"]]: k === "small" },
+    A
   );
-  return /* @__PURE__ */ L("div", { "data-name": "number-field", className: U, children: [
-    /* @__PURE__ */ c(ce, { id: y, label: H, required: E, hideLabel: J, size: B }),
-    /* @__PURE__ */ L("div", { className: le, children: [
-      C("decrement"),
-      ae(),
-      C("increment")
+  return /* @__PURE__ */ $("div", { "data-name": "number-field", className: A, children: [
+    /* @__PURE__ */ c(_e, { id: L, label: M, required: q, hideLabel: ee, size: k }),
+    /* @__PURE__ */ $("div", { className: fe, children: [
+      K("decrement"),
+      me(),
+      K("increment")
     ] }),
-    r && /* @__PURE__ */ c(ue, { className: n["tedi-number-field__feedback"], ...r, id: z }),
-    $ && /* @__PURE__ */ c("div", { "aria-live": "polite", className: "sr-only", children: $ })
+    i && /* @__PURE__ */ c(Ne, { className: n["tedi-number-field__feedback"], ...i, id: W }),
+    /* @__PURE__ */ c("div", { role: "status", "aria-live": "polite", "aria-atomic": "true", className: "sr-only", children: oe })
   ] });
 };
-pe.displayName = "NumberField";
+Ie.displayName = "NumberField";
 export {
-  pe as NumberField
+  Ie as NumberField
 };

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

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

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

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

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

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

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

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

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-search__wrapper":"tedi-search__wrapper-92d6f11f","tedi-search__input":"tedi-search__input-94d53b76","tedi-search__input--has-button":"tedi-search__input--has-button-d8e073e7","tedi-search__button":"tedi-search__button-cbb4df17"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-search__wrapper":"tedi-search__wrapper-92d6f11f","tedi-search__input":"tedi-search__input-94d53b76","tedi-search__input--has-button":"tedi-search__input--has-button-d8e073e7","tedi-search__icon--disabled":"tedi-search__icon--disabled-2b492592","tedi-search__button":"tedi-search__button-cbb4df17","tedi-search__wrapper--small":"tedi-search__wrapper--small-7c104c6a","tedi-search__wrapper--large":"tedi-search__wrapper--large-b59e60d7","tedi-search__button--icon-only":"tedi-search__button--icon-only-cf897af5"};exports.default=e;

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

@@ -1,9 +1,13 @@
-const t = {
+const e = {
   "tedi-search__wrapper": "tedi-search__wrapper-92d6f11f",
   "tedi-search__input": "tedi-search__input-94d53b76",
   "tedi-search__input--has-button": "tedi-search__input--has-button-d8e073e7",
-  "tedi-search__button": "tedi-search__button-cbb4df17"
+  "tedi-search__icon--disabled": "tedi-search__icon--disabled-2b492592",
+  "tedi-search__button": "tedi-search__button-cbb4df17",
+  "tedi-search__wrapper--small": "tedi-search__wrapper--small-7c104c6a",
+  "tedi-search__wrapper--large": "tedi-search__wrapper--large-b59e60d7",
+  "tedi-search__button--icon-only": "tedi-search__button--icon-only-cf897af5"
 };
 export {
-  t as default
+  e as default
 };

package/src/tedi/components/form/select/components/select-input.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("../../../../../../external/classnames/index.cjs.js"),s=require("../select.module.scss.cjs.js"),d=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),u=e=>t.jsx(d.c.Input,{...e,className:i.default(e.className,s.default["tedi-select__input"]),isHidden:e.selectProps.inputIsHidden!==void 0?e.selectProps.inputIsHidden:e.isHidden,"aria-required":e.selectProps.required,required:e.selectProps.required});exports.SelectInput=u;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("react/jsx-runtime"),c=require("../../../../../../external/classnames/index.cjs.js"),n=require("../select.module.scss.cjs.js"),l=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),u=e=>{var i;const d=e.selectProps["aria-describedby"],s=[...(((i=e["aria-describedby"])==null?void 0:i.split(" "))??[]).filter(t=>t&&!t.endsWith("-placeholder")),d].filter(Boolean).join(" ")||void 0;return r.jsx(l.c.Input,{...e,className:c.default(e.className,n.default["tedi-select__input"]),isHidden:e.selectProps.inputIsHidden!==void 0?e.selectProps.inputIsHidden:e.isHidden,"aria-required":e.selectProps.required,required:e.selectProps.required,"aria-describedby":s,inputMode:e.selectProps.softKeyboardSuppressed?"none":void 0})};exports.SelectInput=u;

package/src/tedi/components/form/select/components/select-input.es.js

@@ -1,17 +1,26 @@
-import { jsx as i } from "react/jsx-runtime";
-import s from "../../../../../../external/classnames/index.es.js";
-import t from "../select.module.scss.es.js";
-import { c as r } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
-const o = (e) => /* @__PURE__ */ i(
-  r.Input,
-  {
-    ...e,
-    className: s(e.className, t["tedi-select__input"]),
-    isHidden: e.selectProps.inputIsHidden !== void 0 ? e.selectProps.inputIsHidden : e.isHidden,
-    "aria-required": e.selectProps.required,
-    required: e.selectProps.required
-  }
-);
+import { jsx as t } from "react/jsx-runtime";
+import c from "../../../../../../external/classnames/index.es.js";
+import o from "../select.module.scss.es.js";
+import { c as n } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
+const b = (e) => {
+  var i;
+  const r = e.selectProps["aria-describedby"], d = [
+    ...(((i = e["aria-describedby"]) == null ? void 0 : i.split(" ")) ?? []).filter((s) => s && !s.endsWith("-placeholder")),
+    r
+  ].filter(Boolean).join(" ") || void 0;
+  return /* @__PURE__ */ t(
+    n.Input,
+    {
+      ...e,
+      className: c(e.className, o["tedi-select__input"]),
+      isHidden: e.selectProps.inputIsHidden !== void 0 ? e.selectProps.inputIsHidden : e.isHidden,
+      "aria-required": e.selectProps.required,
+      required: e.selectProps.required,
+      "aria-describedby": d,
+      inputMode: e.selectProps.softKeyboardSuppressed ? "none" : void 0
+    }
+  );
+};
 export {
-  o as SelectInput
+  b as SelectInput
 };

package/src/tedi/components/form/select/components/select-multi-value-remove.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),i=require("../../../buttons/closing-button/closing-button.cjs.js"),n=require("../../../misc/separator/separator.cjs.js"),s=require("../select.module.scss.cjs.js"),u=require("../../../../providers/label-provider/use-labels.cjs.js"),d=({innerProps:l,data:a})=>{const{getLabel:r}=u.useLabels(),o=e=>{l.onClick&&l.onClick(e)},c=e=>{(e.key==="Enter"||e.key===" ")&&o(e)};return t.jsxs(t.Fragment,{children:[t.jsx(i.ClosingButton,{onMouseDown:e=>e.stopPropagation(),onClick:o,onKeyDown:c,className:s.default["tedi-select__multi-value-clear"],iconSize:18,title:`${r("clear")} ${a.label}`}),t.jsx(n.Separator,{color:"primary",axis:"vertical",className:s.default["tedi-select__separator"]})]})};exports.SelectMultiValueRemove=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),a=require("../../../buttons/closing-button/closing-button.cjs.js"),c=require("../../../misc/separator/separator.cjs.js"),r=require("../select.module.scss.cjs.js"),u=require("../../../../providers/label-provider/use-labels.cjs.js"),m=({innerProps:o,data:l})=>{const{getLabel:i}=u.useLabels(),s=e=>{o.onClick&&o.onClick(e)},n=e=>{(e.key==="Enter"||e.key===" ")&&s(e)};return t.jsxs(t.Fragment,{children:[t.jsx(a.ClosingButton,{onMouseDown:e=>e.stopPropagation(),onClick:s,onKeyDown:n,className:r.default["tedi-select__multi-value-clear"],iconSize:18,title:`${i("remove")} ${typeof l.label=="string"?l.label:l.value}`}),t.jsx(c.Separator,{color:"primary",axis:"vertical",className:r.default["tedi-select__separator"]})]})};exports.SelectMultiValueRemove=m;