@sima-land/ui-nucleons 45.0.0-alpha.7 → 45.0.0-alpha.71

package/dist/skeleton/skeleton.js

@@ -0,0 +1,52 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.Skeleton = Skeleton;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const classnames_1 = __importDefault(require("classnames"));
+const styles = __importStar(require("./skeleton.module.scss"));
+/**
+ * Скелетон - блок с анимацией загрузки.
+ * @param props Свойства.
+ * @return Элемент.
+ */
+function Skeleton({ theme = 'light', shining = true, children, className, rootRef, ...restProps }) {
+    const rootClassName = (0, classnames_1.default)(styles.skeleton, theme === 'light' && styles['theme-light'], theme === 'dark' && styles['theme-dark'], shining && styles.shining, className);
+    return ((0, jsx_runtime_1.jsx)("div", { ref: rootRef, ...restProps, className: rootClassName, children: children }));
+}
+//# sourceMappingURL=skeleton.js.map

package/dist/skeleton/skeleton.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skeleton.js","sourceRoot":"","sources":["../../src/skeleton/skeleton.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,4BAqBC;;AA7BD,4DAA4B;AAC5B,+DAAiD;AAEjD;;;;GAIG;AACH,SAAgB,QAAQ,CAAC,EACvB,KAAK,GAAG,OAAO,EACf,OAAO,GAAG,IAAI,EACd,QAAQ,EACR,SAAS,EACT,OAAO,EACP,GAAG,SAAS,EACE;IACd,MAAM,aAAa,GAAG,IAAA,oBAAE,EACtB,MAAM,CAAC,QAAQ,EACf,KAAK,KAAK,OAAO,IAAI,MAAM,CAAC,aAAa,CAAC,EAC1C,KAAK,KAAK,MAAM,IAAI,MAAM,CAAC,YAAY,CAAC,EACxC,OAAO,IAAI,MAAM,CAAC,OAAO,EACzB,SAAS,CACV,CAAC;IAEF,OAAO,CACL,gCAAK,GAAG,EAAE,OAAO,KAAM,SAAS,EAAE,SAAS,EAAE,aAAa,YACvD,QAAQ,GACL,CACP,CAAC;AACJ,CAAC"}

package/dist/skeleton/skeleton.module.scss

@@ -0,0 +1,75 @@
+@use 'sass:color';
+@use 'sass:math';
+@use '../colors';
+
+// точка на единичной окружности над координатой x=0.5
+$intermediate: math.sqrt(math.pow(1, 2) - math.pow(0.5, 2));
+
+.skeleton {
+  position: relative;
+  width: var(--skeleton-width, 320px);
+  height: var(--skeleton-height, 240px);
+  overflow: hidden;
+}
+
+.theme-light {
+  background-color: colors.$basic-gray4;
+}
+
+.theme-dark {
+  background-color: colors.$basic-gray76;
+}
+
+.shining::before {
+  content: '';
+  display: block;
+  position: absolute;
+  top: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+  left: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+  width: var(--skeleton-shine-size, 200px);
+  height: calc(max(250%, 100vh, 320px));
+  transform: translate(-50%, -50%) rotate(30deg);
+  animation-duration: 2000ms;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+  animation-name: skeletonShineMoving;
+}
+
+.shining.theme-light::before {
+  opacity: 0.6;
+  background-image: linear-gradient(
+    90deg,
+    #{color.adjust(#fff, $alpha: -1)},
+    #{color.adjust(#fff, $alpha: -$intermediate)},
+    #{color.adjust(#fff, $alpha: 0)},
+    #{color.adjust(#fff, $alpha: -$intermediate)},
+    #{color.adjust(#fff, $alpha: -1)}
+  );
+}
+
+.shining.theme-dark::before {
+  opacity: 0.3;
+  background-image: linear-gradient(
+    90deg,
+    #{color.adjust(colors.$basic-gray66, $alpha: -1)},
+    #{color.adjust(colors.$basic-gray66, $alpha: -$intermediate)},
+    #{color.adjust(colors.$basic-gray66, $alpha: 0)},
+    #{color.adjust(colors.$basic-gray66, $alpha: -$intermediate)},
+    #{color.adjust(colors.$basic-gray66, $alpha: -1)}
+  );
+}
+
+@keyframes skeletonShineMoving {
+  0% {
+    left: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+    top: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+  }
+  25% {
+    left: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+    top: calc(-1 * (var(--skeleton-shine-size, 200px) / 2));
+  }
+  100% {
+    left: calc(100% + (var(--skeleton-shine-size, 200px) / 2));
+    top: calc(100% + (var(--skeleton-shine-size, 200px) / 2));
+  }
+}

package/dist/skeleton/types.d.ts

@@ -0,0 +1,17 @@
+import type { CSSProperties, HTMLAttributes, Ref } from 'react';
+import type { WithTestId } from '../types';
+export interface SkeletonStyle extends CSSProperties {
+    '--skeleton-width'?: string;
+    '--skeleton-height'?: string;
+    '--skeleton-shine-size'?: string;
+}
+export interface SkeletonProps extends HTMLAttributes<HTMLDivElement>, WithTestId {
+    /** Нужно ли включить анимацию блеска. */
+    shining?: boolean;
+    /** Стили. */
+    style?: SkeletonStyle;
+    /** Тема. */
+    theme?: 'dark' | 'light' | 'unset';
+    /** Ref корневого элемента. */
+    rootRef?: Ref<HTMLDivElement>;
+}

package/dist/skeleton/types.js

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

package/dist/skeleton/types.js.map

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

package/dist/snack-bar/context.d.ts

@@ -0,0 +1,17 @@
+import { Dispatch, ReactNode, SetStateAction } from 'react';
+/**
+ * Провайдер контекста для вывода нескольких снекбаров.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare function SnackbarContextProvider({ children }: {
+    children?: ReactNode;
+}): import("react").JSX.Element;
+export declare const SnackbarContext: import("react").Context<ContextProps>;
+interface ContextProps {
+    closePrevious?: VoidFunction;
+    setClose?: Dispatch<SetStateAction<{
+        closePrevious?: VoidFunction;
+    }>>;
+}
+export {};

package/dist/snack-bar/context.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SnackbarContext = void 0;
+exports.SnackbarContextProvider = SnackbarContextProvider;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+/**
+ * Провайдер контекста для вывода нескольких снекбаров.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function SnackbarContextProvider({ children }) {
+    const [value, setClose] = (0, react_1.useState)({});
+    return ((0, jsx_runtime_1.jsx)(exports.SnackbarContext.Provider, { value: { ...value, setClose }, children: children }));
+}
+exports.SnackbarContext = (0, react_1.createContext)({});
+//# sourceMappingURL=context.js.map

package/dist/snack-bar/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../src/snack-bar/context.tsx"],"names":[],"mappings":";;;AAOA,0DAMC;;AAbD,iCAAqF;AAErF;;;;GAIG;AACH,SAAgB,uBAAuB,CAAC,EAAE,QAAQ,EAA4B;IAC5E,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,IAAA,gBAAQ,EAAmC,EAAE,CAAC,CAAC;IAEzE,OAAO,CACL,uBAAC,uBAAe,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,QAAQ,EAAE,YAAG,QAAQ,GAA4B,CAC/F,CAAC;AACJ,CAAC;AAEY,QAAA,eAAe,GAAG,IAAA,qBAAa,EAAe,EAAE,CAAC,CAAC"}

package/dist/snack-bar/index.d.ts

@@ -0,0 +1,5 @@
+export { SnackBarImage, SnackBarStartIcon, SnackBarEndIcon, SnackBarTitle, SnackBarSubtitle, } from './slots';
+export { SnackBar } from './snack-bar';
+export { useSnackBarPositioning } from './utils';
+export { SnackbarContextProvider } from './context';
+export type { SnackBarProps, SnackBarStyle } from './types';

package/dist/snack-bar/index.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SnackbarContextProvider = exports.useSnackBarPositioning = exports.SnackBar = exports.SnackBarSubtitle = exports.SnackBarTitle = exports.SnackBarEndIcon = exports.SnackBarStartIcon = exports.SnackBarImage = void 0;
+var slots_1 = require("./slots");
+Object.defineProperty(exports, "SnackBarImage", { enumerable: true, get: function () { return slots_1.SnackBarImage; } });
+Object.defineProperty(exports, "SnackBarStartIcon", { enumerable: true, get: function () { return slots_1.SnackBarStartIcon; } });
+Object.defineProperty(exports, "SnackBarEndIcon", { enumerable: true, get: function () { return slots_1.SnackBarEndIcon; } });
+Object.defineProperty(exports, "SnackBarTitle", { enumerable: true, get: function () { return slots_1.SnackBarTitle; } });
+Object.defineProperty(exports, "SnackBarSubtitle", { enumerable: true, get: function () { return slots_1.SnackBarSubtitle; } });
+var snack_bar_1 = require("./snack-bar");
+Object.defineProperty(exports, "SnackBar", { enumerable: true, get: function () { return snack_bar_1.SnackBar; } });
+var utils_1 = require("./utils");
+Object.defineProperty(exports, "useSnackBarPositioning", { enumerable: true, get: function () { return utils_1.useSnackBarPositioning; } });
+var context_1 = require("./context");
+Object.defineProperty(exports, "SnackbarContextProvider", { enumerable: true, get: function () { return context_1.SnackbarContextProvider; } });
+//# sourceMappingURL=index.js.map

package/dist/snack-bar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/snack-bar/index.ts"],"names":[],"mappings":";;;AAAA,iCAMiB;AALf,sGAAA,aAAa,OAAA;AACb,0GAAA,iBAAiB,OAAA;AACjB,wGAAA,eAAe,OAAA;AACf,sGAAA,aAAa,OAAA;AACb,yGAAA,gBAAgB,OAAA;AAElB,yCAAuC;AAA9B,qGAAA,QAAQ,OAAA;AACjB,iCAAiD;AAAxC,+GAAA,sBAAsB,OAAA;AAC/B,qCAAoD;AAA3C,kHAAA,uBAAuB,OAAA"}

package/dist/snack-bar/slots.d.ts

@@ -0,0 +1,32 @@
+import { HTMLAttributes } from 'react';
+import { SnackBarIconProps, SnackBarImageProps } from './types';
+/**
+ * Компонент для вывода изображения в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare function SnackBarImage(props: SnackBarImageProps): import("react").JSX.Element;
+/**
+ * Компонент для вывода иконки в начале контента Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare const SnackBarStartIcon: (props: SnackBarIconProps) => import("react").JSX.Element;
+/**
+ * Компонент для вывода иконки в конце контента Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare const SnackBarEndIcon: (props: SnackBarIconProps) => import("react").JSX.Element;
+/**
+ * Компонент для вывода заголовка в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare function SnackBarTitle({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+/**
+ * Компонент для вывода подзаголовка в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare function SnackBarSubtitle({ children, className, ...props }: HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;

package/dist/snack-bar/slots.js

@@ -0,0 +1,97 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.SnackBarEndIcon = exports.SnackBarStartIcon = void 0;
+exports.SnackBarImage = SnackBarImage;
+exports.SnackBarTitle = SnackBarTitle;
+exports.SnackBarSubtitle = SnackBarSubtitle;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const styles = __importStar(require("./snack-bar.module.scss"));
+const classnames_1 = __importDefault(require("classnames"));
+/**
+ * Компонент для вывода изображения в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function SnackBarImage(props) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: styles.image, children: (0, jsx_runtime_1.jsx)("img", { ...props }) }));
+}
+/**
+ * Компонент для вывода иконки в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function Icon({ icon, onClick, className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles.icon, className), onClick: onClick
+            ? event => {
+                event.stopPropagation();
+                onClick(event);
+            }
+            : undefined, ...props, children: icon }));
+}
+/**
+ * Компонент для вывода иконки в начале контента Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+const SnackBarStartIcon = (props) => (0, jsx_runtime_1.jsx)(Icon, { ...props });
+exports.SnackBarStartIcon = SnackBarStartIcon;
+/**
+ * Компонент для вывода иконки в конце контента Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+const SnackBarEndIcon = (props) => (0, jsx_runtime_1.jsx)(Icon, { ...props });
+exports.SnackBarEndIcon = SnackBarEndIcon;
+/**
+ * Компонент для вывода заголовка в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function SnackBarTitle({ children, className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles.title, className), ...props, children: children }));
+}
+/**
+ * Компонент для вывода подзаголовка в Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function SnackBarSubtitle({ children, className, ...props }) {
+    return ((0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(styles.subtitle, className), ...props, children: children }));
+}
+//# sourceMappingURL=slots.js.map

package/dist/snack-bar/slots.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slots.js","sourceRoot":"","sources":["../../src/snack-bar/slots.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUA,sCAMC;AA6CD,sCAMC;AAOD,4CAUC;;AApFD,gEAAkD;AAElD,4DAA4B;AAG5B;;;;GAIG;AACH,SAAgB,aAAa,CAAC,KAAyB;IACrD,OAAO,CACL,gCAAK,SAAS,EAAE,MAAM,CAAC,KAAK,YAC1B,mCAAS,KAAK,GAAI,GACd,CACP,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAS,IAAI,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,KAAK,EAAqB;IACrE,OAAO,CACL,gCACE,SAAS,EAAE,IAAA,oBAAE,EAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EACrC,OAAO,EACL,OAAO;YACL,CAAC,CAAC,KAAK,CAAC,EAAE;gBACN,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,OAAO,CAAC,KAAK,CAAC,CAAC;YACjB,CAAC;YACH,CAAC,CAAC,SAAS,KAEX,KAAK,YAER,IAAI,GACD,CACP,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACI,MAAM,iBAAiB,GAAG,CAAC,KAAwB,EAAE,EAAE,CAAC,uBAAC,IAAI,OAAK,KAAK,GAAI,CAAC;AAAtE,QAAA,iBAAiB,qBAAqD;AAEnF;;;;GAIG;AACI,MAAM,eAAe,GAAG,CAAC,KAAwB,EAAE,EAAE,CAAC,uBAAC,IAAI,OAAK,KAAK,GAAI,CAAC;AAApE,QAAA,eAAe,mBAAqD;AAEjF;;;;GAIG;AACH,SAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,KAAK,EAAkC;IAC7F,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,oBAAE,EAAC,MAAM,CAAC,KAAK,EAAE,SAAS,CAAC,KAAM,KAAK,YACnD,QAAQ,GACL,CACP,CAAC;AACJ,CAAC;AAED;;;;GAIG;AACH,SAAgB,gBAAgB,CAAC,EAC/B,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACuB;IAC/B,OAAO,CACL,gCAAK,SAAS,EAAE,IAAA,oBAAE,EAAC,MAAM,CAAC,QAAQ,EAAE,SAAS,CAAC,KAAM,KAAK,YACtD,QAAQ,GACL,CACP,CAAC;AACJ,CAAC"}

package/dist/snack-bar/snack-bar.d.ts

@@ -0,0 +1,7 @@
+import { SnackBarProps } from './types';
+/**
+ * Компонент Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+export declare function SnackBar({ onClick, children, className, onMount, ...props }: SnackBarProps): import("react").JSX.Element;

package/dist/snack-bar/snack-bar.js

@@ -0,0 +1,71 @@
+"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 () {
+    var ownKeys = function(o) {
+        ownKeys = Object.getOwnPropertyNames || function (o) {
+            var ar = [];
+            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
+            return ar;
+        };
+        return ownKeys(o);
+    };
+    return function (mod) {
+        if (mod && mod.__esModule) return mod;
+        var result = {};
+        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
+        __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.SnackBar = SnackBar;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const button_1 = require("../button");
+const helpers_1 = require("../helpers");
+const text_button_1 = require("../text-button");
+const styles = __importStar(require("./snack-bar.module.scss"));
+const slots_1 = require("./slots");
+const react_1 = require("react");
+const classnames_1 = __importDefault(require("classnames"));
+/**
+ * Компонент Snackbar.
+ * @param props Параметры.
+ * @return Элемент.
+ */
+function SnackBar({ onClick, children, className, onMount, ...props }) {
+    const ref = (0, react_1.useRef)(null);
+    const { image, title, subtitle, startIcon, button, textButton, endIcon } = (0, helpers_1.defineSlots)(children, {
+        image: slots_1.SnackBarImage,
+        startIcon: slots_1.SnackBarStartIcon,
+        title: slots_1.SnackBarTitle,
+        subtitle: slots_1.SnackBarSubtitle,
+        button: button_1.Button,
+        textButton: text_button_1.TextButton,
+        endIcon: slots_1.SnackBarEndIcon,
+    });
+    (0, react_1.useEffect)(() => {
+        onMount?.();
+    }, []);
+    const asButtonProps = { tabIndex: props.tabIndex || 0, role: props.role || 'button' };
+    const hasButton = Boolean(button || textButton);
+    return ((0, jsx_runtime_1.jsxs)("div", { className: (0, classnames_1.default)(styles.root, className), onClick: !hasButton ? onClick : undefined, ref: ref, ...(!hasButton && asButtonProps), ...props, children: [image || startIcon, title && ((0, jsx_runtime_1.jsxs)("div", { className: styles.content, children: [title, subtitle] })), hasButton && ((0, jsx_runtime_1.jsx)("div", { onClick: onClick, className: styles.button, ...asButtonProps, children: button || textButton })), endIcon] }));
+}
+//# sourceMappingURL=snack-bar.js.map

package/dist/snack-bar/snack-bar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"snack-bar.js","sourceRoot":"","sources":["../../src/snack-bar/snack-bar.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,4BA2CC;;AA/DD,sCAAmC;AACnC,wCAAyC;AACzC,gDAA4C;AAE5C,gEAAkD;AAClD,mCAMiB;AACjB,iCAA0C;AAC1C,4DAA4B;AAE5B;;;;GAIG;AACH,SAAgB,QAAQ,CAAC,EAAE,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,KAAK,EAAiB;IACzF,MAAM,GAAG,GAAG,IAAA,cAAM,EAAiB,IAAI,CAAC,CAAC;IACzC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,GAAG,IAAA,qBAAW,EAAC,QAAQ,EAAE;QAC/F,KAAK,EAAE,qBAAa;QACpB,SAAS,EAAE,yBAAiB;QAC5B,KAAK,EAAE,qBAAa;QACpB,QAAQ,EAAE,wBAAgB;QAC1B,MAAM,EAAE,eAAM;QACd,UAAU,EAAE,wBAAU;QACtB,OAAO,EAAE,uBAAe;KACzB,CAAC,CAAC;IAEH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,OAAO,EAAE,EAAE,CAAC;IACd,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,MAAM,aAAa,GAAG,EAAE,QAAQ,EAAE,KAAK,CAAC,QAAQ,IAAI,CAAC,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,IAAI,QAAQ,EAAE,CAAC;IAEtF,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM,IAAI,UAAU,CAAC,CAAC;IAEhD,OAAO,CACL,iCACE,SAAS,EAAE,IAAA,oBAAE,EAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,EACrC,OAAO,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,EACzC,GAAG,EAAE,GAAG,KACJ,CAAC,CAAC,SAAS,IAAI,aAAa,CAAC,KAC7B,KAAK,aAER,KAAK,IAAI,SAAS,EAClB,KAAK,IAAI,CACR,iCAAK,SAAS,EAAE,MAAM,CAAC,OAAO,aAC3B,KAAK,EACL,QAAQ,IACL,CACP,EACA,SAAS,IAAI,CACZ,gCAAK,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,MAAM,CAAC,MAAM,KAAM,aAAa,YAC/D,MAAM,IAAI,UAAU,GACjB,CACP,EACA,OAAO,IACJ,CACP,CAAC;AACJ,CAAC"}

package/dist/snack-bar/snack-bar.module.scss

@@ -0,0 +1,113 @@
+@use '../colors';
+@use '../breakpoints';
+
+.root {
+  --max-width: 464px;
+  --min-width: 304px;
+  --min-height: 56px;
+  background: colors.$basic-gray76;
+  border-radius: 10px;
+  padding: 12px;
+  display: flex;
+  max-width: var(--max-width);
+  min-width: var(--min-width);
+  min-height: var(--min-height);
+  position: fixed;
+  bottom: var(--snackbar-bottom-gap, 12px);
+  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.12);
+  // частично иммитируем поведение layout
+  margin: 0 auto;
+  @include breakpoints.gte('xs') {
+    width: fit-content;
+    bottom: var(--snackbar-bottom-gap, 40px);
+  }
+  @include breakpoints.lt('ms') {
+    left: var(--snackbar-position-left, 8px);
+    margin-right: 8px;
+    width: calc(100% - (var(--snackbar-position-left, 8px) + 8px));
+  }
+  @include breakpoints.gte('ms') {
+    @include breakpoints.lt('xs') {
+      left: var(--snackbar-position-left, 50%);
+      margin-left: calc(-1 * (var(--max-width) / 2));
+      width: 100%;
+    }
+  }
+  @include breakpoints.gte('xs') {
+    @include breakpoints.lt('l') {
+      left: var(--snackbar-position-left, 56px);
+    }
+  }
+  @include breakpoints.gte('l') {
+    @include breakpoints.lt('xl') {
+      // 1472 - максимальная ширина контейнера Layout на данном разрешении.
+      left: var(--snackbar-position-left, calc(((100% - 1472px) / 2) - 8px));
+    }
+  }
+  @include breakpoints.gte('xl') {
+    // 1504 - максимальная ширина контейнера Layout на данном разрешении.
+    left: var(--snackbar-position-left, calc(((100% - 1504px) / 2) - 8px));
+  }
+  .icon:last-child,
+  .button:last-child {
+    padding-left: 12px;
+    padding-right: 12px;
+    margin-right: -12px;
+  }
+  .button {
+    padding-left: 12px;
+  }
+}
+
+.image + .content,
+.icon + .content {
+  margin-left: 8px;
+}
+
+.content {
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  .title,
+  .subtitle {
+    display: -webkit-box;
+    line-clamp: 2;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    font-size: 14px;
+    line-height: 20px;
+  }
+}
+
+.button {
+  display: flex;
+  align-items: center;
+  margin-top: -12px;
+  margin-bottom: -12px;
+}
+
+.image {
+  display: flex;
+  align-items: center;
+  img {
+    border-radius: 4px;
+    height: 40px;
+  }
+}
+
+.icon {
+  display: flex;
+  align-items: center;
+  margin-top: -12px;
+  margin-bottom: -12px;
+}
+
+.title {
+  color: colors.$basic-white;
+}
+
+.subtitle {
+  color: colors.$basic-gray38;
+}

package/dist/snack-bar/types.d.ts

@@ -0,0 +1,17 @@
+import type { CSSProperties, HTMLAttributes, ReactNode } from 'react';
+import type { WithTestId } from '../types';
+export interface SnackBarStyle extends CSSProperties {
+    '--snackbar-bottom-gap'?: string;
+}
+export interface SnackBarProps extends HTMLAttributes<HTMLDivElement>, WithTestId {
+    /** Будет вызван при мoнтировании. */
+    onMount?: VoidFunction;
+    /** Стили. */
+    style?: SnackBarStyle;
+}
+export interface SnackBarImageProps extends HTMLAttributes<HTMLImageElement> {
+    src: string;
+}
+export interface SnackBarIconProps extends HTMLAttributes<HTMLDivElement> {
+    icon: ReactNode;
+}

package/dist/snack-bar/types.js

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

package/dist/snack-bar/types.js.map

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