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

package/phone-input-deprecated/index.d.ts

@@ -1,29 +0,0 @@
-/// <reference types="react" />
-import { TextFieldProps } from '../text-field';
-import { MaskState } from '../masked-field';
-import { Country } from '../phone-input/presets';
-interface PhoneInputStyle extends React.CSSProperties {
-    '--phone-input-width'?: number | string;
-}
-export interface PhoneInputProps extends Omit<TextFieldProps, 'onChange' | 'onBlur' | 'value' | 'ref' | 'style' | 'multiline'> {
-    /** Сработает при "blur". */
-    onBlur?: (e: React.FocusEvent<HTMLInputElement>, s: MaskState & {
-        ready?: boolean;
-    }) => void;
-    /** Сработает при изменении поля "Другое". Не рекомендуется использовать. */
-    onChange?: React.ChangeEventHandler<HTMLInputElement>;
-    /** Срабатывает при изменении страны. */
-    onCountrySelect?: (c: Country) => void;
-    /** Значение. */
-    value?: string;
-    /** Стили. */
-    style?: PhoneInputStyle;
-}
-/**
- * Компонент поля ввода номера телефона.
- * @param props Параметры компонента.
- * @deprecated Нужно использовать новую реализацию "@sima-land/ui-nucleons/phone-input".
- * @return Элемент.
- */
-export declare const PhoneInput: ({ "data-testid": testId, className, label, onBlur, onCountrySelect, style, value, onChange, ...restProps }: PhoneInputProps) => JSX.Element;
-export {};

package/phone-input-deprecated/index.js

@@ -1,98 +0,0 @@
-"use strict";
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PhoneInput = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-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 dropdown_1 = require("../dropdown");
-const dropdown_item_1 = require("../dropdown-item");
-const text_field_1 = require("../text-field");
-const masked_field_1 = require("../masked-field");
-const hooks_1 = require("../hooks");
-const presets_1 = require("../phone-input/presets");
-const utils_1 = require("../phone-input/utils");
-const bind_1 = __importDefault(require("classnames/bind"));
-const phone_input_module_scss_1 = __importDefault(require("./phone-input.module.scss"));
-const cx = bind_1.default.bind(phone_input_module_scss_1.default);
-/**
- * Удаляет из значения код переданной страны.
- * @param value Значение.
- * @param country Данные страны.
- * @return Значение без кода.
- */
-const formatValue = (value, country) => value.replace(/\D/g, '').slice(country.codeChars.length);
-/**
- * Компонент поля ввода номера телефона.
- * @param props Параметры компонента.
- * @deprecated Нужно использовать новую реализацию "@sima-land/ui-nucleons/phone-input".
- * @return Элемент.
- */
-const PhoneInput = (_a) => {
-    var { 'data-testid': testId, className, label = 'Телефон', onBlur, onCountrySelect, style, value = '', onChange } = _a, restProps = __rest(_a, ['data-testid', "className", "label", "onBlur", "onCountrySelect", "style", "value", "onChange"]);
-    // маску определяем автоматически только при старте
-    const [country, setCountry] = (0, react_1.useState)(() => (0, utils_1.defineCountry)(value));
-    const [cleanValue, setCleanValue] = (0, react_1.useState)(() => formatValue(value, country));
-    const [withMenu, toggleMenu] = (0, react_1.useState)(false);
-    const rootRef = (0, react_1.useRef)(null);
-    const openerRef = (0, react_1.useRef)(null);
-    (0, react_1.useEffect)(() => {
-        setCleanValue(formatValue(value, country));
-    }, [value]);
-    (0, hooks_1.useOutsideClick)(rootRef, () => {
-        toggleMenu(false);
-    });
-    const AdornmentSVG = withMenu ? Up_1.default : Down_1.default;
-    const commonFieldProps = Object.assign(Object.assign({}, restProps), { label, multiline: false, className: cx('field'), endAdornment: ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: openerRef, className: cx('adornment'), "data-testid": 'phone-input:dropdown-opener', onClick: () => {
-                toggleMenu(a => !a);
-            } }, { children: [(0, jsx_runtime_1.jsx)("img", { alt: '', width: 24, height: 24, src: country.imageSrc }), (0, jsx_runtime_1.jsx)(AdornmentSVG, { className: cx('arrow') })] }))), onClick: event => {
-            const opener = openerRef.current;
-            if (opener instanceof Node &&
-                event.target instanceof Node &&
-                (opener === event.target || opener.contains(event.target))) {
-                event.preventDefault(); // чтобы не фокусировалось на поле
-            }
-            else {
-                toggleMenu(false);
-            }
-        } });
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ ref: rootRef, "data-testid": testId, style: style, className: cx('root', className) }, { children: [country.id === presets_1.IDS.other ? ((0, jsx_runtime_1.jsx)(text_field_1.TextField, Object.assign({}, commonFieldProps, { value: cleanValue, onChange: (e) => {
-                    const nextValue = e.target.value.replace(/\D/g, '').slice(0, 20);
-                    e.target.value = nextValue;
-                    setCleanValue(nextValue);
-                    onChange && onChange(e);
-                }, onBlur: e => {
-                    onBlur &&
-                        onBlur(e, {
-                            value: e.target.value,
-                            cleanValue: e.target.value,
-                            ready: e.target.value.length > 0,
-                        });
-                } }))) : ((0, jsx_runtime_1.jsx)(masked_field_1.MaskedField, Object.assign({}, commonFieldProps, { 
-                // убираем код страны, так как он уже зашит в маску
-                value: cleanValue, mask: country.mask, onBlur: (event, state) => {
-                    onBlur &&
-                        onBlur(event, Object.assign(Object.assign({}, state), { 
-                            // вставляем код страны обратно в чистое значение
-                            cleanValue: `${country.codeChars}${state.cleanValue}` }));
-                } }))), withMenu && ((0, jsx_runtime_1.jsx)(dropdown_1.Dropdown, Object.assign({ role: 'menu', className: cx('menu'), "data-testid": 'phone-input:dropdown' }, { children: presets_1.countriesList.map((item, index) => item.id === country.id ? null : ((0, jsx_runtime_1.jsx)(dropdown_item_1.DropdownItem, Object.assign({ size: 'm', role: 'menuitem', className: cx('menu-item'), onClick: () => {
-                        toggleMenu(false);
-                        setCountry(item);
-                        onCountrySelect && onCountrySelect(item);
-                    }, startContent: (0, jsx_runtime_1.jsx)("img", { alt: '', width: 24, height: 24, src: item.imageSrc, className: cx('country-icon') }), endContent: item.code }, { children: item.name }), index))) })))] })));
-};
-exports.PhoneInput = PhoneInput;

package/phone-input-deprecated/phone-input.module.scss

@@ -1,41 +0,0 @@
-@use '../colors';
-
-.root {
-  text-align: left;
-  position: relative;
-  width: var(--phone-input-width, 320px);
-}
-
-.field {
-  width: 100%;
-}
-
-.adornment {
-  display: flex;
-  align-items: center;
-  user-select: none;
-  cursor: pointer;
-}
-
-.arrow {
-  display: block;
-  fill: colors.$basic-gray38;
-  margin-left: 4px;
-  pointer-events: none; // игнорируем клики т.к. после них элемент стрелки подменяется и считается что он сработал вне элемента родителя
-}
-
-.menu {
-  position: absolute;
-  width: 100%;
-  top: 56px;
-  --dropdown-max-height: 208px;
-  z-index: 2;
-}
-
-.menu-item {
-  font-size: 16px;
-  line-height: 24px;
-  .country-icon {
-    display: block;
-  }
-}

package/plate/index.d.ts

@@ -1,15 +0,0 @@
-/// <reference types="react" />
-import { BoxShadow } from '../styling/shadows';
-export interface PlateProps extends React.HTMLAttributes<HTMLDivElement> {
-    /** Тень. */
-    shadow?: keyof typeof BoxShadow | null;
-    /** Скругление углов. */
-    rounds?: 's' | 'm' | null;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-}
-/**
- * Plate это просто div с возможностью легко задавать тень и скругления.
- * И он должен оставаться компонентом, который только задает оформление обычного div.
- */
-export declare const Plate: import("react").ForwardRefExoticComponent<PlateProps & import("react").RefAttributes<HTMLDivElement | null>>;

package/plate/index.js

@@ -1,31 +0,0 @@
-"use strict";
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Plate = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const shadows_1 = require("../styling/shadows");
-const shapes_1 = require("../styling/shapes");
-const classnames_1 = __importDefault(require("classnames"));
-const plate_module_scss_1 = __importDefault(require("./plate.module.scss"));
-/**
- * Plate это просто div с возможностью легко задавать тень и скругления.
- * И он должен оставаться компонентом, который только задает оформление обычного div.
- */
-exports.Plate = (0, react_1.forwardRef)(function Plate(_a, ref) {
-    var { className, children, rounds = 's', shadow = 'z1', 'data-testid': testId = 'plate' } = _a, restProps = __rest(_a, ["className", "children", "rounds", "shadow", 'data-testid']);
-    return ((0, jsx_runtime_1.jsx)("div", Object.assign({ ref: ref, className: (0, classnames_1.default)(plate_module_scss_1.default.root, className, shadow && shadows_1.BoxShadow[shadow], rounds === 's' && shapes_1.SmallRounds.all, rounds === 'm' && shapes_1.MediumRounds.all), "data-testid": testId, children: children }, restProps)));
-});

package/popup/index.d.ts

@@ -1,5 +0,0 @@
-import { Popup, PopupProps } from './popup';
-import { PopupView, PopupViewProps } from './popup-view';
-import { popupFloatingConfig, usePopupFloatingStyle, usePopupOnClick, useFocusTrap } from './utils';
-export type { PopupProps, PopupViewProps };
-export { Popup, PopupView, popupFloatingConfig, usePopupFloatingStyle, usePopupOnClick, useFocusTrap, };

package/popup/index.js

@@ -1,12 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusTrap = exports.usePopupOnClick = exports.usePopupFloatingStyle = exports.popupFloatingConfig = exports.PopupView = exports.Popup = void 0;
-const popup_1 = require("./popup");
-Object.defineProperty(exports, "Popup", { enumerable: true, get: function () { return popup_1.Popup; } });
-const popup_view_1 = require("./popup-view");
-Object.defineProperty(exports, "PopupView", { enumerable: true, get: function () { return popup_view_1.PopupView; } });
-const utils_1 = require("./utils");
-Object.defineProperty(exports, "popupFloatingConfig", { enumerable: true, get: function () { return utils_1.popupFloatingConfig; } });
-Object.defineProperty(exports, "usePopupFloatingStyle", { enumerable: true, get: function () { return utils_1.usePopupFloatingStyle; } });
-Object.defineProperty(exports, "usePopupOnClick", { enumerable: true, get: function () { return utils_1.usePopupOnClick; } });
-Object.defineProperty(exports, "useFocusTrap", { enumerable: true, get: function () { return utils_1.useFocusTrap; } });

package/popup/popup-view.d.ts

@@ -1,14 +0,0 @@
-import { HTMLAttributes, Ref } from 'react';
-import { WithTestId } from '../types';
-export interface PopupViewProps extends HTMLAttributes<HTMLDivElement>, WithTestId {
-    /** Сработает при клике на крестик. */
-    onClose?: () => void;
-    /** Реф корневого элемента. */
-    popupRef?: Ref<HTMLDivElement>;
-}
-/**
- * Popup.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function PopupView({ children, onClose, popupRef, className, 'data-testid': testId, ...rest }: PopupViewProps): JSX.Element;

package/popup/popup-view.js

@@ -1,32 +0,0 @@
-"use strict";
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.PopupView = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const Cross_1 = __importDefault(require("@sima-land/ui-quarks/icons/16x16/Stroked/Cross"));
-const bind_1 = __importDefault(require("classnames/bind"));
-const popup_view_module_scss_1 = __importDefault(require("./popup-view.module.scss"));
-const cx = bind_1.default.bind(popup_view_module_scss_1.default);
-/**
- * Popup.
- * @param props Свойства.
- * @return Элемент.
- */
-function PopupView(_a) {
-    var { children, onClose, popupRef, className, 'data-testid': testId = 'popup' } = _a, rest = __rest(_a, ["children", "onClose", "popupRef", "className", 'data-testid']);
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({}, rest, { className: cx('root', className), ref: popupRef, "data-testid": testId }, { children: [onClose && ((0, jsx_runtime_1.jsx)("button", Object.assign({ "aria-label": '\u0417\u0430\u043A\u0440\u044B\u0442\u044C', className: cx('close'), onClick: onClose, "data-testid": 'popup:close' }, { children: (0, jsx_runtime_1.jsx)(Cross_1.default, {}) }))), (0, jsx_runtime_1.jsx)("div", Object.assign({ className: cx('content') }, { children: children }))] })));
-}
-exports.PopupView = PopupView;

package/popup/popup-view.module.scss

@@ -1,40 +0,0 @@
-@use '../colors';
-@use '../shadows';
-@use '../utils';
-
-.root {
-  @include shadows.box-shadow('z2');
-  display: inline-flex;
-  position: relative;
-  max-width: 400px;
-  max-height: min(536px, calc(100vh - 16px));
-  padding: 40px 8px;
-  box-sizing: border-box;
-  background: colors.$basic-gray4;
-  border-radius: 4px;
-}
-
-.close {
-  @include utils.reset-button;
-  @include utils.focus-visible;
-  position: absolute;
-  top: 0;
-  right: 0;
-  width: 40px;
-  height: 40px;
-  padding: 8px 8px 0 0;
-  display: flex;
-  align-items: flex-start;
-  justify-content: flex-end;
-  cursor: pointer;
-}
-
-.content {
-  @include utils.semi-stylized-scrollbars(colors.$basic-gray4);
-  font-size: 16px;
-  line-height: 24px;
-  padding: 0 32px;
-  max-height: 456px; // 536 (по гайдам) - 80 (горизонтальные отступы)
-  overflow-y: auto;
-  overflow-x: hidden;
-}

package/popup/popup.d.ts

@@ -1,17 +0,0 @@
-/// <reference types="react" />
-import { PopupViewProps } from './popup-view';
-export interface PopupProps extends Omit<PopupViewProps, 'onClose'> {
-    /** Элемент для которого нужно показать Popup ил null. */
-    showFor?: Element | null;
-    /** Сработает при попытке закрыть Popup. */
-    onDismiss?: () => void;
-}
-export interface PopupInnerProps extends PopupProps {
-    showFor: Element;
-}
-/**
- * Popup, всплывающий когда указан целевой элемент.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function Popup({ showFor, ...rest }: PopupProps): JSX.Element;

package/popup/popup.js

@@ -1,51 +0,0 @@
-"use strict";
-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)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Popup = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const popup_view_1 = require("./popup-view");
-const react_2 = require("@floating-ui/react");
-const hooks_1 = require("../hooks");
-const utils_1 = require("./utils");
-const identity_1 = require("../hooks/identity");
-const portal_1 = require("../portal");
-/**
- * Popup, всплывающий когда указан целевой элемент.
- * @param props Свойства.
- * @return Элемент.
- */
-function Popup(_a) {
-    var { showFor } = _a, rest = __rest(_a, ["showFor"]);
-    return (0, jsx_runtime_1.jsx)(portal_1.Portal, { children: showFor && (0, jsx_runtime_1.jsx)(PopupInner, Object.assign({ showFor: showFor }, rest)) });
-}
-exports.Popup = Popup;
-/**
- * Внутренний компонент, необходим из-за использования портала.
- * @param props Свойства.
- * @return Элемент.
- */
-function PopupInner(_a) {
-    var { showFor, popupRef, children, style, onDismiss } = _a, rest = __rest(_a, ["showFor", "popupRef", "children", "style", "onDismiss"]);
-    const _b = (0, react_2.useFloating)((0, utils_1.popupFloatingConfig)()), { refs } = _b, floating = __rest(_b, ["refs"]);
-    const floatingStyle = (0, utils_1.usePopupFloatingStyle)(floating);
-    (0, react_1.useImperativeHandle)(popupRef, () => refs.floating.current);
-    (0, react_1.useImperativeHandle)(refs.setReference, () => showFor, [showFor]);
-    const anchorRef = (0, identity_1.useIdentityRef)(showFor);
-    (0, hooks_1.useOutsideClick)([anchorRef, refs.floating], onDismiss);
-    (0, utils_1.useFocusTrap)(refs.floating, {
-        enabled: floating.isPositioned,
-        afterDeactivate: onDismiss,
-    });
-    return ((0, jsx_runtime_1.jsx)(popup_view_1.PopupView, Object.assign({}, rest, { popupRef: refs.setFloating, style: Object.assign(Object.assign({}, style), floatingStyle), onClose: onDismiss }, { children: children })));
-}

package/popup/utils.d.ts

@@ -1,38 +0,0 @@
-import { UseFloatingProps, UseFloatingReturn } from '@floating-ui/react';
-import { RefObject } from 'react';
-/**
- * Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
- * @return Конфигурация для `useFloating` по дизайн-гайдам.
- */
-export declare function popupFloatingConfig(): Partial<UseFloatingProps>;
-/**
- * Возвращает стили для элемента с учетом "слоя".
- * @param floating Результат вызова useFloating.
- * @return Стили для элемента с учетом "слоя".
- */
-export declare function usePopupFloatingStyle({ strategy, x, y, }: Pick<UseFloatingReturn, 'strategy' | 'x' | 'y'>): {
-    position: import("@floating-ui/react").Strategy;
-    top: number;
-    left: number;
-    zIndex: number;
-};
-/**
- * Показ всплывающего элемента по клику и скрытие.
- * @param floating Результат вызова useFloating.
- * @return Опции для открывающего и всплывающего элемента.
- */
-export declare function usePopupOnClick(floating: Pick<UseFloatingReturn, 'context' | 'strategy' | 'x' | 'y'>): {
-    getReferenceProps: (userProps?: import("react").HTMLProps<Element> | undefined) => Record<string, unknown>;
-    getFloatingProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-    getItemProps: (userProps?: import("react").HTMLProps<HTMLElement> | undefined) => Record<string, unknown>;
-};
-/**
- * Хук ловушки фокуса.
- * @todo Вынести в общие утилиты тк понадобится для Modal и тд.
- * @param ref Элемент-контейнер для которого нужно захватить фокус.
- * @param options Опции.
- */
-export declare function useFocusTrap(ref: RefObject<HTMLElement | SVGElement>, { enabled, afterDeactivate, }: {
-    enabled: boolean;
-    afterDeactivate?: () => void;
-}): void;

package/popup/utils.js

@@ -1,83 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.useFocusTrap = exports.usePopupOnClick = exports.usePopupFloatingStyle = exports.popupFloatingConfig = void 0;
-const react_1 = require("@floating-ui/react");
-const focus_trap_1 = require("focus-trap");
-const layer_1 = require("../helpers/layer");
-const hooks_1 = require("../hooks");
-const identity_1 = require("../hooks/identity");
-/**
- * Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
- * @return Конфигурация для `useFloating` по дизайн-гайдам.
- */
-function popupFloatingConfig() {
-    return {
-        strategy: 'absolute',
-        placement: 'right-start',
-        middleware: [
-            (0, react_1.offset)(8),
-            (0, react_1.flip)({
-                padding: 16,
-                crossAxis: false,
-                fallbackAxisSideDirection: 'start',
-            }),
-            (0, react_1.shift)({
-                padding: 16,
-            }),
-        ],
-        whileElementsMounted: react_1.autoUpdate,
-    };
-}
-exports.popupFloatingConfig = popupFloatingConfig;
-/**
- * Возвращает стили для элемента с учетом "слоя".
- * @param floating Результат вызова useFloating.
- * @return Стили для элемента с учетом "слоя".
- */
-function usePopupFloatingStyle({ strategy, x, y, }) {
-    const layer = (0, layer_1.useLayer)();
-    return {
-        position: strategy,
-        top: y !== null && y !== void 0 ? y : 0,
-        left: x !== null && x !== void 0 ? x : 0,
-        zIndex: layer + 2,
-    };
-}
-exports.usePopupFloatingStyle = usePopupFloatingStyle;
-/**
- * Показ всплывающего элемента по клику и скрытие.
- * @param floating Результат вызова useFloating.
- * @return Опции для открывающего и всплывающего элемента.
- */
-function usePopupOnClick(floating) {
-    const style = usePopupFloatingStyle(floating);
-    const click = (0, react_1.useClick)(floating.context);
-    const dismiss = (0, react_1.useDismiss)(floating.context);
-    return (0, react_1.useInteractions)([click, dismiss, { floating: { style } }]);
-}
-exports.usePopupOnClick = usePopupOnClick;
-/**
- * Хук ловушки фокуса.
- * @todo Вынести в общие утилиты тк понадобится для Modal и тд.
- * @param ref Элемент-контейнер для которого нужно захватить фокус.
- * @param options Опции.
- */
-function useFocusTrap(ref, { enabled, afterDeactivate, }) {
-    const afterDeactivateRef = (0, identity_1.useIdentityRef)(afterDeactivate);
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        const element = ref.current;
-        if (enabled && element) {
-            const trap = (0, focus_trap_1.createFocusTrap)(element, {
-                allowOutsideClick: true,
-                tabbableOptions: { displayCheck: 'none' },
-                onPostDeactivate: afterDeactivateRef.current,
-                fallbackFocus: element,
-            });
-            trap.activate();
-            return () => {
-                trap.deactivate({ returnFocus: true });
-            };
-        }
-    }, [ref, enabled]);
-}
-exports.useFocusTrap = useFocusTrap;

package/portal/index.d.ts

@@ -1,13 +0,0 @@
-/// <reference types="react" />
-export interface PortalProps {
-    /** Вернет элемент, в который нужно вывести содержимое через портал. */
-    defineRoot?: () => HTMLElement;
-    /** Содержимое. */
-    children?: React.ReactNode;
-}
-/**
- * Компонент слоя. Выводит содержимое в портале.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare const Portal: React.FC<PortalProps>;

package/portal/index.js

@@ -1,26 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Portal = void 0;
-const react_1 = require("react");
-const react_dom_1 = require("react-dom");
-const hooks_1 = require("../hooks");
-/**
- * Компонент слоя. Выводит содержимое в портале.
- * @param props Свойства.
- * @return Элемент.
- */
-const Portal = ({ children, defineRoot = () => document.body }) => {
-    const [mounted, setMounted] = (0, react_1.useState)(false);
-    const ref = (0, react_1.useRef)();
-    (0, hooks_1.useIsomorphicLayoutEffect)(() => {
-        const root = defineRoot();
-        ref.current = document.createElement('div');
-        root.appendChild(ref.current);
-        setMounted(true);
-        return () => {
-            ref.current && ref.current.remove();
-        };
-    }, []);
-    return mounted && ref.current ? (0, react_dom_1.createPortal)(children, ref.current) : null;
-};
-exports.Portal = Portal;

package/price/index.d.ts

@@ -1,21 +0,0 @@
-/// <reference types="react" />
-export interface PriceProps {
-    /** Класс/стили цены. */
-    className?: string;
-    /** Отображать цену 'старой' - серой и зачеркнутой. */
-    crossedOut?: boolean;
-    /** Графема валюты пользователя. */
-    currencyGrapheme?: string;
-    /** Отобразить знак валюты перед ценой. */
-    graphemeBefore?: boolean;
-    /** Цена. */
-    value: number | string;
-    /** Идентификатор для систем автоматизированного тестирования. */
-    'data-testid'?: string;
-}
-/**
- * Цена товара с указанием знака валюты.
- * @param props Параметры компонента.
- * @return Элемент.
- */
-export declare function Price({ className, currencyGrapheme: grapheme, graphemeBefore, crossedOut, value, 'data-testid': testId, }: PriceProps): JSX.Element;

package/price/index.js

@@ -1,23 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Price = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const utils_1 = require("./utils");
-const bind_1 = __importDefault(require("classnames/bind"));
-const price_module_scss_1 = __importDefault(require("./price.module.scss"));
-const cx = bind_1.default.bind(price_module_scss_1.default);
-/**
- * Цена товара с указанием знака валюты.
- * @param props Параметры компонента.
- * @return Элемент.
- */
-function Price({ className, currencyGrapheme: grapheme, graphemeBefore, crossedOut, value, 'data-testid': testId = 'price', }) {
-    const content = (0, utils_1.formatPrice)(value, grapheme, {
-        graphemeBefore,
-    });
-    return ((0, jsx_runtime_1.jsx)("span", Object.assign({ className: cx('root', className, crossedOut && 'crossed-out'), "data-testid": testId }, { children: content })));
-}
-exports.Price = Price;