@tedi-design-system/react 17.1.0-rc.7 → 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/form/textfield/textfield.cjs.js

@@ -1 +1 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),p=require("../../../../../external/classnames/index.cjs.js"),i=require("react"),H=require("../../base/icon/icon.cjs.js"),be=require("../../buttons/closing-button/closing-button.cjs.js"),ve=require("../../misc/separator/separator.cjs.js"),K=require("../feedback-text/feedback-text.cjs.js"),pe=require("../field/field.cjs.js"),_e=require("../form-label/form-label.cjs.js"),k=require("../input-group/input-group.cjs.js"),r=require("./textfield.module.scss.cjs.js"),he=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),ge=require("../../../providers/label-provider/use-labels.cjs.js"),je={large:24,default:18},I=i.forwardRef((_,O)=>{var V;const{getCurrentBreakpointProps:D}=he.useBreakpointProps(_.defaultServerBreakpoint),{id:Ae,label:h,className:U,inputClassName:J,disabled:c,required:q,hideLabel:C,invalid:u,readOnly:B,icon:s,onIconClick:g,iconButtonProps:y,size:d="default",placeholder:Q,isArrowsHidden:W=!0,isClearable:F,onClear:b,onChange:o,onChangeEvent:X,onKeyUp:Y,onKeyDown:Z,onKeyPress:G,defaultValue:S,value:j,onFocus:A,onBlur:N,onClick:ee,helper:e,input:n,name:te,isTextArea:re,startSlot:ae,endSlot:le,...ie}=D(_)||{},{getLabel:T}=ge.useLabels(),w=i.useRef(null),L=i.useRef(null),[se,R]=i.useState(j??S??""),M=j??se,f=!!(F&&M&&!B),x=(V=k.useOptionalInputGroup)==null?void 0:V.call(k),ne=i.useId(),de=x==null?void 0:x.hasExternalLabel,m=_.id??(x==null?void 0:x.inputId)??ne;i.useImperativeHandle(O,()=>({get input(){return L.current},get inner(){return w.current}}));const z=i.useMemo(()=>Array.isArray(e)?u||e.some(t=>t.type==="error"):u||(e==null?void 0:e.type)==="error",[u,e]),oe=i.useMemo(()=>!e||Array.isArray(e)&&e.length===0?!1:Array.isArray(e)?!u&&e.every(t=>t.type==="valid"):!u&&e.type==="valid",[u,e]),ce=d==="large"?"default":d,v=j!==void 0,ue=i.useCallback(t=>{v||R(t),o==null||o(t)},[v,o]),P=i.useCallback(()=>{v||R(""),o==null||o(""),b==null||b()},[v,o,b]),$=i.useCallback(()=>{if(!s)return null;const t={size:d==="large"?24:d==="small"?16:18,className:r.default["tedi-textfield__icon"]},l=typeof s=="string"?{...t,name:s}:{...t,...s,className:p.default(t.className,s.className)};return g?a.jsx("button",{type:"button",...y,className:p.default(r.default["tedi-textfield__icon-wrapper"],y==null?void 0:y.className),onClick:c?void 0:g,disabled:c,children:a.jsx(H.Icon,{...l})}):a.jsx("div",{className:r.default["tedi-textfield__icon-wrapper"],"aria-hidden":"true",children:a.jsx(H.Icon,{...l})})},[s,d,g,y,c]),E=i.useMemo(()=>f?a.jsx(be.ClosingButton,{iconSize:je[d==="large"?"large":"default"],onClick:c?void 0:P,disabled:c,title:T("clear"),className:r.default["tedi-textfield__clear-button"]}):null,[f,d,c,P,T]),fe=i.useMemo(()=>!f&&!s?null:a.jsxs("div",{className:r.default["tedi-textfield__right-area"],children:[E,f&&s&&a.jsx(ve.Separator,{color:"primary",axis:"vertical",className:r.default["tedi-textfield__separator"]}),s&&$()]}),[f,s,E,$]),xe=a.jsx(pe.Field,{...n,id:m,name:te,value:M,defaultValue:S,onChange:ue,onChangeEvent:X,disabled:c,readOnly:B,required:q,invalid:z,placeholder:Q,className:p.default(r.default["tedi-textfield__input"],J,{[r.default["tedi-textfield__input--hidden-arrows"]]:W}),onFocus:t=>{var l;(l=n==null?void 0:n.onFocus)==null||l.call(n,t),A==null||A(t)},onBlur:t=>{var l;(l=n==null?void 0:n.onBlur)==null||l.call(n,t),N==null||N(t)},isTextArea:re,"aria-describedby":!e||Array.isArray(e)&&e.length===0?void 0:Array.isArray(e)?e.map((t,l)=>`${m}-helper-${l}`).join(" "):`${m}-helper`,"aria-label":C&&typeof h=="string"?h:void 0,ref:L}),me=p.default(r.default["tedi-textfield"],{[r.default[`tedi-textfield--${d}`]]:d},{[r.default["tedi-textfield--with-icon"]]:s},{[r.default["tedi-textfield--invalid"]]:z},{[r.default["tedi-textfield--valid"]]:oe},{[r.default["tedi-textfield--clearable"]]:f},U),ye=()=>!e||Array.isArray(e)&&e.length===0?null:a.jsx("div",{className:r.default["tedi-textfield__feedback-wrapper"],children:Array.isArray(e)?e.map((t,l)=>a.jsx(K.FeedbackText,{...t,id:`${m}-helper-${l}`},l)):a.jsx(K.FeedbackText,{...e,id:`${m}-helper`})});return a.jsxs("div",{"data-name":"textfield",...ie,className:me,children:[!de&&a.jsx(_e.FormLabel,{id:m,label:h,required:q,hideLabel:C,size:ce}),a.jsxs("div",{className:r.default["tedi-textfield__inner"],onKeyDown:Z,onKeyUp:Y,onKeyPress:G,onClick:ee,ref:w,children:[ae,xe,le,(F||s)&&fe]}),ye()]})});I.displayName="TextField";exports.TextField=I;exports.default=I;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("react/jsx-runtime"),_=require("../../../../../external/classnames/index.cjs.js"),l=require("react"),O=require("../../base/icon/icon.cjs.js"),pe=require("../../buttons/closing-button/closing-button.cjs.js"),_e=require("../../misc/separator/separator.cjs.js"),D=require("../feedback-text/feedback-text.cjs.js"),he=require("../field/field.cjs.js"),ge=require("../form-label/form-label.cjs.js"),k=require("../input-group/input-group.cjs.js"),r=require("./textfield.module.scss.cjs.js"),Ie=require("../../../helpers/hooks/use-breakpoint-props.cjs.js"),je=require("../../../providers/label-provider/use-labels.cjs.js"),Ae={large:24,default:18},q=l.forwardRef((h,U)=>{var H;const{getCurrentBreakpointProps:J}=Ie.useBreakpointProps(h.defaultServerBreakpoint),{id:Ne,label:g,className:Q,inputClassName:W,disabled:c,required:C,hideLabel:S,invalid:u,readOnly:B,icon:i,onIconClick:b,iconButtonProps:y,size:d="default",placeholder:X,isArrowsHidden:Y=!0,isClearable:F,onClear:v,onChange:o,onChangeEvent:Z,onKeyUp:G,onKeyDown:ee,onKeyPress:te,defaultValue:T,value:I,onFocus:j,onBlur:A,onClick:re,helper:e,input:s,name:ae,isTextArea:le,startSlot:ie,endSlot:se,...ne}=J(h)||{},{getLabel:w}=je.useLabels(),z=l.useRef(null),L=l.useRef(null),[de,R]=l.useState(I??T??""),M=I??de,f=!!(F&&M&&!B),x=(H=k.useOptionalInputGroup)==null?void 0:H.call(k),oe=l.useId(),ce=x==null?void 0:x.hasExternalLabel,m=h.id??(x==null?void 0:x.inputId)??oe;l.useImperativeHandle(U,()=>({get input(){return L.current},get inner(){return z.current}}));const P=l.useMemo(()=>Array.isArray(e)?u||e.some(t=>t.type==="error"):u||(e==null?void 0:e.type)==="error",[u,e]),ue=l.useMemo(()=>!e||Array.isArray(e)&&e.length===0?!1:Array.isArray(e)?!u&&e.every(t=>t.type==="valid"):!u&&e.type==="valid",[u,e]),fe=d==="large"?"default":d,p=I!==void 0,xe=l.useCallback(t=>{p||R(t),o==null||o(t)},[p,o]),$=l.useCallback(()=>{p||R(""),o==null||o(""),v==null||v()},[p,o,v]),E=l.useCallback(()=>{if(!i)return null;const N={size:d==="large"?24:d==="small"?!!b?18:16:18,className:r.default["tedi-textfield__icon"]},K=typeof i=="string"?{...N,name:i}:{...N,...i,className:_.default(N.className,i.className)};return b?a.jsx("button",{type:"button",...y,className:_.default(r.default["tedi-textfield__icon-wrapper"],y==null?void 0:y.className),onClick:c?void 0:b,disabled:c,children:a.jsx(O.Icon,{...K})}):a.jsx("div",{className:r.default["tedi-textfield__icon-wrapper"],"aria-hidden":"true",children:a.jsx(O.Icon,{...K})})},[i,d,b,y,c]),V=l.useMemo(()=>f?a.jsx(pe.ClosingButton,{iconSize:Ae[d==="large"?"large":"default"],onClick:c?void 0:$,disabled:c,title:w("clear"),className:r.default["tedi-textfield__clear-button"]}):null,[f,d,c,$,w]),me=l.useMemo(()=>!f&&!i?null:a.jsxs("div",{className:r.default["tedi-textfield__right-area"],children:[V,f&&i&&a.jsx(_e.Separator,{color:"primary",axis:"vertical",className:r.default["tedi-textfield__separator"]}),i&&E()]}),[f,i,V,E]),ye=a.jsx(he.Field,{...s,id:m,name:ae,value:M,defaultValue:T,onChange:xe,onChangeEvent:Z,disabled:c,readOnly:B,required:C,invalid:P,placeholder:X,className:_.default(r.default["tedi-textfield__input"],W,{[r.default["tedi-textfield__input--hidden-arrows"]]:Y}),onFocus:t=>{var n;(n=s==null?void 0:s.onFocus)==null||n.call(s,t),j==null||j(t)},onBlur:t=>{var n;(n=s==null?void 0:s.onBlur)==null||n.call(s,t),A==null||A(t)},isTextArea:le,"aria-describedby":!e||Array.isArray(e)&&e.length===0?void 0:Array.isArray(e)?e.map((t,n)=>`${m}-helper-${n}`).join(" "):`${m}-helper`,"aria-label":S&&typeof g=="string"?g:void 0,ref:L}),be=_.default(r.default["tedi-textfield"],{[r.default[`tedi-textfield--${d}`]]:d},{[r.default["tedi-textfield--with-icon"]]:i},{[r.default["tedi-textfield--invalid"]]:P},{[r.default["tedi-textfield--valid"]]:ue},{[r.default["tedi-textfield--clearable"]]:f},Q),ve=()=>!e||Array.isArray(e)&&e.length===0?null:a.jsx("div",{className:r.default["tedi-textfield__feedback-wrapper"],children:Array.isArray(e)?e.map((t,n)=>a.jsx(D.FeedbackText,{...t,id:`${m}-helper-${n}`},n)):a.jsx(D.FeedbackText,{...e,id:`${m}-helper`})});return a.jsxs("div",{"data-name":"textfield",...ne,className:be,children:[!ce&&a.jsx(ge.FormLabel,{id:m,label:g,required:C,hideLabel:S,size:fe}),a.jsxs("div",{className:r.default["tedi-textfield__inner"],onKeyDown:ee,onKeyUp:G,onKeyPress:te,onClick:re,ref:z,children:[ie,ye,se,(F||i)&&me]}),ve()]})});q.displayName="TextField";exports.TextField=q;exports.default=q;