@sberbusiness/triplex-next 1.34.0 → 1.35.1

package/components/SuggestField/index.js

@@ -1,15 +1,15 @@
-import { SuggestFieldDesktopDropdown as r } from "./desktop/SuggestFieldDesktopDropdown.js";
-import { SuggestFieldDesktop as g } from "./desktop/SuggestFieldDesktop.js";
-import { SuggestFieldMobile as i } from "./mobile/SuggestFieldMobile.js";
-import { SuggestFieldMobileDropdown as l } from "./mobile/SuggestFieldMobileDropdown.js";
-import { S } from "../../chunks/SuggestFieldMobileDropdownHint-AG8aD2R1.js";
-import { SuggestField as m } from "./SuggestField.js";
+import { SuggestFieldDesktopDropdown } from "./desktop/SuggestFieldDesktopDropdown.js";
+import { SuggestFieldDesktop } from "./desktop/SuggestFieldDesktop.js";
+import { SuggestFieldMobile } from "./mobile/SuggestFieldMobile.js";
+import { SuggestFieldMobileDropdown } from "./mobile/SuggestFieldMobileDropdown.js";
+import { S } from "../../chunks/SuggestFieldMobileDropdownHint-BfUZ4rbH.js";
+import { SuggestField } from "./SuggestField.js";
 export {
-  m as SuggestField,
-  g as SuggestFieldDesktop,
-  r as SuggestFieldDesktopDropdown,
-  i as SuggestFieldMobile,
-  l as SuggestFieldMobileDropdown,
+  SuggestField,
+  SuggestFieldDesktop,
+  SuggestFieldDesktopDropdown,
+  SuggestFieldMobile,
+  SuggestFieldMobileDropdown,
   S as SuggestFieldMobileDropdownHint
 };
 //# sourceMappingURL=index.js.map

package/components/SuggestField/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/components/SuggestField/mobile/SuggestFieldMobile.js

@@ -1,13 +1,13 @@
-import { jsxs as u, jsx as t } from "react/jsx-runtime";
-import j, { useState as v, useRef as F, useEffect as B, useCallback as I } from "react";
-import { EComponentSize as M } from "../../../enums/EComponentSize.js";
-import { SuggestFieldMobileDropdown as _ } from "./SuggestFieldMobileDropdown.js";
-import { TextFieldBase as $ } from "../../TextField/TextFieldBase.js";
-import { DataTestId as y } from "../../../consts/DataTestId.js";
-import { FormFieldClear as A } from "../../FormField/components/FormFieldClear.js";
+import { jsxs, jsx } from "react/jsx-runtime";
+import React__default, { useState, useRef, useEffect, useCallback } from "react";
+import { EComponentSize } from "../../../enums/EComponentSize.js";
+import { SuggestFieldMobileDropdown } from "./SuggestFieldMobileDropdown.js";
+import { TextFieldBase } from "../../TextField/TextFieldBase.js";
+import { DataTestId } from "../../../consts/DataTestId.js";
+import { FormFieldClear } from "../../FormField/components/FormFieldClear.js";
 import "../../FormField/components/FormFieldCounter.js";
 import "../../FormField/components/FormFieldDescription.js";
-import { F as G } from "../../../chunks/FormFieldInput-DFQ9utC5.js";
+import { F as FormFieldInput } from "../../../chunks/FormFieldInput-B1sTDP0Z.js";
 import "../../FormField/components/FormFieldLabel.js";
 import "../../FormField/components/FormFieldMaskedInput.js";
 import "../../FormField/components/FormFieldPostfix.js";
@@ -15,84 +15,91 @@ import "../../FormField/components/FormFieldPrefix.js";
 import "../../FormField/components/FormFieldTarget.js";
 import "../../FormField/components/FormFieldTextarea.js";
 import "../../FormField/FormField.js";
-import { LoaderSmall as N } from "../../Loader/LoaderSmall/LoaderSmall.js";
-import { ELoaderSmallTheme as T } from "../../Loader/LoaderSmall/enum.js";
+import { LoaderSmall } from "../../Loader/LoaderSmall/LoaderSmall.js";
+import { ELoaderSmallTheme } from "../../Loader/LoaderSmall/enum.js";
 import "../../Loader/LoaderMiddle/LoaderMiddle.js";
-import "../../../chunks/SuggestFieldMobileDropdownHint-AG8aD2R1.js";
-const po = ({
-  value: r,
-  options: b,
-  size: n = M.LG,
-  placeholder: l,
-  "data-test-id": m,
-  postfix: x,
-  tooltipHint: S,
-  loading: p,
-  tooltipOpen: g,
-  dropdownListLoading: w,
-  clearInputOnFocus: D,
-  onFilter: O,
-  onSelect: h,
-  onClear: a,
-  onScrollEnd: k,
-  renderInput: c,
-  inputProps: o,
-  ...C
+import "../../../chunks/SuggestFieldMobileDropdownHint-BfUZ4rbH.js";
+const SuggestFieldMobile = ({
+  value,
+  options,
+  size = EComponentSize.LG,
+  placeholder,
+  "data-test-id": dataTestId,
+  postfix,
+  tooltipHint,
+  loading,
+  tooltipOpen,
+  dropdownListLoading,
+  clearInputOnFocus,
+  onFilter,
+  onSelect,
+  onClear,
+  onScrollEnd,
+  renderInput,
+  inputProps,
+  ...restProps
 }) => {
-  const [e, d] = v(!1), i = F(null), s = F(!1), E = c === void 0 ? G : c;
-  B(() => {
-    s.current && !e && i.current && i.current.scrollIntoView({ block: "center" }), s.current = e;
-  }, [e]);
-  const L = I(
-    (R) => {
-      var f;
-      d(!0), (f = o.onFocus) == null || f.call(o, R);
+  const [dropdownOpen, setDropdownOpen] = useState(false);
+  const ref = useRef(null);
+  const prevDropdownOpen = useRef(false);
+  const Input = renderInput === void 0 ? FormFieldInput : renderInput;
+  useEffect(() => {
+    if (prevDropdownOpen.current && !dropdownOpen && ref.current) {
+      ref.current.scrollIntoView({ block: "center" });
+    }
+    prevDropdownOpen.current = dropdownOpen;
+  }, [dropdownOpen]);
+  const handleInputFocus = useCallback(
+    (event) => {
+      var _a;
+      setDropdownOpen(true);
+      (_a = inputProps.onFocus) == null ? void 0 : _a.call(inputProps, event);
     },
-    [o]
+    [inputProps]
   );
-  return /* @__PURE__ */ u(
-    $,
+  return /* @__PURE__ */ jsxs(
+    TextFieldBase,
     {
-      "data-test-id": m,
-      size: n,
-      postfix: /* @__PURE__ */ u(j.Fragment, { children: [
-        a !== void 0 && /* @__PURE__ */ t(A, { onClick: a }),
-        p && /* @__PURE__ */ t(N, { theme: T.BRAND, size: n }),
-        x
+      "data-test-id": dataTestId,
+      size,
+      postfix: /* @__PURE__ */ jsxs(React__default.Fragment, { children: [
+        onClear !== void 0 && /* @__PURE__ */ jsx(FormFieldClear, { onClick: onClear }),
+        loading && /* @__PURE__ */ jsx(LoaderSmall, { theme: ELoaderSmallTheme.BRAND, size }),
+        postfix
       ] }),
-      ...C,
-      ref: i,
+      ...restProps,
+      ref,
       children: [
-        /* @__PURE__ */ t(
-          E,
+        /* @__PURE__ */ jsx(
+          Input,
           {
-            value: r ? r.label : "",
-            placeholder: l,
+            value: value ? value.label : "",
+            placeholder,
             role: "combobox",
             "aria-autocomplete": "list",
-            "aria-expanded": e,
-            "data-test-id": m && `${m}${y.Suggest.input}`,
-            ...o,
-            readOnly: !0,
-            onFocus: L
+            "aria-expanded": dropdownOpen,
+            "data-test-id": dataTestId && `${dataTestId}${DataTestId.Suggest.input}`,
+            ...inputProps,
+            readOnly: true,
+            onFocus: handleInputFocus
           }
         ),
-        /* @__PURE__ */ t(
-          _,
+        /* @__PURE__ */ jsx(
+          SuggestFieldMobileDropdown,
           {
-            value: r,
-            options: b,
-            placeholder: l,
-            tooltipHint: S,
-            opened: e,
-            loading: p,
-            tooltipOpen: g,
-            dropdownListLoading: w,
-            clearInputOnFocus: D,
-            setOpened: d,
-            onFilter: O,
-            onSelect: h,
-            onScrollEnd: k
+            value,
+            options,
+            placeholder,
+            tooltipHint,
+            opened: dropdownOpen,
+            loading,
+            tooltipOpen,
+            dropdownListLoading,
+            clearInputOnFocus,
+            setOpened: setDropdownOpen,
+            onFilter,
+            onSelect,
+            onScrollEnd
           }
         )
       ]
@@ -100,6 +107,6 @@ const po = ({
   );
 };
 export {
-  po as SuggestFieldMobile
+  SuggestFieldMobile
 };
 //# sourceMappingURL=SuggestFieldMobile.js.map

package/components/SuggestField/mobile/SuggestFieldMobile.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestFieldMobile.js","sources":["../../../../src/components/SuggestField/mobile/SuggestFieldMobile.tsx"],"sourcesContent":["import React, { useState, useRef, useEffect, useCallback } from \"react\";\nimport { ISuggestFieldMobileProps } from \"./types\";\nimport { ISuggestFieldOption } from \"../types\";\nimport { EComponentSize } from \"../../../enums\";\nimport { SuggestFieldMobileDropdown } from \"./SuggestFieldMobileDropdown\";\nimport { TextFieldBase } from \"../../TextField/TextFieldBase\";\nimport { DataTestId } from \"../../../consts/DataTestId\";\nimport { FormFieldInput, FormFieldClear } from \"../../FormField\";\nimport { LoaderSmall, ELoaderSmallTheme } from \"../../Loader\";\n\n/**\n * Мобильный SuggestField.\n * Отображает поле ввода (target). При получении полем ввода фокуса - отображает мобильный Dropdown.\n */\nexport const SuggestFieldMobile = <T extends ISuggestFieldOption = ISuggestFieldOption>({\n    value,\n    options,\n    size = EComponentSize.LG,\n    placeholder,\n    \"data-test-id\": dataTestId,\n    postfix,\n    tooltipHint,\n    loading,\n    tooltipOpen,\n    dropdownListLoading,\n    clearInputOnFocus,\n    onFilter,\n    onSelect,\n    onClear,\n    onScrollEnd,\n    renderInput,\n    inputProps,\n    ...restProps\n}: ISuggestFieldMobileProps<T>) => {\n    const [dropdownOpen, setDropdownOpen] = useState(false);\n    const ref = useRef<HTMLInputElement>(null);\n    // Предыдущее состояние dropdownOpened.\n    const prevDropdownOpen = useRef(false);\n    const Input = renderInput === undefined ? FormFieldInput : renderInput;\n\n    useEffect(() => {\n        // Дропдаун закрылся.\n        if (prevDropdownOpen.current && !dropdownOpen && ref.current) {\n            // Обратный скролл к инпуту т.к. при открытии Dropdown в iOS страница скроллится вверх.\n            ref.current.scrollIntoView({ block: \"center\" });\n        }\n        prevDropdownOpen.current = dropdownOpen;\n    }, [dropdownOpen]);\n\n    const handleInputFocus = useCallback<React.FocusEventHandler<HTMLInputElement>>(\n        (event) => {\n            setDropdownOpen(true);\n            inputProps.onFocus?.(event);\n        },\n        [inputProps],\n    );\n\n    return (\n        <TextFieldBase\n            data-test-id={dataTestId}\n            size={size}\n            postfix={\n                <React.Fragment>\n                    {onClear !== undefined && <FormFieldClear onClick={onClear} />}\n                    {loading && <LoaderSmall theme={ELoaderSmallTheme.BRAND} size={size} />}\n                    {postfix}\n                </React.Fragment>\n            }\n            {...restProps}\n            ref={ref}\n        >\n            <Input\n                value={value ? value.label : \"\"}\n                placeholder={placeholder}\n                role=\"combobox\"\n                aria-autocomplete=\"list\"\n                aria-expanded={dropdownOpen}\n                data-test-id={dataTestId && `${dataTestId}${DataTestId.Suggest.input}`}\n                {...inputProps}\n                readOnly={true}\n                onFocus={handleInputFocus}\n            />\n            <SuggestFieldMobileDropdown\n                value={value}\n                options={options}\n                placeholder={placeholder}\n                tooltipHint={tooltipHint}\n                opened={dropdownOpen}\n                loading={loading}\n                tooltipOpen={tooltipOpen}\n                dropdownListLoading={dropdownListLoading}\n                clearInputOnFocus={clearInputOnFocus}\n                setOpened={setDropdownOpen}\n                onFilter={onFilter}\n                onSelect={onSelect}\n                onScrollEnd={onScrollEnd}\n            />\n        </TextFieldBase>\n    );\n};\n"],"names":["React"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAcO,MAAM,qBAAqB,CAAsD;AAAA,EACpF;AAAA,EACA;AAAA,EACA,OAAO,eAAe;AAAA,EACtB;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACP,MAAmC;AAC/B,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AACtD,QAAM,MAAM,OAAyB,IAAI;AAEzC,QAAM,mBAAmB,OAAO,KAAK;AACrC,QAAM,QAAQ,gBAAgB,SAAY,iBAAiB;AAE3D,YAAU,MAAM;AAEZ,QAAI,iBAAiB,WAAW,CAAC,gBAAgB,IAAI,SAAS;AAE1D,UAAI,QAAQ,eAAe,EAAE,OAAO,UAAU;AAAA,IAClD;AACA,qBAAiB,UAAU;AAAA,EAC/B,GAAG,CAAC,YAAY,CAAC;AAEjB,QAAM,mBAAmB;AAAA,IACrB,CAAC,UAAU;;AACP,sBAAgB,IAAI;AACpB,uBAAW,YAAX,oCAAqB;AAAA,IACzB;AAAA,IACA,CAAC,UAAU;AAAA,EAAA;AAGf,SACI;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,gBAAc;AAAA,MACd;AAAA,MACA,SACI,qBAACA,eAAM,UAAN,EACI,UAAA;AAAA,QAAA,YAAY,UAAa,oBAAC,gBAAA,EAAe,SAAS,SAAS;AAAA,QAC3D,WAAW,oBAAC,aAAA,EAAY,OAAO,kBAAkB,OAAO,MAAY;AAAA,QACpE;AAAA,MAAA,GACL;AAAA,MAEH,GAAG;AAAA,MACJ;AAAA,MAEA,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,OAAO,QAAQ,MAAM,QAAQ;AAAA,YAC7B;AAAA,YACA,MAAK;AAAA,YACL,qBAAkB;AAAA,YAClB,iBAAe;AAAA,YACf,gBAAc,cAAc,GAAG,UAAU,GAAG,WAAW,QAAQ,KAAK;AAAA,YACnE,GAAG;AAAA,YACJ,UAAU;AAAA,YACV,SAAS;AAAA,UAAA;AAAA,QAAA;AAAA,QAEb;AAAA,UAAC;AAAA,UAAA;AAAA,YACG;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,QAAQ;AAAA,YACR;AAAA,YACA;AAAA,YACA;AAAA,YACA;AAAA,YACA,WAAW;AAAA,YACX;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,QAAA;AAAA,MACJ;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/components/SuggestField/mobile/SuggestFieldMobileDropdown.js

@@ -1,110 +1,134 @@
-import { jsx as t, jsxs as g, Fragment as w } from "react/jsx-runtime";
-import q, { useState as D, useRef as p, useCallback as i } from "react";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import React__default, { useState, useRef, useCallback } from "react";
 import "../../Dropdown/DropdownListContext.js";
 import "../../Dropdown/desktop/DropdownDesktop.js";
 import "../../Dropdown/desktop/DropdownList.js";
-import "../../../chunks/DropdownListItem-Db1_Qf-T.js";
+import "../../../chunks/DropdownListItem-CboBGsbx.js";
 import "../../Dropdown/mobile/DropdownMobile.js";
-import { DropdownMobileBody as z } from "../../Dropdown/mobile/DropdownMobileBody.js";
-import { DropdownMobileClose as A } from "../../Dropdown/mobile/DropdownMobileClose.js";
+import { DropdownMobileBody } from "../../Dropdown/mobile/DropdownMobileBody.js";
+import { DropdownMobileClose } from "../../Dropdown/mobile/DropdownMobileClose.js";
 import "../../Dropdown/mobile/DropdownMobileFooter.js";
-import { DropdownMobileHeader as G } from "../../Dropdown/mobile/DropdownMobileHeader.js";
+import { DropdownMobileHeader } from "../../Dropdown/mobile/DropdownMobileHeader.js";
 import "../../Dropdown/mobile/DropdownMobileInner.js";
-import { DropdownMobileInput as J } from "../../Dropdown/mobile/DropdownMobileInput.js";
-import { DropdownMobileList as K } from "../../Dropdown/mobile/DropdownMobileList.js";
-import { DropdownMobileListItem as L } from "../../Dropdown/mobile/DropdownMobileListItem.js";
-import { DropdownMobileLoader as Q } from "../../Dropdown/mobile/DropdownMobileLoader.js";
-import { Dropdown as U } from "../../Dropdown/Dropdown.js";
-import { s as W, S as X } from "../../../chunks/SuggestFieldMobileDropdownHint-AG8aD2R1.js";
-const Y = ({
-  value: o,
-  options: M,
-  placeholder: C,
-  tooltipHint: a,
-  opened: F,
-  loading: I,
-  tooltipOpen: R,
-  dropdownListLoading: s,
-  clearInputOnFocus: h,
-  setOpened: e,
-  onSelect: c,
-  onFilter: b,
-  onScrollEnd: l
-}, B) => {
-  const [d, n] = D((o == null ? void 0 : o.label) || ""), [m, S] = D(o);
-  (o == null ? void 0 : o.id) !== (m == null ? void 0 : m.id) && (S(o), n((o == null ? void 0 : o.label) || ""));
-  const f = p(!1), y = p(null), H = p(null), k = i(() => {
-    n(h ? "" : (o == null ? void 0 : o.label) || "");
-  }, [h, o == null ? void 0 : o.label]), x = i(
-    (r) => {
-      n(r.target.value), b(r.target.value);
+import { DropdownMobileInput } from "../../Dropdown/mobile/DropdownMobileInput.js";
+import { DropdownMobileList } from "../../Dropdown/mobile/DropdownMobileList.js";
+import { DropdownMobileListItem } from "../../Dropdown/mobile/DropdownMobileListItem.js";
+import { DropdownMobileLoader } from "../../Dropdown/mobile/DropdownMobileLoader.js";
+import { Dropdown } from "../../Dropdown/Dropdown.js";
+import { s as styles, S as SuggestFieldMobileDropdownHint } from "../../../chunks/SuggestFieldMobileDropdownHint-BfUZ4rbH.js";
+const SuggestFieldMobileDropdownBase = ({
+  value,
+  options,
+  placeholder,
+  tooltipHint,
+  opened,
+  loading,
+  tooltipOpen,
+  dropdownListLoading,
+  clearInputOnFocus,
+  setOpened,
+  onSelect,
+  onFilter,
+  onScrollEnd
+}, ref) => {
+  const [inputValue, setInputValue] = useState((value == null ? void 0 : value.label) || "");
+  const [prevValue, setPrevValue] = useState(value);
+  if ((value == null ? void 0 : value.id) !== (prevValue == null ? void 0 : prevValue.id)) {
+    setPrevValue(value);
+    setInputValue((value == null ? void 0 : value.label) || "");
+  }
+  const closedBySelectionRef = useRef(false);
+  const listRef = useRef(null);
+  const targetRef = useRef(null);
+  const handleInputFocus = useCallback(() => {
+    if (!clearInputOnFocus) {
+      setInputValue((value == null ? void 0 : value.label) || "");
+    } else {
+      setInputValue("");
+    }
+  }, [clearInputOnFocus, value == null ? void 0 : value.label]);
+  const handleInputChange = useCallback(
+    (event) => {
+      setInputValue(event.target.value);
+      onFilter(event.target.value);
     },
-    [b]
-  ), N = i(() => {
-    e(!1);
-  }, [e]), V = i(() => {
-    if (f.current) {
-      f.current = !1;
+    [onFilter]
+  );
+  const handleCloseClick = useCallback(() => {
+    setOpened(false);
+  }, [setOpened]);
+  const handleDropdownClose = useCallback(() => {
+    if (closedBySelectionRef.current) {
+      closedBySelectionRef.current = false;
       return;
     }
-    d.length === 0 && o !== void 0 && c(void 0);
-  }, [d.length, c, o]), j = i(
-    (r) => {
-      if (l === void 0 || s)
+    if (inputValue.length === 0 && value !== void 0) {
+      onSelect(void 0);
+    }
+  }, [inputValue.length, onSelect, value]);
+  const handleListScroll = useCallback(
+    (event) => {
+      if (onScrollEnd === void 0 || dropdownListLoading) {
         return;
-      const { scrollHeight: P, scrollTop: T, clientHeight: _ } = r.currentTarget;
-      P - T - _ < 1 && l();
+      }
+      const { scrollHeight, scrollTop, clientHeight } = event.currentTarget;
+      if (scrollHeight - scrollTop - clientHeight < 1) {
+        onScrollEnd();
+      }
     },
-    [l, s]
+    [onScrollEnd, dropdownListLoading]
   );
-  return /* @__PURE__ */ t(
-    U,
+  return /* @__PURE__ */ jsx(
+    Dropdown,
     {
-      opened: F,
-      setOpened: e,
-      targetRef: H,
-      onClose: V,
+      opened,
+      setOpened,
+      targetRef,
+      onClose: handleDropdownClose,
       mobileViewProps: {
-        children: /* @__PURE__ */ g(w, { children: [
-          /* @__PURE__ */ t(
-            G,
+        children: /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsx(
+            DropdownMobileHeader,
             {
-              controlButtons: /* @__PURE__ */ g(w, { children: [
-                I && /* @__PURE__ */ t(Q, {}),
-                /* @__PURE__ */ t(A, { onClick: N })
+              controlButtons: /* @__PURE__ */ jsxs(Fragment, { children: [
+                loading && /* @__PURE__ */ jsx(DropdownMobileLoader, {}),
+                /* @__PURE__ */ jsx(DropdownMobileClose, { onClick: handleCloseClick })
               ] }),
-              children: /* @__PURE__ */ t(
-                J,
+              children: /* @__PURE__ */ jsx(
+                DropdownMobileInput,
                 {
-                  value: d,
-                  placeholder: C,
-                  autoFocus: !0,
-                  onFocus: k,
-                  onChange: x
+                  value: inputValue,
+                  placeholder,
+                  autoFocus: true,
+                  onFocus: handleInputFocus,
+                  onChange: handleInputChange
                 }
               )
             }
           ),
-          /* @__PURE__ */ t(z, { className: W.suggestFieldMobileBody, onScroll: j, children: R ? /* @__PURE__ */ t(X, { children: a }) : /* @__PURE__ */ t(K, { loading: s, ref: y, children: M.map((r) => /* @__PURE__ */ t(
-            L,
+          /* @__PURE__ */ jsx(DropdownMobileBody, { className: styles.suggestFieldMobileBody, onScroll: handleListScroll, children: tooltipOpen ? /* @__PURE__ */ jsx(SuggestFieldMobileDropdownHint, { children: tooltipHint }) : /* @__PURE__ */ jsx(DropdownMobileList, { loading: dropdownListLoading, ref: listRef, children: options.map((option) => /* @__PURE__ */ jsx(
+            DropdownMobileListItem,
             {
-              id: r.id,
-              selected: r.id === (o == null ? void 0 : o.id),
-              showNotificationIcon: r.showNotificationIcon,
+              id: option.id,
+              selected: option.id === (value == null ? void 0 : value.id),
+              showNotificationIcon: option.showNotificationIcon,
               onSelect: () => {
-                f.current = !0, c(r), e(!1);
+                closedBySelectionRef.current = true;
+                onSelect(option);
+                setOpened(false);
               },
-              children: r.content || r.label
+              children: option.content || option.label
             },
-            r.id
+            option.id
           )) }) })
         ] })
       },
-      ref: B
+      ref
     }
   );
-}, ho = q.forwardRef(Y);
+};
+const SuggestFieldMobileDropdown = React__default.forwardRef(SuggestFieldMobileDropdownBase);
 export {
-  ho as SuggestFieldMobileDropdown
+  SuggestFieldMobileDropdown
 };
 //# sourceMappingURL=SuggestFieldMobileDropdown.js.map

package/components/SuggestField/mobile/SuggestFieldMobileDropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestFieldMobileDropdown.js","sources":["../../../../src/components/SuggestField/mobile/SuggestFieldMobileDropdown.tsx"],"sourcesContent":["import React, { useState, useRef, useCallback } from \"react\";\nimport { ISuggestFieldOption } from \"@sberbusiness/triplex-next/components/SuggestField/types\";\nimport { ISuggestFieldMobileDropdownProps } from \"@sberbusiness/triplex-next/components/SuggestField/mobile/types\";\nimport {\n    Dropdown,\n    DropdownMobileHeader,\n    DropdownMobileInput,\n    DropdownMobileLoader,\n    DropdownMobileClose,\n    DropdownMobileBody,\n    DropdownMobileList,\n    DropdownMobileListItem,\n    IDropdownProps,\n} from \"@sberbusiness/triplex-next/components/Dropdown\";\nimport { SuggestFieldMobileDropdownHint } from \"@sberbusiness/triplex-next/components/SuggestField/mobile/SuggestFieldMobileDropdownHint\";\nimport styles from \"../styles/SuggestFieldMobile.module.less\";\n\n/** Отображает мобильный dropdown с полем ввода и списком для выбора. */\nconst SuggestFieldMobileDropdownBase = <T extends ISuggestFieldOption = ISuggestFieldOption>(\n    {\n        value,\n        options,\n        placeholder,\n        tooltipHint,\n        opened,\n        loading,\n        tooltipOpen,\n        dropdownListLoading,\n        clearInputOnFocus,\n        setOpened,\n        onSelect,\n        onFilter,\n        onScrollEnd,\n    }: ISuggestFieldMobileDropdownProps<T>,\n    ref: React.ForwardedRef<HTMLDivElement>,\n) => {\n    const [inputValue, setInputValue] = useState(value?.label || \"\");\n\n    const [prevValue, setPrevValue] = useState(value);\n    if (value?.id !== prevValue?.id) {\n        setPrevValue(value);\n        setInputValue(value?.label || \"\");\n    }\n\n    // Флаг для предотвращения сброса значения, когда закрытие вызвано выбором конкретной опции из списка.\n    const closedBySelectionRef = useRef(false);\n\n    const listRef = useRef<HTMLDivElement>(null);\n    // Не используется в мобильном Dropdown, нужен как обязательное свойство Dropdown.\n    const targetRef = useRef<HTMLDivElement>(null);\n\n    const handleInputFocus = useCallback(() => {\n        if (!clearInputOnFocus) {\n            setInputValue(value?.label || \"\");\n        } else {\n            setInputValue(\"\");\n        }\n    }, [clearInputOnFocus, value?.label]);\n\n    const handleInputChange = useCallback<React.ChangeEventHandler<HTMLInputElement>>(\n        (event) => {\n            setInputValue(event.target.value);\n            onFilter(event.target.value);\n        },\n        [onFilter],\n    );\n\n    const handleCloseClick = useCallback<React.MouseEventHandler<HTMLButtonElement>>(() => {\n        setOpened(false);\n    }, [setOpened]);\n\n    const handleDropdownClose = useCallback<NonNullable<IDropdownProps[\"onClose\"]>>(() => {\n        if (closedBySelectionRef.current) {\n            closedBySelectionRef.current = false;\n            return;\n        }\n\n        if (inputValue.length === 0 && value !== undefined) {\n            onSelect(undefined);\n        }\n    }, [inputValue.length, onSelect, value]);\n\n    const handleListScroll = useCallback<React.UIEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (onScrollEnd === undefined || dropdownListLoading) {\n                return;\n            }\n\n            const { scrollHeight, scrollTop, clientHeight } = event.currentTarget;\n\n            if (scrollHeight - scrollTop - clientHeight < 1) {\n                onScrollEnd();\n            }\n        },\n        [onScrollEnd, dropdownListLoading],\n    );\n\n    return (\n        <Dropdown\n            opened={opened}\n            setOpened={setOpened}\n            targetRef={targetRef}\n            onClose={handleDropdownClose}\n            mobileViewProps={{\n                children: (\n                    <>\n                        <DropdownMobileHeader\n                            controlButtons={\n                                <>\n                                    {loading && <DropdownMobileLoader />}\n                                    <DropdownMobileClose onClick={handleCloseClick} />\n                                </>\n                            }\n                        >\n                            <DropdownMobileInput\n                                value={inputValue}\n                                placeholder={placeholder}\n                                autoFocus={true}\n                                onFocus={handleInputFocus}\n                                onChange={handleInputChange}\n                            />\n                        </DropdownMobileHeader>\n\n                        <DropdownMobileBody className={styles.suggestFieldMobileBody} onScroll={handleListScroll}>\n                            {tooltipOpen ? (\n                                <SuggestFieldMobileDropdownHint>{tooltipHint}</SuggestFieldMobileDropdownHint>\n                            ) : (\n                                <DropdownMobileList loading={dropdownListLoading} ref={listRef}>\n                                    {options.map((option) => (\n                                        <DropdownMobileListItem\n                                            key={option.id}\n                                            id={option.id}\n                                            selected={option.id === value?.id}\n                                            showNotificationIcon={option.showNotificationIcon}\n                                            onSelect={() => {\n                                                closedBySelectionRef.current = true;\n                                                onSelect(option);\n                                                setOpened(false);\n                                            }}\n                                        >\n                                            {option.content || option.label}\n                                        </DropdownMobileListItem>\n                                    ))}\n                                </DropdownMobileList>\n                            )}\n                        </DropdownMobileBody>\n                    </>\n                ),\n            }}\n            ref={ref}\n        />\n    );\n};\n\nexport const SuggestFieldMobileDropdown = React.forwardRef(SuggestFieldMobileDropdownBase) as <\n    T extends ISuggestFieldOption = ISuggestFieldOption,\n>(\n    props: ISuggestFieldMobileDropdownProps<T> & React.RefAttributes<HTMLDivElement>,\n) => JSX.Element;\n"],"names":["React"],"mappings":"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"}

package/components/SuggestField/mobile/SuggestFieldMobileDropdownHint.js

@@ -4,8 +4,8 @@ import "../../Typography/Caption.js";
 import "../../Typography/CodeText.js";
 import "../../Typography/Text.js";
 import "../../Typography/Title.js";
-import { S as g } from "../../../chunks/SuggestFieldMobileDropdownHint-AG8aD2R1.js";
+import { S } from "../../../chunks/SuggestFieldMobileDropdownHint-BfUZ4rbH.js";
 export {
-  g as SuggestFieldMobileDropdownHint
+  S as SuggestFieldMobileDropdownHint
 };
 //# sourceMappingURL=SuggestFieldMobileDropdownHint.js.map

package/components/SuggestField/mobile/SuggestFieldMobileDropdownHint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SuggestFieldMobileDropdownHint.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;"}

package/components/SuggestField/mobile/index.js

@@ -1,9 +1,9 @@
-import { SuggestFieldMobile as r } from "./SuggestFieldMobile.js";
-import { SuggestFieldMobileDropdown as t } from "./SuggestFieldMobileDropdown.js";
-import { S as l } from "../../../chunks/SuggestFieldMobileDropdownHint-AG8aD2R1.js";
+import { SuggestFieldMobile } from "./SuggestFieldMobile.js";
+import { SuggestFieldMobileDropdown } from "./SuggestFieldMobileDropdown.js";
+import { S } from "../../../chunks/SuggestFieldMobileDropdownHint-BfUZ4rbH.js";
 export {
-  r as SuggestFieldMobile,
-  t as SuggestFieldMobileDropdown,
-  l as SuggestFieldMobileDropdownHint
+  SuggestFieldMobile,
+  SuggestFieldMobileDropdown,
+  S as SuggestFieldMobileDropdownHint
 };
 //# sourceMappingURL=index.js.map

package/components/SuggestField/mobile/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/components/SuggestField/mobile/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/components/SuggestField/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}