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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tedi-design-system/react",
-  "version": "17.1.0-rc.7",
+  "version": "17.1.0-rc.9",
   "type": "module",
   "sideEffects": false,
   "exports": {

package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),h=require("../../../../../../../external/classnames/index.cjs.js"),R=require("react"),S=require("../../../checkbox/checkbox.cjs.js"),A=require("../../../feedback-text/feedback-text.cjs.js"),H=require("../../../radio/radio.cjs.js"),L=require("../../choice-group-context.cjs.js"),e=require("./choice-group-item.module.scss.cjs.js"),O=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),V=require("../../../../layout/grid/col.cjs.js"),v=n=>{const{getCurrentBreakpointProps:_}=O.useBreakpointProps(n.defaultServerBreakpoint),{id:c,label:k,value:a,className:q,direction:m,disabled:d,colProps:N=m==="column"?{width:12}:{width:"auto"},onChange:p,hideLabel:I,helper:r,tooltip:B,type:u="radio",variant:s="default",color:$="primary",layout:G,showIndicator:C,justifyContent:x="start"}=_(n),{currentValue:l,name:b,onChange:f,inputType:P}=R.useContext(L.ChoiceGroupContext),i=Array.isArray(l)?l.includes(a):a===l,M=l===void 0?n.defaultChecked:i,y=(o,g)=>{f==null||f(o,g),p==null||p(o,g)},T=h.default(e.default[`tedi-choice-group-item--${G==="separated"?"separated":"segmented"}`],m&&e.default[`tedi-choice-group-item--${m}`]),w=h.default(e.default["tedi-choice-group-item"],e.default[`tedi-choice-group-item--${s}`],e.default[`tedi-choice-group-item--${s}-${$}`],C&&e.default["tedi-choice-group-item--indicator"],u&&e.default[`tedi-choice-group-item--${u}`],{[e.default["tedi-choice-group-item--disabled"]]:d},{[e.default["tedi-choice-group-item--checked"]]:i},{[`justify-content-${x}`]:x}),E=u==="radio"?H.Radio:S.Checkbox,F=o=>{var j;d||s!=="card"||o.target.closest("input, label")||(j=document.getElementById(c))==null||j.click()};return t.jsx(V.Col,{...N,className:T,children:t.jsx("div",{className:w,tabIndex:d?-1:0,onClick:F,role:u,"aria-checked":i,children:s==="default"||C?t.jsx(E,{id:c,label:k,value:a,name:b,className:h.default(e.default["tedi-choice-group-item__indicator"],q),disabled:d,checked:i,defaultChecked:M,onChange:y,hideLabel:I,helper:r?{...r,className:h.default(e.default["tedi-choice-group-item__feedback-text"],r.className)}:void 0,tooltip:B,"data-testid":"choice-group-item-indicator","aria-checked":i}):t.jsxs(t.Fragment,{children:[t.jsx("input",{id:c,value:a,name:b,type:P,disabled:d,checked:i,defaultChecked:l===void 0?n.defaultChecked:void 0,onChange:o=>{y(a,o.target.checked)},className:"visually-hidden",role:u==="radio"?"radio":void 0,"aria-checked":i,tabIndex:-1}),t.jsxs("label",{htmlFor:c,className:e.default["tedi-choice-group-item__label"],children:[k,r&&t.jsx(A.FeedbackText,{...r,id:c,className:e.default["tedi-choice-group-item__feedback-text"]})]})]})})})};exports.ChoiceGroupItem=v;exports.default=v;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const t=require("react/jsx-runtime"),h=require("../../../../../../../external/classnames/index.cjs.js"),S=require("react"),A=require("../../../checkbox/checkbox.cjs.js"),H=require("../../../feedback-text/feedback-text.cjs.js"),L=require("../../../radio/radio.cjs.js"),O=require("../../choice-group-context.cjs.js"),e=require("./choice-group-item.module.scss.cjs.js"),V=require("../../../../../helpers/hooks/use-breakpoint-props.cjs.js"),z=require("../../../../layout/grid/col.cjs.js"),_=n=>{const{getCurrentBreakpointProps:q}=V.useBreakpointProps(n.defaultServerBreakpoint),{id:a,label:C,value:d,className:N,direction:m,disabled:r,colProps:I=m==="column"?{width:12}:{width:"auto"},onChange:p,hideLabel:B,helper:u,tooltip:$,type:o="radio",variant:s="default",color:G="primary",layout:P,showIndicator:x,justifyContent:b="start"}=q(n),{currentValue:l,name:v,onChange:f,inputType:M}=S.useContext(O.ChoiceGroupContext),i=Array.isArray(l)?l.includes(d):d===l,R=l===void 0?n.defaultChecked:i,y=(c,k)=>{f==null||f(c,k),p==null||p(c,k)},T=h.default(e.default[`tedi-choice-group-item--${P==="separated"?"separated":"segmented"}`],m&&e.default[`tedi-choice-group-item--${m}`]),w=h.default(e.default["tedi-choice-group-item"],e.default[`tedi-choice-group-item--${s}`],e.default[`tedi-choice-group-item--${s}-${G}`],x&&e.default["tedi-choice-group-item--indicator"],o&&e.default[`tedi-choice-group-item--${o}`],{[e.default["tedi-choice-group-item--disabled"]]:r},{[e.default["tedi-choice-group-item--checked"]]:i},{[`justify-content-${b}`]:b}),E=o==="radio"?L.Radio:A.Checkbox,F=c=>{var j;r||s!=="card"||c.target.closest("input, label")||(j=document.getElementById(a))==null||j.click()},g=o==="radio";return t.jsx(z.Col,{...I,className:T,children:t.jsx("div",{className:w,tabIndex:g||r?-1:0,onClick:F,role:g?void 0:o,"aria-checked":g?void 0:i,children:s==="default"||x?t.jsx(E,{id:a,label:C,value:d,name:v,className:h.default(e.default["tedi-choice-group-item__indicator"],N),disabled:r,checked:i,defaultChecked:R,onChange:y,hideLabel:B,helper:u?{...u,className:h.default(e.default["tedi-choice-group-item__feedback-text"],u.className)}:void 0,tooltip:$,"data-testid":"choice-group-item-indicator","aria-checked":i}):t.jsxs(t.Fragment,{children:[t.jsx("input",{id:a,value:d,name:v,type:M,disabled:r,checked:i,defaultChecked:l===void 0?n.defaultChecked:void 0,onChange:c=>{y(d,c.target.checked)},className:"visually-hidden",role:o==="radio"?"radio":void 0,"aria-checked":i,tabIndex:-1}),t.jsxs("label",{htmlFor:a,className:e.default["tedi-choice-group-item__label"],children:[C,u&&t.jsx(H.FeedbackText,{...u,id:a,className:e.default["tedi-choice-group-item__feedback-text"]})]})]})})})};exports.ChoiceGroupItem=_;exports.default=_;

package/src/tedi/components/form/choice-group/components/choice-group-item/choice-group-item.es.js

@@ -1,105 +1,105 @@
-import { jsx as l, jsxs as _, Fragment as M } from "react/jsx-runtime";
+import { jsx as s, jsxs as _, Fragment as H } from "react/jsx-runtime";
 import u from "../../../../../../../external/classnames/index.es.js";
-import R from "react";
-import { Checkbox as T } from "../../../checkbox/checkbox.es.js";
-import { FeedbackText as H } from "../../../feedback-text/feedback-text.es.js";
-import { Radio as L } from "../../../radio/radio.es.js";
-import { ChoiceGroupContext as S } from "../../choice-group-context.es.js";
+import L from "react";
+import { Checkbox as S } from "../../../checkbox/checkbox.es.js";
+import { FeedbackText as V } from "../../../feedback-text/feedback-text.es.js";
+import { Radio as q } from "../../../radio/radio.es.js";
+import { ChoiceGroupContext as z } from "../../choice-group-context.es.js";
 import e from "./choice-group-item.module.scss.es.js";
-import { useBreakpointProps as V } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
-import { Col as q } from "../../../../layout/grid/col.es.js";
-const te = (s) => {
-  const { getCurrentBreakpointProps: v } = V(s.defaultServerBreakpoint), {
-    id: i,
-    label: k,
-    value: c,
-    className: I,
+import { useBreakpointProps as D } from "../../../../../helpers/hooks/use-breakpoint-props.es.js";
+import { Col as J } from "../../../../layout/grid/col.es.js";
+const oe = (l) => {
+  const { getCurrentBreakpointProps: $ } = D(l.defaultServerBreakpoint), {
+    id: c,
+    label: C,
+    value: r,
+    className: B,
     direction: h,
-    disabled: r,
-    colProps: $ = h === "column" ? { width: 12 } : { width: "auto" },
+    disabled: a,
+    colProps: I = h === "column" ? { width: 12 } : { width: "auto" },
     onChange: p,
-    hideLabel: B,
-    helper: a,
-    tooltip: j,
-    type: d = "radio",
+    hideLabel: j,
+    helper: d,
+    tooltip: w,
+    type: o = "radio",
     variant: m = "default",
-    color: w = "primary",
-    layout: E,
-    showIndicator: C,
-    justifyContent: b = "start"
-  } = v(s), { currentValue: n, name: y, onChange: f, inputType: F } = R.useContext(S), t = Array.isArray(n) ? n.includes(c) : c === n, G = n === void 0 ? s.defaultChecked : t, x = (o, g) => {
-    f == null || f(o, g), p == null || p(o, g);
-  }, P = u(
-    e[`tedi-choice-group-item--${E === "separated" ? "separated" : "segmented"}`],
+    color: E = "primary",
+    layout: F,
+    showIndicator: b,
+    justifyContent: y = "start"
+  } = $(l), { currentValue: n, name: v, onChange: f, inputType: G } = L.useContext(z), t = Array.isArray(n) ? n.includes(r) : r === n, P = n === void 0 ? l.defaultChecked : t, x = (i, k) => {
+    f == null || f(i, k), p == null || p(i, k);
+  }, R = u(
+    e[`tedi-choice-group-item--${F === "separated" ? "separated" : "segmented"}`],
     h && e[`tedi-choice-group-item--${h}`]
   ), A = u(
     e["tedi-choice-group-item"],
     e[`tedi-choice-group-item--${m}`],
-    e[`tedi-choice-group-item--${m}-${w}`],
-    C && e["tedi-choice-group-item--indicator"],
-    d && e[`tedi-choice-group-item--${d}`],
-    { [e["tedi-choice-group-item--disabled"]]: r },
+    e[`tedi-choice-group-item--${m}-${E}`],
+    b && e["tedi-choice-group-item--indicator"],
+    o && e[`tedi-choice-group-item--${o}`],
+    { [e["tedi-choice-group-item--disabled"]]: a },
     { [e["tedi-choice-group-item--checked"]]: t },
-    { [`justify-content-${b}`]: b }
-  );
-  return /* @__PURE__ */ l(q, { ...$, className: P, children: /* @__PURE__ */ l(
+    { [`justify-content-${y}`]: y }
+  ), M = o === "radio" ? q : S, T = (i) => {
+    var N;
+    a || m !== "card" || i.target.closest("input, label") || (N = document.getElementById(c)) == null || N.click();
+  }, g = o === "radio";
+  return /* @__PURE__ */ s(J, { ...I, className: R, children: /* @__PURE__ */ s(
     "div",
     {
       className: A,
-      tabIndex: r ? -1 : 0,
-      onClick: (o) => {
-        var N;
-        r || m !== "card" || o.target.closest("input, label") || (N = document.getElementById(i)) == null || N.click();
-      },
-      role: d,
-      "aria-checked": t,
-      children: m === "default" || C ? /* @__PURE__ */ l(
-        d === "radio" ? L : T,
+      tabIndex: g || a ? -1 : 0,
+      onClick: T,
+      role: g ? void 0 : o,
+      "aria-checked": g ? void 0 : t,
+      children: m === "default" || b ? /* @__PURE__ */ s(
+        M,
         {
-          id: i,
-          label: k,
-          value: c,
-          name: y,
-          className: u(e["tedi-choice-group-item__indicator"], I),
-          disabled: r,
+          id: c,
+          label: C,
+          value: r,
+          name: v,
+          className: u(e["tedi-choice-group-item__indicator"], B),
+          disabled: a,
           checked: t,
-          defaultChecked: G,
+          defaultChecked: P,
           onChange: x,
-          hideLabel: B,
-          helper: a ? { ...a, className: u(e["tedi-choice-group-item__feedback-text"], a.className) } : void 0,
-          tooltip: j,
+          hideLabel: j,
+          helper: d ? { ...d, className: u(e["tedi-choice-group-item__feedback-text"], d.className) } : void 0,
+          tooltip: w,
           "data-testid": "choice-group-item-indicator",
           "aria-checked": t
         }
-      ) : /* @__PURE__ */ _(M, { children: [
-        /* @__PURE__ */ l(
+      ) : /* @__PURE__ */ _(H, { children: [
+        /* @__PURE__ */ s(
           "input",
           {
-            id: i,
-            value: c,
-            name: y,
-            type: F,
-            disabled: r,
+            id: c,
+            value: r,
+            name: v,
+            type: G,
+            disabled: a,
             checked: t,
-            defaultChecked: n === void 0 ? s.defaultChecked : void 0,
-            onChange: (o) => {
-              x(c, o.target.checked);
+            defaultChecked: n === void 0 ? l.defaultChecked : void 0,
+            onChange: (i) => {
+              x(r, i.target.checked);
             },
             className: "visually-hidden",
-            role: d === "radio" ? "radio" : void 0,
+            role: o === "radio" ? "radio" : void 0,
             "aria-checked": t,
             tabIndex: -1
           }
         ),
-        /* @__PURE__ */ _("label", { htmlFor: i, className: e["tedi-choice-group-item__label"], children: [
-          k,
-          a && /* @__PURE__ */ l(H, { ...a, id: i, className: e["tedi-choice-group-item__feedback-text"] })
+        /* @__PURE__ */ _("label", { htmlFor: c, className: e["tedi-choice-group-item__label"], children: [
+          C,
+          d && /* @__PURE__ */ s(V, { ...d, id: c, className: e["tedi-choice-group-item__feedback-text"] })
         ] })
       ] })
     }
   ) });
 };
 export {
-  te as ChoiceGroupItem,
-  te as default
+  oe as ChoiceGroupItem,
+  oe as default
 };

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

@@ -1,19 +1,19 @@
-import s from "../../../../../../../external/classnames/index.es.js";
-import t from "react";
-import { useInputGroup as m } from "../../input-group.es.js";
+import t from "../../../../../../../external/classnames/index.es.js";
+import s from "react";
+import { useInputGroup as u } from "../../input-group.es.js";
 import o from "../../input-group.module.scss.es.js";
 const f = ({ children: p }) => {
-  const { disabled: r, inputId: e } = m();
-  if (!t.isValidElement(p)) return p;
+  const { disabled: r, inputId: e } = u();
+  if (!s.isValidElement(p)) return p;
   const a = typeof p.type == "string", i = {
     disabled: r || p.props.disabled,
     id: p.props.id ?? e,
-    className: s(p.props.className, o["tedi-input-group__input"]),
+    className: t(p.props.className, o["tedi-input-group__input"]),
     ...!a && {
-      wrapperClassName: s(p.props.wrapperClassName, o["tedi-input-group__input"])
+      wrapperClassName: t(p.props.wrapperClassName, o["tedi-input-group__input"])
     }
   };
-  return t.cloneElement(p, i);
+  return s.cloneElement(p, i);
 };
 export {
   f as Input

package/src/tedi/components/form/input-group/components/prefix/prefix.es.js

@@ -1,22 +1,22 @@
-import { jsx as m } from "react/jsx-runtime";
-import n from "../../../../../../../external/classnames/index.es.js";
-import { useEffect as u } from "react";
+import { jsx as u } from "react/jsx-runtime";
+import m from "../../../../../../../external/classnames/index.es.js";
+import { useEffect as n } from "react";
 import { useInputGroup as a } from "../../input-group.es.js";
 import i from "../../input-group.module.scss.es.js";
-const b = ({ children: r, className: o, ...s }) => {
-  const { registerPrefix: e, unregisterPrefix: t, disabled: p } = a();
-  u(() => (e(), () => t()), [e, t]);
+const b = ({ children: r, className: o, ...p }) => {
+  const { registerPrefix: e, unregisterPrefix: t, disabled: s } = a();
+  n(() => (e(), () => t()), [e, t]);
   const f = typeof r == "string" || typeof r == "number";
-  return /* @__PURE__ */ m(
+  return /* @__PURE__ */ u(
     "div",
     {
-      ...s,
-      className: n(
+      ...p,
+      className: m(
         i["tedi-input-group__prefix"],
         { [i["tedi-input-group__prefix--no-inner-div"]]: f },
         o
       ),
-      "aria-disabled": p,
+      "aria-disabled": s,
       children: r
     }
   );

package/src/tedi/components/form/input-group/components/suffix/suffix.es.js

@@ -2,18 +2,18 @@ import { jsx as p } from "react/jsx-runtime";
 import m from "../../../../../../../external/classnames/index.es.js";
 import { useEffect as n } from "react";
 import { useInputGroup as a } from "../../input-group.es.js";
-import s from "../../input-group.module.scss.es.js";
-const b = ({ children: r, className: e, ...o }) => {
+import o from "../../input-group.module.scss.es.js";
+const _ = ({ children: r, className: e, ...s }) => {
   const { registerSuffix: t, unregisterSuffix: i, disabled: f } = a();
   n(() => (t(), () => i()), [t, i]);
   const u = typeof r == "string" || typeof r == "number";
   return /* @__PURE__ */ p(
     "div",
     {
-      ...o,
+      ...s,
       className: m(
-        s["tedi-input-group__suffix"],
-        { [s["tedi-input-group__suffix--no-inner-div"]]: u },
+        o["tedi-input-group__suffix"],
+        { [o["tedi-input-group__suffix--no-inner-div"]]: u },
         e
       ),
       "aria-disabled": f,
@@ -22,5 +22,5 @@ const b = ({ children: r, className: e, ...o }) => {
   );
 };
 export {
-  b as Suffix
+  _ as Suffix
 };

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

@@ -7,13 +7,13 @@ import { Input as B } from "./components/input/input.es.js";
 import { Prefix as M } from "./components/prefix/prefix.es.js";
 import { Suffix as O } from "./components/suffix/suffix.es.js";
 import t from "./input-group.module.scss.es.js";
-const p = j(null), U = () => {
-  const u = G(p);
+const a = j(null), U = () => {
+  const u = G(a);
   if (!u) throw new Error("InputGroupContext missing");
   return u;
-}, W = () => G(p), P = H(
-  ({ className: u, addons: S = !0, helper: r, label: o, children: h, disabled: s, id: y, ...v }, C) => {
-    const m = g.useRef(null), N = g.useId(), i = y ?? N, [n, d] = l(!1), [a, c] = l(!1);
+}, W = () => G(a), S = H(
+  ({ className: u, addons: P = !0, helper: r, label: o, children: h, disabled: s, id: y, ...v }, C) => {
+    const m = g.useRef(null), N = g.useId(), i = y ?? N, [n, d] = l(!1), [p, c] = l(!1);
     E(C, () => ({
       get root() {
         return m.current;
@@ -22,7 +22,7 @@ const p = j(null), U = () => {
     const w = L(
       () => ({
         hasPrefix: n,
-        hasSuffix: a,
+        hasSuffix: p,
         disabled: s,
         hasExternalLabel: !!o,
         inputId: i,
@@ -31,31 +31,31 @@ const p = j(null), U = () => {
         registerSuffix: () => c(!0),
         unregisterSuffix: () => c(!1)
       }),
-      [i, n, a, s, o]
+      [i, n, p, s, o]
     ), A = F(
       t["tedi-input-group"],
       {
-        [t["tedi-input-group--addons"]]: S,
+        [t["tedi-input-group--addons"]]: P,
         [t["tedi-input-group--has-prefix"]]: n,
-        [t["tedi-input-group--has-suffix"]]: a,
+        [t["tedi-input-group--has-suffix"]]: p,
         [t["tedi-input-group--disabled"]]: s
       },
       u
     ), R = () => !r || Array.isArray(r) && r.length === 0 ? null : /* @__PURE__ */ e("div", { className: t["tedi-input-group__feedback-wrapper"], children: Array.isArray(r) ? r.map((_, x) => /* @__PURE__ */ e(I, { ..._, id: `group-helper-${x}` }, x)) : /* @__PURE__ */ e(I, { ...r, id: "group-helper" }) });
-    return /* @__PURE__ */ k(p.Provider, { value: w, children: [
+    return /* @__PURE__ */ k(a.Provider, { value: w, children: [
       o && /* @__PURE__ */ e(b, { ...v, label: o, id: i }),
       /* @__PURE__ */ e("div", { ref: m, className: A, "data-name": "tedi-input-group", "aria-disabled": s, children: h }),
       R()
     ] });
   }
 );
-P.displayName = "InputGroup";
-const f = P;
+S.displayName = "InputGroup";
+const f = S;
 f.Prefix = M;
 f.Suffix = O;
 f.Input = B;
 export {
-  P as InputGroupBase,
+  S as InputGroupBase,
   f as default,
   U as useInputGroup,
   W as useOptionalInputGroup

package/src/tedi/components/form/select/components/select-bulk-helpers.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i="__tedi_select_all__",r="__tedi_select_group__:",u=e=>!!e&&typeof e.value=="string"&&e.value.startsWith(r),a=e=>{if(!e||e.length===0)return[];const t=[];for(const s of e)if(s&&typeof s=="object"&&Array.isArray(s.options))for(const n of s.options)n.isDisabled||t.push(n);else{const n=s;n&&!n.isDisabled&&t.push(n)}return t},f=e=>!e||!Array.isArray(e.options)?[]:e.options.filter(t=>!t.isDisabled),l=(e,t)=>t.length===0?!1:t.every(s=>e.some(n=>n.value===s.value)),c=(e,t)=>{if(t.length===0)return!1;const s=t.filter(n=>e.some(o=>o.value===n.value)).length;return s>0&&s<t.length},_=(e,t)=>{if(l(e,t))return e.filter(n=>!t.some(o=>o.value===n.value));const s=[...e];for(const n of t)s.some(o=>o.value===n.value)||s.push(n);return s};exports.GROUP_OPTION_PREFIX=r;exports.SELECT_ALL_VALUE=i;exports.areAllSelected=l;exports.getEnabledOptions=a;exports.getGroupEnabledOptions=f;exports.isGroupSentinel=u;exports.isIndeterminate=c;exports.toggleBulkSelection=_;

package/src/tedi/components/form/select/components/select-bulk-helpers.d.ts

@@ -0,0 +1,55 @@
+import { GroupBase, OptionsOrGroups } from 'react-select';
+import { ISelectOption } from '../select';
+/**
+ * Sentinel value used by the "Select all" option when it is injected into
+ * react-select's option list. The sentinel is stripped from the value before
+ * it is exposed to consumers via onChange — it never leaks outside the
+ * component.
+ */
+export declare const SELECT_ALL_VALUE = "__tedi_select_all__";
+export declare const isSelectAllSentinel: (option: {
+    value?: string;
+} | null | undefined) => boolean;
+/**
+ * Prefix for group sentinel options. When `selectableGroups + multiple` is on,
+ * each group is flattened into the option list with a sentinel option at the
+ * top of its run; toggling the sentinel toggles every enabled child of that
+ * group. The label after the prefix is the original group's label.
+ */
+export declare const GROUP_OPTION_PREFIX = "__tedi_select_group__:";
+export declare const isGroupSentinel: (option: {
+    value?: string;
+} | null | undefined) => boolean;
+/**
+ * Returns true when `options` is a grouped tree (i.e. each top-level entry
+ * has its own `options` array).
+ */
+export declare const isGroupedOptions: (options: OptionsOrGroups<ISelectOption, GroupBase<ISelectOption>>) => options is ReadonlyArray<GroupBase<ISelectOption>>;
+/**
+ * Flattens grouped/non-grouped options into a single list of enabled
+ * `ISelectOption`s. Used by Select All and group toggles to decide which
+ * options to flip on/off.
+ *
+ * Handles a mixed input where a flat option (e.g. the injected Select-all
+ * sentinel) sits alongside groups in the same top-level array, by checking
+ * each item individually rather than only inspecting `options[0]`.
+ */
+export declare const getEnabledOptions: (options: OptionsOrGroups<ISelectOption, GroupBase<ISelectOption>>) => ISelectOption[];
+/**
+ * Returns the enabled options of a specific group. Pass the group object
+ * directly (e.g. `GroupHeadingProps.data` from react-select) — looking groups
+ * up by label is unsafe because duplicate labels would always resolve to the
+ * first match, mutating the wrong group.
+ */
+export declare const getGroupEnabledOptions: (group: GroupBase<ISelectOption> | null | undefined) => ISelectOption[];
+/** True iff every enabled option is currently in the selection. */
+export declare const areAllSelected: (selected: ReadonlyArray<ISelectOption>, enabled: ReadonlyArray<ISelectOption>) => boolean;
+/** True when some — but not all — enabled options are selected. */
+export declare const isIndeterminate: (selected: ReadonlyArray<ISelectOption>, enabled: ReadonlyArray<ISelectOption>) => boolean;
+/**
+ * Toggle behaviour for both Select All and group toggle: when every enabled
+ * option in `target` is selected, remove them all; otherwise add the missing
+ * ones to the existing selection. Other selected values (e.g. options
+ * outside `target`) are preserved.
+ */
+export declare const toggleBulkSelection: (selected: ReadonlyArray<ISelectOption>, target: ReadonlyArray<ISelectOption>) => ISelectOption[];

package/src/tedi/components/form/select/components/select-bulk-helpers.es.js

@@ -0,0 +1,34 @@
+const i = "__tedi_select_all__", o = "__tedi_select_group__:", u = (t) => !!t && typeof t.value == "string" && t.value.startsWith(o), f = (t) => {
+  if (!t || t.length === 0) return [];
+  const e = [];
+  for (const n of t)
+    if (n && typeof n == "object" && Array.isArray(n.options))
+      for (const s of n.options)
+        s.isDisabled || e.push(s);
+    else {
+      const s = n;
+      s && !s.isDisabled && e.push(s);
+    }
+  return e;
+}, a = (t) => !t || !Array.isArray(t.options) ? [] : t.options.filter((e) => !e.isDisabled), l = (t, e) => e.length === 0 ? !1 : e.every((n) => t.some((s) => s.value === n.value)), c = (t, e) => {
+  if (e.length === 0) return !1;
+  const n = e.filter((s) => t.some((r) => r.value === s.value)).length;
+  return n > 0 && n < e.length;
+}, _ = (t, e) => {
+  if (l(t, e))
+    return t.filter((s) => !e.some((r) => r.value === s.value));
+  const n = [...t];
+  for (const s of e)
+    n.some((r) => r.value === s.value) || n.push(s);
+  return n;
+};
+export {
+  o as GROUP_OPTION_PREFIX,
+  i as SELECT_ALL_VALUE,
+  l as areAllSelected,
+  f as getEnabledOptions,
+  a as getGroupEnabledOptions,
+  u as isGroupSentinel,
+  c as isIndeterminate,
+  _ as toggleBulkSelection
+};

package/src/tedi/components/form/select/components/select-group-bulk-context.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react"),t=e.createContext(null),u=()=>e.useContext(t);exports.SelectGroupBulkContext=t;exports.useSelectGroupBulkApi=u;

package/src/tedi/components/form/select/components/select-group-bulk-context.d.ts

@@ -0,0 +1,18 @@
+import { SetValueAction } from 'react-select';
+import { ISelectOption } from '../select';
+/**
+ * Exposes react-select's `getValue` / `setValue` helpers from the `Group`
+ * component down to `GroupHeading`. react-select only forwards `selectProps`
+ * + theme/styles to the heading at runtime, so the heading can't read these
+ * helpers from its own props — it has to grab them from this context.
+ *
+ * Using `selectProps.value` / `selectProps.onChange` instead would only work
+ * in fully controlled mode: in uncontrolled mode `value` is undefined and
+ * `onChange` bypasses react-select's internal state.
+ */
+export interface SelectGroupBulkApi {
+    getValue: () => ReadonlyArray<ISelectOption>;
+    setValue: (value: ReadonlyArray<ISelectOption>, action: SetValueAction) => void;
+}
+export declare const SelectGroupBulkContext: import('react').Context<SelectGroupBulkApi | null>;
+export declare const useSelectGroupBulkApi: () => SelectGroupBulkApi | null;

package/src/tedi/components/form/select/components/select-group-bulk-context.es.js

@@ -0,0 +1,6 @@
+import { useContext as t, createContext as e } from "react";
+const o = e(null), l = () => t(o);
+export {
+  o as SelectGroupBulkContext,
+  l as useSelectGroupBulkApi
+};

package/src/tedi/components/form/select/components/select-group-heading.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"),c=require("../../../base/typography/text/text.cjs.js"),u=require("../select.module.scss.cjs.js"),d=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),s=({optionGroupHeadingText:n,...e})=>{const r=e.data.text||n;return t.jsx(d.c.GroupHeading,{...e,className:i.default(u.default["tedi-select__group-heading"]),children:t.jsx(c.Text,{...r,children:e.data.label})})};exports.SelectGroupHeading=s;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),S=require("../../../../../../external/classnames/index.cjs.js"),q=require("react"),u=require("../../../base/typography/text/text.cjs.js"),G=require("../../checkbox/checkbox.cjs.js"),i=require("../select.module.scss.cjs.js"),s=require("./select-bulk-helpers.cjs.js"),f=require("./select-group-bulk-context.cjs.js"),j=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),g=({optionGroupHeadingText:x,...e})=>{const _=q.useId(),d=e.data.text||x,{selectableGroups:h,isMulti:b}=e.selectProps,t=f.useSelectGroupBulkApi(),l=!!b&&!!h&&!!t,c=l?s.getGroupEnabledOptions(e.data):[],o=(t==null?void 0:t.getValue())??[],r=l&&s.areAllSelected(o,c),p=l&&s.isIndeterminate(o,c),m=()=>{if(!l||!t||c.length===0)return;const a=s.toggleBulkSelection(o,c);t.setValue(a,r?"deselect-option":"select-option")};return n.jsx(j.c.GroupHeading,{...e,className:S.default(i.default["tedi-select__group-heading"],{[i.default["tedi-select__group-heading--selectable"]]:l}),children:l?n.jsx("div",{className:i.default["tedi-select__group-heading-toggle"],onMouseDown:a=>a.preventDefault(),children:n.jsx(G.Checkbox,{id:`${e.selectProps.instanceId??"tedi-select"}-group-${_}`,name:"tedi-select__group-toggle",value:`__group_${e.data.label}__`,label:n.jsx(u.Text,{...d,children:e.data.label}),checked:r,indeterminate:p,onChange:m})}):n.jsx(u.Text,{...d,children:e.data.label})})};g.displayName="SelectGroupHeading";exports.SelectGroupHeading=g;

package/src/tedi/components/form/select/components/select-group-heading.d.ts

@@ -5,5 +5,8 @@ import { IGroupedOptions, ISelectOption } from '../select';
 type GroupHeadingType = GroupHeadingProps<ISelectOption, boolean, IGroupedOptions<ISelectOption>> & {
     optionGroupHeadingText?: Pick<TextProps, 'modifiers' | 'color'>;
 };
-export declare const SelectGroupHeading: ({ optionGroupHeadingText, ...props }: GroupHeadingType) => ReactElement;
+export declare const SelectGroupHeading: {
+    ({ optionGroupHeadingText, ...props }: GroupHeadingType): ReactElement;
+    displayName: string;
+};
 export {};

package/src/tedi/components/form/select/components/select-group-heading.es.js

@@ -1,12 +1,47 @@
-import { jsx as e } from "react/jsx-runtime";
-import a from "../../../../../../external/classnames/index.es.js";
-import { Text as m } from "../../../base/typography/text/text.es.js";
+import { jsx as l } from "react/jsx-runtime";
+import f from "../../../../../../external/classnames/index.es.js";
+import { useId as b } from "react";
+import { Text as d } from "../../../base/typography/text/text.es.js";
+import { Checkbox as x } from "../../checkbox/checkbox.es.js";
 import i from "../select.module.scss.es.js";
-import { c as s } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
-const f = ({ optionGroupHeadingText: o, ...t }) => {
-  const r = t.data.text || o;
-  return /* @__PURE__ */ e(s.GroupHeading, { ...t, className: a(i["tedi-select__group-heading"]), children: /* @__PURE__ */ e(m, { ...r, children: t.data.label }) });
+import { getGroupEnabledOptions as S, areAllSelected as G, isIndeterminate as v, toggleBulkSelection as H } from "./select-bulk-helpers.es.js";
+import { useSelectGroupBulkApi as I } from "./select-group-bulk-context.es.js";
+import { c as N } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
+const k = ({ optionGroupHeadingText: g, ...e }) => {
+  const m = b(), s = e.data.text || g, { selectableGroups: u, isMulti: p } = e.selectProps, t = I(), o = !!p && !!u && !!t, n = o ? S(e.data) : [], a = (t == null ? void 0 : t.getValue()) ?? [], r = o && G(a, n), _ = o && v(a, n), h = () => {
+    if (!o || !t || n.length === 0) return;
+    const c = H(a, n);
+    t.setValue(c, r ? "deselect-option" : "select-option");
+  };
+  return /* @__PURE__ */ l(
+    N.GroupHeading,
+    {
+      ...e,
+      className: f(i["tedi-select__group-heading"], {
+        [i["tedi-select__group-heading--selectable"]]: o
+      }),
+      children: o ? (
+        // The Checkbox owns the toggle path through its own `onChange`;
+        // attaching another handler to the wrapper would fire `handleToggle`
+        // twice on a single user click. The wrapper stays only to swallow the
+        // mousedown that would otherwise close react-select's menu.
+        /* @__PURE__ */ l("div", { className: i["tedi-select__group-heading-toggle"], onMouseDown: (c) => c.preventDefault(), children: /* @__PURE__ */ l(
+          x,
+          {
+            id: `${e.selectProps.instanceId ?? "tedi-select"}-group-${m}`,
+            name: "tedi-select__group-toggle",
+            value: `__group_${e.data.label}__`,
+            label: /* @__PURE__ */ l(d, { ...s, children: e.data.label }),
+            checked: r,
+            indeterminate: _,
+            onChange: h
+          }
+        ) })
+      ) : /* @__PURE__ */ l(d, { ...s, children: e.data.label })
+    }
+  );
 };
+k.displayName = "SelectGroupHeading";
 export {
-  f as SelectGroupHeading
+  k as SelectGroupHeading
 };

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

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),r=require("../../../../../../external/classnames/index.cjs.js"),u=require("../select.module.scss.cjs.js"),c=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),i=e=>t.jsx(c.c.Group,{...e,className:r.default(u.default["tedi-select__group"]),children:e.children});exports.SelectGroup=i;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),o=require("../../../../../../external/classnames/index.cjs.js"),i=require("react"),n=require("../select.module.scss.cjs.js"),s=require("./select-group-bulk-context.cjs.js"),a=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),u=e=>{const l=i.useMemo(()=>({getValue:()=>e.getValue(),setValue:(r,c)=>e.setValue(r,c)}),[e]);return t.jsx(s.SelectGroupBulkContext.Provider,{value:l,children:t.jsx(a.c.Group,{...e,className:o.default(n.default["tedi-select__group"]),children:e.children})})};u.displayName="SelectGroup";exports.SelectGroup=u;

package/src/tedi/components/form/select/components/select-group.d.ts

@@ -1,3 +1,6 @@
 import { GroupProps } from 'react-select';
 import { IGroupedOptions, ISelectOption } from '../select';
-export declare const SelectGroup: (props: GroupProps<ISelectOption, boolean, IGroupedOptions<ISelectOption>>) => JSX.Element;
+export declare const SelectGroup: {
+    (props: GroupProps<ISelectOption, boolean, IGroupedOptions<ISelectOption>>): JSX.Element;
+    displayName: string;
+};

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

@@ -1,8 +1,20 @@
-import { jsx as o } from "react/jsx-runtime";
-import e from "../../../../../../external/classnames/index.es.js";
-import t from "../select.module.scss.es.js";
-import { c as m } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
-const p = (r) => /* @__PURE__ */ o(m.Group, { ...r, className: e(t["tedi-select__group"]), children: r.children });
+import { jsx as t } from "react/jsx-runtime";
+import m from "../../../../../../external/classnames/index.es.js";
+import { useMemo as u } from "react";
+import c from "../select.module.scss.es.js";
+import { SelectGroupBulkContext as i } from "./select-group-bulk-context.es.js";
+import { c as s } from "../../../../../../external/react-select/dist/index-641ee5b8.esm.es.js";
+const a = (e) => {
+  const o = u(
+    () => ({
+      getValue: () => e.getValue(),
+      setValue: (r, l) => e.setValue(r, l)
+    }),
+    [e]
+  );
+  return /* @__PURE__ */ t(i.Provider, { value: o, children: /* @__PURE__ */ t(s.Group, { ...e, className: m(c["tedi-select__group"]), children: e.children }) });
+};
+a.displayName = "SelectGroup";
 export {
-  p as SelectGroup
+  a as SelectGroup
 };

package/src/tedi/components/form/select/components/select-menu-list.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"),l=require("../select.module.scss.cjs.js"),c=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),n=({renderMessageListFooter:s,...e})=>t.jsxs("div",{className:l.default["tedi-select__menu-list-wrapper"],children:[t.jsx(c.c.MenuList,{...e,className:i.default(e.className,l.default["tedi-select__menu-list"]),children:e.children}),s&&t.jsx("div",{className:l.default["tedi-select__menu-list-footer"],children:s(e)})]});exports.SelectMenuList=n;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("react/jsx-runtime"),u=require("../../../../../../external/classnames/index.cjs.js"),t=require("../select.module.scss.cjs.js"),a=require("../../../../../../external/react-select/dist/index-641ee5b8.esm.cjs.js"),d=({renderMessageListFooter:l,...e})=>{const{keyboardMode:s,exitKeyboardMode:c,dropdownType:n}=e.selectProps;return i.jsxs("div",{className:t.default["tedi-select__menu-list-wrapper"],onMouseMove:s?c:void 0,children:[i.jsx(a.c.MenuList,{...e,className:u.default(e.className,t.default["tedi-select__menu-list"],{[t.default["tedi-select__menu-list--keyboard"]]:s,[t.default["tedi-select__menu-list--grid"]]:n==="grid"}),children:e.children}),l&&i.jsx("div",{className:t.default["tedi-select__menu-list-footer"],children:l(e)})]})};d.displayName="SelectMenuList";exports.SelectMenuList=d;