@cloud-ru/uikit-product-calculator 0.33.3 → 0.33.5

package/dist/esm/components/Calculator/Calculator.d.ts

@@ -0,0 +1,42 @@
+import { LayoutType } from '@sbercloud/uikit-product-utils';
+import { CalculatorType, CatalogConfig, FetcherFn, FormValues, PlatformType, ProductState, State } from '../../types';
+export type CalculatorProps = {
+    /** Тип устройства @default desktop*/
+    layoutType?: LayoutType;
+    /** Тип калькулятора @default main*/
+    calculatorType?: CalculatorType;
+    /** Конфигурация платформ/продуктов/каталога */
+    config: CatalogConfig;
+    /** Функция для запроса цен по продукту */
+    fetcherFn: FetcherFn;
+    /** Колбеки на действия внутри калькулятора */
+    actions: {
+        /** Колбек на выбор платформы в каталоге */
+        onPlatformSelect?(platform: PlatformType): void;
+        /** Колбек на выбор продукта в каталоге */
+        onProductSelect?(productId: string): void;
+        /** Колбек на удаление продукта в корзине */
+        onProductDelete?(productId: string): void;
+        /** Колбек на кнопку 'Начать расчет' */
+        onStartClick?(): void;
+        /** Колбек на открытие каталога */
+        onCatalogOpen?(): void;
+        /** Колбек на подключение продукта в консоли */
+        onConnectClick?(id: string, value: FormValues): void;
+        /** Колбек клика на кнопку "Поделиться ссылкой" */
+        onShareClick?(state: State): Promise<void>;
+        /** Колбек клика на кнопку "Скачать расчет" */
+        onDownloadFileClick?(state: State): Promise<void>;
+        /** Колбек клика на кнопку "Запросить консультацию" */
+        onRequestConsultationClick?(state: State): void;
+    };
+    /** Колбэк вызова при изменении любого контрола для аналитики */
+    onAnalyticsClick?(clickContent: string, uniqueId: string): void;
+    /** Изображение на заднем фоне в состоянии "пустой" корзины */
+    bgImage?: string;
+    /** Id продукта который будет "по умолчанию" в корзине*/
+    initialActiveProduct?: string;
+    /** Начальное состояние корзины */
+    iniState?: Record<string, ProductState[]>;
+};
+export declare function Calculator({ config, layoutType, calculatorType, fetcherFn, initialActiveProduct, iniState, bgImage, actions, onAnalyticsClick, }: CalculatorProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/Calculator/Calculator.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CalculatorContextProvider } from '../../contexts';
+import { CalculatorContent } from '../CalculatorContent';
+import { Catalog } from '../Catalog';
+export function Calculator({ config, layoutType, calculatorType, fetcherFn, initialActiveProduct, iniState, bgImage, actions, onAnalyticsClick, }) {
+    return (_jsxs(CalculatorContextProvider, { config: config, fetcherFn: fetcherFn, calculatorType: calculatorType, layoutType: layoutType, iniState: iniState, initialActiveProduct: initialActiveProduct, actions: actions, onAnalyticsClick: onAnalyticsClick, children: [_jsx(CalculatorContent, { bgImage: bgImage }), _jsx(Catalog, {})] }));
+}

package/dist/esm/components/Calculator/index.d.ts

@@ -0,0 +1 @@
+export * from './Calculator';

package/dist/esm/components/Calculator/index.js

@@ -0,0 +1 @@
+export * from './Calculator';

package/dist/esm/components/CalculatorContent/CalculatorContent.d.ts

@@ -0,0 +1,5 @@
+type CalculatorContentProps = {
+    bgImage?: string;
+};
+export declare function CalculatorContent({ bgImage }: CalculatorContentProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/CalculatorContent/CalculatorContent.js

@@ -0,0 +1,15 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCalculatorContext } from '../../contexts';
+import { Disclaimer } from '../Disclaimer';
+import { PriceSummary } from '../PriceSummary';
+import { ProductPage } from '../ProductPage/ProductPage';
+import { Welcome } from '../Welcome';
+import styles from './styles.module.css';
+export function CalculatorContent({ bgImage }) {
+    const { selectedProduct, layoutType } = useCalculatorContext();
+    const isDesktop = layoutType === 'desktop';
+    if (!selectedProduct) {
+        return (_jsxs(_Fragment, { children: [_jsx(Welcome, { image: bgImage }), _jsx(Disclaimer, { className: styles.disclaimer })] }));
+    }
+    return (_jsxs("div", { className: styles.calculator, "data-layout-type": layoutType, children: [_jsxs("div", { className: styles.pageWrapper, children: [_jsx(ProductPage, { selectedProduct: selectedProduct, className: styles.page }), isDesktop && _jsx(Disclaimer, { className: styles.disclaimer })] }), _jsx(PriceSummary, { className: styles.priceSummary }), !isDesktop && _jsx(Disclaimer, {})] }));
+}

package/dist/esm/components/CalculatorContent/index.d.ts

@@ -0,0 +1 @@
+export * from './CalculatorContent';

package/dist/esm/components/CalculatorContent/index.js

@@ -0,0 +1 @@
+export * from './CalculatorContent';

package/dist/esm/components/CalculatorContent/styles.module.css

@@ -0,0 +1,64 @@
+.page{
+  background-color:var(--sys-neutral-background1-level, #fdfdfd);
+  display:flex;
+  flex-direction:column;
+  flex-shrink:0;
+  min-height:500px;
+}
+
+.page,
+.pageWrapper{
+  width:800px;
+  min-height:569px;
+}
+
+.content{
+  padding:var(--dimension-3m, 24px);
+  display:flex;
+  gap:var(--dimension-3m, 24px);
+  flex-direction:column;
+}
+
+.priceSummary{
+  width:384px;
+  flex-shrink:0;
+  position:sticky;
+  top:24px;
+}
+
+.calculator{
+  box-sizing:border-box;
+  position:relative;
+  color:var(--sys-neutral-text-main, #41424e);
+  z-index:0;
+  display:flex;
+  gap:var(--dimension-3m, 24px);
+  align-items:flex-start;
+}
+.calculator:not(.calculator[data-layout-type=desktop]){
+  flex-direction:column;
+}
+.calculator:not(.calculator[data-layout-type=desktop]) .page,
+.calculator:not(.calculator[data-layout-type=desktop]) .pageWrapper{
+  width:100%;
+}
+.calculator:not(.calculator[data-layout-type=desktop]) .priceSummary{
+  width:100%;
+  position:inherit;
+  top:inherit;
+}
+
+.footer{
+  color:var(--sys-neutral-text-light, #8b8e9b);
+  margin-top:var(--dimension-3m, 24px);
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-3m, 24px);
+}
+.footer[data-mobile]{
+  margin-top:var(--dimension-2m, 16px);
+}
+
+.disclaimer{
+  margin-top:var(--dimension-3m, 24px);
+}

package/dist/esm/components/Catalog/Catalog.d.ts

@@ -0,0 +1,10 @@
+import { LayoutType } from '@sbercloud/uikit-product-utils';
+import { CatalogConfig } from '../../types';
+export type CatalogProps = {
+    layoutType?: LayoutType;
+    config: CatalogConfig;
+    open: boolean;
+    setOpen(open: boolean): void;
+    onCardClick?(productId: string): void;
+};
+export declare function Catalog(): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/Catalog/Catalog.js

@@ -0,0 +1,80 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { useState } from 'react';
+import { FilterSVG } from '@sbercloud/uikit-product-icons';
+import { MobileDroplist } from '@sbercloud/uikit-product-mobile-dropdown';
+import { AdaptiveFieldSelect } from '@sbercloud/uikit-product-mobile-fields';
+import { MobileModalCustom } from '@sbercloud/uikit-product-mobile-modal';
+import { LAYOUT_TYPE } from '@sbercloud/uikit-product-utils';
+import { ButtonFilled } from '@snack-uikit/button';
+import { Card } from '@snack-uikit/card';
+import { Divider } from '@snack-uikit/divider';
+import { List } from '@snack-uikit/list';
+import { ModalCustom } from '@snack-uikit/modal';
+import { Tag } from '@snack-uikit/tag';
+import { Tooltip } from '@snack-uikit/tooltip';
+import { useCalculatorContext } from '../../contexts';
+import { useCatalogCardClick } from '../../hooks';
+import { parseKeyToDataTest } from '../../utils';
+import { PrivateCardHeader } from './components';
+import styles from './styles.module.css';
+const bannerText = {
+    public: 'Доступна всем',
+    request: 'Для всех, по заявке',
+    legal: 'Только для юрлиц',
+};
+export function Catalog() {
+    var _a, _b, _c, _d;
+    const { selectedPlatform, setSelectedPlatform, setSelectedCategory, selectedCategory, products, layoutType = LAYOUT_TYPE.Desktop, config, catalogOpen, setCatalogOpen, actions: { onPlatformSelect }, } = useCalculatorContext();
+    const handleCatalogCardClick = useCatalogCardClick();
+    const handlePlatformChange = (platformId) => {
+        onPlatformSelect === null || onPlatformSelect === void 0 ? void 0 : onPlatformSelect(platformId);
+        setSelectedPlatform(platformId);
+        setSelectedCategory(config.catalog[platformId][0].id);
+    };
+    const categoryOptions = config.catalog[selectedPlatform].map(({ id, dataTestId, label }) => ({
+        id,
+        content: {
+            option: label,
+        },
+        'data-test-id': dataTestId,
+    }));
+    const [openMobileCategory, setOpenMobileCategory] = useState(false);
+    const isMobile = layoutType !== LAYOUT_TYPE.Desktop && layoutType !== LAYOUT_TYPE.DesktopSmall;
+    const AdaptiveModal = isMobile ? MobileModalCustom : ModalCustom;
+    return (_jsxs(AdaptiveModal, { open: catalogOpen, 
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        size: 'l', onClose: () => {
+            setCatalogOpen === null || setCatalogOpen === void 0 ? void 0 : setCatalogOpen(false);
+        }, className: cn({ [styles.modal]: !isMobile }), "data-test-id": parseKeyToDataTest('catalog'), children: [_jsx(AdaptiveModal.Header, { title: '\u041A\u0430\u0442\u0430\u043B\u043E\u0433 \u043F\u0440\u043E\u0434\u0443\u043A\u0442\u043E\u0432' }), _jsx(AdaptiveModal.Body, { content: _jsxs("div", { className: styles.wrapper, "data-mobile": isMobile || undefined, children: [_jsxs("div", { className: styles.sidebar, children: [_jsx(AdaptiveFieldSelect, { layoutType: layoutType, value: selectedPlatform, onChange: handlePlatformChange, size: 'm', label: '\u041E\u0431\u043B\u0430\u0447\u043D\u0430\u044F \u043F\u043B\u0430\u0442\u0444\u043E\u0440\u043C\u0430', widthStrategy: 'eq', searchable: false, showClearButton: false, options: config.platforms.map(({ icon, description, id, label, dataTestId, access }) => ({
+                                        value: id,
+                                        beforeContent: icon,
+                                        truncate: {
+                                            option: 2,
+                                            description: 3,
+                                            variant: 'end',
+                                        },
+                                        'data-test-id': dataTestId,
+                                        option: label,
+                                        description: (_jsxs("div", { className: styles.description, children: [_jsxs("span", { children: [description, " "] }), _jsx("div", { children: _jsx(Tag, { label: bannerText[access], appearance: 'green' }) })] })),
+                                    })) }), !isMobile && (_jsxs("div", { className: styles.categoriesWrapper, children: [_jsx(Divider, { orientation: 'vertical' }), _jsx(List, { size: 'm', items: categoryOptions, selection: {
+                                                value: selectedCategory,
+                                                onChange: value => value && setSelectedCategory(value),
+                                                mode: 'single',
+                                            } })] }))] }), _jsxs("div", { className: styles.content, children: [_jsx("div", { className: styles.contentHeadline, "data-test-id": parseKeyToDataTest('catalog', 'category-title'), children: (_a = config.catalog[selectedPlatform].find(item => item.id === selectedCategory)) === null || _a === void 0 ? void 0 : _a.label }), _jsxs("div", { className: styles.contentCards, children: [((_b = config.catalog[selectedPlatform].find(item => item.id === selectedCategory)) === null || _b === void 0 ? void 0 : _b.banner) || null, (_c = config.catalog[selectedPlatform]
+                                            .find(item => item.id === selectedCategory)) === null || _c === void 0 ? void 0 : _c.visibleProducts.map(productId => config.products[productId]).filter(Boolean).map(product => {
+                                            const disabled = product.freeTier && Object.keys(products).includes(product.id);
+                                            return (_jsx(Card, { className: styles.card, size: isMobile ? 's' : 'm', outline: true, disabled: disabled, onClick: disabled ? undefined : () => handleCatalogCardClick === null || handleCatalogCardClick === void 0 ? void 0 : handleCatalogCardClick(product.id), promoBadge: disabled ? { text: 'Добавлен', appearance: 'green' } : undefined, header: _jsx(Tooltip, { open: disabled ? undefined : false, tip: 'Free tier продукты можно добавить только один раз. Чтобы посмотреть конфигурацию продукта, кликните на его карточку в расчете', children: _jsx(PrivateCardHeader, { icon: product === null || product === void 0 ? void 0 : product.icon, title: product === null || product === void 0 ? void 0 : product.label, metadata: product === null || product === void 0 ? void 0 : product.caption, description: (product === null || product === void 0 ? void 0 : product.freeTier) ? (_jsx("div", { className: styles.tag, "data-test-id": parseKeyToDataTest('catalog', 'card-tag'), children: _jsx(Tag, { label: '\u0411\u0435\u0441\u043F\u043B\u0430\u0442\u043D\u0430\u044F \u043A\u043E\u043D\u0444\u0438\u0433\u0443\u0440\u0430\u0446\u0438\u044F', appearance: 'green' }) })) : null }) }), "data-test-id": parseKeyToDataTest('catalog', 'card') }, product.id));
+                                        })] })] })] }) }), isMobile && (_jsx(AdaptiveModal.Footer, { actions: _jsx(MobileDroplist, { open: openMobileCategory, onOpenChange: setOpenMobileCategory, items: categoryOptions, selection: {
+                        value: selectedCategory,
+                        onChange: value => {
+                            setSelectedCategory(value);
+                            setOpenMobileCategory(false);
+                        },
+                        mode: 'single',
+                    }, label: '\u041A\u0430\u0442\u0435\u0433\u043E\u0440\u0438\u0438', 
+                    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                    // @ts-ignore
+                    size: 'l', children: _jsx("div", { className: styles.categoriesWrapper, children: _jsx(ButtonFilled, { size: 'm', appearance: 'neutral', icon: _jsx(FilterSVG, {}), label: `Категории: ${(_d = config.catalog[selectedPlatform].find(item => item.id === selectedCategory)) === null || _d === void 0 ? void 0 : _d.label}` }) }) }) }))] }));
+}

package/dist/esm/components/Catalog/components/PrivateCardHeader.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { IconPredefinedProps } from '@snack-uikit/icon-predefined';
+import { WithSupportProps } from '@snack-uikit/utils';
+export type ProductCardHeaderProps = WithSupportProps<{
+    /** Заголовок */
+    title: string;
+    /** Подзаголовок */
+    description?: ReactNode;
+    /** Метаинформация */
+    metadata?: string;
+    icon?: IconPredefinedProps['icon'];
+    /** CSS-класс для элемента с контентом */
+    className?: string;
+}>;
+export declare function PrivateCardHeader({ title, description, metadata, icon, className, ...rest }: ProductCardHeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/components/Catalog/components/PrivateCardHeader.js

@@ -0,0 +1,22 @@
+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;
+};
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import cn from 'classnames';
+import { IconPredefined } from '@snack-uikit/icon-predefined';
+import { Typography } from '@snack-uikit/typography';
+import { excludeSupportProps } from '@snack-uikit/utils';
+import { parseKeyToDataTest } from '../../../utils';
+import styles from './styles.module.css';
+export function PrivateCardHeader(_a) {
+    var { title, description, metadata, icon, className } = _a, rest = __rest(_a, ["title", "description", "metadata", "icon", "className"]);
+    return (_jsxs("div", Object.assign({ className: cn(styles.titleLayout, className) }, excludeSupportProps(rest), { children: [icon && _jsx(IconPredefined, { icon: icon, size: 's', decor: false, appearance: 'neutral', shape: 'square' }), _jsxs("div", { className: styles.contentLayout, children: [_jsx(Typography, { family: 'sans', size: 's', purpose: 'title', className: styles.title, "data-test-id": parseKeyToDataTest('catalog-card', 'title'), children: title }), metadata && _jsx(Typography.SansBodyS, { className: styles.metadata, children: metadata }), description && (_jsx(Typography, { family: 'sans', size: 'm', purpose: 'body', className: styles.description, "data-test-id": parseKeyToDataTest('catalog-card', 'desc'), children: description }))] })] })));
+}

package/dist/esm/components/Catalog/components/index.d.ts

@@ -0,0 +1 @@
+export * from './PrivateCardHeader';

package/dist/esm/components/Catalog/components/index.js

@@ -0,0 +1 @@
+export * from './PrivateCardHeader';

package/dist/esm/components/Catalog/components/styles.module.css

@@ -0,0 +1,29 @@
+.titleLayout{
+  gap:var(--space-card-gap-s, 4px);
+  display:flex;
+  align-items:flex-start;
+  box-sizing:border-box;
+  width:100%;
+}
+
+.contentLayout{
+  overflow:hidden;
+  display:block;
+  max-width:100%;
+}
+
+.title{
+  display:block;
+  max-width:100%;
+  color:var(--sys-neutral-text-main, #41424e);
+}
+
+.metadata{
+  max-width:100%;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+
+.description{
+  max-width:100%;
+  color:var(--sys-neutral-text-support, #6d707f);
+}

package/dist/esm/components/Catalog/index.d.ts

@@ -0,0 +1 @@
+export * from './Catalog';

package/dist/esm/components/Catalog/index.js

@@ -0,0 +1 @@
+export * from './Catalog';

package/dist/esm/components/Catalog/styles.module.css

@@ -0,0 +1,95 @@
+.calculator{
+  box-sizing:border-box;
+}
+
+.content{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-2m, 16px);
+  min-height:400px;
+  padding-bottom:var(--dimension-3m, 24px);
+}
+
+.contentHeadline{
+  font-family:var(--sans-title-l-font-family, SB Sans Interface);
+  font-weight:var(--sans-title-l-font-weight, Semibold);
+  line-height:var(--sans-title-l-line-height, 28px);
+  font-size:var(--sans-title-l-font-size, 20px);
+  letter-spacing:var(--sans-title-l-letter-spacing, 0.15px);
+  paragraph-spacing:var(--sans-title-l-paragraph-spacing, 11px);
+}
+
+.contentCards{
+  display:flex;
+  flex-wrap:wrap;
+  gap:var(--dimension-2m, 16px);
+}
+
+.categoriesWrapper{
+  display:grid;
+  grid-template-columns:auto 1fr;
+  margin-top:var(--dimension-2m, 16px);
+}
+
+.selectCard{
+  display:flex;
+  padding:var(--dimension-3m, 24px);
+  border:solid 1px var(--sys-neutral-decor-default, #dde0ea);
+}
+
+.card{
+  width:280px;
+}
+
+.modal{
+  width:1298px !important;
+  max-width:calc(100dvw - 2 * var(--dimension-3m, 24px));
+  color:var(--sys-neutral-text-main, #41424e);
+}
+
+.sidebar{
+  padding-bottom:var(--dimension-3m, 24px);
+}
+
+.wrapper{
+  position:relative;
+  min-height:100%;
+  z-index:0;
+  display:grid;
+  grid-template-columns:256px 1fr;
+  gap:var(--dimension-4m, 32px);
+}
+.wrapper[data-mobile]{
+  grid-template-columns:1fr;
+  gap:var(--dimension-1m, 8px);
+  min-height:inherit;
+}
+.wrapper[data-mobile] .card{
+  width:100%;
+  height:inherit;
+}
+.wrapper[data-mobile] .content{
+  min-height:inherit;
+}
+.wrapper[data-mobile] .sidebar{
+  position:sticky;
+  top:0;
+  left:0;
+  background-color:var(--sys-neutral-background1-level, #fdfdfd);
+  padding:var(--dimension-3m, 24px) 0 var(--dimension-1m, 8px);
+  transform:translateY(calc(0px - var(--dimension-3m, 24px)));
+  z-index:1;
+}
+.wrapper[data-mobile] .contentCards{
+  margin:0 var(--dimension-050m, 4px);
+}
+
+.description{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-050m, 4px);
+}
+
+.tag{
+  margin-top:var(--dimension-050m, 4px);
+}

package/dist/esm/components/Controls/AlertControl/AlertControl.d.ts

@@ -0,0 +1,15 @@
+import { AlertProps } from '@snack-uikit/alert';
+import { FormValues } from '../../../types';
+import { CONTROL } from '../constants';
+import { BaseControl, WithVisible } from '../types';
+export type AlertControl = Pick<BaseControl<AlertProps>, 'uiProps' | 'accessorKey' | 'watchedControls' | 'onChangePeriod' | 'canChangeWholePricePeriod'> & {
+    type: typeof CONTROL.Alert;
+    relateFn?(watchedValues: FormValues): {
+        uiProps?: Partial<WithVisible<AlertProps>>;
+    } | undefined;
+    onChangeFn?: never;
+};
+export type AlertControlUiProps = AlertControl & {
+    watchedValues?: FormValues;
+};
+export declare function AlertControlUi({ uiProps, relateFn, watchedValues, accessorKey }: AlertControlUiProps): import("react/jsx-runtime").JSX.Element | null;

package/dist/esm/components/Controls/AlertControl/AlertControl.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { Alert } from '@snack-uikit/alert';
+import { parseKeyToDataTest } from '../../../utils';
+export function AlertControlUi({ uiProps, relateFn, watchedValues, accessorKey }) {
+    var _a, _b;
+    const { uiProps: relatedUiProps } = useMemo(() => { var _a; return (_a = relateFn === null || relateFn === void 0 ? void 0 : relateFn(watchedValues !== null && watchedValues !== void 0 ? watchedValues : {})) !== null && _a !== void 0 ? _a : {}; }, [relateFn, watchedValues]);
+    const dataTestAttribute = parseKeyToDataTest('alert', accessorKey);
+    const visible = (_b = (_a = relatedUiProps === null || relatedUiProps === void 0 ? void 0 : relatedUiProps.visible) !== null && _a !== void 0 ? _a : uiProps === null || uiProps === void 0 ? void 0 : uiProps.visible) !== null && _b !== void 0 ? _b : true;
+    if (!visible) {
+        return null;
+    }
+    return (_jsx(Alert, Object.assign({ description: '', appearance: 'info', outline: true }, uiProps, relatedUiProps, { "data-test-id": dataTestAttribute })));
+}

package/dist/esm/components/Controls/AlertControl/index.d.ts

@@ -0,0 +1 @@
+export * from './AlertControl';

package/dist/esm/components/Controls/AlertControl/index.js

@@ -0,0 +1 @@
+export * from './AlertControl';

package/dist/esm/components/Controls/ArrayControl/ArrayControl.d.ts

@@ -0,0 +1,26 @@
+import { AnyType } from '../../../types';
+import { CONTROL } from '../constants';
+import { ObjectControl } from '../ObjectControl';
+export type ArrayControl = {
+    type: typeof CONTROL.Array;
+    /** Минимальное кол-во элементов массива */
+    min?: number;
+    /** Максимальное кол-во элементов массива */
+    max: number;
+    /**
+     * Поле (полный путь),  куда будет сохраняться значение
+     *
+     * @example 'esc.cpu'
+     */
+    accessorKey: string;
+    /** Текст кнопки добавления нового элемента */
+    addText: string;
+    /** Дефолтное значение */
+    defaultValue: AnyType[];
+    invertTrashOffset?: boolean;
+    onChangeFn?: never;
+    relateFn?: never;
+} & Omit<ObjectControl, 'type'>;
+type ArrayControlUiProps = ArrayControl;
+export declare function ArrayControlUi({ accessorKey, ui, controls, max, addText, min, invertTrashOffset, }: ArrayControlUiProps): import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/esm/components/Controls/ArrayControl/ArrayControl.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { PlusSVG, TrashSVG } from '@sbercloud/uikit-product-icons';
+import { ButtonFunction } from '@snack-uikit/button';
+import { ProductContext, useProductContext } from '../../../contexts';
+import { useAdaptive } from '../../../hooks';
+import { getValue, parseKeyToDataTest, setValue } from '../../../utils';
+import { CONTROL } from '../constants';
+import { ObjectControlUi } from '../ObjectControl';
+import { getDefaultValues } from '../utils';
+import styles from './styles.module.css';
+export function ArrayControlUi({ accessorKey, ui, controls, max, addText, min = 0, invertTrashOffset, }) {
+    const { value: valueProp, onChange: onChangeProp } = useProductContext();
+    const { isMobile } = useAdaptive();
+    const value = getValue(valueProp, accessorKey);
+    const onChange = (newValue) => {
+        setValue(valueProp, accessorKey, newValue);
+        onChangeProp(valueProp);
+    };
+    return (_jsxs("div", { className: styles.container, children: [value === null || value === void 0 ? void 0 : value.map((_, idx) => (_jsx(ProductContext.Provider, { value: {
+                    value: Object.assign({}, getValue(value, `[${idx}]`)),
+                    onChange: newValue => {
+                        setValue(value, `[${idx}]`, newValue);
+                        onChange(value);
+                    },
+                }, children: _jsxs("div", { className: styles.row, children: [_jsx("div", { className: styles.wrap, "data-mobile": isMobile || undefined, children: _jsx(ObjectControlUi, { ui: ui, controls: controls, type: CONTROL.Object }) }), (value !== null && value !== void 0 ? value : []).length > min && (_jsx(ButtonFunction, { icon: _jsx(TrashSVG, {}), className: invertTrashOffset ? styles.trashInvert : styles.trash, size: 'm', onClick: () => {
+                                value === null || value === void 0 ? void 0 : value.splice(idx, 1);
+                                onChange(value);
+                            } }))] }, idx) }, idx))), (value !== null && value !== void 0 ? value : []).length < max && (_jsx(ButtonFunction, { icon: _jsx(PlusSVG, {}), size: 'm', iconPosition: 'before', label: addText, onClick: () => {
+                    onChange((value !== null && value !== void 0 ? value : []).concat([getDefaultValues(controls)]));
+                }, "data-test-id": parseKeyToDataTest('button') }))] }));
+}

package/dist/esm/components/Controls/ArrayControl/index.d.ts

@@ -0,0 +1 @@
+export * from './ArrayControl';

package/dist/esm/components/Controls/ArrayControl/index.js

@@ -0,0 +1 @@
+export * from './ArrayControl';

package/dist/esm/components/Controls/ArrayControl/styles.module.css

@@ -0,0 +1,27 @@
+.row{
+  display:grid;
+  grid-template-columns:1fr auto;
+  gap:var(--dimension-1m, 8px);
+  align-items:flex-start;
+}
+.row .trash{
+  margin-top:var(--dimension-3m, 24px);
+}
+.row .trashInvert{
+  margin-top:calc(0px - var(--dimension-1m, 8px));
+}
+
+.container{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-3m, 24px);
+}
+
+.wrap{
+  display:flex;
+  flex-direction:column;
+  gap:var(--dimension-3m, 24px);
+}
+.wrap[data-mobile]{
+  gap:var(--dimension-2m, 16px);
+}

package/dist/esm/components/Controls/CarouselControl/CarouselControl.d.ts

@@ -0,0 +1,17 @@
+import { CarouselProps } from '@snack-uikit/carousel';
+import { FormValues } from '../../../types';
+import { CONTROL } from '../constants';
+import { ToggleCardItem } from '../ToggleCard';
+import { BaseControlWithItems } from '../types';
+type CarouselUiProps = Pick<CarouselProps, 'transition' | 'scrollBy' | 'className' | 'swipe' | 'infiniteScroll' | 'arrows' | 'showItems' | 'pagination' | 'gap' | 'swipeActivateLength'>;
+export type CarouselControl = {
+    type: typeof CONTROL.Carousel;
+    defaultValue?: string;
+} & BaseControlWithItems<ToggleCardItem, CarouselUiProps>;
+export type CarouselControlUiProps = {
+    value?: string;
+    onChange?(value: string): void;
+    watchedValues?: FormValues;
+} & CarouselControl;
+export declare function CarouselControlUi({ items: itemsProp, value, onChange, uiProps, decoratorProps, watchedValues, relateFn, accessorKey, }: CarouselControlUiProps): import("react/jsx-runtime").JSX.Element | null;
+export {};