@itcase/ui 1.8.122 → 1.8.124

package/dist/types/components/Tab/appearance/tabSize.d.ts

@@ -3,55 +3,41 @@ declare const tabAppearanceSize: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
     sizeXL: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
     sizeL: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
     sizeM: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
     sizeS: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
     sizeXS: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
     };
     sizeXXS: {
         size: string;
         labelTextSize: string;
         badgeAppearanceSize: string;
-        badgeSize: string;
-        badgeTextSize: string;
         dividerSize: string;
     };
 };

package/dist/types/components/Tab/appearance/tabSurface.d.ts

@@ -8,14 +8,14 @@ declare const tabAppearanceSurface: {
         fillHover: string;
         labelTextColor: string;
         labelTextColorActive: string;
-        dividerFillDisabled: string;
         borderColor: string;
         borderColorActive: string;
         badgeAppearance: string;
         dividerFillActive: string;
+        dividerFillDisabled: string;
         iconFillIcon: string;
     };
-    surfaceSecondary: {
+    surfaceQuaternary: {
         fill: string;
         fillActive: string;
         fillActiveHover: string;
@@ -23,14 +23,14 @@ declare const tabAppearanceSurface: {
         fillHover: string;
         labelTextColor: string;
         labelTextColorActive: string;
-        dividerFillDisabled: string;
         borderColor: string;
         borderColorActive: string;
         badgeAppearance: string;
         dividerFillActive: string;
+        dividerFillDisabled: string;
         iconFillIcon: string;
     };
-    surfaceTertiary: {
+    surfaceSecondary: {
         fill: string;
         fillActive: string;
         fillActiveHover: string;
@@ -38,14 +38,14 @@ declare const tabAppearanceSurface: {
         fillHover: string;
         labelTextColor: string;
         labelTextColorActive: string;
-        dividerFillDisabled: string;
         borderColor: string;
         borderColorActive: string;
         badgeAppearance: string;
         dividerFillActive: string;
+        dividerFillDisabled: string;
         iconFillIcon: string;
     };
-    surfaceQuaternary: {
+    surfaceTertiary: {
         fill: string;
         fillActive: string;
         fillActiveHover: string;
@@ -53,11 +53,11 @@ declare const tabAppearanceSurface: {
         fillHover: string;
         labelTextColor: string;
         labelTextColorActive: string;
-        dividerFillDisabled: string;
         borderColor: string;
         borderColorActive: string;
         badgeAppearance: string;
         dividerFillActive: string;
+        dividerFillDisabled: string;
         iconFillIcon: string;
     };
 };

package/dist/utils/setViewportProperty.js

@@ -1,6 +1,6 @@
-var setViewportProperty = function () {
-    var vh = window.innerHeight * 0.01;
-    document.documentElement.style.setProperty('--vh', "".concat(vh, "px"));
+const setViewportProperty = () => {
+    const vh = window.innerHeight * 0.01;
+    document.documentElement.style.setProperty('--vh', `${vh}px`);
 };
 
 export { setViewportProperty };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.122",
+  "version": "1.8.124",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -100,10 +100,10 @@
     ]
   },
   "dependencies": {
-    "@emotion/is-prop-valid": "^1.3.1",
-    "@itcase/common": "^1.2.29",
+    "@emotion/is-prop-valid": "^1.4.0",
+    "@itcase/common": "^1.2.31",
     "@itcase/icons": "^1.2.19",
-    "@itcase/storybook-config": "^1.2.5",
+    "@itcase/storybook-config": "^1.2.7",
     "@itcase/tokens-am": "^1.1.19",
     "@itcase/tokens-baikal": "^1.1.17",
     "@itcase/tokens-palette": "^1.1.11",
@@ -112,7 +112,7 @@
     "framer-motion": "^12.23.12",
     "js-cookie": "^3.0.5",
     "lodash": "^4.17.21",
-    "luxon": "^3.7.1",
+    "luxon": "^3.7.2",
     "motion": "^12.23.12",
     "rc-slider": "^11.1.8",
     "react": "^18.3.1",
@@ -121,7 +121,7 @@
     "react-dom": "^18.3.1",
     "react-indiana-drag-scroll": "^3.0.3-alpha",
     "react-inlinesvg": "^4.2.0",
-    "react-modal-sheet": "^4.4.0",
+    "react-modal-sheet": "^5.1.1",
     "react-modern-drawer": "^1.4.0",
     "react-otp-input": "^3.1.1",
     "react-paginate": "^8.3.0",
@@ -131,16 +131,16 @@
     "react-select": "^5.10.2",
     "simplebar-react": "^3.3.2",
     "swiper": "^11.2.10",
-    "uuid": "^11.1.0"
+    "uuid": "^13.0.0"
   },
   "devDependencies": {
-    "@babel/core": "^7.28.3",
+    "@babel/core": "^7.28.4",
     "@babel/preset-env": "^7.28.3",
     "@babel/preset-react": "^7.27.1",
     "@commitlint/cli": "^19.8.1",
     "@commitlint/config-conventional": "^19.8.1",
     "@itcase/config": "^1.0.57",
-    "@itcase/lint": "^1.1.48",
+    "@itcase/lint": "^1.1.57",
     "@itcase/types": "^1.0.45",
     "@rollup/plugin-alias": "^5.1.1",
     "@rollup/plugin-babel": "^6.0.4",
@@ -152,7 +152,7 @@
     "@rollup/plugin-typescript": "^12.1.4",
     "@semantic-release/changelog": "^6.0.3",
     "@semantic-release/git": "^10.0.1",
-    "@semantic-release/release-notes-generator": "14.0.3",
+    "@semantic-release/release-notes-generator": "14.1.0",
     "@types/js-cookie": "^3.0.6",
     "@types/lodash": "^4.17.20",
     "@types/luxon": "^3.7.1",
@@ -166,19 +166,19 @@
     "babel-plugin-react-docgen": "^4.2.1",
     "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "conventional-changelog-conventionalcommits": "^9.1.0",
-    "eslint": "9.34.0",
+    "eslint": "9.35.0",
     "husky": "^9.1.7",
     "lint-staged": "^16.1.6",
     "prettier": "^3.6.2",
     "react-docgen-typescript": "^2.4.0",
-    "rollup": "^4.50.0",
+    "rollup": "^4.50.1",
     "rollup-plugin-copy": "^3.5.0",
     "rollup-plugin-dts": "^6.2.3",
     "rollup-plugin-peer-deps-external": "^2.2.4",
     "rollup-preserve-directives": "^1.1.3",
     "semantic-release": "^24.2.7",
-    "storybook": "^9.1.4",
-    "stylelint": "^16.23.1",
+    "storybook": "^9.1.5",
+    "stylelint": "^16.24.0",
     "typescript": "^5.9.2"
   }
 }

package/dist/Avatar_cjs_kuE0Rueg.js

@@ -1,157 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var React = require('react');
-var clsx = require('clsx');
-var useAppearanceConfig = require('./cjs/hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('./Icon_cjs_Cz6IyOkb.js');
-var Image = require('./Image_cjs_B6YlGx8G.js');
-var Text = require('./Text_cjs_0EINiUq4.js');
-var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
-
-var avatarAppearanceDefault = {
-    surfacePrimary: {
-        fill: 'surfacePrimary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceSecondary: {
-        fill: 'surfaceSecondary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceQuaternary: {
-        fill: 'surfaceQuaternary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-};
-
-var avatarAppearanceShape = {
-    circular: {
-        shape: 'circular',
-    },
-    rounded: {
-        shape: 'rounded',
-    },
-    roundedXL: {
-        shape: 'rounded',
-        shapeStrength: '2m',
-    },
-    roundedL: {
-        shape: 'rounded',
-        shapeStrength: '1_5m',
-    },
-    roundedM: {
-        shape: 'rounded',
-        shapeStrength: '1m',
-    },
-    roundedS: {
-        shape: 'rounded',
-        shapeStrength: '0_5m',
-    },
-};
-
-var avatarAppearanceSize = {
-    size16: {
-        size: '16',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size20: {
-        size: '20',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size24: {
-        size: '24',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size32: {
-        size: '32',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeXS',
-        iconFillSize: '12',
-    },
-    size40: {
-        size: '40',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeS',
-        iconFillSize: '12',
-    },
-    size56: {
-        size: '56',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeM',
-        iconFillSize: '16',
-    },
-    size96: {
-        size: '96',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXL',
-        iconFillSize: '32',
-    },
-    size144: {
-        size: '144',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXL',
-        iconFillSize: '40',
-    },
-    size240: {
-        size: '240',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXL',
-        iconFillSize: '40',
-    },
-};
-
-var avatarAppearanceStyle = {
-    solid: {
-        borderColor: 'none',
-    },
-    outlined: {
-        fill: 'none',
-    },
-    full: {
-        borderColor: 'none',
-    },
-    ghost: {
-        fill: 'none',
-        borderColor: 'none',
-    },
-};
-
-var avatarAppearance = tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign(tslib_es6.__assign({}, avatarAppearanceSize), avatarAppearanceStyle), avatarAppearanceShape), avatarAppearanceDefault);
-
-var avatarConfig = {
-    appearance: avatarAppearance,
-    setAppearance: function (appearanceConfig) {
-        avatarConfig.appearance = appearanceConfig;
-    },
-};
-function Avatar(props) {
-    var className = props.className, appearance = props.appearance, src = props.src, _a = props.firstName, firstName = _a === void 0 ? '' : _a, _b = props.secondName, secondName = _b === void 0 ? '' : _b, count = props.count, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick;
-    var avatarChars = React.useMemo(function () {
-        var firstChar = ((firstName === null || firstName === void 0 ? void 0 : firstName[0]) || '').toUpperCase();
-        var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
-        return "".concat(firstChar).concat(secondChar);
-    }, [firstName, secondName]);
-    var appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, avatarConfig);
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var size = propsGenerator.size, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, badge = propsGenerator.badge, badgeAppearance = propsGenerator.badgeAppearance, badgeAppearanceSize = propsGenerator.badgeAppearanceSize, badgeShape = propsGenerator.badgeShape, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, badgeValue = propsGenerator.badgeValue, icon = propsGenerator.icon, iconFill = propsGenerator.iconFill, iconFillHover = propsGenerator.iconFillHover, iconFillSize = propsGenerator.iconFillSize, iconItemFill = propsGenerator.iconItemFill, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, iconSrc = propsGenerator.iconSrc, placeholderUrl = propsGenerator.placeholderUrl, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'avatar', size && "avatar_size_".concat(sizeClass), (badgeValue || badgeAppearance || badgeSize) && 'avatar_status', isSkeleton && "avatar_skeleton", onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxRuntime.jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass)), children: [before, src ? (jsxRuntime.jsx(Image.Image, { className: clsx('avatar__image', shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass)), src: src, placeholderUrl: placeholderUrl })) : (jsxRuntime.jsx(Text.Text, { className: "avatar__text", size: textSize, textColor: textColor, textWeight: textWeight, children: avatarChars || count })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "avatar__icon", fill: iconFill, fillHover: iconFillHover, fillSize: iconFillSize, iconFill: iconItemFill, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (badge || badgeValue) && (jsxRuntime.jsx(Icon.Badge, { className: "avatar__badge", appearance: "".concat(badgeAppearance, " ").concat(badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), after] }) }));
-}
-
-exports.Avatar = Avatar;
-exports.avatarAppearance = avatarAppearance;
-exports.avatarConfig = avatarConfig;

package/dist/Avatar_es_lx7s4Vla.js

@@ -1,153 +0,0 @@
-import { jsx, jsxs } from 'react/jsx-runtime';
-import { useMemo } from 'react';
-import clsx from 'clsx';
-import { useAppearanceConfig } from './hooks/useAppearanceConfig/useAppearanceConfig.js';
-import { useDevicePropsGenerator } from './hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
-import { I as Icon, B as Badge } from './Icon_es_BrwLifge.js';
-import { I as Image } from './Image_es_BvYo_cHH.js';
-import { T as Text } from './Text_es_CwV9rjFD.js';
-import { _ as __assign } from './tslib.es6_es_Bwu1Cn-t.js';
-
-var avatarAppearanceDefault = {
-    surfacePrimary: {
-        fill: 'surfacePrimary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceSecondary: {
-        fill: 'surfaceSecondary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-    surfaceQuaternary: {
-        fill: 'surfaceQuaternary',
-        textColor: 'surfaceTextPrimary',
-        badgeAppearance: 'accentPrimary solid circular',
-    },
-};
-
-var avatarAppearanceShape = {
-    circular: {
-        shape: 'circular',
-    },
-    rounded: {
-        shape: 'rounded',
-    },
-    roundedXL: {
-        shape: 'rounded',
-        shapeStrength: '2m',
-    },
-    roundedL: {
-        shape: 'rounded',
-        shapeStrength: '1_5m',
-    },
-    roundedM: {
-        shape: 'rounded',
-        shapeStrength: '1m',
-    },
-    roundedS: {
-        shape: 'rounded',
-        shapeStrength: '0_5m',
-    },
-};
-
-var avatarAppearanceSize = {
-    size16: {
-        size: '16',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size20: {
-        size: '20',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size24: {
-        size: '24',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeXXS',
-        iconFillSize: '12',
-    },
-    size32: {
-        size: '32',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeXS',
-        iconFillSize: '12',
-    },
-    size40: {
-        size: '40',
-        textSize: 'l',
-        badgeAppearanceSize: 'sizeS',
-        iconFillSize: '12',
-    },
-    size56: {
-        size: '56',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeM',
-        iconFillSize: '16',
-    },
-    size96: {
-        size: '96',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXL',
-        iconFillSize: '32',
-    },
-    size144: {
-        size: '144',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXL',
-        iconFillSize: '40',
-    },
-    size240: {
-        size: '240',
-        textSize: 'xxl',
-        badgeAppearanceSize: 'sizeXXL',
-        iconFillSize: '40',
-    },
-};
-
-var avatarAppearanceStyle = {
-    solid: {
-        borderColor: 'none',
-    },
-    outlined: {
-        fill: 'none',
-    },
-    full: {
-        borderColor: 'none',
-    },
-    ghost: {
-        fill: 'none',
-        borderColor: 'none',
-    },
-};
-
-var avatarAppearance = __assign(__assign(__assign(__assign({}, avatarAppearanceSize), avatarAppearanceStyle), avatarAppearanceShape), avatarAppearanceDefault);
-
-var avatarConfig = {
-    appearance: avatarAppearance,
-    setAppearance: function (appearanceConfig) {
-        avatarConfig.appearance = appearanceConfig;
-    },
-};
-function Avatar(props) {
-    var className = props.className, appearance = props.appearance, src = props.src, _a = props.firstName, firstName = _a === void 0 ? '' : _a, _b = props.secondName, secondName = _b === void 0 ? '' : _b, count = props.count, before = props.before, after = props.after, isSkeleton = props.isSkeleton, onClick = props.onClick;
-    var avatarChars = useMemo(function () {
-        var firstChar = ((firstName === null || firstName === void 0 ? void 0 : firstName[0]) || '').toUpperCase();
-        var secondChar = ((secondName === null || secondName === void 0 ? void 0 : secondName[0]) || '').toUpperCase();
-        return "".concat(firstChar).concat(secondChar);
-    }, [firstName, secondName]);
-    var appearanceConfig = useAppearanceConfig(appearance, avatarConfig);
-    var propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    var size = propsGenerator.size, fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, textWeight = propsGenerator.textWeight, badge = propsGenerator.badge, badgeAppearance = propsGenerator.badgeAppearance, badgeAppearanceSize = propsGenerator.badgeAppearanceSize, badgeShape = propsGenerator.badgeShape, badgeSize = propsGenerator.badgeSize, badgeTextColor = propsGenerator.badgeTextColor, badgeTextSize = propsGenerator.badgeTextSize, badgeValue = propsGenerator.badgeValue, icon = propsGenerator.icon, iconFill = propsGenerator.iconFill, iconFillHover = propsGenerator.iconFillHover, iconFillSize = propsGenerator.iconFillSize, iconItemFill = propsGenerator.iconItemFill, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, iconSrc = propsGenerator.iconSrc, placeholderUrl = propsGenerator.placeholderUrl, shapeClass = propsGenerator.shapeClass, shapeStrengthClass = propsGenerator.shapeStrengthClass, sizeClass = propsGenerator.sizeClass;
-    return (jsx("div", { className: clsx(className, 'avatar', size && "avatar_size_".concat(sizeClass), (badgeValue || badgeAppearance || badgeSize) && 'avatar_status', isSkeleton && "avatar_skeleton", onClick && 'cursor_type_pointer'), onClick: onClick, children: jsxs("div", { className: clsx('avatar__wrapper', fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass)), children: [before, src ? (jsx(Image, { className: clsx('avatar__image', shapeClass && "shape_".concat(shapeClass), shapeStrengthClass && "shape-strength_".concat(shapeStrengthClass)), src: src, placeholderUrl: placeholderUrl })) : (jsx(Text, { className: "avatar__text", size: textSize, textColor: textColor, textWeight: textWeight, children: avatarChars || count })), (icon || iconSrc) && (jsx(Icon, { className: "avatar__icon", fill: iconFill, fillHover: iconFillHover, fillSize: iconFillSize, iconFill: iconItemFill, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (badge || badgeValue) && (jsx(Badge, { className: "avatar__badge", appearance: "".concat(badgeAppearance, " ").concat(badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), after] }) }));
-}
-
-export { Avatar as A, avatarConfig as a, avatarAppearance as b };