mimir-ui-kit 1.54.0 → 1.54.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (7) hide show
  1. package/dist/assets/Chip.css +1 -1
  2. package/dist/components/Chip/Chip.d.ts +9 -2
  3. package/dist/components/Chip/Chip.js +59 -51
  4. package/dist/components/MultiSelectSearch/MultiSelectSearch.js +230 -216
  5. package/dist/components/MultiSelectSearch/hooks/useMultiSelectState.js +20 -22
  6. package/dist/components/MultiSelectSearch/utils.js +111 -103
  7. package/package.json +1 -1
package/dist/assets/Chip.css CHANGED
@@ -1 +1 @@
1
- ._chip_mrr0l_2{--chip-cursor: default;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--chip-height);color:var(--chip-color);font-size:var(--chip-font-size);line-height:var(--chip-line-height);-webkit-column-gap:var(--mimir-space-2xs);-moz-column-gap:var(--mimir-space-2xs);column-gap:var(--mimir-space-2xs);background-color:var(--chip-bg-color);border-radius:var(--chip-border-radius);cursor:default;cursor:var(--chip-cursor);-webkit-transition:background-color .3s ease,border-color .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;transition:background-color .3s ease,border-color .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-left:var(--chip-space);padding-right:var(--chip-space)}._chip_mrr0l_2._with-action_mrr0l_18{--chip-cursor: pointer}._chip_mrr0l_2._with-action_mrr0l_18:hover{color:var(--chip-color-hover);background-color:var(--chip-bg-color-hover)}._chip_mrr0l_2._with-action_mrr0l_18:active{color:var(--chip-color-active);background-color:var(--chip-bg-color-active)}._chip_mrr0l_2._with-action_mrr0l_18:focus-visible{-webkit-box-shadow:0 0 2px var(--sapphire-normal);box-shadow:0 0 2px var(--sapphire-normal)}._chip_mrr0l_2._with-action_mrr0l_18 svg{color:currentcolor;fill:currentcolor}._chip_mrr0l_2._with-action_mrr0l_18 svg path{color:currentcolor;fill:currentcolor}._chip_mrr0l_2._disabled_mrr0l_40{--chip-color: var(--light-text);--chip-bg-color: var(--disabled);--chip-bg-color-hover: var(--disabled-color);--chip-bg-color-active: var(--disabled-color);--chip-cursor: not-allowed}._chip_mrr0l_2._disabled_mrr0l_40:focus-visible{-webkit-box-shadow:none;box-shadow:none}._chip_mrr0l_2._squareBorder_mrr0l_50{--chip-border-radius: var(--mimir-control-radius)}._xs_mrr0l_54{--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m-s);--chip-height: 24px;--chip-space: var(--mimir-space-xs)}._s_mrr0l_50{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m-s);--chip-height: 28px;--chip-space: var(--mimir-space-s)}._sm_mrr0l_70{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m);--chip-height: 34px;--chip-space: var(--mimir-space-s)}._m_mrr0l_78{--chip-font-size: var(--mimir-size-text-m);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m);--chip-height: 40px;--chip-space: var(--mimir-space-m)}._sapphire_mrr0l_86{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--sapphire-normal);--chip-bg-color-hover: var(--sapphire-hover);--chip-bg-color-active: var(--sapphire-active)}._citrine_mrr0l_95{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--citrine-normal);--chip-bg-color-hover: var(--citrine-hover);--chip-bg-color-active: var(--citrine-active)}._asphalt_mrr0l_104{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--asphalt-normal);--chip-bg-color-hover: var(--asphalt-hover);--chip-bg-color-active: var(--asphalt-active)}._gray_mrr0l_113{--chip-color: var(--dark-text);--chip-color-hover: var(--sapphire-normal);--chip-color-active: var(--light-text);--chip-bg-color: var(--gray-normal);--chip-bg-color-hover: var(--gray-normal);--chip-bg-color-active: var(--gray-active)}._white_mrr0l_122{--chip-color: var(--dark-text);--chip-color-hover: var(--sapphire-normal);--chip-color-active: var(--light-text);--chip-bg-color: var(--white-normal);--chip-bg-color-hover: var(--white-normal);--chip-bg-color-active: var(--white-active)}._green_mrr0l_131{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--green-normal);--chip-bg-color-hover: var(--green-hover);--chip-bg-color-active: var(--green-active)}._green-light_mrr0l_140{--chip-color: var(--green);--chip-color-hover: var(--green);--chip-color-active: var(--green);--chip-bg-color: var(--success-bg-active);--chip-bg-color-hover: var(--success-bg-active);--chip-bg-color-active: var(--success-bg-active)}._green-light_mrr0l_140._xs_mrr0l_54{--chip-space: var(--mimir-space-xs);--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xss1);padding:var(--mimir-space-2xs) var(--mimir-space-xs)}._green-light_mrr0l_140._sm_mrr0l_70{--chip-color: var(--success-normal);--chip-color-hover: var(--success-normal);--chip-color-active: var(--success-normal);--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xss);padding:var(--mimir-space-xs)}._orange-light_mrr0l_163{--chip-color: var(--citrine-100);--chip-color-hover: var(--citrine-100);--chip-color-active: var(--citrine-100);--chip-bg-color: var(--citrine-20);--chip-bg-color-hover: var(--citrine-20);--chip-bg-color-active: var(--citrine-20)}._orange-light_mrr0l_163._xs_mrr0l_54{--chip-space: var(--mimir-space-xs);--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xss1);padding:var(--mimir-space-2xs) var(--mimir-space-xs)}._yellow-light_mrr0l_178{--chip-color: var(--citrine-100);--chip-color-hover: var(--citrine-100);--chip-color-active: var(--citrine-100);--chip-bg-color: var(--alarm-bg-active);--chip-bg-color-hover: var(--alarm-bg-active);--chip-bg-color-active: var(--alarm-bg-active)}._yellow-light_mrr0l_178._sm_mrr0l_70{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xss);padding:var(--mimir-space-xs)}
1
+ ._chip_wsovh_2{--chip-cursor: default;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:var(--chip-height);color:var(--chip-color);font-size:var(--chip-font-size);line-height:var(--chip-line-height);-webkit-column-gap:var(--mimir-space-2xs);-moz-column-gap:var(--mimir-space-2xs);column-gap:var(--mimir-space-2xs);background-color:var(--chip-bg-color);border-radius:var(--chip-border-radius);cursor:default;cursor:var(--chip-cursor);-webkit-transition:background-color .3s ease,border-color .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;transition:background-color .3s ease,border-color .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease;transition:background-color .3s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease,fill .15s ease,-webkit-box-shadow .15s ease;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-left:var(--chip-space);padding-right:var(--chip-space);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}._chip_wsovh_2._with-action_wsovh_19,._chip_wsovh_2._with-interactive_wsovh_19{--chip-cursor: pointer}._chip_wsovh_2._with-action_wsovh_19:hover,._chip_wsovh_2._with-interactive_wsovh_19:hover{color:var(--chip-color-hover);background-color:var(--chip-bg-color-hover)}._chip_wsovh_2._with-action_wsovh_19:active,._chip_wsovh_2._with-interactive_wsovh_19:active{color:var(--chip-color-active);background-color:var(--chip-bg-color-active)}._chip_wsovh_2._with-action_wsovh_19:focus-visible,._chip_wsovh_2._with-interactive_wsovh_19:focus-visible{-webkit-box-shadow:0 0 2px var(--sapphire-normal);box-shadow:0 0 2px var(--sapphire-normal)}._chip_wsovh_2._with-action_wsovh_19 svg,._chip_wsovh_2._with-interactive_wsovh_19 svg{color:currentcolor;fill:currentcolor}._chip_wsovh_2._with-action_wsovh_19 svg path,._chip_wsovh_2._with-interactive_wsovh_19 svg path{color:currentcolor;fill:currentcolor}._chip_wsovh_2._disabled_wsovh_41{--chip-color: var(--light-text);--chip-bg-color: var(--disabled);--chip-bg-color-hover: var(--disabled-color);--chip-bg-color-active: var(--disabled-color);--chip-cursor: not-allowed}._chip_wsovh_2._disabled_wsovh_41:focus-visible{-webkit-box-shadow:none;box-shadow:none}._chip_wsovh_2._squareBorder_wsovh_51{--chip-border-radius: var(--mimir-control-radius)}._xs_wsovh_55{--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m-s);--chip-height: 24px;--chip-space: var(--mimir-space-xs)}._s_wsovh_51{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m-s);--chip-height: 28px;--chip-space: var(--mimir-space-s)}._sm_wsovh_71{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m);--chip-height: 34px;--chip-space: var(--mimir-space-s)}._m_wsovh_79{--chip-font-size: var(--mimir-size-text-m);--chip-line-height: var(--mimir-line-height-text-xs);--chip-border-radius: var(--mimir-control-radius-m);--chip-height: 40px;--chip-space: var(--mimir-space-m)}._sapphire_wsovh_87{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--sapphire-normal);--chip-bg-color-hover: var(--sapphire-hover);--chip-bg-color-active: var(--sapphire-active)}._citrine_wsovh_96{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--citrine-normal);--chip-bg-color-hover: var(--citrine-hover);--chip-bg-color-active: var(--citrine-active)}._asphalt_wsovh_105{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--asphalt-normal);--chip-bg-color-hover: var(--asphalt-hover);--chip-bg-color-active: var(--asphalt-active)}._gray_wsovh_114{--chip-color: var(--dark-text);--chip-color-hover: var(--sapphire-normal);--chip-color-active: var(--light-text);--chip-bg-color: var(--gray-normal);--chip-bg-color-hover: var(--gray-normal);--chip-bg-color-active: var(--gray-active)}._white_wsovh_123{--chip-color: var(--dark-text);--chip-color-hover: var(--sapphire-normal);--chip-color-active: var(--light-text);--chip-bg-color: var(--white-normal);--chip-bg-color-hover: var(--white-normal);--chip-bg-color-active: var(--white-active)}._green_wsovh_132{--chip-color: var(--light-text);--chip-color-hover: var(--light-text);--chip-color-active: var(--light-text);--chip-bg-color: var(--green-normal);--chip-bg-color-hover: var(--green-hover);--chip-bg-color-active: var(--green-active)}._green-light_wsovh_141{--chip-color: var(--green);--chip-color-hover: var(--green);--chip-color-active: var(--green);--chip-bg-color: var(--success-bg-active);--chip-bg-color-hover: var(--success-bg-active);--chip-bg-color-active: var(--success-bg-active)}._green-light_wsovh_141._xs_wsovh_55{--chip-space: var(--mimir-space-xs);--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xss1);padding:var(--mimir-space-2xs) var(--mimir-space-xs)}._green-light_wsovh_141._sm_wsovh_71{--chip-color: var(--success-normal);--chip-color-hover: var(--success-normal);--chip-color-active: var(--success-normal);--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xss);padding:var(--mimir-space-xs)}._orange-light_wsovh_164{--chip-color: var(--citrine-100);--chip-color-hover: var(--citrine-100);--chip-color-active: var(--citrine-100);--chip-bg-color: var(--citrine-20);--chip-bg-color-hover: var(--citrine-20);--chip-bg-color-active: var(--citrine-20)}._orange-light_wsovh_164._xs_wsovh_55{--chip-space: var(--mimir-space-xs);--chip-font-size: var(--mimir-size-text-s);--chip-line-height: var(--mimir-line-height-text-xss1);padding:var(--mimir-space-2xs) var(--mimir-space-xs)}._yellow-light_wsovh_179{--chip-color: var(--citrine-100);--chip-color-hover: var(--citrine-100);--chip-color-active: var(--citrine-100);--chip-bg-color: var(--alarm-bg-active);--chip-bg-color-hover: var(--alarm-bg-active);--chip-bg-color-active: var(--alarm-bg-active)}._yellow-light_wsovh_179._sm_wsovh_71{--chip-font-size: var(--mimir-size-text-l);--chip-line-height: var(--mimir-line-height-text-xss);padding:var(--mimir-space-xs)}
package/dist/components/Chip/Chip.d.ts CHANGED
@@ -1,5 +1,6 @@
1
- import { PropsWithChildren, ReactNode } from 'react';
1
+ import { ReactNode, ElementType, ReactElement } from 'react';
2
2
  import { EChipSize, EChipVariant } from './constants';
3
+ import { Props } from '../../types/propsWithAs';
3
4
 
4
5
  export type TProps = {
5
6
  /**
@@ -34,5 +35,11 @@ export type TProps = {
34
35
  * Квадратные границы
35
36
  */
36
37
  squareBorder?: boolean;
38
+ /**
39
+ * Флаг, указывающий, что чип является интерактивным.
40
+ */
41
+ isInteractive?: boolean;
37
42
  };
38
- export declare const Chip: ({ size, variant, className, disabled, withAction, children, onClose, squareBorder }: PropsWithChildren<TProps>) => import("react/jsx-runtime").JSX.Element;
43
+ type TChipComponent = <C extends ElementType = 'div'>(props: Props<C, TProps>) => ReactElement | ReactNode;
44
+ export declare const Chip: TChipComponent;
45
+ export {};
package/dist/components/Chip/Chip.js CHANGED
@@ -1,53 +1,61 @@
1
- import { jsxs as c, jsx as m } from "react/jsx-runtime";
2
- import { c as h } from "../../index-DIxK0V-G.js";
3
- import { EChipSize as p, EChipVariant as g } from "./constants.js";
4
- import { Button as d } from "../Button/Button.js";
5
- import '../../assets/Chip.css';const u = "_chip_mrr0l_2", w = "_disabled_mrr0l_40", x = "_squareBorder_mrr0l_50", B = "_xs_mrr0l_54", f = "_s_mrr0l_50", y = "_sm_mrr0l_70", C = "_m_mrr0l_78", b = "_sapphire_mrr0l_86", q = "_citrine_mrr0l_95", N = "_asphalt_mrr0l_104", j = "_gray_mrr0l_113", E = "_white_mrr0l_122", S = "_green_mrr0l_131", r = {
6
- chip: u,
7
- "with-action": "_with-action_mrr0l_18",
8
- disabled: w,
9
- squareBorder: x,
10
- xs: B,
11
- s: f,
12
- sm: y,
13
- m: C,
14
- sapphire: b,
15
- citrine: q,
16
- asphalt: N,
17
- gray: j,
18
- white: E,
19
- green: S,
20
- "green-light": "_green-light_mrr0l_140",
21
- "orange-light": "_orange-light_mrr0l_163",
22
- "yellow-light": "_yellow-light_mrr0l_178"
23
- }, M = ({
24
- size: _ = p.M,
25
- variant: e = g.Sapphire,
26
- className: t,
27
- disabled: i,
28
- withAction: s,
29
- children: l,
30
- onClose: o,
31
- squareBorder: a = !1
32
- }) => {
33
- const n = h(
34
- r.chip,
35
- t,
36
- {
37
- [r["with-action"]]: s,
38
- [r.disabled]: i
39
- },
40
- r[e],
41
- r[_],
42
- {
43
- [r.squareBorder]: a
44
- }
45
- );
46
- return /* @__PURE__ */ c("div", { className: n, children: [
47
- l,
48
- s && /* @__PURE__ */ m(d, { isIconButton: !0, iconName: "Close16px", onClick: o, clear: !0 })
49
- ] });
50
- };
1
+ import { jsxs as m, jsx as d } from "react/jsx-runtime";
2
+ import { c as g } from "../../index-DIxK0V-G.js";
3
+ import { forwardRef as u } from "react";
4
+ import { EChipSize as f, EChipVariant as x } from "./constants.js";
5
+ import { Button as B } from "../Button/Button.js";
6
+ import '../../assets/Chip.css';const C = "_chip_wsovh_2", b = "_disabled_wsovh_41", q = "_squareBorder_wsovh_51", y = "_xs_wsovh_55", N = "_s_wsovh_51", j = "_sm_wsovh_71", z = "_m_wsovh_79", E = "_sapphire_wsovh_87", I = "_citrine_wsovh_96", S = "_asphalt_wsovh_105", k = "_gray_wsovh_114", A = "_white_wsovh_123", M = "_green_wsovh_132", s = {
7
+ chip: C,
8
+ "with-action": "_with-action_wsovh_19",
9
+ "with-interactive": "_with-interactive_wsovh_19",
10
+ disabled: b,
11
+ squareBorder: q,
12
+ xs: y,
13
+ s: N,
14
+ sm: j,
15
+ m: z,
16
+ sapphire: E,
17
+ citrine: I,
18
+ asphalt: S,
19
+ gray: k,
20
+ white: A,
21
+ green: M,
22
+ "green-light": "_green-light_wsovh_141",
23
+ "orange-light": "_orange-light_wsovh_164",
24
+ "yellow-light": "_yellow-light_wsovh_179"
25
+ }, G = u(
26
+ (e, t) => {
27
+ const {
28
+ as: i = "div",
29
+ size: r = f.M,
30
+ variant: _ = x.Sapphire,
31
+ className: h,
32
+ disabled: a,
33
+ withAction: o,
34
+ children: n,
35
+ onClose: c,
36
+ squareBorder: l = !1,
37
+ isInteractive: w = !1,
38
+ ...p
39
+ } = e, v = g(
40
+ s.chip,
41
+ h,
42
+ {
43
+ [s["with-action"]]: o,
44
+ [s["with-interactive"]]: w,
45
+ [s.disabled]: a
46
+ },
47
+ s[_],
48
+ s[r],
49
+ {
50
+ [s.squareBorder]: l
51
+ }
52
+ );
53
+ return /* @__PURE__ */ m(i, { ref: t, className: v, ...p, children: [
54
+ n,
55
+ o && /* @__PURE__ */ d(B, { isIconButton: !0, iconName: "Close16px", onClick: c, clear: !0 })
56
+ ] });
57
+ }
58
+ );
51
59
  export {
52
- M as Chip
60
+ G as Chip
53
61
  };
package/dist/components/MultiSelectSearch/MultiSelectSearch.js CHANGED
@@ -1,192 +1,206 @@
1
- import { jsxs as w, jsx as l, Fragment as se } from "react/jsx-runtime";
2
- import { c as z } from "../../index-DIxK0V-G.js";
3
- import { forwardRef as et, useId as tt, useRef as L, useState as nt, useEffect as ie } from "react";
1
+ import { jsxs as v, jsx as c, Fragment as se } from "react/jsx-runtime";
2
+ import { c as C } from "../../index-DIxK0V-G.js";
3
+ import { forwardRef as tt, useId as nt, useRef as L, useState as at, useEffect as ie } from "react";
4
4
  import { EMultiSelectSearchSize as re, ELoadingIndicatorPlacement as D } from "./constants.js";
5
5
  import { useChips as ot } from "./hooks/useChips.js";
6
- import { useDataLoading as at } from "./hooks/useDataLoading.js";
7
- import { useEventHandling as st } from "./hooks/useEventHandling.js";
8
- import { useMenuPlacement as it } from "./hooks/useMenuPlacement.js";
9
- import { useMultiSelectState as rt } from "./hooks/useMultiSelectState.js";
10
- import { u as lt, c as t } from "../../useNestedSelection-bo9wXvE-.js";
11
- import { useRenderVirtualizedList as ct } from "./hooks/useRenderVirtualizedList.js";
12
- import { useSearch as dt } from "./hooks/useSearch.js";
13
- import { useVirtualization as ut } from "./hooks/useVirtualization.js";
14
- import { normalizeDataForNestedSelection as mt, getInitialInputValue as pt, mapSizeToInputSize as le, getDropdownArrowIcon as ft, processNestedSelectionChange as ce, flattenSelectedItems as ht, updateInputValueAfterChange as gt, dispatchMultiselectOpen as R, highlightReactNode as It } from "./utils.js";
15
- import { Icon as St } from "../../icons/Icon.js";
16
- import { Button as Nt } from "../Button/Button.js";
17
- import { I as de } from "../../Input-DgWOCNwP.js";
18
- import { EInputVariant as vt } from "../Input/constants.js";
19
- import { Loader as ue } from "../Loader/Loader.js";
20
- import { H as wt, U as me, G as pe } from "../../combobox-fIVOzEhl.js";
21
- const Jt = et(
22
- (fe, he) => {
6
+ import { useDataLoading as st } from "./hooks/useDataLoading.js";
7
+ import { useEventHandling as it } from "./hooks/useEventHandling.js";
8
+ import { useMenuPlacement as rt } from "./hooks/useMenuPlacement.js";
9
+ import { useMultiSelectState as lt } from "./hooks/useMultiSelectState.js";
10
+ import { u as ct, c as t } from "../../useNestedSelection-bo9wXvE-.js";
11
+ import { useRenderVirtualizedList as dt } from "./hooks/useRenderVirtualizedList.js";
12
+ import { useSearch as ut } from "./hooks/useSearch.js";
13
+ import { useVirtualization as mt } from "./hooks/useVirtualization.js";
14
+ import { normalizeDataForNestedSelection as pt, flattenOptions as ft, updateInputValueAfterChange as le, getInitialInputValue as ht, mapSizeToInputSize as ce, getDropdownArrowIcon as gt, processNestedSelectionChange as de, flattenSelectedItems as It, dispatchMultiselectOpen as R, highlightReactNode as St } from "./utils.js";
15
+ import { Icon as Nt } from "../../icons/Icon.js";
16
+ import { Button as zt } from "../Button/Button.js";
17
+ import { I as ue } from "../../Input-DgWOCNwP.js";
18
+ import { EInputVariant as wt } from "../Input/constants.js";
19
+ import { Loader as me } from "../Loader/Loader.js";
20
+ import { H as vt, U as pe, G as fe } from "../../combobox-fIVOzEhl.js";
21
+ const jt = tt(
22
+ (he, ge) => {
23
23
  const {
24
- placeholder: J,
25
- size: c = re.L,
26
- value: g,
24
+ placeholder: Q,
25
+ size: d = re.L,
26
+ value: I,
27
27
  onChange: s,
28
- full: ge,
29
- showArrow: Ie = !0,
28
+ full: Ie,
29
+ showArrow: Se = !0,
30
30
  items: i = [],
31
- classNameOption: Q,
32
- displayValue: f = "name",
33
- filterOnSearch: Se = !0,
31
+ classNameOption: j,
32
+ displayValue: p = "name",
33
+ filterOnSearch: Ne = !0,
34
34
  onSearch: B,
35
- variant: j = vt.DefaultGray,
36
- menuPlacement: Ne = "bottom",
37
- disabled: d = !1,
35
+ variant: J = wt.DefaultGray,
36
+ menuPlacement: ze = "bottom",
37
+ disabled: u = !1,
38
38
  searchProps: U,
39
39
  withClearButton: P = !1,
40
- withChip: ve = !1,
41
- chipVariant: we = "sapphire",
42
- disableInput: C = !1,
40
+ withChip: we = !1,
41
+ chipVariant: ve = "sapphire",
42
+ disableInput: b = !1,
43
43
  autocomplete: $ = "on",
44
- id: ze,
45
- autoPlacement: Ce = !1,
44
+ id: Ce,
45
+ autoPlacement: be = !1,
46
46
  onIsOpen: M,
47
47
  noOptionsText: ye = "Нет данных",
48
- noMatchText: be = "Ничего не найдено",
49
- loadOnOpen: Oe,
50
- loading: De,
48
+ noMatchText: Oe = "Ничего не найдено",
49
+ loadOnOpen: De,
50
+ loading: Me,
51
51
  loadingIndicatorPlacement: x = D.Both,
52
- groupBy: I,
53
- getGroupTitle: Me = (e) => e,
52
+ groupBy: S,
53
+ getGroupTitle: xe = (e) => e,
54
54
  highlightMatches: k = !1,
55
55
  enableNestedSelection: n = !1,
56
56
  searchInNestedItems: W = !1,
57
57
  useIconInsteadOfCheckbox: K = !1,
58
58
  searchInHeaderGroupItems: A = !1
59
- } = fe, xe = tt(), y = ze || `multiselect-${xe}`, T = L(null), S = L(null), Te = L(!1), X = L(null), [a, Y] = nt(null), Ve = rt({ value: g, displayValue: f }), {
60
- isOpen: m,
61
- setIsOpen: b,
59
+ } = he, Ve = nt(), y = Ce || `multiselect-${Ve}`, V = L(null), N = L(null), Te = L(!1), X = L(null), [a, Y] = at(null), Le = lt({ value: I, displayValue: p }), {
60
+ isOpen: f,
61
+ setIsOpen: O,
62
62
  inputValue: E,
63
- setInputValue: O,
64
- selectedItems: r,
65
- setSelectedItems: N,
66
- expandedOptions: Le,
67
- setExpandedOptions: Re,
68
- internalSearchQuery: v,
63
+ setInputValue: z,
64
+ selectedItems: m,
65
+ setSelectedItems: g,
66
+ expandedOptions: Re,
67
+ setExpandedOptions: Be,
68
+ internalSearchQuery: w,
69
69
  setInternalSearchQuery: F
70
- } = Ve, Be = it({
71
- autoPlacement: Ce,
72
- menuPlacement: Ne,
73
- size: c,
74
- selectSearchRef: T,
75
- isOpen: m
76
- }), { actualMenuPlacement: Pe, isVisible: ke, isMenuReady: Ae, updateMenuPlacement: Z } = Be, Ee = at({ loadOnOpen: Oe, loading: De }), { isLoading: _, handleDataLoading: q } = Ee, Fe = dt({
77
- filterOnSearch: Se,
70
+ } = Le, Pe = rt({
71
+ autoPlacement: be,
72
+ menuPlacement: ze,
73
+ size: d,
74
+ selectSearchRef: V,
75
+ isOpen: f
76
+ }), { actualMenuPlacement: ke, isVisible: Ae, isMenuReady: Ee, updateMenuPlacement: Z } = Pe, Fe = st({ loadOnOpen: De, loading: Me }), { isLoading: _, handleDataLoading: q } = Fe, qe = ut({
77
+ filterOnSearch: Ne,
78
78
  items: n && a ? a.normalizedItems : i,
79
- internalSearchQuery: v,
80
- selectedItems: r,
79
+ internalSearchQuery: w,
80
+ selectedItems: m,
81
81
  enableNestedSelection: n,
82
82
  searchInNestedItems: W,
83
- displayValue: f,
84
- groupBy: I,
83
+ displayValue: p,
84
+ groupBy: S,
85
85
  searchInHeaderGroupItems: A
86
- }), { filteredItems: V } = Fe, qe = ut({
87
- filteredItems: V,
88
- groupBy: I,
89
- getGroupTitle: Me,
90
- size: c,
86
+ }), { filteredItems: T } = qe, Ge = mt({
87
+ filteredItems: T,
88
+ groupBy: S,
89
+ getGroupTitle: xe,
90
+ size: d,
91
91
  parentRef: X
92
- }), { virtualItems: Ge, virtualizer: He } = qe;
92
+ }), { virtualItems: He, virtualizer: Qe } = Ge;
93
93
  ie(() => {
94
94
  if (n && i.length > 0) {
95
- const e = mt(i);
95
+ const e = pt(i);
96
96
  Y(e);
97
97
  } else
98
98
  Y(null);
99
99
  }, [i, n]), ie(() => {
100
- g && (N(g), JSON.stringify(g) !== JSON.stringify(r) && O(pt(g, f)));
101
- }, [g, f, r]);
102
- const Je = (e) => {
100
+ if (I) {
101
+ let e = I;
102
+ n && a && (e = I.map((r) => ft(
103
+ a.normalizedItems
104
+ ).find(
105
+ (l) => l.id === r.id || l.originalId === (r.originalId || r.id) && l.name === r.name
106
+ )).filter(Boolean)), g(e);
107
+ const o = n ? le(
108
+ e,
109
+ n,
110
+ a ? a.normalizedItems : i,
111
+ p
112
+ ) : ht(e, p);
113
+ z(o);
114
+ } else I === null && (g([]), z(""));
115
+ }, [I, p, n, a, i]);
116
+ const je = (e) => {
103
117
  let o = e;
104
118
  if (n && a) {
105
- const { normalizedItems: p } = a;
106
- o = ce(
119
+ const { normalizedItems: l } = a;
120
+ o = de(
107
121
  e,
108
- r,
109
- p
122
+ m,
123
+ l
110
124
  );
111
- } else n && (o = ce(
125
+ } else n && (o = de(
112
126
  e,
113
- r,
127
+ m,
114
128
  i
115
129
  ));
116
- const u = ht(
130
+ const r = It(
117
131
  o,
118
132
  n && a ? a.normalizedItems : i
119
133
  );
120
- N(u), s == null || s(u);
121
- const h = gt(
122
- u,
134
+ g(o), s == null || s(r);
135
+ const h = le(
136
+ r,
123
137
  n,
124
138
  n && a ? a.normalizedItems : i,
125
- f
139
+ p
126
140
  );
127
- O(h), F(""), b(!0), R(y), setTimeout(() => {
128
- if (S.current) {
129
- S.current.focus(), S.current.scrollLeft = S.current.scrollWidth;
130
- const p = h.length;
131
- S.current.setSelectionRange(p, p);
141
+ z(h), F(""), O(!0), R(y), setTimeout(() => {
142
+ if (N.current) {
143
+ N.current.focus(), N.current.scrollLeft = N.current.scrollWidth;
144
+ const l = h.length;
145
+ N.current.setSelectionRange(l, l);
132
146
  }
133
147
  }, 0);
134
148
  }, ee = async (e) => {
135
- var h, p;
136
- if (C) return;
149
+ var h, l;
150
+ if (b) return;
137
151
  const o = e.target.value;
138
- if (O(o), F(((h = o.split(",").pop()) == null ? void 0 : h.trim()) || ""), B == null || B(o), n)
139
- o === "" && r.length > 0 && (N([]), s == null || s([]));
152
+ if (z(o), F(((h = o.split(",").pop()) == null ? void 0 : h.trim()) || ""), B == null || B(o), n)
153
+ o === "" && m.length > 0 && (g([]), s == null || s([]));
140
154
  else {
141
- const _e = o.split(",").map((H) => H.trim()).filter(Boolean), G = i.filter(
142
- (H) => _e.includes(H[f])
155
+ const et = o.split(",").map((H) => H.trim()).filter(Boolean), G = i.filter(
156
+ (H) => et.includes(H[p])
143
157
  );
144
- JSON.stringify(G) !== JSON.stringify(r) && (N(G), s == null || s(G));
158
+ JSON.stringify(G) !== JSON.stringify(m) && (g(G), s == null || s(G));
145
159
  }
146
- m || (b(!0), R(y), await q());
147
- const u = (p = T.current) == null ? void 0 : p.querySelector(
160
+ f || (O(!0), R(y), await q());
161
+ const r = (l = V.current) == null ? void 0 : l.querySelector(
148
162
  `.${t.options}`
149
163
  );
150
- u && typeof u.scrollTo == "function" && u.scrollTo({ top: 0, behavior: "smooth" });
151
- }, Qe = (e) => {
164
+ r && typeof r.scrollTo == "function" && r.scrollTo({ top: 0, behavior: "smooth" });
165
+ }, Je = (e) => {
152
166
  e.preventDefault(), e.currentTarget.focus();
153
167
  const o = e.currentTarget.value.length;
154
168
  e.currentTarget.setSelectionRange(o, o);
155
- }, je = () => {
156
- O(""), F(""), N([]), s == null || s([]);
157
- }, Ue = (e) => {
158
- e.stopPropagation(), je();
169
+ }, Ue = () => {
170
+ z(""), F(""), g([]), s == null || s([]);
171
+ }, $e = (e) => {
172
+ e.stopPropagation(), Ue();
159
173
  }, te = async () => {
160
- Z(), b(!0), R(y), await q();
161
- }, $e = async (e) => {
162
- if (C) {
174
+ Z(), O(!0), R(y), await q();
175
+ }, We = async (e) => {
176
+ if (b) {
163
177
  e.target.blur();
164
178
  return;
165
179
  }
166
180
  await te();
167
181
  }, ne = async () => {
168
- const e = !m;
169
- e && (Z(), R(y), await q()), b(e), M == null || M(e);
170
- }, We = () => {
171
- if (Ie)
182
+ const e = !f;
183
+ e && (Z(), R(y), await q()), O(e), M == null || M(e);
184
+ }, Ke = () => {
185
+ if (Se)
172
186
  return {
173
187
  addonType: "react-node",
174
- addonContent: /* @__PURE__ */ w(se, { children: [
175
- _ && (x === D.Input || x === D.Both) && /* @__PURE__ */ l(ue, { size: "s" }),
176
- /* @__PURE__ */ l(
177
- me,
188
+ addonContent: /* @__PURE__ */ v(se, { children: [
189
+ _ && (x === D.Input || x === D.Both) && /* @__PURE__ */ c(me, { size: "s" }),
190
+ /* @__PURE__ */ c(
191
+ pe,
178
192
  {
179
- className: z(t.button, {
180
- [t.disabled]: d
193
+ className: C(t.button, {
194
+ [t.disabled]: u
181
195
  }),
182
- disabled: d,
196
+ disabled: u,
183
197
  onMouseDown: ne,
184
- children: /* @__PURE__ */ l(
185
- St,
198
+ children: /* @__PURE__ */ c(
199
+ Nt,
186
200
  {
187
- iconName: c == re.M ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
188
- className: z(t["selector-icon"], {
189
- [t["selector-icon-open"]]: m
201
+ iconName: d == re.M ? "DropdownArrowBottom16px" : "DropdownArrowDown24px",
202
+ className: C(t["selector-icon"], {
203
+ [t["selector-icon-open"]]: f
190
204
  })
191
205
  }
192
206
  )
@@ -194,130 +208,130 @@ const Jt = et(
194
208
  )
195
209
  ] })
196
210
  };
197
- }, Ke = () => _ && (x === D.Dropdown || x === D.Both) ? /* @__PURE__ */ w("div", { className: t.loader, children: [
198
- /* @__PURE__ */ l(ue, { size: "s" }),
211
+ }, Xe = () => _ && (x === D.Dropdown || x === D.Both) ? /* @__PURE__ */ v("div", { className: t.loader, children: [
212
+ /* @__PURE__ */ c(me, { size: "s" }),
199
213
  "Загрузка..."
200
- ] }) : ye, oe = (e) => {
214
+ ] }) : ye, ae = (e) => {
201
215
  let o = e.name;
202
- const u = e.bottom && /* @__PURE__ */ l("div", { children: e.bottom });
203
- if (k && v && !(I && A)) {
204
- const h = v.toLowerCase();
205
- (typeof e.name == "string" ? e.name : String(e.name || "")).toLowerCase().includes(h) && (o = It(
216
+ const r = e.bottom && /* @__PURE__ */ c("div", { children: e.bottom });
217
+ if (k && w && !(S && A)) {
218
+ const h = w.toLowerCase();
219
+ (typeof e.name == "string" ? e.name : String(e.name || "")).toLowerCase().includes(h) && (o = St(
206
220
  e.name,
207
- v,
221
+ w,
208
222
  t["highlighted-text"]
209
223
  ));
210
224
  }
211
- return /* @__PURE__ */ w(se, { children: [
225
+ return /* @__PURE__ */ v(se, { children: [
212
226
  o,
213
- u
227
+ r
214
228
  ] });
215
- }, Xe = lt({
216
- filteredItems: V,
217
- selectedItems: r,
218
- expandedOptions: Le,
219
- setExpandedOptions: Re,
220
- size: c,
221
- classNameOption: Q,
229
+ }, Ye = ct({
230
+ filteredItems: T,
231
+ selectedItems: m,
232
+ expandedOptions: Re,
233
+ setExpandedOptions: Be,
234
+ size: d,
235
+ classNameOption: j,
222
236
  items: n && a ? a.normalizedItems : i,
223
237
  enableNestedSelection: n,
224
238
  searchInNestedItems: W,
225
- internalSearchQuery: v,
226
- renderOptionContent: oe,
227
- groupBy: I,
239
+ internalSearchQuery: w,
240
+ renderOptionContent: ae,
241
+ groupBy: S,
228
242
  useIconInsteadOfCheckbox: K,
229
243
  highlightMatches: k
230
- }), { renderNestedOptions: Ye } = Xe, ae = ot({
231
- selectedItems: r,
244
+ }), { renderNestedOptions: Ze } = Ye, oe = ot({
245
+ selectedItems: m,
232
246
  enableNestedSelection: n,
233
- size: c,
234
- chipVariant: we,
247
+ size: d,
248
+ chipVariant: ve,
235
249
  items: n && a ? a.normalizedItems : i,
236
- displayValue: f,
237
- setSelectedItems: N,
250
+ displayValue: p,
251
+ setSelectedItems: g,
238
252
  onChange: s,
239
- setInputValue: O
253
+ setInputValue: z
240
254
  });
241
- st({
242
- isOpen: m,
243
- setIsOpen: b,
255
+ it({
256
+ isOpen: f,
257
+ setIsOpen: O,
244
258
  onIsOpen: M,
245
259
  id: y,
246
- selectSearchRef: T,
260
+ selectSearchRef: V,
247
261
  isHandlingRef: Te
248
262
  });
249
- const Ze = ct({
263
+ const _e = dt({
250
264
  items: n && a ? a.normalizedItems : i,
251
- filteredItems: V,
252
- size: c,
253
- actualMenuPlacement: Pe,
254
- isVisible: ke,
255
- noOptionsText: Ke(),
256
- noMatchText: be,
265
+ filteredItems: T,
266
+ size: d,
267
+ actualMenuPlacement: ke,
268
+ isVisible: Ae,
269
+ noOptionsText: Xe(),
270
+ noMatchText: Oe,
257
271
  enableNestedSelection: n,
258
- renderNestedOptions: Ye,
259
- groupBy: I,
272
+ renderNestedOptions: Ze,
273
+ groupBy: S,
260
274
  parentRef: X,
261
- virtualItems: Ge,
262
- virtualizer: He,
263
- classNameOption: Q,
264
- selectedItems: r,
265
- renderOptionContent: oe,
275
+ virtualItems: He,
276
+ virtualizer: Qe,
277
+ classNameOption: j,
278
+ selectedItems: m,
279
+ renderOptionContent: ae,
266
280
  cls: t,
267
281
  useIconInsteadOfCheckbox: K,
268
282
  highlightMatches: k,
269
- internalSearchQuery: v,
283
+ internalSearchQuery: w,
270
284
  searchInHeaderGroupItems: A
271
285
  });
272
- return /* @__PURE__ */ w("div", { ref: T, children: [
273
- /* @__PURE__ */ l(
274
- wt,
286
+ return /* @__PURE__ */ v("div", { ref: V, children: [
287
+ /* @__PURE__ */ c(
288
+ vt,
275
289
  {
276
290
  multiple: !0,
277
291
  as: "div",
278
- value: r,
279
- className: z(t["multi-select-search"], {
280
- [t.full]: ge,
281
- [t.disabled]: d
292
+ value: m,
293
+ className: C(t["multi-select-search"], {
294
+ [t.full]: Ie,
295
+ [t.disabled]: u
282
296
  }),
283
- onChange: Je,
284
- ref: he,
285
- disabled: d,
286
- virtual: I ? void 0 : { options: V },
287
- children: /* @__PURE__ */ w(
297
+ onChange: je,
298
+ ref: ge,
299
+ disabled: u,
300
+ virtual: S ? void 0 : { options: T },
301
+ children: /* @__PURE__ */ v(
288
302
  "div",
289
303
  {
290
- className: z(t.container, t[c], {
291
- [t["container-open"]]: m
304
+ className: C(t.container, t[d], {
305
+ [t["container-open"]]: f
292
306
  }),
293
307
  children: [
294
- C && /* @__PURE__ */ w("div", { className: t["input-container"], children: [
295
- /* @__PURE__ */ l(
296
- me,
308
+ b && /* @__PURE__ */ v("div", { className: t["input-container"], children: [
309
+ /* @__PURE__ */ c(
310
+ pe,
297
311
  {
298
- disabled: d,
312
+ disabled: u,
299
313
  style: { width: "100%" },
300
314
  onClick: ne,
301
- children: /* @__PURE__ */ l(
302
- pe,
315
+ children: /* @__PURE__ */ c(
316
+ fe,
303
317
  {
304
- as: de,
305
- label: J,
306
- size: le(c),
307
- className: z(t["multi-select-input"], {
308
- [t["multi-select-input-disabled"]]: C && P
318
+ as: ue,
319
+ label: Q,
320
+ size: ce(d),
321
+ className: C(t["multi-select-input"], {
322
+ [t["multi-select-input-disabled"]]: b && P
309
323
  }),
310
324
  onChange: ee,
311
325
  value: E,
312
- disabled: d,
313
- variant: j,
326
+ disabled: u,
327
+ variant: J,
314
328
  rightSlotClassName: t["right-slot"],
315
329
  requiredMarkClassName: t["required-mark"],
316
330
  "data-testid": "select-search-input",
317
- onFocus: $e,
331
+ onFocus: We,
318
332
  rightAddon: {
319
333
  addonType: "icon",
320
- addonContent: ft(m, c)
334
+ addonContent: gt(f, d)
321
335
  },
322
336
  autocomplete: $,
323
337
  ...U
@@ -325,58 +339,58 @@ const Jt = et(
325
339
  )
326
340
  }
327
341
  ),
328
- P && E && /* @__PURE__ */ l(
329
- Nt,
342
+ P && E && /* @__PURE__ */ c(
343
+ zt,
330
344
  {
331
345
  tabIndex: -1,
332
- className: z(t.clear, {
333
- [t.disabled]: d
346
+ className: C(t.clear, {
347
+ [t.disabled]: u
334
348
  }),
335
349
  iconButtonClassName: t["icon-button"],
336
350
  isIconButton: !0,
337
351
  iconName: "Close16px",
338
352
  size: "m-s",
339
353
  clear: !0,
340
- disabled: d,
354
+ disabled: u,
341
355
  variant: "secondary-gray",
342
- onClick: Ue,
356
+ onClick: $e,
343
357
  "data-testid": "clear-button"
344
358
  }
345
359
  )
346
360
  ] }),
347
- !C && /* @__PURE__ */ l(
348
- pe,
361
+ !b && /* @__PURE__ */ c(
362
+ fe,
349
363
  {
350
- as: de,
351
- label: J,
352
- size: le(c),
364
+ as: ue,
365
+ label: Q,
366
+ size: ce(d),
353
367
  className: t["multi-select-input"],
354
368
  rightSlotClassName: t["right-slot"],
355
369
  requiredMarkClassName: t["required-mark"],
356
370
  value: E,
357
- disabled: d,
358
- variant: j,
371
+ disabled: u,
372
+ variant: J,
359
373
  withClearButton: P,
360
374
  onFocus: te,
361
- onMouseDown: Qe,
375
+ onMouseDown: Je,
362
376
  onChange: ee,
363
- ref: S,
364
- rightAddon: We(),
377
+ ref: N,
378
+ rightAddon: Ke(),
365
379
  "data-testid": "select-search-input",
366
380
  autocomplete: $,
367
381
  ...U
368
382
  }
369
383
  ),
370
- m && Ae && Ze()
384
+ f && Ee && _e()
371
385
  ]
372
386
  }
373
387
  )
374
388
  }
375
389
  ),
376
- ve && ae && /* @__PURE__ */ l("div", { className: t["chip-container"], children: ae })
390
+ we && oe && /* @__PURE__ */ c("div", { className: t["chip-container"], children: oe })
377
391
  ] });
378
392
  }
379
393
  );
380
394
  export {
381
- Jt as MultiSelectSearch
395
+ jt as MultiSelectSearch
382
396
  };
package/dist/components/MultiSelectSearch/hooks/useMultiSelectState.js CHANGED
@@ -1,31 +1,29 @@
1
- import { useState as e, useEffect as u } from "react";
2
- import { getInitialInputValue as o } from "../utils.js";
3
- const g = ({
1
+ import { useState as e } from "react";
2
+ import { getInitialInputValue as S } from "../utils.js";
3
+ const O = ({
4
4
  value: t,
5
5
  displayValue: n
6
6
  }) => {
7
- const [c, p] = e(!1), [f, r] = e(
8
- () => o(t, n)
9
- ), [s, i] = e(
7
+ const [s, o] = e(!1), [r, a] = e(
8
+ () => S(t, n)
9
+ ), [p, c] = e(
10
10
  t || []
11
- ), [S, I] = e(
11
+ ), [u, i] = e(
12
12
  /* @__PURE__ */ new Set()
13
- ), [m, O] = e("");
14
- return u(() => {
15
- t && (i(t), JSON.stringify(t) !== JSON.stringify(s) && r(o(t, n)));
16
- }, [t, n, s]), {
17
- isOpen: c,
18
- setIsOpen: p,
19
- inputValue: f,
20
- setInputValue: r,
21
- selectedItems: s,
22
- setSelectedItems: i,
23
- expandedOptions: S,
24
- setExpandedOptions: I,
25
- internalSearchQuery: m,
26
- setInternalSearchQuery: O
13
+ ), [l, I] = e("");
14
+ return {
15
+ isOpen: s,
16
+ setIsOpen: o,
17
+ inputValue: r,
18
+ setInputValue: a,
19
+ selectedItems: p,
20
+ setSelectedItems: c,
21
+ expandedOptions: u,
22
+ setExpandedOptions: i,
23
+ internalSearchQuery: l,
24
+ setInternalSearchQuery: I
27
25
  };
28
26
  };
29
27
  export {
30
- g as useMultiSelectState
28
+ O as useMultiSelectState
31
29
  };
package/dist/components/MultiSelectSearch/utils.js CHANGED
@@ -1,72 +1,72 @@
1
- import { createElement as f, Fragment as S, isValidElement as w, cloneElement as E } from "react";
2
- import { EMultiSelectSearchSize as h, MOBILE_MENU_HEIGHT as M, DESKTOP_MENU_HEIGHT as T } from "./constants.js";
1
+ import { createElement as g, Fragment as S, isValidElement as w, cloneElement as E } from "react";
2
+ import { EMultiSelectSearchSize as a, MOBILE_MENU_HEIGHT as M, DESKTOP_MENU_HEIGHT as T } from "./constants.js";
3
3
  import "../../Input-DgWOCNwP.js";
4
- import { EInputSize as p } from "../Input/constants.js";
5
- const j = (e) => {
6
- switch (e) {
7
- case h.M:
8
- return p.M;
9
- case h.L:
10
- return p.L;
4
+ import { EInputSize as f } from "../Input/constants.js";
5
+ const j = (n) => {
6
+ switch (n) {
7
+ case a.M:
8
+ return f.M;
9
+ case a.L:
10
+ return f.L;
11
11
  default:
12
- return p.M;
12
+ return f.M;
13
13
  }
14
- }, _ = (e, t) => e ? t === h.L ? "DropdownArrowUp24px" : "DropdownArrowUp16px" : t === h.L ? "DropdownArrowDown24px" : "DropdownArrowBottom16px", b = (e, t) => e && e.length > 0 ? e.map((r) => r[t]).join(", ") : "", A = (e, t) => e.map((r) => r[t]).join(", "), C = "multiselectOpen", y = (e) => {
15
- window.dispatchEvent(new CustomEvent(C, { detail: e }));
16
- }, G = (e, t) => {
17
- if (!e.current) return !1;
18
- const r = e.current.getBoundingClientRect(), n = window.innerHeight, i = t === h.M ? M : T, s = n - r.bottom, o = r.top;
14
+ }, _ = (n, t) => n ? t === a.L ? "DropdownArrowUp24px" : "DropdownArrowUp16px" : t === a.L ? "DropdownArrowDown24px" : "DropdownArrowBottom16px", b = (n, t) => n && n.length > 0 ? n.map((r) => r[t]).join(", ") : "", A = (n, t) => n.map((r) => r[t]).join(", "), C = "multiselectOpen", y = (n) => {
15
+ window.dispatchEvent(new CustomEvent(C, { detail: n }));
16
+ }, G = (n, t) => {
17
+ if (!n.current) return !1;
18
+ const r = n.current.getBoundingClientRect(), e = window.innerHeight, i = t === a.M ? M : T, s = e - r.bottom, o = r.top;
19
19
  return s >= i ? !1 : o > s;
20
- }, K = (e, t, r) => {
21
- if (!e.length || !t) return e;
22
- const n = [], i = /* @__PURE__ */ new Set();
23
- for (const s of e) {
20
+ }, k = (n, t, r) => {
21
+ if (!n.length || !t) return n;
22
+ const e = [], i = /* @__PURE__ */ new Set();
23
+ for (const s of n) {
24
24
  const o = String(s[t] || "Без группы");
25
- i.has(o) || (i.add(o), n.push({
25
+ i.has(o) || (i.add(o), e.push({
26
26
  id: `group-header-${o}`,
27
27
  name: r(o),
28
28
  isGroupHeader: !0,
29
29
  originalValue: o
30
- })), n.push(s);
30
+ })), e.push(s);
31
31
  }
32
- return n;
33
- }, g = (e, t, r) => {
32
+ return e;
33
+ }, m = (n, t, r) => {
34
34
  if (!t.trim())
35
- return e;
36
- if (typeof e == "string") {
37
- const n = O(
38
- e,
35
+ return n;
36
+ if (typeof n == "string") {
37
+ const e = O(
38
+ n,
39
39
  t,
40
40
  r
41
41
  );
42
- return f(
42
+ return g(
43
43
  "span",
44
44
  { className: "highlighted-text-wrapper" },
45
- n
45
+ e
46
46
  );
47
47
  }
48
- return Array.isArray(e) ? e.map(
49
- (n, i) => f(
48
+ return Array.isArray(n) ? n.map(
49
+ (e, i) => g(
50
50
  S,
51
51
  { key: i },
52
- g(n, t, r)
52
+ m(e, t, r)
53
53
  )
54
- ) : w(e) ? E(e, {
55
- ...e.props,
56
- children: g(
57
- e.props.children,
54
+ ) : w(n) ? E(n, {
55
+ ...n.props,
56
+ children: m(
57
+ n.props.children,
58
58
  t,
59
59
  r
60
60
  )
61
- }) : e;
62
- }, O = (e, t, r) => {
61
+ }) : n;
62
+ }, O = (n, t, r) => {
63
63
  if (!t.trim())
64
- return [e];
65
- const n = new RegExp(
64
+ return [n];
65
+ const e = new RegExp(
66
66
  `(${t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&")})`,
67
67
  "gi"
68
68
  );
69
- return e.split(n).map((s, o) => n.test(s) ? f(
69
+ return n.split(e).map((s, o) => e.test(s) ? g(
70
70
  "span",
71
71
  {
72
72
  key: o,
@@ -75,52 +75,60 @@ const j = (e) => {
75
75
  },
76
76
  s
77
77
  ) : s);
78
- }, u = (e, t) => {
78
+ }, h = (n, t) => {
79
79
  const r = [];
80
- if (e.children)
81
- for (const n of e.children)
82
- r.push(n.id), r.push(...u(n));
80
+ if (n.children)
81
+ for (const e of n.children)
82
+ r.push(e.id), r.push(...h(e));
83
83
  return r;
84
- }, N = (e) => {
85
- const t = [], r = (n) => {
86
- for (const i of n)
84
+ }, N = (n) => {
85
+ const t = [], r = (e) => {
86
+ for (const i of e)
87
87
  t.push(i), i.children && r(i.children);
88
88
  };
89
- return r(e), t;
90
- }, P = (e, t) => t.includes(e.id) ? !0 : u(e).some((n) => t.includes(n)), q = (e, t) => u(e).filter((n) => t.includes(n)).length, $ = (e) => u(e).length, v = (e, t, r) => {
91
- const n = q(e, t), i = $(e);
92
- return i === 0 ? String(e[r] || "") : `${e[r]} (${n} из ${i})`;
93
- }, k = (e, t, r) => {
94
- let n = e;
95
- const i = e.filter(
89
+ return r(n), t;
90
+ }, K = (n, t) => t.includes(n.id) ? !0 : h(n).some((e) => t.includes(e)), q = (n, t) => h(n).filter((e) => t.includes(e)).length, $ = (n) => h(n).length, v = (n, t, r) => {
91
+ const e = q(n, t), i = $(n);
92
+ return i === 0 ? String(n[r] || "") : `${n[r]} (${e} из ${i})`;
93
+ }, P = (n, t, r) => {
94
+ let e = n;
95
+ const i = n.filter(
96
96
  (o) => !t.some((c) => c.id === o.id)
97
97
  ), s = t.filter(
98
- (o) => !e.some((c) => c.id === o.id)
98
+ (o) => !n.some((c) => c.id === o.id)
99
99
  );
100
100
  for (const o of i)
101
101
  if (o.children && o.children.length > 0) {
102
- const c = u(o), d = N(r).filter(
103
- (a) => c.includes(a.id)
102
+ const c = h(o), d = N(r).filter(
103
+ (u) => c.includes(u.id)
104
104
  );
105
105
  d.every(
106
- (a) => t.some((I) => I.id === a.id)
107
- ) ? n = n.filter(
108
- (a) => !c.includes(a.id)
109
- ) : n = [...n, ...d];
106
+ (u) => t.some((p) => p.id === u.id)
107
+ ) ? e = e.filter(
108
+ (u) => !d.some((p) => p.id === u.id)
109
+ ) : e = [...e, ...d];
110
110
  }
111
111
  for (const o of s) {
112
- const c = u(o);
113
- n = n.filter((d) => !c.includes(d.id));
112
+ const c = [], d = [o];
113
+ for (; d.length > 0; ) {
114
+ const l = d.pop();
115
+ if (l.children)
116
+ for (const u of l.children)
117
+ c.push(u.id), d.push(u);
118
+ }
119
+ e = e.filter(
120
+ (l) => !c.includes(l.id)
121
+ );
114
122
  }
115
- return n = n.filter(
123
+ return e = e.filter(
116
124
  (o, c, d) => c === d.findIndex((l) => l.id === o.id)
117
- ), n = n.filter(
125
+ ), e = e.filter(
118
126
  (o) => !o.children || o.children.length === 0
119
- ), n;
120
- }, B = (e, t, r, n) => {
127
+ ), e;
128
+ }, B = (n, t, r, e) => {
121
129
  if (t) {
122
130
  const i = /* @__PURE__ */ new Set();
123
- for (const s of e)
131
+ for (const s of n)
124
132
  if (s.children && s.children.length > 0)
125
133
  i.add(s);
126
134
  else {
@@ -135,54 +143,54 @@ const j = (e) => {
135
143
  return Array.from(i).map(
136
144
  (s) => v(
137
145
  s,
138
- e.map((o) => o.id),
139
- n
146
+ n.map((o) => o.id),
147
+ e
140
148
  )
141
149
  ).join(", ");
142
150
  }
143
- return A(e, n);
144
- }, x = (e, t, r) => `unique-${t.join("-")}-${e}-${r.value++}`, m = (e, t = [], r = { value: 0 }) => e.map((n) => {
145
- t.push(n.id);
146
- const i = x(n.id, t, r), s = {
147
- ...n,
151
+ return A(n, e);
152
+ }, x = (n, t, r) => `unique-${t.join("-")}-${n}-${r.value++}`, I = (n, t = [], r = { value: 0 }) => n.map((e) => {
153
+ t.push(e.id);
154
+ const i = x(e.id, t, r), s = {
155
+ ...e,
148
156
  id: i,
149
- originalId: n.id,
157
+ originalId: e.id,
150
158
  path: [...t]
151
159
  };
152
- return n.children && n.children.length > 0 && (s.children = m(
153
- n.children,
160
+ return e.children && e.children.length > 0 && (s.children = I(
161
+ e.children,
154
162
  t,
155
163
  r
156
164
  )), t.pop(), s;
157
- }), U = (e) => {
158
- const t = {}, r = [...e];
165
+ }), U = (n) => {
166
+ const t = {}, r = [...n];
159
167
  for (; r.length > 0; ) {
160
- const n = r.pop();
161
- if (n.originalId) {
162
- const i = String(n.originalId);
163
- t[i] = t[i] || [], t[i].push(n.id);
168
+ const e = r.pop();
169
+ if (e.originalId) {
170
+ const i = String(e.originalId);
171
+ t[i] = t[i] || [], t[i].push(e.id);
164
172
  }
165
- if (n.children)
166
- for (let i = n.children.length - 1; i >= 0; i--)
167
- r.push(n.children[i]);
173
+ if (e.children)
174
+ for (let i = e.children.length - 1; i >= 0; i--)
175
+ r.push(e.children[i]);
168
176
  }
169
177
  return t;
170
- }, R = (e) => {
171
- const r = m(e, [], { value: 0 }), n = U(r), i = {};
172
- for (const [c, d] of Object.entries(n))
178
+ }, R = (n) => {
179
+ const r = I(n, [], { value: 0 }), e = U(r), i = {};
180
+ for (const [c, d] of Object.entries(e))
173
181
  for (const l of d)
174
182
  i[String(l)] = isNaN(Number(c)) ? c : Number(c);
175
183
  return {
176
184
  normalizedItems: r,
177
- idMapping: n,
185
+ idMapping: e,
178
186
  originalToUniqueId: (c) => {
179
- const d = String(c), l = n[d];
187
+ const d = String(c), l = e[d];
180
188
  return l && l.length > 0 ? l[0] : c;
181
189
  },
182
190
  uniqueToOriginalId: (c) => i[String(c)] || c
183
191
  };
184
- }, F = (e, t) => {
185
- const r = [], n = /* @__PURE__ */ new Set(), i = (s) => {
192
+ }, F = (n, t) => {
193
+ const r = [], e = /* @__PURE__ */ new Set(), i = (s) => {
186
194
  const o = t.find(
187
195
  (c) => {
188
196
  var d;
@@ -194,13 +202,13 @@ const j = (e) => {
194
202
  regionName: o.name
195
203
  } : {};
196
204
  };
197
- for (const s of e)
198
- if (!n.has(s.id) && (!s.children || s.children.length === 0)) {
205
+ for (const s of n)
206
+ if (!e.has(s.id) && (!s.children || s.children.length === 0)) {
199
207
  const o = i(s), c = {
200
208
  ...s,
201
209
  ...o
202
210
  };
203
- r.push(c), n.add(s.id);
211
+ r.push(c), e.add(s.id);
204
212
  }
205
213
  return r;
206
214
  };
@@ -210,19 +218,19 @@ export {
210
218
  N as flattenOptions,
211
219
  F as flattenSelectedItems,
212
220
  v as formatOptionWithCount,
213
- u as getAllChildrenIds,
221
+ h as getAllChildrenIds,
214
222
  _ as getDropdownArrowIcon,
215
223
  b as getInitialInputValue,
216
224
  q as getSelectedChildrenCount,
217
225
  $ as getTotalChildrenCount,
218
- g as highlightReactNode,
226
+ m as highlightReactNode,
219
227
  O as highlightText,
220
- P as isOptionSelected,
228
+ K as isOptionSelected,
221
229
  A as joinSelectedItems,
222
230
  j as mapSizeToInputSize,
223
231
  R as normalizeDataForNestedSelection,
224
- K as prepareGroupedItems,
225
- k as processNestedSelectionChange,
232
+ k as prepareGroupedItems,
233
+ P as processNestedSelectionChange,
226
234
  G as shouldShowMenuOnTop,
227
235
  B as updateInputValueAfterChange
228
236
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "mimir-ui-kit",
3
3
  "private": false,
4
- "version": "1.54.0",
4
+ "version": "1.54.4",
5
5
  "type": "module",
6
6
  "exports": {
7
7
  ".": {