@sima-land/ui-nucleons 45.0.0-alpha.4 → 45.0.0-alpha.5

package/screen/slots.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { TopBarProps } from '../top-bar';
 export interface HeaderSlotProps extends TopBarProps {
     /** Будет вызвана при нажатии на кнопку-стрелку. */
@@ -15,9 +15,9 @@ export declare const HeaderSlot: ({ divided, title, subtitle, buttons, onBack, o
 /**
  * Слот основного контента экрана.
  */
-export declare const BodySlot: React.ForwardRefExoticComponent<{
+export declare const BodySlot: import("react").ForwardRefExoticComponent<{
     children?: React.ReactNode;
-} & React.RefAttributes<HTMLDivElement | null>>;
+} & import("react").RefAttributes<HTMLDivElement | null>>;
 /**
  * Слот футера экрана.
  * @param props Свойства.

package/screen/slots.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,10 +15,11 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FooterSlot = exports.BodySlot = exports.HeaderSlot = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const lodash_1 = require("lodash");
-const arrow_left_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/arrow-left"));
-const cross_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/cross"));
+const ArrowLeft_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/ArrowLeft"));
+const Cross_1 = __importDefault(require("@sima-land/ui-quarks/icons/24x24/Stroked/Cross"));
 const page_scroll_lock_1 = require("../_internal/page-scroll-lock");
 const hooks_1 = require("../hooks");
 const loading_overlay_1 = require("../loading-overlay");
@@ -55,11 +33,11 @@ const top_bar_1 = require("../top-bar");
  */
 const HeaderSlot = (_a) => {
     var { divided, title, subtitle, buttons, onBack, onClose } = _a, restProps = __rest(_a, ["divided", "title", "subtitle", "buttons", "onBack", "onClose"]);
-    return (react_1.default.createElement(top_bar_1.TopBar, Object.assign({}, restProps, { size: 's', title: title, subtitle: subtitle, divided: divided, buttons: Object.assign(Object.assign({}, buttons), { start: onBack
+    return ((0, jsx_runtime_1.jsx)(top_bar_1.TopBar, Object.assign({}, restProps, { size: 's', title: title, subtitle: subtitle, divided: divided, buttons: Object.assign(Object.assign({}, buttons), { start: onBack
                 ? {
                     // ВАЖНО: не подмешиваем свойства из buttons.start
                     // чтобы не распылять конфигурацию одной и той же кнопки по нескольким местам
-                    icon: react_1.default.createElement(arrow_left_1.default, null),
+                    icon: (0, jsx_runtime_1.jsx)(ArrowLeft_1.default, {}),
                     onClick: onBack,
                     'aria-label': 'Вернуться назад',
                     'data-testid': 'screen:back',
@@ -68,7 +46,7 @@ const HeaderSlot = (_a) => {
                 ? {
                     // ВАЖНО: не подмешиваем свойства из buttons.end
                     // чтобы не распылять конфигурацию одной и той же кнопки по нескольким местам
-                    icon: react_1.default.createElement(cross_1.default, null),
+                    icon: (0, jsx_runtime_1.jsx)(Cross_1.default, {}),
                     onClick: onClose,
                     'aria-label': `Закрыть ${title || ''}`.trim(),
                     'data-testid': 'screen:close',
@@ -90,12 +68,12 @@ exports.BodySlot = (0, react_1.forwardRef)(function BodySlot({ children }, outer
     (0, hooks_1.useInfiniteScroll)(ref, { onFullScroll, threshold: fullScrollThreshold });
     return (
     // ВАЖНО: элемент с ref должен выводиться всегда (без условий), т.к. он нужен для блокировки прокрутки
-    react_1.default.createElement("div", { ref: ref, className: screen_module_scss_1.default.body, "data-testid": 'screen:body' }, loading ? (react_1.default.createElement(loading_overlay_1.LoadingOverlay, Object.assign({}, loadingOverlayProps, { fill: false, style: { height: '100%' } }))) : (children)));
+    (0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: screen_module_scss_1.default.body, "data-testid": 'screen:body' }, { children: loading ? ((0, jsx_runtime_1.jsx)(loading_overlay_1.LoadingOverlay, Object.assign({}, loadingOverlayProps, { fill: false, style: { height: '100%' } }))) : (children) })));
 });
 /**
  * Слот футера экрана.
  * @param props Свойства.
  * @return Элемент.
  */
-const FooterSlot = ({ children }) => react_1.default.createElement(react_1.default.Fragment, null, children);
+const FooterSlot = ({ children }) => (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
 exports.FooterSlot = FooterSlot;

package/select/parts/block.js

@@ -1,38 +1,16 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectFieldBlock = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const utils_1 = require("../utils");
 const field_block_1 = require("../../field-block");
 const colors_1 = require("../../colors");
-const up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/up"));
-const down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/down"));
+const Up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Up"));
+const Down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Down"));
 const block_module_scss_1 = __importDefault(require("./block.module.scss"));
 const classnames_1 = __importDefault(require("classnames"));
 /**
@@ -44,12 +22,12 @@ function SelectFieldBlock(props) {
     var _a;
     const binding = (0, react_1.useContext)(utils_1.SelectContext);
     const [focused, setFocused] = (0, react_1.useState)(false);
-    const ArrowSVG = binding.opened ? up_1.default : down_1.default;
+    const ArrowSVG = binding.opened ? Up_1.default : Down_1.default;
     // @todo прокидывать ref в props.blockRef при необходимости
     const ref = (0, react_1.useRef)(null);
     (0, react_1.useImperativeHandle)(binding.anchorRef, () => ref.current);
     (0, react_1.useImperativeHandle)(binding.openerRef, () => ref.current);
-    return (react_1.default.createElement(field_block_1.FieldBlock, Object.assign({ label: binding.label, adornmentEnd: react_1.default.createElement(ArrowSVG, { fill: colors_1.COLORS.get('basic-gray24') }) }, props, { failed: binding.failed, disabled: binding.disabled, fixedHeight: true, blockRef: ref, blockProps: Object.assign(Object.assign({}, props === null || props === void 0 ? void 0 : props.blockProps), { onFocus: event => {
+    return ((0, jsx_runtime_1.jsx)(field_block_1.FieldBlock, Object.assign({ label: binding.label, adornmentEnd: (0, jsx_runtime_1.jsx)(ArrowSVG, { fill: colors_1.COLORS.get('basic-gray24') }) }, props, { failed: binding.failed, disabled: binding.disabled, fixedHeight: true, blockRef: ref, blockProps: Object.assign(Object.assign({}, props === null || props === void 0 ? void 0 : props.blockProps), { onFocus: event => {
                 var _a, _b;
                 setFocused(true);
                 (_b = (_a = props.blockProps) === null || _a === void 0 ? void 0 : _a.onFocus) === null || _b === void 0 ? void 0 : _b.call(_a, event);

package/select/parts/button.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,11 +15,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectTextButton = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const text_button_1 = require("../../text-button");
 const utils_1 = require("../utils");
-const up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/up"));
-const down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/down"));
+const Up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Up"));
+const Down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Down"));
 /**
  * Компонент открывашки в виде текстовой кнопки.
  * @param props Свойства.
@@ -52,11 +30,11 @@ function SelectTextButton(_a) {
     var { buttonRef: buttonRefProp, children, onKeyDown, onMouseDown } = _a, props = __rest(_a, ["buttonRef", "children", "onKeyDown", "onMouseDown"]);
     const buttonRef = (0, react_1.useRef)(null);
     const binding = (0, react_1.useContext)(utils_1.SelectContext);
-    const ArrowSVG = binding.opened ? up_1.default : down_1.default;
+    const ArrowSVG = binding.opened ? Up_1.default : Down_1.default;
     (0, react_1.useImperativeHandle)(buttonRefProp, () => buttonRef.current);
     (0, react_1.useImperativeHandle)(binding.anchorRef, () => buttonRef.current);
     (0, react_1.useImperativeHandle)(binding.openerRef, () => buttonRef.current);
-    return (react_1.default.createElement(text_button_1.TextButton, Object.assign({ iconGutter: 4, endIcon: ArrowSVG }, props, { as: 'button', onMouseDown: event => {
+    return ((0, jsx_runtime_1.jsx)(text_button_1.TextButton, Object.assign({ iconGutter: 4, endIcon: ArrowSVG }, props, { as: 'button', onMouseDown: event => {
             var _a;
             (_a = binding.onMouseDown) === null || _a === void 0 ? void 0 : _a.call(binding, event);
             onMouseDown === null || onMouseDown === void 0 ? void 0 : onMouseDown(event);
@@ -64,6 +42,6 @@ function SelectTextButton(_a) {
             var _a;
             (_a = binding.onKeyDown) === null || _a === void 0 ? void 0 : _a.call(binding, event);
             onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
-        }, disabled: binding.disabled, buttonRef: buttonRef, role: 'combobox' }), children !== null && children !== void 0 ? children : (binding.value || binding.label)));
+        }, disabled: binding.disabled, buttonRef: buttonRef, role: 'combobox' }, { children: children !== null && children !== void 0 ? children : (binding.value || binding.label) })));
 }
 exports.SelectTextButton = SelectTextButton;

package/select/parts/menu.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,7 +15,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SelectMenu = void 0;
-const react_1 = __importStar(require("react"));
+const react_1 = require("react");
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_2 = require("react");
 const dropdown_1 = require("../../dropdown");
 const dropdown_item_1 = require("../../dropdown-item");
 const utils_1 = require("../../dropdown-item/utils");
@@ -56,13 +35,13 @@ const MenuItemAttr = {
  */
 function SelectMenu(_a) {
     var { loading, children, menuRef, value, onKeyDown, onItemSelect } = _a, restProps = __rest(_a, ["loading", "children", "menuRef", "value", "onKeyDown", "onItemSelect"]);
-    const ref = (0, react_1.useRef)(null);
-    const osComponentRef = (0, react_1.useRef)(null);
-    const [activeIndex, setActiveIndex] = (0, react_1.useState)(-1);
-    const items = react_1.Children.toArray(children).filter(utils_1.DropdownItemUtils.is);
-    (0, react_1.useImperativeHandle)(menuRef, () => ref.current);
+    const ref = (0, react_2.useRef)(null);
+    const osComponentRef = (0, react_2.useRef)(null);
+    const [activeIndex, setActiveIndex] = (0, react_2.useState)(-1);
+    const items = react_2.Children.toArray(children).filter(utils_1.DropdownItemUtils.is);
+    (0, react_2.useImperativeHandle)(menuRef, () => ref.current);
     // прокрутка до элемента списка
-    (0, react_1.useEffect)(() => {
+    (0, react_2.useEffect)(() => {
         var _a, _b;
         const menu = ref.current;
         const itemSelector = `[${MenuItemAttr.name}="${MenuItemAttr.value}"]`;
@@ -74,7 +53,7 @@ function SelectMenu(_a) {
             });
         }
     }, [activeIndex]);
-    const handleMenuKeyDown = (0, react_1.useCallback)(event => {
+    const handleMenuKeyDown = (0, react_2.useCallback)(event => {
         onKeyDown === null || onKeyDown === void 0 ? void 0 : onKeyDown(event);
         switch (event.code) {
             case 'Enter': {
@@ -93,13 +72,13 @@ function SelectMenu(_a) {
                 break;
         }
     }, [items, activeIndex, onKeyDown]);
-    const handleItemClick = (0, react_1.useCallback)((item) => item.props.disabled
+    const handleItemClick = (0, react_2.useCallback)((item) => item.props.disabled
         ? undefined
         : event => {
             var _a, _b;
             (_b = (_a = item.props).onClick) === null || _b === void 0 ? void 0 : _b.call(_a, event);
             onItemSelect === null || onItemSelect === void 0 ? void 0 : onItemSelect(item);
         }, [onItemSelect]);
-    return (react_1.default.createElement(dropdown_1.Dropdown, Object.assign({}, restProps, { ref: ref, tabIndex: 0, role: 'listbox', onKeyDown: handleMenuKeyDown, className: (0, classnames_1.default)(menu_module_scss_1.default.menu, restProps.className), customScrollbarProps: { osComponentRef } }), loading ? (react_1.default.createElement(dropdown_loading_1.DropdownLoading, { "data-testid": 'select:loading-area' })) : (items.map((item, index) => (react_1.default.createElement(dropdown_item_1.DropdownItem, Object.assign({ checked: activeIndex === index, selected: value === utils_1.DropdownItemUtils.getValue(item) }, item.props, { key: index, role: 'option', onClick: handleItemClick(item) }, { [MenuItemAttr.name]: MenuItemAttr.value })))))));
+    return ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, restProps, { ref: ref, tabIndex: 0, role: 'listbox', onKeyDown: handleMenuKeyDown, className: (0, classnames_1.default)(menu_module_scss_1.default.menu, restProps.className), customScrollbarProps: { osComponentRef } }, { children: loading ? ((0, jsx_runtime_1.jsx)(dropdown_loading_1.DropdownLoading, { "data-testid": 'select:loading-area' })) : (items.map((item, index) => ((0, react_1.createElement)(dropdown_item_1.DropdownItem, Object.assign({ checked: activeIndex === index, selected: value === utils_1.DropdownItemUtils.getValue(item) }, item.props, { key: index, role: 'option', onClick: handleItemClick(item) }, { [MenuItemAttr.name]: MenuItemAttr.value }))))) })));
 }
 exports.SelectMenu = SelectMenu;

package/select/select.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -35,7 +12,8 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const utils_1 = require("./utils");
 const identity_1 = require("../hooks/identity");
 const utils_2 = require("../dropdown-item/utils");
@@ -49,7 +27,7 @@ const utils_3 = require("../dropdown/utils");
  * @param props Свойства.
  * @return Элемент.
  */
-function Select({ children, disabled, failed, loading, onValueChange, onMenuToggle, value, defaultValue, label, opener = react_1.default.createElement(block_1.SelectFieldBlock, null), renderValue = v => v, dropdownProps, }) {
+function Select({ children, disabled, failed, loading, onValueChange, onMenuToggle, value, defaultValue, label, opener = (0, jsx_runtime_1.jsx)(block_1.SelectFieldBlock, {}), renderValue = v => v, dropdownProps, }) {
     // @todo по аналогии с <select /> надо проверять, есть ли значение в списке переданных
     const [initialValue] = (0, react_1.useState)(() => { var _a; return (_a = value !== null && value !== void 0 ? value : defaultValue) !== null && _a !== void 0 ? _a : ''; });
     const [currentValue, setCurrentValue] = (0, react_1.useState)(initialValue);
@@ -136,9 +114,7 @@ function Select({ children, disabled, failed, loading, onValueChange, onMenuTogg
             setNeedMenu(false);
             (_a = openerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
         } });
-    return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.createElement(utils_1.SelectContext.Provider, { value: openerBinding }, (0, react_1.isValidElement)(opener) && opener),
-        react_1.default.createElement(react_2.FloatingPortal, { id: '' }, needMenu && react_1.default.createElement(menu_1.SelectMenu, Object.assign({}, menuProps), children))));
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(utils_1.SelectContext.Provider, Object.assign({ value: openerBinding }, { children: (0, react_1.isValidElement)(opener) && opener })), (0, jsx_runtime_1.jsx)(react_2.FloatingPortal, Object.assign({ id: '' }, { children: needMenu && (0, jsx_runtime_1.jsx)(menu_1.SelectMenu, Object.assign({}, menuProps, { children: children })) }))] }));
 }
 exports.Select = Select;
 Select.FieldBlock = block_1.SelectFieldBlock;

package/select-deprecated/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { TextFieldProps } from '../text-field';
 type Size = 's' | 'm' | 'l' | 'xl';
 export interface SelectProps extends Omit<TextFieldProps, 'style' | 'endAdornment'> {

package/select-deprecated/index.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,14 +15,15 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Select = exports.renderDefaultArrow = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const dropdown_1 = require("../dropdown");
 const dropdown_item_1 = require("../dropdown-item");
 const text_field_1 = require("../text-field");
 const dropdown_2 = require("../_internal/utils/dropdown");
 const bind_1 = __importDefault(require("classnames/bind"));
-const down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/down"));
-const up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/up"));
+const Down_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Down"));
+const Up_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Arrows/Up"));
 const select_module_scss_1 = __importDefault(require("./select.module.scss"));
 const colors_1 = require("../colors");
 const dropdown_loading_1 = require("../_internal/dropdown-loading");
@@ -57,8 +35,8 @@ const cx = bind_1.default.bind(select_module_scss_1.default);
  * @return Элемент.
  */
 const renderDefaultArrow = (opened) => {
-    const ArrowSVG = opened ? up_1.default : down_1.default;
-    return react_1.default.createElement(ArrowSVG, { fill: colors_1.COLORS.get('basic-gray38') });
+    const ArrowSVG = opened ? Up_1.default : Down_1.default;
+    return (0, jsx_runtime_1.jsx)(ArrowSVG, { fill: colors_1.COLORS.get('basic-gray38') });
 };
 exports.renderDefaultArrow = renderDefaultArrow;
 /**
@@ -78,35 +56,33 @@ const Select = (_a) => {
         onMenuToggle && onMenuToggle(opened);
     }, [opened]);
     (0, hooks_1.useOutsideClick)(rootRef, toggleMenu.bind(null, false));
-    return (react_1.default.createElement("div", { ref: rootRef, style: style, className: cx('root', className), "data-testid": dataTestId },
-        react_1.default.createElement(text_field_1.TextField, Object.assign({}, restProps, { size: size, blockProps: {
-                ref: fieldRef,
-                tabIndex: 0,
-                onMouseDown: () => {
-                    toggleMenu(a => !a);
-                },
-                onKeyDown: e => {
-                    e.key === 'Enter' && toggleMenu(true);
-                },
-            }, onClick: e => {
-                e.preventDefault();
-                onClick && onClick(e);
-            }, className: select_module_scss_1.default.field, "data-testid": 'select:field', label: label, focused: opened, baseInputProps: {
-                // чтобы не ловить фокус на поле
-                style: { pointerEvents: 'none' },
-                tabIndex: -1,
-            }, value: value, multiline: false, variant: 'desktop', readOnly: true, endAdornment: typeof endAdornment === 'function' ? endAdornment(opened) : endAdornment })),
-        opened && (loading || options.length > 0) && (react_1.default.createElement(dropdown_1.Dropdown, Object.assign({}, (0, dropdown_2.placeDropdown)(size), { ref: menuRef, "data-testid": 'select:menu', role: 'menu', tabIndex: -1, className: cx('menu'), onKeyDown: event => {
-                if (event.key === 'Enter') {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: rootRef, style: style, className: cx('root', className), "data-testid": dataTestId }, { children: [(0, jsx_runtime_1.jsx)(text_field_1.TextField, Object.assign({}, restProps, { size: size, blockProps: {
+                    ref: fieldRef,
+                    tabIndex: 0,
+                    onMouseDown: () => {
+                        toggleMenu(a => !a);
+                    },
+                    onKeyDown: e => {
+                        e.key === 'Enter' && toggleMenu(true);
+                    },
+                }, onClick: e => {
+                    e.preventDefault();
+                    onClick && onClick(e);
+                }, className: select_module_scss_1.default.field, "data-testid": 'select:field', label: label, focused: opened, baseInputProps: {
+                    // чтобы не ловить фокус на поле
+                    style: { pointerEvents: 'none' },
+                    tabIndex: -1,
+                }, value: value, multiline: false, variant: 'desktop', readOnly: true, endAdornment: typeof endAdornment === 'function' ? endAdornment(opened) : endAdornment })), opened && (loading || options.length > 0) && ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({}, (0, dropdown_2.placeDropdown)(size), { ref: menuRef, "data-testid": 'select:menu', role: 'menu', tabIndex: -1, className: cx('menu'), onKeyDown: event => {
+                    if (event.key === 'Enter') {
+                        toggleMenu(false);
+                        fieldRef.current && fieldRef.current.focus();
+                    }
+                }, onBlur: () => {
                     toggleMenu(false);
                     fieldRef.current && fieldRef.current.focus();
-                }
-            }, onBlur: () => {
-                toggleMenu(false);
-                fieldRef.current && fieldRef.current.focus();
-            } }), loading ? (react_1.default.createElement(dropdown_loading_1.DropdownLoading, { "data-testid": 'select:loading-area' })) : (options.map((option, index) => (react_1.default.createElement(dropdown_item_1.DropdownItem, { size: optionSize, key: index, role: 'menuitem', onClick: () => {
-                toggleMenu(false);
-                onSelect && onSelect(option);
-            } }, renderOption(option)))))))));
+                } }, { children: loading ? ((0, jsx_runtime_1.jsx)(dropdown_loading_1.DropdownLoading, { "data-testid": 'select:loading-area' })) : (options.map((option, index) => ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ size: optionSize, role: 'menuitem', onClick: () => {
+                        toggleMenu(false);
+                        onSelect && onSelect(option);
+                    } }, { children: renderOption(option) }), index)))) })))] })));
 };
 exports.Select = Select;

package/side-page/index.js

@@ -1,27 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
 var __rest = (this && this.__rest) || function (s, e) {
     var t = {};
     for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
@@ -38,7 +15,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SidePage = void 0;
-const react_1 = __importStar(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
 const define_slots_1 = require("../helpers/define-slots");
 const page_scroll_lock_1 = require("../_internal/page-scroll-lock");
 const slots_1 = require("./slots");
@@ -62,7 +40,7 @@ const transitionClasses = {
 function SidePage(_a) {
     var { shown, withTransitions, onEnter, onEntering, onEntered, onExit, onExiting, onExited } = _a, restProps = __rest(_a, ["shown", "withTransitions", "onEnter", "onEntering", "onEntered", "onExit", "onExiting", "onExited"]);
     const transitionDuration = withTransitions ? 300 : 0;
-    return (react_1.default.createElement(CSSTransition_1.default, { in: shown, timeout: transitionDuration, classNames: transitionClasses, unmountOnExit: true, onEntering: onEntering, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited }, transitionStatus => (react_1.default.createElement(SidePageInner, Object.assign({}, restProps, { transitionStatus, transitionDuration })))));
+    return ((0, jsx_runtime_1.jsx)(CSSTransition_1.default, Object.assign({ in: shown, timeout: transitionDuration, classNames: transitionClasses, unmountOnExit: true, onEntering: onEntering, onEnter: onEnter, onEntered: onEntered, onExit: onExit, onExiting: onExiting, onExited: onExited }, { children: transitionStatus => ((0, jsx_runtime_1.jsx)(SidePageInner, Object.assign({}, restProps, { transitionStatus, transitionDuration }))) })));
 }
 exports.SidePage = SidePage;
 /**
@@ -80,11 +58,7 @@ function SidePageInner({ size = 'm', children, onClose, withScrollDisable = fals
         footer: SidePage.Footer,
     });
     const overlayProps = Object.assign({ style: { '--transition-duration': `${transitionDuration}ms` } }, (transitionStatus !== 'entering' && overlayClickBind));
-    return (react_1.default.createElement(modal_overlay_1.ModalOverlay, Object.assign({}, overlayProps),
-        react_1.default.createElement("div", { className: cx('side-page', `size-${size}`) },
-            header,
-            react_1.default.createElement("div", { ref: ref, className: cx('body') }, body),
-            footer)));
+    return ((0, jsx_runtime_1.jsx)(modal_overlay_1.ModalOverlay, Object.assign({}, overlayProps, { children: (0, jsx_runtime_1.jsxs)("div", Object.assign({ className: cx('side-page', `size-${size}`) }, { children: [header, (0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: cx('body') }, { children: body })), footer] })) })));
 }
 SidePage.Header = slots_1.SidePageHeader;
 SidePage.Body = slots_1.SidePageBody;

package/side-page/slots.js

@@ -15,7 +15,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SidePageFooter = exports.SidePageBody = exports.SidePageHeader = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const top_bar_1 = require("../top-bar");
 const bottom_bar_1 = require("../bottom-bar");
 const utils_1 = require("../top-bar/utils");
@@ -28,7 +28,7 @@ const side_page_module_scss_1 = __importDefault(require("./side-page.module.scss
  */
 function SidePageHeader(_a) {
     var { onBack, onClose, buttons } = _a, topBarProps = __rest(_a, ["onBack", "onClose", "buttons"]);
-    return (react_1.default.createElement(top_bar_1.TopBar, Object.assign({}, topBarProps, { size: 'unset', className: side_page_module_scss_1.default.header, buttons: (0, utils_1.navigationButtons)({ buttons, onBack, onClose }) })));
+    return ((0, jsx_runtime_1.jsx)(top_bar_1.TopBar, Object.assign({}, topBarProps, { size: 'unset', className: side_page_module_scss_1.default.header, buttons: (0, utils_1.navigationButtons)({ buttons, onBack, onClose }) })));
 }
 exports.SidePageHeader = SidePageHeader;
 /**
@@ -37,7 +37,7 @@ exports.SidePageHeader = SidePageHeader;
  * @return Элемент.
  */
 function SidePageBody({ children }) {
-    return react_1.default.createElement(react_1.default.Fragment, null, children);
+    return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children });
 }
 exports.SidePageBody = SidePageBody;
 /**
@@ -47,6 +47,6 @@ exports.SidePageBody = SidePageBody;
  */
 function SidePageFooter(_a) {
     var props = __rest(_a, []);
-    return react_1.default.createElement(bottom_bar_1.BottomBar, Object.assign({}, props, { size: 'unset', className: (0, classnames_1.default)(side_page_module_scss_1.default.footer) }));
+    return (0, jsx_runtime_1.jsx)(bottom_bar_1.BottomBar, Object.assign({}, props, { size: 'unset', className: (0, classnames_1.default)(side_page_module_scss_1.default.footer) }));
 }
 exports.SidePageFooter = SidePageFooter;

package/spinner/index.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+/// <reference types="react" />
 import { Token } from '../colors';
 /**
  * @deprecated Следует использовать 's' | 'm' | 'l'.

package/spinner/index.js

@@ -4,7 +4,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.SpinnerSVG = exports.Spinner = exports.DIAMETERS = void 0;
-const react_1 = __importDefault(require("react"));
+const jsx_runtime_1 = require("react/jsx-runtime");
 const lodash_1 = require("lodash");
 const colors_1 = require("../colors");
 const bind_1 = __importDefault(require("classnames/bind"));
@@ -28,8 +28,7 @@ const DEFAULT_COLOR = 'basic-blue';
 function Spinner({ size = 'm', color = DEFAULT_COLOR, className, style, 'data-testid': testId = 'spinner', }) {
     const readySize = (0, lodash_1.has)(exports.DIAMETERS, size) ? size : 'm';
     const readyColor = colors_1.COLORS.has(color) ? color : DEFAULT_COLOR;
-    return (react_1.default.createElement("div", { className: className, style: style, "data-testid": testId },
-        react_1.default.createElement(SpinnerSVG, { size: readySize, color: readyColor, "data-testid": null })));
+    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ className: className, style: style, "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)(SpinnerSVG, { size: readySize, color: readyColor, "data-testid": null }) })));
 }
 exports.Spinner = Spinner;
 /**
@@ -41,7 +40,6 @@ exports.Spinner = Spinner;
 function SpinnerSVG({ size = 'm', color = DEFAULT_COLOR, className, style, 'data-testid': testId = 'spinner', }) {
     const diameter = exports.DIAMETERS[size];
     const radius = diameter / 2;
-    return (react_1.default.createElement("svg", { style: style, className: cx('spinner', `size-${size}`, className), viewBox: `0 0 ${diameter} ${diameter}`, width: diameter, height: diameter, stroke: colors_1.COLORS.get(color), "data-testid": testId },
-        react_1.default.createElement("circle", { className: cx('circle'), cx: radius, cy: radius, r: radius - 1 })));
+    return ((0, jsx_runtime_1.jsx)("svg", Object.assign({ style: style, className: cx('spinner', `size-${size}`, className), viewBox: `0 0 ${diameter} ${diameter}`, width: diameter, height: diameter, stroke: colors_1.COLORS.get(color), "data-testid": testId }, { children: (0, jsx_runtime_1.jsx)("circle", { className: cx('circle'), cx: radius, cy: radius, r: radius - 1 }) })));
 }
 exports.SpinnerSVG = SpinnerSVG;