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

package/dist/colors/index.js

@@ -0,0 +1,51 @@
+"use strict";
+// GENERATED FILE - DO NOT CHANGE IT MANUALLY
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.COLORS = exports.COLOR = void 0;
+/** Цвета дизайн-системы. */
+exports.COLOR = {
+    // basic
+    'basic-blue': '#1f84db',
+    'basic-black': '#000',
+    'basic-gray87': '#212121',
+    'basic-gray76': '#3a3a3b',
+    'basic-gray66': '#545455',
+    'basic-gray54': '#757575',
+    'basic-gray38': '#9e9e9e',
+    'basic-gray24': '#c2c2c2',
+    'basic-gray12': '#e0e0e0',
+    'basic-gray8': '#ebebeb',
+    'basic-gray4': '#f5f5f5',
+    'basic-gray2': '#fafafa',
+    'basic-white': '#fff',
+    // additional
+    'additional-deep-red': '#d50000',
+    'additional-red': '#fb3a2f',
+    'additional-light-red': '#feebea',
+    'additional-dark-teal': '#089176',
+    'additional-teal': '#09ab8b',
+    'additional-green': '#00c853',
+    'additional-light-green': '#64dd17',
+    'additional-lime': '#aeea00',
+    'additional-faded-green': '#eff9ea',
+    'additional-pink': '#e82e5c',
+    'additional-purple': '#b52ea8',
+    'additional-violet': '#902bd0',
+    'additional-deep-purple': '#634bdf',
+    'additional-electric-blue': '#2962ff',
+    'additional-light-blue': '#0091ea',
+    'additional-cyan': '#00b8d4',
+    'additional-sky': '#e4f1f9',
+    'additional-deep-orange': '#ff7200',
+    'additional-amber': '#ffab00',
+    'additional-yellow': '#ffd600',
+    'additional-gold': '#d5a43b',
+    'additional-brown': '#795548',
+    'additional-blue-gray': '#607d8b',
+    'additional-deep-blue': '#00599d',
+    'additional-dark-blue': '#002b41',
+    'additional-unlit-blue': '#1b75c2',
+    'additional-crimson': '#f4446b',
+};
+exports.COLORS = new Map(Object.entries(exports.COLOR));
+//# sourceMappingURL=index.js.map

package/dist/colors/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/colors/index.ts"],"names":[],"mappings":";AAAA,6CAA6C;;;AAE7C,4BAA4B;AACf,QAAA,KAAK,GAAG;IACnB,QAAQ;IACR,YAAY,EAAE,SAAS;IACvB,aAAa,EAAE,MAAM;IACrB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,cAAc,EAAE,SAAS;IACzB,aAAa,EAAE,SAAS;IACxB,aAAa,EAAE,SAAS;IACxB,aAAa,EAAE,SAAS;IACxB,aAAa,EAAE,MAAM;IAErB,aAAa;IACb,qBAAqB,EAAE,SAAS;IAChC,gBAAgB,EAAE,SAAS;IAC3B,sBAAsB,EAAE,SAAS;IACjC,sBAAsB,EAAE,SAAS;IACjC,iBAAiB,EAAE,SAAS;IAC5B,kBAAkB,EAAE,SAAS;IAC7B,wBAAwB,EAAE,SAAS;IACnC,iBAAiB,EAAE,SAAS;IAC5B,wBAAwB,EAAE,SAAS;IACnC,iBAAiB,EAAE,SAAS;IAC5B,mBAAmB,EAAE,SAAS;IAC9B,mBAAmB,EAAE,SAAS;IAC9B,wBAAwB,EAAE,SAAS;IACnC,0BAA0B,EAAE,SAAS;IACrC,uBAAuB,EAAE,SAAS;IAClC,iBAAiB,EAAE,SAAS;IAC5B,gBAAgB,EAAE,SAAS;IAC3B,wBAAwB,EAAE,SAAS;IACnC,kBAAkB,EAAE,SAAS;IAC7B,mBAAmB,EAAE,SAAS;IAC9B,iBAAiB,EAAE,SAAS;IAC5B,kBAAkB,EAAE,SAAS;IAC7B,sBAAsB,EAAE,SAAS;IACjC,sBAAsB,EAAE,SAAS;IACjC,sBAAsB,EAAE,SAAS;IACjC,uBAAuB,EAAE,SAAS;IAClC,oBAAoB,EAAE,SAAS;CACvB,CAAC;AAGE,QAAA,MAAM,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,OAAO,CAAC,aAAK,CAAC,CAAuB,CAAC"}

package/dist/colors.scss

@@ -0,0 +1,91 @@
+// GENERATED FILE - DO NOT CHANGE IT MANUALLY
+
+// basic
+$basic-blue: #1f84db;
+$basic-black: #000;
+$basic-gray87: #212121;
+$basic-gray76: #3a3a3b;
+$basic-gray66: #545455;
+$basic-gray54: #757575;
+$basic-gray38: #9e9e9e;
+$basic-gray24: #c2c2c2;
+$basic-gray12: #e0e0e0;
+$basic-gray8: #ebebeb;
+$basic-gray4: #f5f5f5;
+$basic-gray2: #fafafa;
+$basic-white: #fff;
+
+// additional
+$additional-deep-red: #d50000;
+$additional-red: #fb3a2f;
+$additional-light-red: #feebea;
+$additional-dark-teal: #089176;
+$additional-teal: #09ab8b;
+$additional-green: #00c853;
+$additional-light-green: #64dd17;
+$additional-lime: #aeea00;
+$additional-faded-green: #eff9ea;
+$additional-pink: #e82e5c;
+$additional-purple: #b52ea8;
+$additional-violet: #902bd0;
+$additional-deep-purple: #634bdf;
+$additional-electric-blue: #2962ff;
+$additional-light-blue: #0091ea;
+$additional-cyan: #00b8d4;
+$additional-sky: #e4f1f9;
+$additional-deep-orange: #ff7200;
+$additional-amber: #ffab00;
+$additional-yellow: #ffd600;
+$additional-gold: #d5a43b;
+$additional-brown: #795548;
+$additional-blue-gray: #607d8b;
+$additional-deep-blue: #00599d;
+$additional-dark-blue: #002b41;
+$additional-unlit-blue: #1b75c2;
+$additional-crimson: #f4446b;
+
+@mixin properties() {
+  // basic
+  --color-basic-blue: #1f84db;
+  --color-basic-black: #000;
+  --color-basic-gray87: #212121;
+  --color-basic-gray76: #3a3a3b;
+  --color-basic-gray66: #545455;
+  --color-basic-gray54: #757575;
+  --color-basic-gray38: #9e9e9e;
+  --color-basic-gray24: #c2c2c2;
+  --color-basic-gray12: #e0e0e0;
+  --color-basic-gray8: #ebebeb;
+  --color-basic-gray4: #f5f5f5;
+  --color-basic-gray2: #fafafa;
+  --color-basic-white: #fff;
+
+  // additional
+  --color-additional-deep-red: #d50000;
+  --color-additional-red: #fb3a2f;
+  --color-additional-light-red: #feebea;
+  --color-additional-dark-teal: #089176;
+  --color-additional-teal: #09ab8b;
+  --color-additional-green: #00c853;
+  --color-additional-light-green: #64dd17;
+  --color-additional-lime: #aeea00;
+  --color-additional-faded-green: #eff9ea;
+  --color-additional-pink: #e82e5c;
+  --color-additional-purple: #b52ea8;
+  --color-additional-violet: #902bd0;
+  --color-additional-deep-purple: #634bdf;
+  --color-additional-electric-blue: #2962ff;
+  --color-additional-light-blue: #0091ea;
+  --color-additional-cyan: #00b8d4;
+  --color-additional-sky: #e4f1f9;
+  --color-additional-deep-orange: #ff7200;
+  --color-additional-amber: #ffab00;
+  --color-additional-yellow: #ffd600;
+  --color-additional-gold: #d5a43b;
+  --color-additional-brown: #795548;
+  --color-additional-blue-gray: #607d8b;
+  --color-additional-deep-blue: #00599d;
+  --color-additional-dark-blue: #002b41;
+  --color-additional-unlit-blue: #1b75c2;
+  --color-additional-crimson: #f4446b;
+}

package/dist/context/index.d.ts

@@ -0,0 +1,9 @@
+export declare const MatchMediaContext: import("react").Context<{
+    matchMedia(query: string): MediaQueryList;
+}>;
+export declare const ResizeObserverContext: import("react").Context<{
+    createResizeObserver(callback: ResizeObserverCallback): ResizeObserver;
+}>;
+export declare const IntersectionObserverContext: import("react").Context<{
+    createIntersectionObserver(callback: IntersectionObserverCallback, options?: IntersectionObserverInit | undefined): IntersectionObserver;
+}>;

package/dist/context/index.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IntersectionObserverContext = exports.ResizeObserverContext = exports.MatchMediaContext = void 0;
+/* eslint-disable jsdoc/require-jsdoc */
+const react_1 = require("react");
+// @todo возможно стоит убрать "window." тк наблюдаются проблемы в iOS
+exports.MatchMediaContext = (0, react_1.createContext)({
+    matchMedia(query) {
+        // ВАЖНО: доступ к window.matchMedia должен осуществляться именно в момент вызова а не в момент определения контекста
+        // ВАЖНО: используем "window.matchMedia" вместо "matchMedia" тк падают ошибки в некоторых браузерах
+        return window.matchMedia(query);
+    },
+});
+exports.ResizeObserverContext = (0, react_1.createContext)({
+    createResizeObserver(callback) {
+        // ВАЖНО: доступ к window.ResizeObserver должен осуществляться именно в момент вызова а не в момент определения контекста
+        return new window.ResizeObserver(callback);
+    },
+});
+exports.IntersectionObserverContext = (0, react_1.createContext)({
+    createIntersectionObserver(...args) {
+        // ВАЖНО: доступ к window.IntersectionObserver должен осуществляться именно в момент вызова а не в момент определения контекста
+        return new window.IntersectionObserver(...args);
+    },
+});
+//# sourceMappingURL=index.js.map

package/dist/context/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/context/index.ts"],"names":[],"mappings":";;;AAAA,wCAAwC;AACxC,iCAAsC;AAEtC,sEAAsE;AAEzD,QAAA,iBAAiB,GAAG,IAAA,qBAAa,EAAC;IAC7C,UAAU,CAAC,KAAa;QACtB,qHAAqH;QACrH,mGAAmG;QACnG,OAAO,MAAM,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;IAClC,CAAC;CACF,CAAC,CAAC;AAEU,QAAA,qBAAqB,GAAG,IAAA,qBAAa,EAAC;IACjD,oBAAoB,CAAC,QAAgC;QACnD,yHAAyH;QACzH,OAAO,IAAI,MAAM,CAAC,cAAc,CAAC,QAAQ,CAAC,CAAC;IAC7C,CAAC;CACF,CAAC,CAAC;AAEU,QAAA,2BAA2B,GAAG,IAAA,qBAAa,EAAC;IACvD,0BAA0B,CAAC,GAAG,IAAwD;QACpF,+HAA+H;QAC/H,OAAO,IAAI,MAAM,CAAC,oBAAoB,CAAC,GAAG,IAAI,CAAC,CAAC;IAClD,CAAC;CACF,CAAC,CAAC"}

package/dist/context/viewport.js

@@ -0,0 +1,10 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewportContext = void 0;
+const react_1 = require("react");
+/**
+ * Контекст необходимый для правильного позиционирования выпадающих элементов (например Tooltip)
+ * внутри компонентов формирующих свою область видимости (например Modal).
+ */
+exports.ViewportContext = (0, react_1.createContext)((0, react_1.createRef)());
+//# sourceMappingURL=viewport.js.map

package/dist/context/viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"viewport.js","sourceRoot":"","sources":["../../src/context/viewport.ts"],"names":[],"mappings":";;;AAAA,iCAA4D;AAE5D;;;GAGG;AACU,QAAA,eAAe,GAAG,IAAA,qBAAa,EAAyB,IAAA,iBAAS,GAAE,CAAC,CAAC"}

package/dist/dot-nav/dot-nav.d.ts

@@ -0,0 +1,7 @@
+import type { DotNavProps } from './types';
+/**
+ * Точки навигации. Используются в основном рядом с каруселями и слайдерами.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function DotNav({ size, current, total, onSelect }: DotNavProps): import("react/jsx-runtime").JSX.Element;

package/dist/dot-nav/dot-nav.js

@@ -0,0 +1,61 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DotNav = DotNav;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const bind_1 = __importDefault(require("classnames/bind"));
+const dot_nav_m_scss_1 = __importDefault(require("./dot-nav.m.scss"));
+const cx = bind_1.default.bind(dot_nav_m_scss_1.default);
+/**
+ * Точки навигации. Используются в основном рядом с каруселями и слайдерами.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function DotNav({ size = 'm', current = 0, total = 1, onSelect }) {
+    const withShift = total > 4;
+    const itemSize = { s: 8, m: 14, l: 14 }[size];
+    const itemGutter = { s: 4, m: 0, l: 6 }[size];
+    const maxWidth = itemSize * 5 + itemGutter * 4;
+    const totalWidth = itemSize * total + itemGutter * (total - 1);
+    const shift = useShift(current, total);
+    const correction = withShift ? itemSize + itemGutter : (maxWidth - totalWidth) / 2;
+    return ((0, jsx_runtime_1.jsx)("div", { className: cx('root', `size-${size}`), style: { width: maxWidth, height: itemSize }, children: Array(total)
+            .fill(0)
+            .map((zero, index) => {
+            const position = index - shift + 1;
+            return ((0, jsx_runtime_1.jsx)("div", { style: {
+                    left: `${correction + (index - shift) * (itemSize + itemGutter)}px`,
+                }, onClick: () => onSelect?.(index), className: cx('item', index === current && 'active', withShift && (position <= 0 || position >= 4) && 'distant') }, index));
+        }) }));
+}
+/**
+ * Определяет необходимое для точек навигации смещение.
+ * @param current Индекс выбранной точки.
+ * @param total Количество точек.
+ * @return Смещение.
+ */
+function useShift(current, total) {
+    const shiftRef = (0, react_1.useRef)(0);
+    const prevCurrentRef = (0, react_1.useRef)(0);
+    if (total > 4) {
+        const currentPos = current - shiftRef.current;
+        const prevCurrent = prevCurrentRef.current;
+        const prevCurrentPos = prevCurrent - shiftRef.current;
+        let newShift = shiftRef.current;
+        if (currentPos > 2) {
+            const correction = Math.max(prevCurrentPos, 2) + shiftRef.current - prevCurrent;
+            newShift += current - prevCurrent - correction;
+        }
+        else if (currentPos < 0) {
+            const correction = Math.min(prevCurrentPos, 0) + shiftRef.current - prevCurrent;
+            newShift -= prevCurrent - current + correction;
+        }
+        shiftRef.current = newShift;
+    }
+    prevCurrentRef.current = current;
+    return shiftRef.current;
+}
+//# sourceMappingURL=dot-nav.js.map

package/dist/dot-nav/dot-nav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dot-nav.js","sourceRoot":"","sources":["../../src/dot-nav/dot-nav.tsx"],"names":[],"mappings":"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"}

package/dist/dot-nav/dot-nav.m.scss

@@ -0,0 +1,65 @@
+@use '../colors';
+
+.root {
+  display: flex;
+  position: relative;
+  overflow: hidden;
+  &.size-s {
+    --dot-regular-size: 4;
+    --dot-active-size: 4;
+    --dot-distant-size: 3;
+  }
+  &.size-m {
+    --dot-regular-size: 6;
+    --dot-active-size: 6;
+    --dot-distant-size: 4;
+  }
+  &.size-l {
+    --dot-regular-size: 8;
+    --dot-active-size: 12;
+    --dot-distant-size: 4;
+  }
+}
+
+.item {
+  position: absolute;
+  top: 0;
+  width: 14px;
+  height: 14px;
+  transition: left 0.3s;
+  --dot-size: var(--dot-regular-size);
+  cursor: pointer;
+  .size-s & {
+    width: 8px;
+    height: 8px;
+  }
+  &.active {
+    --dot-size: var(--dot-active-size);
+  }
+  &.distant {
+    --dot-size: var(--dot-distant-size);
+  }
+  &::after {
+    content: '';
+    display: block;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    border-radius: 50%;
+    background: colors.$basic-gray12;
+
+    // используем 10 чтобы проще считать коэффициенты масштабирования
+    // ВАЖНО: не надо использовать здесь число больше чем размер родителя с overflow:hidden - моргает в Safari
+    width: 10px;
+    height: 10px;
+
+    // используем scale() чтобы плавное изменение размера выглядело нормально
+    transform: translate3d(-50%, -50%, 0) scale(calc(var(--dot-size) / 10));
+    transition:
+      transform 0.3s,
+      background 0.3s;
+  }
+  &.active::after {
+    background: colors.$basic-gray38;
+  }
+}

package/dist/dot-nav/index.d.ts

@@ -0,0 +1,2 @@
+export type { DotNavSize, DotNavProps } from './types';
+export { DotNav } from './dot-nav';

package/dist/dot-nav/index.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DotNav = void 0;
+var dot_nav_1 = require("./dot-nav");
+Object.defineProperty(exports, "DotNav", { enumerable: true, get: function () { return dot_nav_1.DotNav; } });
+//# sourceMappingURL=index.js.map

package/dist/dot-nav/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/dot-nav/index.ts"],"names":[],"mappings":";;;AACA,qCAAmC;AAA1B,iGAAA,MAAM,OAAA"}

package/dist/dot-nav/types.d.ts

@@ -0,0 +1,11 @@
+export type DotNavSize = 's' | 'm' | 'l';
+export interface DotNavProps {
+    /** Индекс выбранной точки. */
+    current?: number;
+    /** Количество точек. */
+    total?: number;
+    /** Сработает при выборе точки. */
+    onSelect?: (index: number) => void;
+    /** Размер. */
+    size?: DotNavSize;
+}

package/dist/dot-nav/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/dot-nav/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/dot-nav/types.ts"],"names":[],"mappings":""}

package/dist/dropdown/dropdown-loading.d.ts

@@ -0,0 +1,7 @@
+import type { DropdownLoadingProps } from './types';
+/**
+ * Плашка состояния загрузки для Dropdown.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function DropdownLoading({ className, ...props }: DropdownLoadingProps): import("react/jsx-runtime").JSX.Element;

package/dist/dropdown/dropdown-loading.js

@@ -0,0 +1,20 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DropdownLoading = DropdownLoading;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const spinner_1 = require("../spinner");
+const bind_1 = __importDefault(require("classnames/bind"));
+const dropdown_loading_m_scss_1 = __importDefault(require("./dropdown-loading.m.scss"));
+const cx = bind_1.default.bind(dropdown_loading_m_scss_1.default);
+/**
+ * Плашка состояния загрузки для Dropdown.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function DropdownLoading({ className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { ...props, className: cx('root', className), children: (0, jsx_runtime_1.jsx)(spinner_1.SpinnerSVG, { size: 's' }) }));
+}
+//# sourceMappingURL=dropdown-loading.js.map

package/dist/dropdown/dropdown-loading.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown-loading.js","sourceRoot":"","sources":["../../src/dropdown/dropdown-loading.tsx"],"names":[],"mappings":";;;;;AAYA,0CAMC;;AAjBD,wCAAwC;AACxC,2DAAyC;AACzC,wFAA+C;AAE/C,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,iCAAM,CAAC,CAAC;AAEnC;;;;GAIG;AACH,SAAgB,eAAe,CAAC,EAAE,SAAS,EAAE,GAAG,KAAK,EAAwB;IAC3E,OAAO,CACL,mCAAS,KAAK,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,YAC9C,uBAAC,oBAAU,IAAC,IAAI,EAAC,GAAG,GAAG,GACnB,CACP,CAAC;AACJ,CAAC"}

package/dist/dropdown/dropdown.d.ts

@@ -0,0 +1,7 @@
+import type { DropdownProps } from './types';
+/**
+ * Выпадающий блок. Обычно используется для вывода списков опций выбора.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+export declare function Dropdown({ rootRef, viewportRef, viewportProps, className, children, 'data-testid': testId, ...restProps }: DropdownProps): import("react/jsx-runtime").JSX.Element;

package/dist/dropdown/dropdown.js

@@ -0,0 +1,21 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Dropdown = Dropdown;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const custom_scrollbar_1 = require("../_internal/custom-scrollbar");
+const bind_1 = __importDefault(require("classnames/bind"));
+const dropdown_m_scss_1 = __importDefault(require("./dropdown.m.scss"));
+const page_scroll_lock_1 = require("../_internal/page-scroll-lock");
+const cx = bind_1.default.bind(dropdown_m_scss_1.default);
+/**
+ * Выпадающий блок. Обычно используется для вывода списков опций выбора.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function Dropdown({ rootRef, viewportRef, viewportProps, className, children, 'data-testid': testId = 'dropdown', ...restProps }) {
+    return ((0, jsx_runtime_1.jsx)("div", { ref: rootRef, className: cx('root', className), ...restProps, "data-testid": testId, children: (0, jsx_runtime_1.jsx)(custom_scrollbar_1.CustomScrollbar, { className: cx('inner'), overflow: { x: 'hidden', y: 'scroll' }, viewportRef: viewportRef, viewportProps: { [page_scroll_lock_1.BSL_IGNORE_ATTR]: true, ...viewportProps }, children: children }) }));
+}
+//# sourceMappingURL=dropdown.js.map

package/dist/dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../src/dropdown/dropdown.tsx"],"names":[],"mappings":";;;;;AAcA,4BAuBC;;AApCD,oEAAgE;AAChE,2DAAyC;AACzC,wEAAuC;AACvC,oEAAgE;AAGhE,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,yBAAM,CAAC,CAAC;AAEnC;;;;GAIG;AACH,SAAgB,QAAQ,CAAC,EACvB,OAAO,EACP,WAAW,EACX,aAAa,EACb,SAAS,EACT,QAAQ,EACR,aAAa,EAAE,MAAM,GAAG,UAAU,EAClC,GAAG,SAAS,EACE;IACd,OAAO,CACL,gCAAK,GAAG,EAAE,OAAO,EAAE,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,KAAM,SAAS,iBAAe,MAAM,YACrF,uBAAC,kCAAe,IACd,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,EACtB,QAAQ,EAAE,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,EACtC,WAAW,EAAE,WAAW,EACxB,aAAa,EACX,EAAE,CAAC,kCAAe,CAAC,EAAE,IAAI,EAAE,GAAG,aAAa,EAAoC,YAGhF,QAAQ,GACO,GACd,CACP,CAAC;AACJ,CAAC"}

package/dist/dropdown/dropdown.m.scss

@@ -0,0 +1,18 @@
+@use '../shadows';
+
+.root {
+  background: #fff;
+  outline: 0;
+  padding: 8px 0;
+  border-radius: 8px;
+  @include shadows.box-shadow('z4');
+
+  // задавать можно только максимальную высоту через --dropdown-max-height
+  max-height: var(--dropdown-max-height, 376px) !important;
+  height: auto;
+}
+
+.inner {
+  height: 100%;
+  max-height: calc(var(--dropdown-max-height, 376px) - 16px); // вычитаем padding корневого элемента
+}

package/dist/dropdown/index.d.ts

@@ -0,0 +1,4 @@
+export type { DropdownProps, DropdownStyle, DropdownLoadingProps } from './types';
+export { Dropdown } from './dropdown';
+export { DropdownLoading } from './dropdown-loading';
+export { dropdownFloatingConfig, useDropdownFloatingStyle, useDismissByWheel } from './utils';

package/dist/dropdown/index.js

@@ -0,0 +1,12 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useDismissByWheel = exports.useDropdownFloatingStyle = exports.dropdownFloatingConfig = exports.DropdownLoading = exports.Dropdown = void 0;
+var dropdown_1 = require("./dropdown");
+Object.defineProperty(exports, "Dropdown", { enumerable: true, get: function () { return dropdown_1.Dropdown; } });
+var dropdown_loading_1 = require("./dropdown-loading");
+Object.defineProperty(exports, "DropdownLoading", { enumerable: true, get: function () { return dropdown_loading_1.DropdownLoading; } });
+var utils_1 = require("./utils");
+Object.defineProperty(exports, "dropdownFloatingConfig", { enumerable: true, get: function () { return utils_1.dropdownFloatingConfig; } });
+Object.defineProperty(exports, "useDropdownFloatingStyle", { enumerable: true, get: function () { return utils_1.useDropdownFloatingStyle; } });
+Object.defineProperty(exports, "useDismissByWheel", { enumerable: true, get: function () { return utils_1.useDismissByWheel; } });
+//# sourceMappingURL=index.js.map

package/dist/dropdown/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/dropdown/index.ts"],"names":[],"mappings":";;;AACA,uCAAsC;AAA7B,oGAAA,QAAQ,OAAA;AACjB,uDAAqD;AAA5C,mHAAA,eAAe,OAAA;AACxB,iCAA8F;AAArF,+GAAA,sBAAsB,OAAA;AAAE,iHAAA,wBAAwB,OAAA;AAAE,0GAAA,iBAAiB,OAAA"}

package/dist/dropdown/types.d.ts

@@ -0,0 +1,16 @@
+import type { CSSProperties, HTMLAttributes, Ref } from 'react';
+import type { WithTestId } from '../types';
+export interface DropdownStyle extends CSSProperties {
+    '--dropdown-max-height'?: string;
+}
+export interface DropdownProps extends Omit<HTMLAttributes<HTMLDivElement>, 'style'>, WithTestId {
+    /** Стили. */
+    style?: DropdownStyle;
+    /** Реф корневого элемента. */
+    rootRef?: Ref<HTMLDivElement>;
+    /** Реф внутреннего элемента с прокруткой. */
+    viewportRef?: Ref<HTMLDivElement>;
+    /** Свойства для элемента с прокруткой. */
+    viewportProps?: HTMLAttributes<HTMLDivElement>;
+}
+export type DropdownLoadingProps = Omit<HTMLAttributes<HTMLDivElement>, 'children'>;

package/dist/dropdown/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/dropdown/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/dropdown/types.ts"],"names":[],"mappings":""}

package/dist/dropdown/utils.d.ts

@@ -0,0 +1,38 @@
+import { RefObject } from 'react';
+import { autoUpdate, UseFloatingReturn } from '@floating-ui/react';
+/**
+ * Возвращает конфигурацию для `useFloating` по дизайн-гайдам.
+ * @return Конфигурация для `useFloating` по дизайн-гайдам.
+ */
+export declare function dropdownFloatingConfig(): {
+    whileElementsMounted: typeof autoUpdate;
+    placement: "bottom-start";
+    middleware: {
+        options?: any;
+        name: string;
+        fn: (state: import("@floating-ui/dom").MiddlewareState) => import("@floating-ui/core").MiddlewareReturn | Promise<import("@floating-ui/core").MiddlewareReturn>;
+    }[];
+};
+/**
+ * Возвращает стили для элемента с учетом "слоя".
+ * @param floating Результат вызова useFloating.
+ * @return Стили для элемента с учетом "слоя".
+ */
+export declare function useDropdownFloatingStyle({ strategy, x, y, refs, }: Pick<UseFloatingReturn, 'strategy' | 'x' | 'y' | 'refs'>): {
+    position: import("@floating-ui/utils").Strategy;
+    top: number;
+    left: number;
+    zIndex: number;
+} | {
+    minWidth: string;
+    '--opener-width': string;
+    position: import("@floating-ui/utils").Strategy;
+    top: number;
+    left: number;
+    zIndex: number;
+};
+/**
+ * Скрытие меню при прокрутке колесом за пределами меню.
+ * @inheritdoc
+ */
+export declare function useDismissByWheel<T extends HTMLElement>(ref: RefObject<T | null>, callback: VoidFunction): void;