@itcase/ui 1.8.96 → 1.8.98

package/dist/cjs/components/ModalSheetBottom.js

@@ -4,9 +4,12 @@ var tslib_es6 = require('../../tslib.es6_cjs_CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var reactModalSheet = require('react-modal-sheet');
+var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
+var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
 var useStyles = require('../hooks/useStyles/useStyles.js');
+var Icon = require('../../Icon_cjs_B-nskaAO.js');
 require('lodash/camelCase');
-require('lodash/maxBy');
+require('lodash/castArray');
 require('lodash/upperFirst');
 require('../context/Notifications.js');
 require('uuid');
@@ -15,16 +18,33 @@ require('../context/UIContext.js');
 require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
 require('../utils/setViewportProperty.js');
+require('lodash/maxBy');
 require('../hooks/useStyles/styleAttributes.js');
+require('clsx');
+require('react-inlinesvg');
+require('../hoc/urlWithAssetPrefix.js');
+require('../context/UrlAssetPrefix.js');
+require('../../Link_cjs_BqT6eVl6.js');
+require('../../Text_cjs_DmuzuKFj.js');
 
 var modalSheetBottomAppearance = {
+    sizeL: {
+        size: 'l',
+        titleTextSize: 'h4',
+    },
+    sizeM: {
+        size: 'm',
+        titleTextSize: 'h5',
+    },
     dev: {
         fill: 'accentPrimary',
     },
 };
 
+var modalSheetBottomConfig = {
+    appearance: modalSheetBottomAppearance};
 var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
-    var dataTestId = props.dataTestId, dataTour = props.dataTour, initialIsOpen = props.initialIsOpen, closeButton = props.closeButton, onCloseModalSheetBottom = props.onCloseModalSheetBottom, onOpenModalSheetBottom = props.onOpenModalSheetBottom, children = props.children;
+    var dataTestId = props.dataTestId, dataTour = props.dataTour, appearance = props.appearance, initialIsOpen = props.initialIsOpen, title = props.title, closeButton = props.closeButton, onCloseModalSheetBottom = props.onCloseModalSheetBottom, onOpenModalSheetBottom = props.onOpenModalSheetBottom, children = props.children;
     var _a = React.useState(initialIsOpen), isOpen = _a[0], setIsOpen = _a[1];
     var openModalSheetBottom = React.useCallback(function () {
         setIsOpen(true);
@@ -40,9 +60,12 @@ var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
         closeModal: closeModalSheetBottom,
         isOpen: isOpen,
     }); }, [isOpen, openModalSheetBottom, closeModalSheetBottom]);
+    var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, modalSheetBottomConfig);
+    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    var titleTextColor = propsGenerator.titleTextColor, titleTextColorHover = propsGenerator.titleTextColorHover, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWidth = propsGenerator.titleTextWidth, titleTextWrap = propsGenerator.titleTextWrap;
     // @ts-expect-error
     var styles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs(reactModalSheet.Sheet, tslib_es6.__assign({ dataTestId: dataTestId, dataTour: dataTour, className: "modal-sheet-bottom", isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxRuntime.jsxs(reactModalSheet.Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsxRuntime.jsx("div", { className: "modal-sheet-bottom__header", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsxRuntime.jsx(reactModalSheet.Sheet.Header, { className: "modal-sheet-bottom__header" })), jsxRuntime.jsx(reactModalSheet.Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsxRuntime.jsx(reactModalSheet.Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
+    return (jsxRuntime.jsxs(reactModalSheet.Sheet, tslib_es6.__assign({ dataTestId: dataTestId, dataTour: dataTour, className: "modal-sheet-bottom", isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxRuntime.jsxs(reactModalSheet.Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsxRuntime.jsx(reactModalSheet.Sheet.Header, { className: "modal-sheet-bottom__header" }), (closeButton || title) && (jsxRuntime.jsxs("div", { className: "modal-sheet-bottom__header", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), jsxRuntime.jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })] })), jsxRuntime.jsx(reactModalSheet.Sheet.Content, { className: "modal-sheet-bottom__content", children: jsxRuntime.jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsxRuntime.jsx(reactModalSheet.Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
 });
 
 exports.ModalSheetBottom = ModalSheetBottom;

package/dist/cjs/components/Response.js

@@ -37,10 +37,24 @@ var responseAppearanceConfirm = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
+        svgFill: 'surfaceTertiary',
+        svgPathFill: 'surfaceItemQuaternary',
+    },
+};
+
+var responseAppearanceEmpty = {
+    empty: {
+        fill: 'surfacePrimary',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'xxl',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
     },
 };
 
@@ -51,8 +65,8 @@ var responseAppearanceFail = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -65,8 +79,8 @@ var responseAppearanceNothingFound = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -79,13 +93,27 @@ var responseAppearanceRefresh = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
 };
 
+var responseAppearanceDanger = {
+    danger: {
+        fill: 'surfacePrimary',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'xxl',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextSize: 'm',
+        primaryButtonAppearance: 'dangerPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
+        svgFill: 'dangerPrimary',
+        svgPathFill: 'dangerItemPrimary',
+    },
+};
+
 var responseAppearanceError = {
     error: {
         fill: 'surfacePrimary',
@@ -93,8 +121,8 @@ var responseAppearanceError = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'errorPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'errorPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'errorPrimary',
         svgPathFill: 'errorItemPrimary',
     },
@@ -107,10 +135,10 @@ var responseAppearanceSuccess = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'accentPrimary',
         svgPathFill: 'accentItemPrimary',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
     },
 };
 
@@ -121,8 +149,8 @@ var responseAppearanceUnableLoadData = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -135,14 +163,14 @@ var responseAppearanceWarning = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'warningPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'warningPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'warningPrimary',
         svgPathFill: 'warningItemPrimary',
     },
 };
 
-var responseAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, responseAppearanceConfirm), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning);
+var responseAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, responseAppearanceConfirm), responseAppearanceEmpty), responseAppearanceDanger), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning);
 
 var responseConfig = {
     appearance: responseAppearance,

package/dist/components/ModalSheetBottom.js

@@ -2,9 +2,12 @@ import { _ as __assign } from '../tslib.es6_es_Bwu1Cn-t.js';
 import { jsxs, jsx } from 'react/jsx-runtime';
 import React, { useState, useCallback, useImperativeHandle } from 'react';
 import { Sheet } from 'react-modal-sheet';
+import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
+import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
 import { useStyles } from '../hooks/useStyles/useStyles.js';
+import { b as Title } from '../Icon_es_CTKPPrrC.js';
 import 'lodash/camelCase';
-import 'lodash/maxBy';
+import 'lodash/castArray';
 import 'lodash/upperFirst';
 import '../context/Notifications.js';
 import 'uuid';
@@ -13,16 +16,33 @@ import '../context/UIContext.js';
 import '../hooks/useMediaQueries/useMediaQueries.js';
 import 'react-responsive';
 import '../utils/setViewportProperty.js';
+import 'lodash/maxBy';
 import '../hooks/useStyles/styleAttributes.js';
+import 'clsx';
+import 'react-inlinesvg';
+import '../hoc/urlWithAssetPrefix.js';
+import '../context/UrlAssetPrefix.js';
+import '../Link_es_BnUIX0QT.js';
+import '../Text_es_DIU5ySvf.js';
 
 var modalSheetBottomAppearance = {
+    sizeL: {
+        size: 'l',
+        titleTextSize: 'h4',
+    },
+    sizeM: {
+        size: 'm',
+        titleTextSize: 'h5',
+    },
     dev: {
         fill: 'accentPrimary',
     },
 };
 
+var modalSheetBottomConfig = {
+    appearance: modalSheetBottomAppearance};
 var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
-    var dataTestId = props.dataTestId, dataTour = props.dataTour, initialIsOpen = props.initialIsOpen, closeButton = props.closeButton, onCloseModalSheetBottom = props.onCloseModalSheetBottom, onOpenModalSheetBottom = props.onOpenModalSheetBottom, children = props.children;
+    var dataTestId = props.dataTestId, dataTour = props.dataTour, appearance = props.appearance, initialIsOpen = props.initialIsOpen, title = props.title, closeButton = props.closeButton, onCloseModalSheetBottom = props.onCloseModalSheetBottom, onOpenModalSheetBottom = props.onOpenModalSheetBottom, children = props.children;
     var _a = useState(initialIsOpen), isOpen = _a[0], setIsOpen = _a[1];
     var openModalSheetBottom = useCallback(function () {
         setIsOpen(true);
@@ -38,9 +58,12 @@ var ModalSheetBottom = React.forwardRef(function Modal(props, ref) {
         closeModal: closeModalSheetBottom,
         isOpen: isOpen,
     }); }, [isOpen, openModalSheetBottom, closeModalSheetBottom]);
+    var appearanceConfig = useAppearanceConfig(appearance, modalSheetBottomConfig);
+    var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
+    var titleTextColor = propsGenerator.titleTextColor, titleTextColorHover = propsGenerator.titleTextColorHover, titleTextSize = propsGenerator.titleTextSize, titleTextTruncate = propsGenerator.titleTextTruncate, titleTextWeight = propsGenerator.titleTextWeight, titleTextWidth = propsGenerator.titleTextWidth, titleTextWrap = propsGenerator.titleTextWrap;
     // @ts-expect-error
     var styles = useStyles(props).styles;
-    return (jsxs(Sheet, __assign({ dataTestId: dataTestId, dataTour: dataTour, className: "modal-sheet-bottom", isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [closeButton ? (jsx("div", { className: "modal-sheet-bottom__header", children: jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton }) })) : (jsx(Sheet.Header, { className: "modal-sheet-bottom__header" })), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
+    return (jsxs(Sheet, __assign({ dataTestId: dataTestId, dataTour: dataTour, className: "modal-sheet-bottom", isOpen: isOpen, onClose: closeModalSheetBottom }, props, { children: [jsxs(Sheet.Container, { className: "modal-sheet-bottom__container", style: styles, children: [jsx(Sheet.Header, { className: "modal-sheet-bottom__header" }), (closeButton || title) && (jsxs("div", { className: "modal-sheet-bottom__header", children: [title && (jsx(Title, { className: "modal__title", width: titleTextWidth, size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), jsx("div", { className: "modal-sheet-bottom__close", onClick: closeModalSheetBottom, children: closeButton })] })), jsx(Sheet.Content, { className: "modal-sheet-bottom__content", children: jsx("div", { className: "modal-sheet-bottom__content-wrapper", children: children }) })] }), jsx(Sheet.Backdrop, { className: "modal-sheet-bottom__backdrop", onClick: closeModalSheetBottom })] })));
 });
 
 export { ModalSheetBottom, modalSheetBottomAppearance };

package/dist/components/Response.js

@@ -35,10 +35,24 @@ var responseAppearanceConfirm = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
+        svgFill: 'surfaceTertiary',
+        svgPathFill: 'surfaceItemQuaternary',
+    },
+};
+
+var responseAppearanceEmpty = {
+    empty: {
+        fill: 'surfacePrimary',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'xxl',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
     },
 };
 
@@ -49,8 +63,8 @@ var responseAppearanceFail = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -63,8 +77,8 @@ var responseAppearanceNothingFound = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -77,13 +91,27 @@ var responseAppearanceRefresh = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
 };
 
+var responseAppearanceDanger = {
+    danger: {
+        fill: 'surfacePrimary',
+        titleTextColor: 'surfaceTextPrimary',
+        titleTextSize: 'xxl',
+        labelTextColor: 'surfaceTextPrimary',
+        descTextSize: 'm',
+        primaryButtonAppearance: 'dangerPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
+        svgFill: 'dangerPrimary',
+        svgPathFill: 'dangerItemPrimary',
+    },
+};
+
 var responseAppearanceError = {
     error: {
         fill: 'surfacePrimary',
@@ -91,8 +119,8 @@ var responseAppearanceError = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'errorPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'errorPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'errorPrimary',
         svgPathFill: 'errorItemPrimary',
     },
@@ -105,10 +133,10 @@ var responseAppearanceSuccess = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'accentPrimary',
         svgPathFill: 'accentItemPrimary',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
     },
 };
 
@@ -119,8 +147,8 @@ var responseAppearanceUnableLoadData = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'accentPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'accentPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'surfaceTertiary',
         svgPathFill: 'surfaceItemQuaternary',
     },
@@ -133,14 +161,14 @@ var responseAppearanceWarning = {
         titleTextSize: 'xxl',
         labelTextColor: 'surfaceTextPrimary',
         descTextSize: 'm',
-        primaryButtonAppearance: 'warningPrimary sizeXXL',
-        secondaryButtonAppearance: 'surfaceSecondary sizeXXL',
+        primaryButtonAppearance: 'warningPrimary sizeXXL solid',
+        secondaryButtonAppearance: 'surfaceSecondary sizeXXL solid',
         svgFill: 'warningPrimary',
         svgPathFill: 'warningItemPrimary',
     },
 };
 
-var responseAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, responseAppearanceConfirm), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning);
+var responseAppearance = __assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign(__assign({}, responseAppearanceConfirm), responseAppearanceEmpty), responseAppearanceDanger), responseAppearanceRefresh), responseAppearanceUnableLoadData), responseAppearanceNothingFound), responseAppearanceFail), responseAppearanceError), responseAppearanceSuccess), responseAppearanceWarning);
 
 var responseConfig = {
     appearance: responseAppearance,

package/dist/css/components/ModalSheetBottom/ModalSheetBottom.css

@@ -5,14 +5,15 @@
     border-radius: var(--modal-sheet-bottom-container-border-radius) !important;
   }
   &__header {
-    height: 32px;
+    min-height: 32px;
+    padding: 0 16px;
     & .react-modal-sheet-header {
       max-height: 32px;
     }
     & .react-modal-sheet-drag-indicator {
       background-color: var(
         --modal-sheet-bottom-header-grabber,
-        var(--color-surface-item-primary)
+        #000
       ) !important;
     }
   }

package/dist/types/components/ModalSheetBottom/ModalSheetBottom.appearance.d.ts

@@ -1,4 +1,12 @@
 export declare const modalSheetBottomAppearance: {
+    sizeL: {
+        size: string;
+        titleTextSize: string;
+    };
+    sizeM: {
+        size: string;
+        titleTextSize: string;
+    };
     dev: {
         fill: string;
     };

package/dist/types/components/Response/appearance/responceConfirm.d.ts

@@ -5,10 +5,10 @@ declare const responseAppearanceConfirm: {
         titleTextSize: string;
         labelTextColor: string;
         descTextSize: string;
-        svgFill: string;
-        svgPathFill: string;
         primaryButtonAppearance: string;
         secondaryButtonAppearance: string;
+        svgFill: string;
+        svgPathFill: string;
     };
 };
 export { responseAppearanceConfirm };

package/dist/types/components/Response/appearance/responceEmpty.d.ts

@@ -0,0 +1,14 @@
+declare const responseAppearanceEmpty: {
+    empty: {
+        fill: string;
+        titleTextColor: string;
+        titleTextSize: string;
+        labelTextColor: string;
+        descTextSize: string;
+        primaryButtonAppearance: string;
+        secondaryButtonAppearance: string;
+        svgFill: string;
+        svgPathFill: string;
+    };
+};
+export { responseAppearanceEmpty };

package/dist/types/components/Response/appearance/responseDanger.d.ts

@@ -0,0 +1,14 @@
+declare const responseAppearanceDanger: {
+    danger: {
+        fill: string;
+        titleTextColor: string;
+        titleTextSize: string;
+        labelTextColor: string;
+        descTextSize: string;
+        primaryButtonAppearance: string;
+        secondaryButtonAppearance: string;
+        svgFill: string;
+        svgPathFill: string;
+    };
+};
+export { responseAppearanceDanger };

package/dist/types/components/Response/appearance/responseSuccess.d.ts

@@ -5,10 +5,10 @@ declare const responseAppearanceSuccess: {
         titleTextSize: string;
         labelTextColor: string;
         descTextSize: string;
-        svgFill: string;
-        svgPathFill: string;
         primaryButtonAppearance: string;
         secondaryButtonAppearance: string;
+        svgFill: string;
+        svgPathFill: string;
     };
 };
 export { responseAppearanceSuccess };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.96",
+  "version": "1.8.98",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",