@sima-land/ui-nucleons 45.0.0-alpha.2 → 45.0.0-alpha.21

package/clean-buttons/clean-group.js

@@ -0,0 +1,25 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CleanGroup = CleanGroup;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const utils_1 = require("./utils");
+const bind_1 = __importDefault(require("classnames/bind"));
+const clean_group_m_scss_1 = __importDefault(require("./clean-group.m.scss"));
+const cx = bind_1.default.bind(clean_group_m_scss_1.default);
+/**
+ * Группа прозрачных кнопок.
+ * @todo Добавить возможность задавать свойства корневому элементу.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function CleanGroup({ size: sizeFromProps, children }) {
+    const { size: sizeFromContext, ...itemProps } = (0, react_1.useContext)(utils_1.CleanButtonContext);
+    const size = sizeFromProps ?? sizeFromContext;
+    const itemClassName = cx('item', itemProps.className);
+    return ((0, jsx_runtime_1.jsx)(utils_1.CleanButtonContext.Provider, { value: { size, className: itemClassName }, children: (0, jsx_runtime_1.jsx)("div", { className: cx('group'), children: children }) }));
+}
+//# sourceMappingURL=clean-group.js.map

package/clean-buttons/clean-group.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"clean-group.js","sourceRoot":"","sources":["../../src/clean-buttons/clean-group.tsx"],"names":[],"mappings":";;;;;AAcA,gCAYC;;AAzBD,iCAAmC;AACnC,mCAA6C;AAC7C,2DAAyC;AACzC,8EAA0C;AAE1C,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,4BAAM,CAAC,CAAC;AAEnC;;;;;GAKG;AACH,SAAgB,UAAU,CAAC,EAAE,IAAI,EAAE,aAAa,EAAE,QAAQ,EAAmB;IAC3E,MAAM,EAAE,IAAI,EAAE,eAAe,EAAE,GAAG,SAAS,EAAE,GAAG,IAAA,kBAAU,EAAC,0BAAkB,CAAC,CAAC;IAE/E,MAAM,IAAI,GAAG,aAAa,IAAI,eAAe,CAAC;IAE9C,MAAM,aAAa,GAAG,EAAE,CAAC,MAAM,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAEtD,OAAO,CACL,uBAAC,0BAAkB,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,SAAS,EAAE,aAAa,EAAE,YACpE,gCAAK,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,YAAG,QAAQ,GAAO,GACjB,CAC/B,CAAC;AACJ,CAAC"}

package/clean-buttons/clean-group.m.scss

@@ -0,0 +1,16 @@
+@use '../colors';
+
+.group {
+  display: flex;
+  flex-wrap: nowrap;
+  overflow: hidden;
+  width: 100%;
+  .item {
+    flex-grow: 1;
+    flex-shrink: 1;
+    flex-basis: 0;
+    + .item {
+      border-left: 1px solid colors.$basic-gray12;
+    }
+  }
+}

package/clean-buttons/index.d.ts

@@ -1,33 +1,3 @@
-import { ReactNode } from 'react';
-import { LinkProps } from '../link';
-import { CleanButtonSize } from './types';
-export interface CleanButtonProps extends LinkProps {
-    asLink?: boolean;
-    /** Размер (высота). */
-    size?: CleanButtonSize | 'unset';
-}
-export interface CleanGroupProps {
-    /** Размер (высота). */
-    size?: CleanButtonSize | 'unset';
-    /** Содержимое. */
-    children?: ReactNode;
-}
-/**
- * Компонент группы прозрачных кнопок.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function CleanGroup({ size: sizeFromProps, children }: CleanGroupProps): JSX.Element;
-/**
- * Компонент прозрачной кнопки.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare function CleanButton({ size, href, asLink, 'data-testid': testId, children, className, ...rest }: CleanButtonProps): JSX.Element;
-/**
- * @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
- */
-export declare const Clean: {
-    Group: typeof CleanGroup;
-    Button: typeof CleanButton;
-};
+export type { CleanButtonSize, CleanButtonProps, CleanGroupProps } from './types';
+export { CleanButton } from './clean-button';
+export { CleanGroup } from './clean-group';

package/clean-buttons/index.js

@@ -1,74 +1,8 @@
 "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)
-        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.Clean = exports.CleanButton = exports.CleanGroup = void 0;
-const react_1 = __importStar(require("react"));
-const link_1 = require("../link");
-const utils_1 = require("./utils");
-const bind_1 = __importDefault(require("classnames/bind"));
-const clean_buttons_module_scss_1 = __importDefault(require("./clean-buttons.module.scss"));
-const cx = bind_1.default.bind(clean_buttons_module_scss_1.default);
-/**
- * Компонент группы прозрачных кнопок.
- * @param props Свойства.
- * @return Элемент.
- */
-function CleanGroup({ size: sizeFromProps, children }) {
-    const sizeFromContext = (0, react_1.useContext)(utils_1.CleanGroupSizeContext);
-    // значение из пропсов имеет приоритет
-    const size = sizeFromProps || sizeFromContext;
-    return (react_1.default.createElement("div", { className: cx('group') }, react_1.Children.toArray(children).map(item => (0, react_1.isValidElement)(item) && item.type === CleanButton
-        ? (0, react_1.cloneElement)(item, { size })
-        : null)));
-}
-exports.CleanGroup = CleanGroup;
-/**
- * Компонент прозрачной кнопки.
- * @param props Свойства.
- * @return Элемент.
- */
-function CleanButton(_a) {
-    var { size = 's', href, asLink = Boolean(href), 'data-testid': testId = 'clean-button', children, className } = _a, rest = __rest(_a, ["size", "href", "asLink", 'data-testid', "children", "className"]);
-    return (react_1.default.createElement(link_1.Link, Object.assign({}, rest, { className: cx('button', `size-${size}`, className), pseudo: !asLink, href: href, "data-testid": testId }), children));
-}
-exports.CleanButton = CleanButton;
-/**
- * @deprecated Нужно использовать `import { CleanGroup, CleanButton }`.
- */
-exports.Clean = { Group: CleanGroup, Button: CleanButton };
+exports.CleanGroup = exports.CleanButton = void 0;
+var clean_button_1 = require("./clean-button");
+Object.defineProperty(exports, "CleanButton", { enumerable: true, get: function () { return clean_button_1.CleanButton; } });
+var clean_group_1 = require("./clean-group");
+Object.defineProperty(exports, "CleanGroup", { enumerable: true, get: function () { return clean_group_1.CleanGroup; } });
+//# sourceMappingURL=index.js.map

package/clean-buttons/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/clean-buttons/index.ts"],"names":[],"mappings":";;;AACA,+CAA6C;AAApC,2GAAA,WAAW,OAAA;AACpB,6CAA2C;AAAlC,yGAAA,UAAU,OAAA"}

package/clean-buttons/types.d.ts

@@ -1,4 +1,17 @@
+import type { ReactNode } from 'react';
+import type { LinkProps } from '../link';
 /**
  * Размер прозрачных кнопок (высота) по дизайн-гайдам.
  */
 export type CleanButtonSize = 's' | 'm' | 'l';
+export interface CleanGroupProps {
+    /** Размер (высота). */
+    size?: CleanButtonSize | 'unset';
+    /** Содержимое. */
+    children?: ReactNode;
+}
+export interface CleanButtonProps extends LinkProps {
+    asLink?: boolean;
+    /** Размер (высота). */
+    size?: CleanButtonSize | 'unset';
+}

package/clean-buttons/types.js

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

package/clean-buttons/types.js.map

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

package/clean-buttons/utils.d.ts

@@ -1,7 +1,6 @@
-/// <reference types="react" />
-import { CleanButtonSize } from './types';
+import type { CleanButtonProps } from './types';
 /**
  * Контекст установки размера группы прозрачных кнопок CleanGroup.
  * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
  */
-export declare const CleanGroupSizeContext: import("react").Context<"unset" | CleanButtonSize | undefined>;
+export declare const CleanButtonContext: import("react").Context<Pick<CleanButtonProps, "size" | "className">>;

package/clean-buttons/utils.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.CleanGroupSizeContext = void 0;
+exports.CleanButtonContext = void 0;
 const react_1 = require("react");
 /**
  * Контекст установки размера группы прозрачных кнопок CleanGroup.
  * Размер заданный непосредственно компоненту CleanGroup имеет приоритет над контекстом.
  */
-exports.CleanGroupSizeContext = (0, react_1.createContext)(undefined);
+exports.CleanButtonContext = (0, react_1.createContext)({});
+//# sourceMappingURL=utils.js.map

package/clean-buttons/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../src/clean-buttons/utils.ts"],"names":[],"mappings":";;;AACA,iCAAsC;AAEtC;;;GAGG;AACU,QAAA,kBAAkB,GAAG,IAAA,qBAAa,EAA+C,EAAE,CAAC,CAAC"}

package/colors/index.d.ts

@@ -1,4 +1,5 @@
-declare const collection: {
+/** Цвета дизайн-системы. */
+export declare const COLOR: {
     readonly 'basic-blue': "#1f84db";
     readonly 'basic-gray87': "#212121";
     readonly 'basic-gray76': "#3a3a3b";
@@ -11,9 +12,11 @@ declare const collection: {
     readonly 'basic-gray4': "#f5f5f5";
     readonly 'basic-gray2': "#fafafa";
     readonly 'basic-white': "#fff";
+    readonly 'basic-black': "#000";
     readonly 'additional-deep-red': "#d50000";
     readonly 'additional-red': "#fb3a2f";
     readonly 'additional-light-red': "#feebea";
+    readonly 'additional-dark-teal': "#089176";
     readonly 'additional-teal': "#09ab8b";
     readonly 'additional-green': "#00c853";
     readonly 'additional-light-green': "#64dd17";
@@ -35,7 +38,8 @@ declare const collection: {
     readonly 'additional-blue-gray': "#607d8b";
     readonly 'additional-deep-blue': "#00599d";
     readonly 'additional-dark-blue': "#002b41";
+    readonly 'additional-unlit-blue': "#1b75c2";
+    readonly 'additional-crimson': "#f4446b";
 };
-export type Token = keyof typeof collection;
-export declare const COLORS: Map<"basic-blue" | "basic-gray87" | "basic-gray76" | "basic-gray66" | "basic-gray54" | "basic-gray38" | "basic-gray24" | "basic-gray12" | "basic-gray8" | "basic-gray4" | "basic-gray2" | "basic-white" | "additional-deep-red" | "additional-red" | "additional-light-red" | "additional-teal" | "additional-green" | "additional-light-green" | "additional-lime" | "additional-faded-green" | "additional-pink" | "additional-purple" | "additional-violet" | "additional-deep-purple" | "additional-electric-blue" | "additional-light-blue" | "additional-cyan" | "additional-sky" | "additional-deep-orange" | "additional-amber" | "additional-yellow" | "additional-gold" | "additional-brown" | "additional-blue-gray" | "additional-deep-blue" | "additional-dark-blue", string>;
-export {};
+export type Token = keyof typeof COLOR;
+export declare const COLORS: Map<Token, string>;

package/colors/index.js

@@ -1,8 +1,9 @@
 "use strict";
 // GENERATED FILE - DO NOT CHANGE IT MANUALLY
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.COLORS = void 0;
-const collection = {
+exports.COLORS = exports.COLOR = void 0;
+/** Цвета дизайн-системы. */
+exports.COLOR = {
     // basic
     'basic-blue': '#1f84db',
     'basic-gray87': '#212121',
@@ -16,10 +17,12 @@ const collection = {
     'basic-gray4': '#f5f5f5',
     'basic-gray2': '#fafafa',
     'basic-white': '#fff',
+    'basic-black': '#000',
     // 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',
@@ -41,5 +44,8 @@ const collection = {
     '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(collection));
+exports.COLORS = new Map(Object.entries(exports.COLOR));
+//# sourceMappingURL=index.js.map

package/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,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;IACrB,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/colors.scss

@@ -13,11 +13,13 @@ $basic-gray8: #ebebeb;
 $basic-gray4: #f5f5f5;
 $basic-gray2: #fafafa;
 $basic-white: #fff;
+$basic-black: #000;
 
 // 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;
@@ -39,3 +41,51 @@ $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-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;
+  --color-basic-black: #000;
+
+  // 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/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/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/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/context/viewport.js

@@ -7,3 +7,4 @@ const react_1 = require("react");
  * внутри компонентов формирующих свою область видимости (например Modal).
  */
 exports.ViewportContext = (0, react_1.createContext)((0, react_1.createRef)());
+//# sourceMappingURL=viewport.js.map

package/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/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/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 = 's', current = 0, total = 1, onSelect }) {
+    const withShift = total > 4;
+    const itemSize = 14;
+    const itemGutter = { s: 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/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":";;;;;AAYA,wBAmCC;;AA9CD,iCAA+B;AAC/B,2DAAyC;AACzC,sEAAsC;AAEtC,MAAM,EAAE,GAAG,cAAU,CAAC,IAAI,CAAC,wBAAM,CAAC,CAAC;AAEnC;;;;GAIG;AACH,SAAgB,MAAM,CAAC,EAAE,IAAI,GAAG,GAAG,EAAE,OAAO,GAAG,CAAC,EAAE,KAAK,GAAG,CAAC,EAAE,QAAQ,EAAe;IAClF,MAAM,SAAS,GAAG,KAAK,GAAG,CAAC,CAAC;IAE5B,MAAM,QAAQ,GAAG,EAAE,CAAC;IACpB,MAAM,UAAU,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC;IACxC,MAAM,QAAQ,GAAG,QAAQ,GAAG,CAAC,GAAG,UAAU,GAAG,CAAC,CAAC;IAC/C,MAAM,UAAU,GAAG,QAAQ,GAAG,KAAK,GAAG,UAAU,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;IAE/D,MAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;IACvC,MAAM,UAAU,GAAG,SAAS,CAAC,CAAC,CAAC,QAAQ,GAAG,UAAU,CAAC,CAAC,CAAC,CAAC,QAAQ,GAAG,UAAU,CAAC,GAAG,CAAC,CAAC;IAEnF,OAAO,CACL,gCAAK,SAAS,EAAE,EAAE,CAAC,MAAM,EAAE,QAAQ,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,YACrF,KAAK,CAAC,KAAK,CAAC;aACV,IAAI,CAAC,CAAC,CAAC;aACP,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE;YACnB,MAAM,QAAQ,GAAG,KAAK,GAAG,KAAK,GAAG,CAAC,CAAC;YAEnC,OAAO,CACL,gCAEE,KAAK,EAAE;oBACL,IAAI,EAAE,GAAG,UAAU,GAAG,CAAC,KAAK,GAAG,KAAK,CAAC,GAAG,CAAC,QAAQ,GAAG,UAAU,CAAC,IAAI;iBACpE,EACD,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,EAAE,CAAC,KAAK,CAAC,EAChC,SAAS,EAAE,EAAE,CACX,MAAM,EACN,KAAK,KAAK,OAAO,IAAI,QAAQ,EAC7B,SAAS,IAAI,CAAC,QAAQ,IAAI,CAAC,IAAI,QAAQ,IAAI,CAAC,CAAC,IAAI,SAAS,CAC3D,IATI,KAAK,CAUV,CACH,CAAC;QACJ,CAAC,CAAC,GACA,CACP,CAAC;AACJ,CAAC;AAED;;;;;GAKG;AACH,SAAS,QAAQ,CAAC,OAAe,EAAE,KAAa;IAC9C,MAAM,QAAQ,GAAG,IAAA,cAAM,EAAC,CAAC,CAAC,CAAC;IAC3B,MAAM,cAAc,GAAG,IAAA,cAAM,EAAC,CAAC,CAAC,CAAC;IAEjC,IAAI,KAAK,GAAG,CAAC,EAAE,CAAC;QACd,MAAM,UAAU,GAAG,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC;QAC9C,MAAM,WAAW,GAAG,cAAc,CAAC,OAAO,CAAC;QAC3C,MAAM,cAAc,GAAG,WAAW,GAAG,QAAQ,CAAC,OAAO,CAAC;QAEtD,IAAI,QAAQ,GAAG,QAAQ,CAAC,OAAO,CAAC;QAEhC,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;YACnB,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,OAAO,GAAG,WAAW,CAAC;YAChF,QAAQ,IAAI,OAAO,GAAG,WAAW,GAAG,UAAU,CAAC;QACjD,CAAC;aAAM,IAAI,UAAU,GAAG,CAAC,EAAE,CAAC;YAC1B,MAAM,UAAU,GAAG,IAAI,CAAC,GAAG,CAAC,cAAc,EAAE,CAAC,CAAC,GAAG,QAAQ,CAAC,OAAO,GAAG,WAAW,CAAC;YAChF,QAAQ,IAAI,WAAW,GAAG,OAAO,GAAG,UAAU,CAAC;QACjD,CAAC;QAED,QAAQ,CAAC,OAAO,GAAG,QAAQ,CAAC;IAC9B,CAAC;IAED,cAAc,CAAC,OAAO,GAAG,OAAO,CAAC;IAEjC,OAAO,QAAQ,CAAC,OAAO,CAAC;AAC1B,CAAC"}

package/dot-nav/{dot-nav.module.scss → dot-nav.m.scss}

@@ -46,7 +46,9 @@
 
     // используем scale() чтобы плавное изменение размера выглядело нормально
     transform: translate3d(-50%, -50%, 0) scale(calc(var(--dot-size) / 10));
-    transition: transform 0.3s, background 0.3s;
+    transition:
+      transform 0.3s,
+      background 0.3s;
   }
   &.active::after {
     background: colors.$basic-gray38;

package/dot-nav/index.d.ts

@@ -1,18 +1,2 @@
-/// <reference types="react" />
-export type DotNavSize = 's' | 'l';
-export interface DotNavProps {
-    /** Индекс выбранной точки. */
-    current?: number;
-    /** Количество точек. */
-    total?: number;
-    /** Сработает при выборе точки. */
-    onSelect?: (index: number) => void;
-    /** Размер. */
-    size?: DotNavSize;
-}
-/**
- * Компонент точек навигации для каруселей и слайдеров.
- * @param props Свойства.
- * @return Элемент.
- */
-export declare const DotNav: ({ size, current, total, onSelect }: DotNavProps) => JSX.Element;
+export type { DotNavSize, DotNavProps } from './types';
+export { DotNav } from './dot-nav';

package/dot-nav/index.js

@@ -1,82 +1,6 @@
 "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.DotNav = void 0;
-const react_1 = __importStar(require("react"));
-const lodash_1 = require("lodash");
-const bind_1 = __importDefault(require("classnames/bind"));
-const dot_nav_module_scss_1 = __importDefault(require("./dot-nav.module.scss"));
-const cx = bind_1.default.bind(dot_nav_module_scss_1.default);
-/**
- * Компонент точек навигации для каруселей и слайдеров.
- * @param props Свойства.
- * @return Элемент.
- */
-const DotNav = ({ size = 's', current = 0, total = 1, onSelect }) => {
-    const withShift = total > 4;
-    const itemSize = 14;
-    const itemGutter = { s: 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 (react_1.default.createElement("div", { className: cx('root', `size-${size}`), style: { width: maxWidth, height: itemSize } }, (0, lodash_1.times)(total).map(index => {
-        const position = index - shift + 1;
-        return (react_1.default.createElement("div", { key: index, style: {
-                left: `${correction + (index - shift) * (itemSize + itemGutter)}px`,
-            }, onClick: () => onSelect === null || onSelect === void 0 ? void 0 : onSelect(index), className: cx('item', index === current && 'active', withShift && (position <= 0 || position >= 4) && 'distant') }));
-    })));
-};
-exports.DotNav = DotNav;
-/**
- * Определяет необходимое для точек навигации смещение.
- * @param current Индекс выбранной точки.
- * @param total Количество точек.
- * @return Смещение.
- */
-const 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;
-};
+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/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/dot-nav/types.d.ts

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

package/dot-nav/types.js

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

package/dot-nav/types.js.map

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