@itcase/ui 1.3.9 → 1.3.11

package/dist/cjs/components/Choice.js

@@ -23,6 +23,16 @@ require('../../Tooltip-CNua1g76.js');
 require('../../Title-DBaHcpvB.js');
 
 var choiceAppearance = {
+    accent: {
+        borderColor: 'surfaceBorderSecondary',
+        fill: 'surfacePrimary',
+        fillActive: 'accentPrimary',
+        labelTextActiveColor: 'accentTextPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        labelTextSize: 's',
+        shape: 'rounded',
+        size: 'normal',
+    },
     dev: {
         borderColor: 'surfaceBorderTertiary',
         fill: 'surfacePrimary',

package/dist/cjs/components/Drawer.js

@@ -2,8 +2,8 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
-var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
 var ReactDrawer = require('react-modern-drawer');
+var useDeviceTargetClassGenerator = require('../hooks/useDeviceTargetClassGenerator.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('react');
 require('lodash/camelCase');

package/dist/cjs/components/Tab.js

@@ -125,7 +125,7 @@ var tabConfig = {
     },
 };
 function Tab(props) {
-    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextAlign = props.labelTextAlign, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
+    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeShape = props.badgeShape, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextAlign = props.labelTextAlign, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
     // @ts-expect-error
     var appearanceConfig = tabConfig.appearance && tabConfig.appearance[appearance];
     var classGenerator = useDeviceTargetClassGenerator.useDeviceTargetClassGenerator(props, appearanceConfig);
@@ -136,7 +136,7 @@ function Tab(props) {
             ? fillClass && "fill_".concat(fillClass)
             : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsx(Link.Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxRuntime.jsxs(React.Fragment, { children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: "tab__wrapper", children: [(label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textAlign: labelTextAlign, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, textColor: isDisabled
                                             ? labelColorDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorDisabled)
-                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsxRuntime.jsx(Badge.Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsxRuntime.jsx(Divider.Divider, { width: "fill", fill: isDisabled
+                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsxRuntime.jsx(Badge.Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), shape: badgeShape, size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsxRuntime.jsx(Divider.Divider, { width: "fill", fill: isDisabled
                                     ? dividerFillDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillDisabled)
                                     : dividerFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFill), fillHover: isHover && (dividerFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillHover)), direction: dividerDirection, fillActive: isActive && (dividerFillActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillActive)), fillActiveHover: dividerFillActiveHover, size: dividerSize })] })), after] }) }) }));
 }

package/dist/components/Choice.js

@@ -21,6 +21,16 @@ import '../Tooltip-1Jbub0K6.js';
 import '../Title-CHgrIarR.js';
 
 var choiceAppearance = {
+    accent: {
+        borderColor: 'surfaceBorderSecondary',
+        fill: 'surfacePrimary',
+        fillActive: 'accentPrimary',
+        labelTextActiveColor: 'accentTextPrimary',
+        labelTextColor: 'surfaceTextPrimary',
+        labelTextSize: 's',
+        shape: 'rounded',
+        size: 'normal',
+    },
     dev: {
         borderColor: 'surfaceBorderTertiary',
         fill: 'surfacePrimary',

package/dist/components/Drawer.js

@@ -1,7 +1,7 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
 import clsx from 'clsx';
-import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import ReactDrawer from 'react-modern-drawer';
+import { useDeviceTargetClassGenerator } from '../hooks/useDeviceTargetClassGenerator.js';
 import '../tslib.es6-5FtW-kfi.js';
 import 'react';
 import 'lodash/camelCase';

package/dist/components/Tab.js

@@ -123,7 +123,7 @@ var tabConfig = {
     },
 };
 function Tab(props) {
-    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextAlign = props.labelTextAlign, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
+    var children = props.children, _a = props.isActive, isActive = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isHover, isHover = _c === void 0 ? false : _c, after = props.after, appearance = props.appearance, badgeAppearance = props.badgeAppearance, badgeShape = props.badgeShape, badgeSize = props.badgeSize, badgeTextColor = props.badgeTextColor, badgeTextSize = props.badgeTextSize, badgeValue = props.badgeValue, before = props.before, className = props.className, dataTour = props.dataTour, _d = props.dividerDirection, dividerDirection = _d === void 0 ? 'horizontal' : _d, dividerFill = props.dividerFill, dividerFillActive = props.dividerFillActive, dividerFillActiveHover = props.dividerFillActiveHover, dividerFillDisabled = props.dividerFillDisabled, dividerFillHover = props.dividerFillHover, dividerSize = props.dividerSize, href = props.href, label = props.label, labelColor = props.labelColor, labelColorActive = props.labelColorActive, labelColorDisabled = props.labelColorDisabled, labelTextAlign = props.labelTextAlign, labelTextColorHover = props.labelTextColorHover, labelTextGradient = props.labelTextGradient, labelTextSize = props.labelTextSize, labelTextStyle = props.labelTextStyle, labelTextWeight = props.labelTextWeight, labelTextWrap = props.labelTextWrap, link = props.link, linkFill = props.linkFill, rel = props.rel, reset = props.reset, set = props.set, target = props.target, onClick = props.onClick, onMouseEnter = props.onMouseEnter;
     // @ts-expect-error
     var appearanceConfig = tabConfig.appearance && tabConfig.appearance[appearance];
     var classGenerator = useDeviceTargetClassGenerator(props, appearanceConfig);
@@ -134,7 +134,7 @@ function Tab(props) {
             ? fillClass && "fill_".concat(fillClass)
             : fillDisabledClass && "fill_disabled_".concat(fillDisabledClass), !isDisabled ? fillHoverClass && "fill_hover_".concat(fillHoverClass) : null, className, sizeClass && "tab_size_".concat(sizeClass), fillActiveClass && "fill_active_".concat(fillActiveClass), fillActiveHoverClass && "fill_active_hover_".concat(fillActiveHoverClass), shapeClass && "tab_shape_".concat(shapeClass), typeClass && "tab_type_".concat(typeClass), widthClass && "width_".concat(widthClass), reset && 'tab-reset', set && "tab_set_".concat(set), justifyContentClass && "tab_justify-content_".concat(justifyContentClass), onClick && 'cursor_type_pointer'), "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsx(Link, { className: clsx('tab__link', alignDirectionClass && "align_".concat(alignDirectionClass), alignClass && "align_".concat(alignClass)), fill: linkFill, href: link || href, rel: rel, target: target, children: jsxs(React.Fragment, { children: [before, children || (jsxs(React.Fragment, { children: [jsxs("div", { className: "tab__wrapper", children: [(label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label)) && (jsx(Text, { className: "tab__label", size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textAlign: labelTextAlign, textColorGradient: labelTextGradient, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, textColor: isDisabled
                                             ? labelColorDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorDisabled)
-                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsx(Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsx(Divider, { width: "fill", fill: isDisabled
+                                            : labelColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColor), textColorActive: isActive && (labelColorActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelColorActive)), children: label || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.label) })), (badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue)) && (jsx(Badge, { appearance: badgeAppearance || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeAppearance), shape: badgeShape, size: badgeSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeSize), textColor: badgeTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextColor), textSize: badgeTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeTextSize), value: badgeValue || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.badgeValue) }))] }), jsx(Divider, { width: "fill", fill: isDisabled
                                     ? dividerFillDisabled || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillDisabled)
                                     : dividerFill || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFill), fillHover: isHover && (dividerFillHover || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillHover)), direction: dividerDirection, fillActive: isActive && (dividerFillActive || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.dividerFillActive)), fillActiveHover: dividerFillActiveHover, size: dividerSize })] })), after] }) }) }));
 }

package/dist/css/components/DatePicker/DatePicker.css

@@ -1102,7 +1102,7 @@ h2.react-datepicker__current-month {
       }
     }
   }
-  &__clear-icon {
+  &__clear-icon.icon {
     position: absolute;
     top: 50%;
     right: 12px;

package/dist/css/components/Dot/Dot.css

@@ -12,14 +12,16 @@
     }
   }
 }
-.dot_shape {
-  &_rounded {
-    border-radius: var(--dot-shape-rounded, 12px);
-  }
-  &_circular {
-    border-radius: 50%;
-  }
-  &_geometric {
-    border-radius: 0;
+.dot {
+  &_shape {
+    &_rounded {
+      border-radius: var(--dot-shape-rounded, 12px);
+    }
+    &_circular {
+      border-radius: 50%;
+    }
+    &_geometric {
+      border-radius: 0;
+    }
   }
 }

package/dist/css/components/Tab/Tab.css

@@ -68,9 +68,3 @@ div.tab-reset {
     }
   }
 }
-:root {
-  --tab-size-normal-padding: 10px;
-  --tab-size-normal-gap: 10px;
-  --tab-size-compact-padding: 10px;
-  --tab-size-compact-gap: 10px;
-}

package/dist/css/styles/text-color/text-color.css

@@ -1,7 +1,7 @@
 .text {
   &&-color {
     @each $type in accent, primary, secondary, tertiary, quaternary, quinary, senary, surface,
-      success, error, info, warning {
+      success, error, info, warning, danger {
       &_$(type) {
         &-text {
           @each $color in primary, secondary, tertiary, quaternary, quinary, senary, accent,

package/dist/types/components/Link/Link.d.ts

@@ -2,5 +2,5 @@ import React from 'react';
 import type { iLinkConfig, iLinkProps, iLinkWrapperProps } from './Link.interface';
 declare const linkConfig: iLinkConfig;
 declare function Link(props: iLinkProps): import("react/jsx-runtime").JSX.Element;
-declare function LinkWrapper(props: iLinkWrapperProps): import("react/jsx-runtime").JSX.Element | (string | number | React.ReactElement<any, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode>)[];
+declare function LinkWrapper(props: iLinkWrapperProps): import("react/jsx-runtime").JSX.Element | (string | number | bigint | Iterable<React.ReactNode> | Promise<string | number | bigint | boolean | React.ReactPortal | React.ReactElement<unknown, string | React.JSXElementConstructor<any>> | Iterable<React.ReactNode> | null | undefined> | React.ReactElement<unknown, string | React.JSXElementConstructor<any>>)[];
 export { Link, linkConfig, LinkWrapper };

package/dist/types/types/componentProps/textColor.d.ts

@@ -1 +1 @@
-export type tTextColorProps = false | undefined | 'accentTextPrimary' | 'accentTextSecondary' | 'accentTextTertiary' | 'primaryTextPrimary' | 'primaryTextSecondary' | 'primaryTextTertiary' | 'secondaryTextPrimary' | 'secondaryTextSecondary' | 'secondaryTextTertiary' | 'tertiaryTextPrimary' | 'tertiaryTextSecondary' | 'surfaceTextPrimary' | 'surfaceTextAccent' | 'surfaceTextSecondary' | 'surfaceTextTertiary' | 'surfaceTextQuaternary' | 'surfaceTextAccent' | 'surfaceTextHover' | 'surfaceTextFocus' | 'surfaceTextActive' | 'surfaceTextDisabled' | 'errorTextPrimary' | 'errorTextSecondary' | 'successTextPrimary' | 'successTextSecondary' | 'surfaceTextInverse';
+export type tTextColorProps = false | undefined | 'accentTextPrimary' | 'accentTextSecondary' | 'accentTextTertiary' | 'primaryTextPrimary' | 'primaryTextSecondary' | 'primaryTextTertiary' | 'secondaryTextPrimary' | 'secondaryTextSecondary' | 'secondaryTextTertiary' | 'tertiaryTextPrimary' | 'tertiaryTextSecondary' | 'surfaceTextPrimary' | 'surfaceTextAccent' | 'surfaceTextSecondary' | 'surfaceTextTertiary' | 'surfaceTextQuaternary' | 'surfaceTextAccent' | 'surfaceTextHover' | 'surfaceTextFocus' | 'surfaceTextActive' | 'surfaceTextDisabled' | 'errorTextPrimary' | 'errorTextSecondary' | 'successTextPrimary' | 'successTextSecondary' | 'surfaceTextInverse' | 'dangerTextPrimary' | 'dangerTextSecondary';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.3.9",
+  "version": "1.3.11",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -96,11 +96,12 @@
     "registry": "https://registry.npmjs.org/"
   },
   "dependencies": {
+    "@emotion/is-prop-valid": "^1.3.1",
     "@itcase/common": "^1.2.17",
-    "@itcase/icons": "^1.0.10",
+    "@itcase/icons": "^1.0.14",
     "clsx": "^2.1.1",
     "date-fns": "^4.1.0",
-    "framer-motion": "^11.13.5",
+    "framer-motion": "^11.15.0",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
     "rc-slider": "^11.1.7",
@@ -118,7 +119,7 @@
     "react-responsive": "^10.0.0",
     "react-scroll": "^1.9.0",
     "react-scrollbars-custom": "^4.1.1",
-    "react-select": "^5.8.3",
+    "react-select": "^5.9.0",
     "swiper": "^11.1.15",
     "uuid": "^11.0.3"
   },
@@ -128,42 +129,41 @@
     "@babel/eslint-plugin": "^7.25.9",
     "@babel/preset-env": "^7.26.0",
     "@babel/preset-react": "^7.26.3",
-    "@chromatic-com/storybook": "^3.2.2",
-    "@commitlint/cli": "^19.6.0",
+    "@commitlint/cli": "^19.6.1",
     "@commitlint/config-conventional": "^19.6.0",
-    "@itcase/lint": "^1.0.33",
+    "@itcase/icons": "^1.0.11",
+    "@itcase/lint": "^1.0.34",
+    "@itcase/ui": "^1.3.9",
     "@lehoczky/postcss-fluid": "^1.0.3",
     "@rollup/plugin-babel": "^6.0.4",
-    "@rollup/plugin-commonjs": "^28.0.1",
+    "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-image": "^3.0.3",
     "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^15.3.0",
+    "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-terser": "^0.4.4",
-    "@rollup/plugin-typescript": "^12.1.1",
+    "@rollup/plugin-typescript": "^12.1.2",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
     "@semantic-release/release-notes-generator": "14.0.1",
     "@storybook/addon-essentials": "^8.4.7",
     "@storybook/addon-interactions": "^8.4.7",
-    "@storybook/addon-links": "^8.4.7",
-    "@storybook/addon-onboarding": "^8.4.7",
     "@storybook/addon-styling-webpack": "^1.0.1",
     "@storybook/addon-themes": "^8.4.7",
     "@storybook/addon-webpack5-compiler-swc": "^1.0.5",
     "@storybook/blocks": "^8.4.7",
     "@storybook/react": "^8.4.7",
     "@storybook/react-webpack5": "^8.4.7",
-    "@storybook/test": "^8.4.7",
     "@types/js-cookie": "^3.0.6",
     "@types/lodash": "^4.17.13",
-    "@types/react": "^18",
+    "@types/react": "^19",
     "@types/react-datepicker": "^7.0.0",
-    "@types/react-dom": "^18.3.1",
+    "@types/react-dom": "^19.0.2",
     "@types/react-scroll": "^1.8.10",
     "@types/uuid": "^10.0.0",
     "babel-loader": "^9.2.1",
     "babel-plugin-inline-react-svg": "^2.0.2",
     "babel-plugin-react-docgen": "^4.2.1",
+    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^8.0.0",
     "eslint": "9.16.0",
     "husky": "^9.1.7",
@@ -187,7 +187,7 @@
     "postcss-nested-ancestors": "^3.0.0",
     "postcss-normalize": "^13.0.1",
     "postcss-prepend-imports": "^1.0.1",
-    "postcss-preset-env": "^10.1.1",
+    "postcss-preset-env": "^10.1.2",
     "postcss-pxtorem": "^6.1.0",
     "postcss-sort-media-queries": "^5.2.0",
     "prettier": "^3.4.2",
@@ -198,7 +198,7 @@
     "rollup-preserve-directives": "^1.1.3",
     "semantic-release": "^24.2.0",
     "storybook": "^8.4.7",
-    "stylelint": "^16.11.0",
+    "stylelint": "^16.12.0",
     "typescript": "^5.7.2"
   }
 }

package/dist/stories/appearance.mdx

@@ -1,62 +0,0 @@
-import { Meta } from '@storybook/blocks'
-
-<Meta title="Appearance / Overview" />
-
-# Appearance
-
-`Appearance` - это заранее прописанные стили (по сути пропсы с указанными значениями) для более быстрого применения в коде.
-
-Для того чтобы добавить возможность использовать `Appearance` для компонента необходимо:
-
-- добавить `appearance` в пропсы компонента
-  `const { appearance, children, className, textColor, textSize, value } = props`
-
-- а также конфиг:
-
-```
-const badgeConfig: iBadgeConfig = {
-  appearance: badgeAppearance,
-  setAppearance: (newComponent) => {
-    badgeConfig.appearance = newComponent
-  },
-}
-```
-
-- записать в переменную сокращенное название для дальнейшего использования в коде компонента:
-
-```
-const appearanceConfig = badgeConfig.appearance && badgeConfig.appearance[appearance]
-```
-
-- использовать для пропсов:
-
-```
-	fillClass && `fill_${fillClass}`,
-
-fillHoverClass && `fill_hover_${fillHoverClass}`,
-
-textColor={textColor || appearanceConfig?.textColor}
-```
-
-- описать варианты `Appearance` необходимо в `src/components/Badge/Badge.appearance.ts`
-
-```
-	import { badgeAppearanceType } from './Badge.interface'
-
-export const badgeAppearance: badgeAppearanceType = {
-	surfacePrimary: {
-		fill: 'surfacePrimary',
-		fillHover: 'surfacePrimaryHover',
-		textColor: 'surfaceTextPrimary',
-	},
-	surfaceSecondary: {
-		fill: 'surfaceSecondary',
-		fillHover: 'surfaceSecondaryHover',
-		textColor: 'surfaceTextPrimary',
-	}
-	...
-}
-```
-
-- в коде на проекте использовать:
-  `<Badge appearance="surfacePrimary" ..../>`