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

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

@@ -1,167 +1,257 @@
-import { jsx as l, jsxs as w } from "react/jsx-runtime";
-import Oe from "../../../../../external/classnames/index.es.js";
-import c, { forwardRef as ve } from "react";
-import Ce from "../../../../../external/react-select/dist/react-select.esm.es.js";
-import Le from "../../../../../external/react-select/async/dist/react-select-async.esm.es.js";
-import { FeedbackText as he } from "../feedback-text/feedback-text.es.js";
-import { FormLabel as ye } from "../form-label/form-label.es.js";
-import { useOptionalInputGroup as Ne } from "../input-group/input-group.es.js";
-import { SelectClearIndicator as Ve } from "./components/select-clear-indicator.es.js";
-import { SelectControl as Re } from "./components/select-control.es.js";
-import { SelectDropDownIndicator as we } from "./components/select-dropdown-indicator.es.js";
-import { SelectGroup as _e } from "./components/select-group.es.js";
-import { SelectGroupHeading as $e } from "./components/select-group-heading.es.js";
-import { SelectIndicatorsContainer as xe } from "./components/select-indicators-container.es.js";
-import { SelectInput as He } from "./components/select-input.es.js";
-import { SelectLoadingIndicator as Pe } from "./components/select-loading-indicator.es.js";
-import { SelectMenu as Te } from "./components/select-menu.es.js";
-import { SelectMenuList as De } from "./components/select-menu-list.es.js";
-import { SelectMenuPortal as Fe } from "./components/select-menu-portal.es.js";
-import { SelectMultiValue as je } from "./components/select-multi-value.es.js";
-import { SelectMultiValueRemove as ke } from "./components/select-multi-value-remove.es.js";
-import { SelectOption as Ee } from "./components/select-option.es.js";
-import { SelectValueContainer as Be } from "./components/select-value-container.es.js";
-import o from "./select.module.scss.es.js";
-import { useLabels as Ge } from "../../../providers/label-provider/use-labels.es.js";
-const qe = ve(
-  (g, _) => {
-    var R;
+import { jsx as C, jsxs as q } from "react/jsx-runtime";
+import W from "../../../../../external/classnames/index.es.js";
+import r, { forwardRef as Je } from "react";
+import Qe from "../../../../../external/react-select/dist/react-select.esm.es.js";
+import Ye from "../../../../../external/react-select/async/dist/react-select-async.esm.es.js";
+import { FeedbackText as Ze } from "../feedback-text/feedback-text.es.js";
+import { FormLabel as et } from "../form-label/form-label.es.js";
+import { useOptionalInputGroup as tt } from "../input-group/input-group.es.js";
+import ot from "../input-group/input-group.module.scss.es.js";
+import { SELECT_ALL_VALUE as v, GROUP_OPTION_PREFIX as lt, areAllSelected as X, getEnabledOptions as J, isGroupSentinel as Q } from "./components/select-bulk-helpers.es.js";
+import { SelectClearIndicator as nt } from "./components/select-clear-indicator.es.js";
+import { SelectControl as st } from "./components/select-control.es.js";
+import { SelectDropDownIndicator as rt } from "./components/select-dropdown-indicator.es.js";
+import { SelectGroup as at } from "./components/select-group.es.js";
+import { SelectGroupHeading as it } from "./components/select-group-heading.es.js";
+import { SelectIndicatorsContainer as ut } from "./components/select-indicators-container.es.js";
+import { SelectInput as ct } from "./components/select-input.es.js";
+import { SelectLoadingIndicator as dt } from "./components/select-loading-indicator.es.js";
+import { SelectMenu as pt } from "./components/select-menu.es.js";
+import { SelectMenuList as mt } from "./components/select-menu-list.es.js";
+import { SelectMenuPortal as ft } from "./components/select-menu-portal.es.js";
+import { SelectMultiValue as gt } from "./components/select-multi-value.es.js";
+import { SelectMultiValueRemove as bt } from "./components/select-multi-value-remove.es.js";
+import { SelectOption as St } from "./components/select-option.es.js";
+import { SelectSingleValue as vt } from "./components/select-single-value.es.js";
+import { SelectValueContainer as yt } from "./components/select-value-container.es.js";
+import p from "./select.module.scss.es.js";
+import { useLabels as Mt } from "../../../providers/label-provider/use-labels.es.js";
+const ht = Je(
+  (k, Y) => {
+    var z;
     const {
-      options: $,
-      defaultOptions: x,
-      id: S,
-      name: H,
-      iconName: P = "arrow_drop_down",
-      label: T,
-      required: b,
+      options: u,
+      defaultOptions: Z,
+      id: _,
+      name: ee,
+      iconName: te = "arrow_drop_down",
+      label: oe,
+      required: R,
       value: D,
-      defaultValue: F,
-      tagsDirection: M = "row",
-      onChange: d,
-      onInputChange: j,
-      inputValue: k,
-      loadOptions: E,
-      isLoading: B,
-      openMenuOnFocus: G = !1,
-      openMenuOnClick: q = !0,
-      tabSelectsValue: z = !1,
-      disabled: I = !1,
-      className: O,
-      hideLabel: A = !1,
-      helper: t,
-      placeholder: W,
-      invalid: J,
-      valid: K,
-      size: m,
-      async: Q = !1,
-      renderOption: U,
-      renderMessageListFooter: v,
-      noOptionsMessage: X,
-      loadingMessage: Y,
-      multiple: u = !1,
-      closeMenuOnSelect: Z = !u,
-      blurInputOnSelect: C = !1,
-      autoFocus: ee = !1,
-      isClearable: te = !0,
-      isClearIndicatorVisible: oe = !1,
-      isSearchable: L = !0,
-      menuIsOpen: ae,
-      onMenuClose: ne,
-      onMenuOpen: re,
-      onBlur: se,
-      inputIsHidden: ie,
-      isTagRemovable: h = !1,
-      optionGroupHeadingText: le = { modifiers: "small", color: "tertiary" },
-      cacheOptions: ce = !0,
-      showRadioButtons: de = !1,
-      renderWithoutLabel: me,
-      tooltip: ue,
-      classNames: y
-    } = g, a = (R = Ne) == null ? void 0 : R(), pe = c.useId(), fe = a == null ? void 0 : a.hasExternalLabel, p = g.id ?? (a == null ? void 0 : a.inputId) ?? pe, N = t ? (t == null ? void 0 : t.id) ?? `${p}-helper` : void 0, r = c.useRef(null), { getLabel: V } = Ge();
-    c.useImperativeHandle(
-      _,
-      () => r.current
+      defaultValue: N,
+      tagsDirection: L = "stack",
+      onChange: V,
+      onInputChange: le,
+      inputValue: ne,
+      loadOptions: se,
+      isLoading: re,
+      openMenuOnFocus: ae = !1,
+      openMenuOnClick: ie = !0,
+      tabSelectsValue: ue = !1,
+      disabled: F = !1,
+      className: ce,
+      hideLabel: de = !1,
+      helper: a,
+      placeholder: pe,
+      invalid: me,
+      valid: fe,
+      size: w,
+      async: ge = !1,
+      renderOption: be,
+      renderMessageListFooter: x,
+      noOptionsMessage: Se,
+      loadingMessage: ve,
+      multiple: y = !1,
+      showSelectAll: G = !1,
+      selectableGroups: P = !1,
+      dropdownType: ye = "menu",
+      renderValue: Me,
+      closeMenuOnSelect: he = !y,
+      blurInputOnSelect: T = !1,
+      autoFocus: Ie = !1,
+      isClearable: Oe = !0,
+      isClearIndicatorVisible: Ce = !1,
+      isSearchable: $ = !0,
+      menuIsOpen: Le,
+      onMenuClose: Ve,
+      onMenuOpen: we,
+      onBlur: Ae,
+      inputIsHidden: ke,
+      isTagRemovable: _e = !1,
+      backspaceRemovesValue: Re = !1,
+      optionGroupHeadingText: De = { modifiers: "small", color: "tertiary" },
+      cacheOptions: Ne = !0,
+      showRadioButtons: Fe = !1,
+      renderWithoutLabel: xe,
+      tooltip: Ge,
+      classNames: E
+    } = k, m = (z = tt) == null ? void 0 : z(), Pe = r.useId(), Te = m == null ? void 0 : m.hasExternalLabel, A = k.id ?? (m == null ? void 0 : m.inputId) ?? Pe, H = a ? (a == null ? void 0 : a.id) ?? `${A}-helper` : void 0, h = r.useRef(null), { getLabel: I } = Mt();
+    r.useImperativeHandle(
+      Y,
+      () => h.current
     );
-    const ge = (n) => {
-      d == null || d(n), !C && r.current && setTimeout(() => {
-        var s, i;
-        return (i = (s = r.current) == null ? void 0 : s.inputRef) == null ? void 0 : i.focus();
+    const g = !!G && y, [$e, Ee] = r.useState(N ?? null), j = D !== void 0, f = j ? D : $e, c = r.useMemo(() => Array.isArray(f) ? f : f ? [f] : [], [f]), O = r.useMemo(
+      () => ({ value: v, label: I("select.select-all") }),
+      [I]
+    ), b = !!P && !!y, { groupFlattenedOptions: K, groupSentinelMap: M } = r.useMemo(() => {
+      const t = /* @__PURE__ */ new Map();
+      if (!b || !u || u.length === 0)
+        return { groupFlattenedOptions: null, groupSentinelMap: t };
+      if (!u.some((e) => e && Array.isArray(e.options))) return { groupFlattenedOptions: null, groupSentinelMap: t };
+      const l = [], i = /* @__PURE__ */ new Map();
+      for (const e of u)
+        if (e && Array.isArray(e.options)) {
+          const o = e, n = `${lt}${o.label ?? ""}`, d = o.options.filter((S) => !S.isDisabled);
+          i.set(n, { enabled: d }), l.push({ value: n, label: o.label ?? "" });
+          for (const S of o.options)
+            l.push({
+              ...S,
+              customData: { ...S.customData ?? {}, __tediInGroup: !0 }
+            });
+        } else
+          l.push(e);
+      return { groupFlattenedOptions: l, groupSentinelMap: i };
+    }, [u, b]), He = r.useMemo(() => {
+      let t = K ?? u;
+      return g && t && t.length > 0 && (t = [O, ...t]), t;
+    }, [u, K, g, O]), je = r.useMemo(() => {
+      const t = [];
+      if (b && M.size > 0)
+        for (const [s, l] of M)
+          l.enabled.length > 0 && X(c, l.enabled) && t.push({ value: s, label: "" });
+      if (g) {
+        const s = J(u ?? []);
+        s.length > 0 && X(c, s) && t.push(O);
+      }
+      return t.length === 0 ? f : [...c, ...t];
+    }, [
+      f,
+      c,
+      u,
+      b,
+      M,
+      g,
+      O
+    ]), Ke = (t, s) => {
+      let l = t;
+      const i = s.option;
+      if (b && i && M.has(i.value)) {
+        const e = M.get(i.value).enabled;
+        if (s.action === "select-option") {
+          const o = [...c];
+          for (const n of e)
+            o.some((d) => d.value === n.value) || o.push(n);
+          l = o;
+        } else s.action === "deselect-option" && (l = c.filter((o) => !e.some((n) => n.value === o.value)));
+      } else if (g) {
+        const e = J(u ?? []), o = (i == null ? void 0 : i.value) === v;
+        o && s.action === "select-option" ? l = [...c.filter(
+          (d) => d.value !== v && !e.some((S) => S.value === d.value)
+        ), ...e] : o && s.action === "deselect-option" && (l = c.filter(
+          (n) => n.value !== v && !e.some((d) => d.value === n.value)
+        ));
+      }
+      Array.isArray(l) && (l = l.filter((e) => e.value !== v && !Q(e))), j || Ee(l), V == null || V(l), !T && h.current && setTimeout(() => {
+        var e, o;
+        return (o = (e = h.current) == null ? void 0 : e.inputRef) == null ? void 0 : o.focus();
       }, 0);
-    }, Se = c.useCallback(
-      (n) => /* @__PURE__ */ l(De, { ...n, renderMessageListFooter: v }),
-      [v]
-    ), be = () => {
-      const n = {
-        ClearIndicator: (e) => Ve({ isClearIndicatorVisible: oe, ...e }),
-        DropdownIndicator: () => we({ iconName: P }),
+    }, Ue = r.useCallback(
+      (t, s) => t.data.value === v || Q(t.data) || !s ? !0 : String(t.label).toLowerCase().includes(s.toLowerCase()),
+      []
+    ), [U, B] = r.useState(!1), Be = (t) => {
+      (t.key === "ArrowUp" || t.key === "ArrowDown" || t.key === "Home" || t.key === "End" || t.key === "PageUp" || t.key === "PageDown" || t.key === "Tab") && (U || B(!0));
+    }, ze = r.useCallback(() => {
+      B((t) => t && !1);
+    }, []), qe = r.useCallback(
+      (t) => /* @__PURE__ */ C(mt, { ...t, renderMessageListFooter: x }),
+      [x]
+    ), We = () => {
+      const t = {
+        ClearIndicator: (e) => nt({ isClearIndicatorVisible: Ce, ...e }),
+        DropdownIndicator: () => rt({ iconName: te }),
         IndicatorSeparator: () => null,
-        MenuPortal: Fe,
-        Menu: Te,
-        MenuList: Se,
-        Option: (e) => Ee({ renderOption: U, multiple: u, showRadioButtons: de, ...e }),
-        Control: (e) => Re({ ...e, className: O }),
-        Input: He,
-        MultiValue: (e) => je({ isTagRemovable: h, ...e }),
-        MultiValueRemove: ke,
-        Group: _e,
-        GroupHeading: (e) => $e({ optionGroupHeadingText: le, ...e }),
-        IndicatorsContainer: xe,
-        ValueContainer: Be,
-        LoadingIndicator: Pe
-      }, s = Q ? Le : Ce, i = () => V("select.no-options"), Ie = () => V("select.loading");
-      return /* @__PURE__ */ l(
+        MenuPortal: ft,
+        Menu: pt,
+        MenuList: qe,
+        Option: (e) => St({ renderOption: be, multiple: y, showRadioButtons: Fe, ...e }),
+        Control: st,
+        Input: ct,
+        MultiValue: (e) => gt({ isTagRemovable: _e, ...e }),
+        MultiValueRemove: bt,
+        SingleValue: vt,
+        Group: at,
+        GroupHeading: (e) => it({ optionGroupHeadingText: De, ...e }),
+        IndicatorsContainer: ut,
+        ValueContainer: yt,
+        LoadingIndicator: dt
+      }, s = ge ? Ye : Qe, l = () => I("select.no-options"), i = () => I("select.loading");
+      return /* @__PURE__ */ C(
         s,
         {
-          id: p,
-          "aria-describedby": N,
-          autoFocus: ee,
-          ref: r,
-          instanceId: S,
+          tagsDirection: L,
+          showSelectAll: G,
+          selectableGroups: P,
+          dropdownType: ye,
+          renderValue: Me,
+          keyboardMode: U,
+          exitKeyboardMode: ze,
+          onKeyDown: Be,
+          id: A,
+          "aria-describedby": H,
+          autoFocus: Ie,
+          ref: h,
+          instanceId: _,
           className: "tedi-select__wrapper",
-          name: H,
-          options: $,
-          defaultOptions: x,
-          value: D,
-          defaultValue: F,
-          cacheOptions: ce,
-          onChange: ge,
-          onInputChange: j,
-          onBlur: se,
-          inputValue: k,
-          inputId: `${S}-input`,
-          loadOptions: E,
-          isLoading: B,
-          noOptionsMessage: X || i,
-          loadingMessage: Y || Ie,
+          name: ee,
+          options: He,
+          defaultOptions: Z,
+          value: je,
+          defaultValue: N,
+          cacheOptions: Ne,
+          onChange: Ke,
+          filterOption: g || b ? Ue : void 0,
+          onInputChange: le,
+          onBlur: Ae,
+          inputValue: ne,
+          inputId: `${_}-input`,
+          loadOptions: se,
+          isLoading: re,
+          noOptionsMessage: Se || l,
+          loadingMessage: ve || i,
           classNamePrefix: "select",
-          components: n,
-          isDisabled: I,
-          isSearchable: L,
-          menuIsOpen: ae,
-          openMenuOnFocus: G,
-          openMenuOnClick: q,
-          tabSelectsValue: z,
-          onMenuClose: ne,
-          onMenuOpen: re,
-          placeholder: W || "",
-          isClearable: te,
-          backspaceRemovesValue: h,
+          components: t,
+          isDisabled: F,
+          isSearchable: $,
+          menuIsOpen: Le,
+          openMenuOnFocus: ae,
+          openMenuOnClick: ie,
+          tabSelectsValue: ue,
+          onMenuClose: Ve,
+          onMenuOpen: we,
+          placeholder: pe || "",
+          isClearable: Oe,
+          backspaceRemovesValue: Re,
           menuShouldScrollIntoView: !0,
-          isMulti: u,
+          isMulti: y,
           hideSelectedOptions: !1,
-          closeMenuOnSelect: Z,
-          blurInputOnSelect: C,
+          closeMenuOnSelect: he,
+          blurInputOnSelect: T,
           menuPlacement: "auto",
-          inputIsHidden: ie,
-          required: b,
+          inputIsHidden: ke,
+          required: R,
           menuPortalTarget: document.body,
           menuPosition: "absolute",
-          classNames: y ? Object.fromEntries(
-            Object.entries(y).map(([e, f]) => [
-              e,
-              typeof f == "string" ? () => f : f
-            ])
-          ) : void 0,
+          classNames: (() => {
+            const e = {};
+            if (E)
+              for (const [o, n] of Object.entries(E))
+                e[o] = typeof n == "string" ? () => n : n;
+            if (m) {
+              const o = e.control;
+              e.control = (n) => W(o == null ? void 0 : o(n), ot["tedi-input-group__input"]);
+            }
+            return Object.keys(e).length > 0 ? e : void 0;
+          })(),
           theme: (e) => ({
             ...e,
             colors: {
@@ -179,38 +269,38 @@ const qe = ve(
           }
         }
       );
-    }, Me = Oe(
-      o["tedi-select"],
-      O,
-      { [o["tedi-select--invalid"]]: J || (t == null ? void 0 : t.type) === "error" },
-      { [o["tedi-select--valid"]]: K || (t == null ? void 0 : t.type) === "valid" },
-      { [o[`tedi-select--${m}`]]: m },
-      { [o[`tedi-select--tags-${M}`]]: M },
-      { [o["tedi-select--searchable"]]: L },
-      { [o["tedi-select--disabled"]]: I }
+    }, Xe = W(
+      p["tedi-select"],
+      ce,
+      { [p["tedi-select--invalid"]]: me || (a == null ? void 0 : a.type) === "error" },
+      { [p["tedi-select--valid"]]: fe || (a == null ? void 0 : a.type) === "valid" },
+      { [p[`tedi-select--${w}`]]: w },
+      { [p[`tedi-select--tags-${L}`]]: L },
+      { [p["tedi-select--searchable"]]: $ },
+      { [p["tedi-select--disabled"]]: F }
     );
-    return /* @__PURE__ */ w("div", { "data-name": "select", className: Me, children: [
-      /* @__PURE__ */ w("div", { className: o["tedi-select__inner"], children: [
-        !fe && /* @__PURE__ */ l(
-          ye,
+    return /* @__PURE__ */ q("div", { "data-name": "select", className: Xe, children: [
+      /* @__PURE__ */ q("div", { className: p["tedi-select__inner"], children: [
+        !Te && /* @__PURE__ */ C(
+          et,
           {
-            id: `${p}-input`,
-            label: T,
-            required: b,
-            hideLabel: A,
-            size: m,
-            renderWithoutLabel: me,
-            tooltip: ue
+            id: `${A}-input`,
+            label: oe,
+            required: R,
+            hideLabel: de,
+            size: w,
+            renderWithoutLabel: xe,
+            tooltip: Ge
           }
         ),
-        be()
+        We()
       ] }),
-      t && /* @__PURE__ */ l(he, { ...t, id: N })
+      a && /* @__PURE__ */ C(Ze, { ...a, id: H })
     ] });
   }
 );
-qe.displayName = "Select";
+ht.displayName = "Select";
 export {
-  qe as Select,
-  qe as default
+  ht as Select,
+  ht as default
 };

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

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-select__control":"tedi-select__control-dbce8bb7","tedi-select__value-container":"tedi-select__value-container-253d079a","tedi-select__indicators-container":"tedi-select__indicators-container-0fc8fa2a","tedi-select__input":"tedi-select__input-5525b622","tedi-select--invalid":"tedi-select--invalid-3901c89c","tedi-select__control--focused":"tedi-select__control--focused-0e632efe","tedi-select--valid":"tedi-select--valid-969c0297","tedi-select__arrow":"tedi-select__arrow-94b5ef4a","tedi-select__loading-indicator":"tedi-select__loading-indicator-a35a63ca","tedi-select--disabled":"tedi-select--disabled-2d4b8ddd","tedi-select__menu-portal":"tedi-select__menu-portal-d5349f37","tedi-select__menu":"tedi-select__menu-bf54b75b","tedi-select__menu-list":"tedi-select__menu-list-0aa06e24","tedi-select__menu-list-inner":"tedi-select__menu-list-inner-471e5cf8","tedi-select__menu-list-footer":"tedi-select__menu-list-footer-eb1d3bbc","tedi-select__option":"tedi-select__option-6f811381","tedi-select__option--disabled":"tedi-select__option--disabled-d3aff112","tedi-select__option--focused":"tedi-select__option--focused-1d972ff1","tedi-select__option--selected":"tedi-select__option--selected-a93e5fb0","tedi-select--small":"tedi-select--small-2659608b","tedi-select__multi-value-item":"tedi-select__multi-value-item-b8ec59ae","tedi-select__checkbox":"tedi-select__checkbox-e4f94b67","tedi-select":"tedi-select-8b014852","tedi-select__group":"tedi-select__group-b275e954","tedi-select__group-heading":"tedi-select__group-heading-02b3d9bc","tedi-select__multi-value-clear":"tedi-select__multi-value-clear-d231f7de","tedi-select--tags-row":"tedi-select--tags-row-c9f33e4b","tedi-select--searchable":"tedi-select--searchable-d56eb325","tedi-select--tags-stack":"tedi-select--tags-stack-ddb929a9","tedi-select__separator":"tedi-select__separator-b1045f3f"};exports.default=e;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e={"tedi-select__control":"tedi-select__control-dbce8bb7","tedi-select__value-container":"tedi-select__value-container-253d079a","tedi-select__indicators-container":"tedi-select__indicators-container-0fc8fa2a","tedi-select__input":"tedi-select__input-5525b622","tedi-select":"tedi-select-8b014852","tedi-select--disabled":"tedi-select--disabled-2d4b8ddd","tedi-select--invalid":"tedi-select--invalid-3901c89c","tedi-select--valid":"tedi-select--valid-969c0297","tedi-select__control--focused":"tedi-select__control--focused-0e632efe","tedi-select__arrow":"tedi-select__arrow-94b5ef4a","tedi-select__loading-indicator":"tedi-select__loading-indicator-a35a63ca","tedi-select__dropdown-indicator":"tedi-select__dropdown-indicator-5a948baa","tedi-select__clear-indicator":"tedi-select__clear-indicator-68b60b12","tedi-select__menu-portal":"tedi-select__menu-portal-d5349f37","tedi-select__menu":"tedi-select__menu-bf54b75b","tedi-select__menu-list--grid":"tedi-select__menu-list--grid-393f3232","tedi-select__menu-list":"tedi-select__menu-list-0aa06e24","tedi-select__menu-list-inner":"tedi-select__menu-list-inner-471e5cf8","tedi-select__menu-list-footer":"tedi-select__menu-list-footer-eb1d3bbc","tedi-select__option":"tedi-select__option-6f811381","tedi-select__option--disabled":"tedi-select__option--disabled-d3aff112","tedi-select__option--focused":"tedi-select__option--focused-1d972ff1","tedi-select__option--selected":"tedi-select__option--selected-a93e5fb0","tedi-select--small":"tedi-select--small-2659608b","tedi-select__multi-value-item":"tedi-select__multi-value-item-b8ec59ae","tedi-select__checkbox":"tedi-select__checkbox-e4f94b67","tedi-select__group":"tedi-select__group-b275e954","tedi-select__group-heading":"tedi-select__group-heading-02b3d9bc","tedi-select__group-heading--selectable":"tedi-select__group-heading--selectable-c84cd617","tedi-select__option--indented":"tedi-select__option--indented-bf4a1661","tedi-select__multi-value-clear":"tedi-select__multi-value-clear-d231f7de","tedi-select--tags-row":"tedi-select--tags-row-c9f33e4b","tedi-select__overflow-tag":"tedi-select__overflow-tag-c0391df2","tedi-select__menu-list--keyboard":"tedi-select__menu-list--keyboard-3d066942","tedi-select__select-all":"tedi-select__select-all-12c3e7f1","tedi-select__group-heading-toggle":"tedi-select__group-heading-toggle-34296a63","tedi-select--tags-stack":"tedi-select--tags-stack-ddb929a9","tedi-select__separator":"tedi-select__separator-b1045f3f","tedi-select--searchable":"tedi-select--searchable-d56eb325"};exports.default=e;

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

@@ -3,14 +3,18 @@ const e = {
   "tedi-select__value-container": "tedi-select__value-container-253d079a",
   "tedi-select__indicators-container": "tedi-select__indicators-container-0fc8fa2a",
   "tedi-select__input": "tedi-select__input-5525b622",
+  "tedi-select": "tedi-select-8b014852",
+  "tedi-select--disabled": "tedi-select--disabled-2d4b8ddd",
   "tedi-select--invalid": "tedi-select--invalid-3901c89c",
-  "tedi-select__control--focused": "tedi-select__control--focused-0e632efe",
   "tedi-select--valid": "tedi-select--valid-969c0297",
+  "tedi-select__control--focused": "tedi-select__control--focused-0e632efe",
   "tedi-select__arrow": "tedi-select__arrow-94b5ef4a",
   "tedi-select__loading-indicator": "tedi-select__loading-indicator-a35a63ca",
-  "tedi-select--disabled": "tedi-select--disabled-2d4b8ddd",
+  "tedi-select__dropdown-indicator": "tedi-select__dropdown-indicator-5a948baa",
+  "tedi-select__clear-indicator": "tedi-select__clear-indicator-68b60b12",
   "tedi-select__menu-portal": "tedi-select__menu-portal-d5349f37",
   "tedi-select__menu": "tedi-select__menu-bf54b75b",
+  "tedi-select__menu-list--grid": "tedi-select__menu-list--grid-393f3232",
   "tedi-select__menu-list": "tedi-select__menu-list-0aa06e24",
   "tedi-select__menu-list-inner": "tedi-select__menu-list-inner-471e5cf8",
   "tedi-select__menu-list-footer": "tedi-select__menu-list-footer-eb1d3bbc",
@@ -21,14 +25,19 @@ const e = {
   "tedi-select--small": "tedi-select--small-2659608b",
   "tedi-select__multi-value-item": "tedi-select__multi-value-item-b8ec59ae",
   "tedi-select__checkbox": "tedi-select__checkbox-e4f94b67",
-  "tedi-select": "tedi-select-8b014852",
   "tedi-select__group": "tedi-select__group-b275e954",
   "tedi-select__group-heading": "tedi-select__group-heading-02b3d9bc",
+  "tedi-select__group-heading--selectable": "tedi-select__group-heading--selectable-c84cd617",
+  "tedi-select__option--indented": "tedi-select__option--indented-bf4a1661",
   "tedi-select__multi-value-clear": "tedi-select__multi-value-clear-d231f7de",
   "tedi-select--tags-row": "tedi-select--tags-row-c9f33e4b",
-  "tedi-select--searchable": "tedi-select--searchable-d56eb325",
+  "tedi-select__overflow-tag": "tedi-select__overflow-tag-c0391df2",
+  "tedi-select__menu-list--keyboard": "tedi-select__menu-list--keyboard-3d066942",
+  "tedi-select__select-all": "tedi-select__select-all-12c3e7f1",
+  "tedi-select__group-heading-toggle": "tedi-select__group-heading-toggle-34296a63",
   "tedi-select--tags-stack": "tedi-select--tags-stack-ddb929a9",
-  "tedi-select__separator": "tedi-select__separator-b1045f3f"
+  "tedi-select__separator": "tedi-select__separator-b1045f3f",
+  "tedi-select--searchable": "tedi-select--searchable-d56eb325"
 };
 export {
   e as default

package/src/tedi/components/tags/tag/tag.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),u=require("../../../../../external/classnames/index.cjs.js"),g=require("../../base/icon/icon.cjs.js"),p=require("../../buttons/closing-button/closing-button.cjs.js"),f=require("../../loaders/spinner/spinner.cjs.js"),e=require("./tag.module.scss.cjs.js"),_=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),m=s=>{const{getCurrentBreakpointProps:o}=_.useBreakpointProps(s.defaultServerBreakpoint),{children:n,className:l,onClose:a,isLoading:r=!1,color:i="primary",...c}=o(s),d=u.default(e.default["tedi-tag"],i&&e.default[`tedi-tag--color-${i}`],a&&!r&&e.default["tedi-tag__close"],l);return t.jsxs("div",{className:d,role:"status","aria-live":r?"polite":void 0,...c,children:[i==="danger"&&t.jsx("div",{className:e.default["tedi-tag__icon-wrapper"],children:t.jsx(g.Icon,{name:"info",color:"danger",size:16,className:e.default["tedi-tag__icon--error"]})}),t.jsx("div",{className:e.default["tedi-tag__content"],children:n}),r&&!a&&t.jsx("div",{className:e.default["tedi-tag__icon-wrapper"],children:t.jsx(f.Spinner,{className:e.default["tedi-tag__loader"]})}),!r&&a&&t.jsx(p.ClosingButton,{iconSize:18,onClick:a})]})};exports.Tag=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),g=require("../../../../../external/classnames/index.cjs.js"),p=require("../../base/icon/icon.cjs.js"),f=require("../../buttons/closing-button/closing-button.cjs.js"),_=require("../../loaders/spinner/spinner.cjs.js"),e=require("./tag.module.scss.cjs.js"),m=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),j=s=>{const{getCurrentBreakpointProps:i}=m.useBreakpointProps(s.defaultServerBreakpoint),{children:n,className:l,onClose:r,closeButtonProps:c,isLoading:a=!1,color:o="primary",...d}=i(s),u=g.default(e.default["tedi-tag"],o&&e.default[`tedi-tag--color-${o}`],r&&!a&&e.default["tedi-tag__close"],l);return t.jsxs("div",{className:u,role:"status","aria-live":a?"polite":void 0,...d,children:[o==="danger"&&t.jsx("div",{className:e.default["tedi-tag__icon-wrapper"],children:t.jsx(p.Icon,{name:"info",color:"danger",size:16,className:e.default["tedi-tag__icon--error"]})}),t.jsx("div",{className:e.default["tedi-tag__content"],children:n}),a&&!r&&t.jsx("div",{className:e.default["tedi-tag__icon-wrapper"],children:t.jsx(_.Spinner,{className:e.default["tedi-tag__loader"]})}),!a&&r&&t.jsx(f.ClosingButton,{iconSize:18,...c,onClick:r})]})};exports.Tag=j;

package/src/tedi/components/tags/tag/tag.d.ts

@@ -1,5 +1,6 @@
 import { MouseEventHandler } from 'react';
 import { BreakpointSupport } from '../../../helpers';
+import { ClosingButtonProps } from '../../buttons/closing-button/closing-button';
 type TagColor = 'primary' | 'secondary' | 'danger';
 type TagBreakpointProps = {
     /**
@@ -24,6 +25,13 @@ export interface TagProps extends BreakpointSupport<TagBreakpointProps> {
      * If provided, a close button will be rendered inside the Tag.
      */
     onClose?: MouseEventHandler<HTMLButtonElement>;
+    /**
+     * Extra props forwarded to the inner close button (when `onClose` is set).
+     * Lets consumers wire up keyboard handlers, tab focus, or event isolation
+     * without reaching past the Tag API. `onClick` and `iconSize` are owned by
+     * Tag and can't be overridden here.
+     */
+    closeButtonProps?: Omit<ClosingButtonProps, 'onClick' | 'iconSize'>;
     /**
      * Determines whether the Tag is in a loading state
      * @default false

package/src/tedi/components/tags/tag/tag.es.js

@@ -1,29 +1,30 @@
-import { jsxs as d, jsx as o } from "react/jsx-runtime";
-import p from "../../../../../external/classnames/index.es.js";
-import { Icon as g } from "../../base/icon/icon.es.js";
-import { ClosingButton as _ } from "../../buttons/closing-button/closing-button.es.js";
-import { Spinner as f } from "../../loaders/spinner/spinner.es.js";
+import { jsxs as p, jsx as o } from "react/jsx-runtime";
+import g from "../../../../../external/classnames/index.es.js";
+import { Icon as _ } from "../../base/icon/icon.es.js";
+import { ClosingButton as f } from "../../buttons/closing-button/closing-button.es.js";
+import { Spinner as N } from "../../loaders/spinner/spinner.es.js";
 import e from "./tag.module.scss.es.js";
-import { useBreakpointProps as N } from "../../../helpers/hooks/use-breakpoint-props.es.js";
+import { useBreakpointProps as u } from "../../../helpers/hooks/use-breakpoint-props.es.js";
 const S = (a) => {
-  const { getCurrentBreakpointProps: s } = N(a.defaultServerBreakpoint), {
+  const { getCurrentBreakpointProps: s } = u(a.defaultServerBreakpoint), {
     children: n,
     className: c,
     onClose: r,
+    closeButtonProps: l,
     isLoading: t = !1,
     color: i = "primary",
-    ...l
-  } = s(a), m = p(
+    ...m
+  } = s(a), d = g(
     e["tedi-tag"],
     i && e[`tedi-tag--color-${i}`],
     r && !t && e["tedi-tag__close"],
     c
   );
-  return /* @__PURE__ */ d("div", { className: m, role: "status", "aria-live": t ? "polite" : void 0, ...l, children: [
-    i === "danger" && /* @__PURE__ */ o("div", { className: e["tedi-tag__icon-wrapper"], children: /* @__PURE__ */ o(g, { name: "info", color: "danger", size: 16, className: e["tedi-tag__icon--error"] }) }),
+  return /* @__PURE__ */ p("div", { className: d, role: "status", "aria-live": t ? "polite" : void 0, ...m, children: [
+    i === "danger" && /* @__PURE__ */ o("div", { className: e["tedi-tag__icon-wrapper"], children: /* @__PURE__ */ o(_, { name: "info", color: "danger", size: 16, className: e["tedi-tag__icon--error"] }) }),
     /* @__PURE__ */ o("div", { className: e["tedi-tag__content"], children: n }),
-    t && !r && /* @__PURE__ */ o("div", { className: e["tedi-tag__icon-wrapper"], children: /* @__PURE__ */ o(f, { className: e["tedi-tag__loader"] }) }),
-    !t && r && /* @__PURE__ */ o(_, { iconSize: 18, onClick: r })
+    t && !r && /* @__PURE__ */ o("div", { className: e["tedi-tag__icon-wrapper"], children: /* @__PURE__ */ o(N, { className: e["tedi-tag__loader"] }) }),
+    !t && r && /* @__PURE__ */ o(f, { iconSize: 18, ...l, onClick: r })
   ] });
 };
 export {