@itcase/ui 1.8.13 → 1.8.17

package/dist/types/components/Pagination/appearance/paginationSecondary.d.ts

@@ -0,0 +1,8 @@
+declare const paginationAppearanceSecondary: {
+    secondary: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+    };
+};
+export { paginationAppearanceSecondary };

package/dist/types/components/Pagination/appearance/paginationSize.d.ts

@@ -0,0 +1,59 @@
+declare const paginationAppearanceSize: {
+    sizeXXL: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeXL: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeL: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeM: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeS: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeXS: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeXXS: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+};
+export { paginationAppearanceSize };

package/dist/types/components/Pagination/appearance/paginationStyle.d.ts

@@ -0,0 +1,16 @@
+declare const paginationAppearanceStyle: {
+    full: {
+        borderColor: string;
+    };
+    ghost: {
+        fill: string;
+        borderColor: string;
+    };
+    outlined: {
+        fill: string;
+    };
+    solid: {
+        borderColor: string;
+    };
+};
+export { paginationAppearanceStyle };

package/dist/types/components/Pagination/appearance/paginationSuccess.d.ts

@@ -0,0 +1,11 @@
+declare const paginationAppearanceSuccess: {
+    success: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+        loaderFill: string;
+        loaderItemFill: string;
+    };
+};
+export { paginationAppearanceSuccess };

package/dist/types/components/Pagination/appearance/paginationWarning.d.ts

@@ -0,0 +1,11 @@
+declare const paginationAppearanceWarning: {
+    warning: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+        loaderFill: string;
+        loaderItemFill: string;
+    };
+};
+export { paginationAppearanceWarning };

package/dist/types/components/Radio/appearance/radioDefault.d.ts

@@ -0,0 +1,18 @@
+declare const radioAppearanceDefault: {
+    defaultPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+    };
+    defaultSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { radioAppearanceDefault };

package/dist/types/components/Radio/appearance/radioError.d.ts

@@ -0,0 +1,11 @@
+declare const radioAppearanceError: {
+    error: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+        loaderFill: string;
+        loaderItemFill: string;
+    };
+};
+export { radioAppearanceError };

package/dist/types/components/Radio/appearance/radioRequire.d.ts

@@ -0,0 +1,20 @@
+declare const requireAppearanceRequire: {
+    requirePrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+    requireSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+        placeholderTextColor: string;
+    };
+};
+export { requireAppearanceRequire };

package/dist/types/components/Radio/appearance/radioSize.d.ts

@@ -0,0 +1,27 @@
+declare const radioAppearanceSize: {
+    sizeM: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeXS: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+    sizeXXS: {
+        size: string;
+        labelTextSize: string;
+        iconAfterFillSize: string;
+        iconAfterSize: string;
+        iconBeforeFillSize: string;
+        iconBeforeSize: string;
+    };
+};
+export { radioAppearanceSize };

package/dist/types/components/Radio/appearance/radioStyle.d.ts

@@ -0,0 +1,16 @@
+declare const radioAppearanceStyle: {
+    full: {
+        borderColor: string;
+    };
+    ghost: {
+        fill: string;
+        borderColor: string;
+    };
+    outlined: {
+        fill: string;
+    };
+    solid: {
+        borderColor: string;
+    };
+};
+export { radioAppearanceStyle };

package/dist/types/components/Radio/appearance/radioSuccess.d.ts

@@ -0,0 +1,11 @@
+declare const radioAppearanceSuccess: {
+    success: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+        loaderFill: string;
+        loaderItemFill: string;
+    };
+};
+export { radioAppearanceSuccess };

package/dist/types/components/Segmented/appearance/segmentedAccent.d.ts

@@ -0,0 +1,19 @@
+declare const segmentedAppearanceAccent: {
+    accent: {
+        fill: string;
+        fillHover: string;
+    };
+    accentPrimary: {
+        fill: string;
+        fillHover: string;
+        borderColor: string;
+    };
+    accentSecondary: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+        borderColor: string;
+    };
+};
+export { segmentedAppearanceAccent };

package/dist/types/components/Segmented/appearance/segmentedDisabled.d.ts

@@ -0,0 +1,18 @@
+declare const segmentedAppearanceDisabled: {
+    disabledPrimary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        textColor: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+    };
+    disabledSecondary: {
+        fill: string;
+        borderColor: string;
+        borderHover: string;
+        iconBeforeFill: string;
+        iconClearFill: string;
+    };
+};
+export { segmentedAppearanceDisabled };

package/dist/types/components/Segmented/appearance/segmentedError.d.ts

@@ -0,0 +1,9 @@
+declare const segmentedAppearanceError: {
+    error: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+    };
+};
+export { segmentedAppearanceError };

package/dist/types/components/Segmented/appearance/segmentedFalse.d.ts

@@ -0,0 +1,4 @@
+declare const segmentedAppearanceFalse: {
+    false: {};
+};
+export { segmentedAppearanceFalse };

package/dist/types/components/Segmented/appearance/segmentedSize.d.ts

@@ -1,5 +1,5 @@
 declare const segmentedAppearanceSize: {
-    sizeS: {
+    sizeL: {
         size: string;
         labelTextSize: string;
     };
@@ -7,7 +7,15 @@ declare const segmentedAppearanceSize: {
         size: string;
         labelTextSize: string;
     };
-    sizeL: {
+    sizeS: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeXS: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeXSS: {
         size: string;
         labelTextSize: string;
     };

package/dist/types/components/Segmented/appearance/segmentedStyle.d.ts

@@ -0,0 +1,16 @@
+declare const segmentedAppearanceStyle: {
+    full: {
+        borderColor: string;
+    };
+    ghost: {
+        fill: string;
+        borderColor: string;
+    };
+    outlined: {
+        fill: string;
+    };
+    solid: {
+        borderColor: string;
+    };
+};
+export { segmentedAppearanceStyle };

package/dist/types/components/Segmented/appearance/segmentedSuccess.d.ts

@@ -0,0 +1,9 @@
+declare const segmentedAppearanceSuccess: {
+    success: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+    };
+};
+export { segmentedAppearanceSuccess };

package/dist/types/components/Segmented/appearance/segmentedWarning.d.ts

@@ -0,0 +1,9 @@
+declare const segmentedAppearanceWarning: {
+    warning: {
+        fill: string;
+        fillHover: string;
+        labelTextColor: string;
+        labelTextColorHover: string;
+    };
+};
+export { segmentedAppearanceWarning };

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

@@ -1,2 +1,2 @@
-import { Appearance } from 'src/components/Text/Text.interface';
-export declare const textAppearance: Appearance;
+import { TextAppearanceType } from './Text.interface';
+export declare const textAppearance: TextAppearanceType;

package/dist/types/components/Text/Text.interface.d.ts

@@ -10,13 +10,13 @@ interface TextThemeColor {
     textColorHover?: TextColorHoverProps;
     width?: WidthProps;
 }
-export type Appearance = {
+export type TextAppearanceType = {
     [key in AppearanceKeysDefault]: TextThemeColor;
 };
 interface TextConfig {
     [key: number | string | symbol]: any;
-    appearance: Appearance | undefined;
-    setAppearance: (newComponent: Appearance) => void;
+    appearance: TextAppearanceType | undefined;
+    setAppearance: (newComponent: TextAppearanceType) => void;
 }
 interface TextProps extends TextThemeColor, StyleAttributes {
     id?: number | string;

package/dist/types/components/Text/appearance/textSize.d.ts

@@ -0,0 +1,31 @@
+declare const textAppearanceSize: {
+    sizeXXL: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeXL: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeL: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeM: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeS: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeXS: {
+        size: string;
+        labelTextSize: string;
+    };
+    sizeXXS: {
+        size: string;
+        labelTextSize: string;
+    };
+};
+export { textAppearanceSize };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.8.13",
+  "version": "1.8.17",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",
@@ -100,10 +100,10 @@
     "@itcase/config": "^1.0.47",
     "@itcase/icons": "^1.1.1",
     "@itcase/storybook-config": "^1.1.10",
-    "@itcase/tokens-am": "^1.1.8",
-    "@itcase/tokens-baikal": "^1.1.8",
+    "@itcase/tokens-am": "^1.1.9",
+    "@itcase/tokens-baikal": "^1.1.9",
     "@itcase/types": "^1.0.3",
-    "@itcase/tokens-palette": "^1.1.8",
+    "@itcase/tokens-palette": "^1.1.9",
     "clsx": "^2.1.1",
     "date-fns": "^4.1.0",
     "eslint-import-resolver-alias": "^1.1.2",
@@ -165,7 +165,7 @@
     "husky": "^9.1.7",
     "lint-staged": "^16.1.0",
     "npm": "^11.4.1",
-    "postcss": "^8.5.3",
+    "postcss": "^8.5.4",
     "prettier": "^3.5.3",
     "react-docgen-typescript": "^2.2.2",
     "react-svg": "^16.3.0",

package/dist/Badge_cjs_CeqDdbMs.js

@@ -1,227 +0,0 @@
-'use strict';
-
-var tslib_es6 = require('./tslib.es6_cjs_CCZ3TN_7.js');
-var jsxRuntime = require('react/jsx-runtime');
-var clsx = require('clsx');
-var useDevicePropsGenerator = require('./cjs/hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('./cjs/hooks/useStyles/useStyles.js');
-var Icon = require('./Icon_cjs_BaWMPaAR.js');
-var Text = require('./Text_cjs_D4xG0cKD.js');
-
-var badgeAppearanceAccent = {
-    accent: {
-        dotFill: 'accentItemPrimary',
-        iconFill: 'accentItemPrimary',
-    },
-    accentPrimary: {
-        dotFill: 'accentItemPrimary',
-    },
-    accentQuaternary: {
-        dotFill: 'accentItemPrimary',
-    },
-    accentSecondary: {
-        dotFill: 'accentItemPrimary',
-    },
-    accentTertiary: {
-        dotFill: 'accentItemPrimary',
-    },
-};
-
-var badgeAppearanceDanger = {
-    danger: {
-        fill: 'dangerPrimary',
-        fillHover: 'dangerPrimary',
-        borderColor: 'dangerBorderPrimary',
-        textColor: 'dangerTextSecondary',
-        dotFill: 'dangerItemPrimary',
-        iconFill: 'dangerItemPrimary',
-    },
-};
-
-var badgeAppearanceError = {
-    error: {
-        fill: 'errorPrimary',
-        fillHover: 'errorPrimaryHover',
-        labelTextColor: 'errorTextPrimary',
-        labelTextColorHover: 'errorTextPrimary',
-        iconFill: 'errorItemPrimary',
-        loaderFill: 'errorPrimary',
-        loaderItemFill: 'errorItemPrimary',
-    },
-};
-
-var badgeAppearanceInfo = {
-    info: {
-        fill: 'infoPrimary',
-        fillHover: 'infoPrimaryHover',
-        borderColor: 'infoBorderSecondary',
-        textColor: 'infoTextPrimary',
-        dotFill: 'infoItemPrimary',
-        iconFill: 'infoItemPrimary',
-    },
-    infoSecondary: {
-        fill: 'infoSecondary',
-        fillHover: 'infoSecondaryHover',
-        borderColor: 'infoBorderSecondary',
-        textColor: 'infoTextSecondary',
-        dotFill: 'infoItemSecondary',
-    },
-};
-
-var badgeAppearancePrimary = {
-    primary: {
-        fill: 'primaryPrimary',
-        fillHover: 'primaryPrimaryHover',
-        borderColor: 'primaryBorderSecondary',
-        textColor: 'primaryTextPrimary',
-        dotFill: 'primaryItemPrimary',
-        iconFill: 'primaryItemPrimary',
-    },
-};
-
-var badgeAppearanceSecondary = {
-    secondary: {
-        fill: 'secondaryPrimary',
-        fillHover: 'secondaryPrimaryHover',
-        borderColor: 'secondaryBorderSecondary',
-        textColor: 'secondaryTextPrimary',
-        dotFill: 'secondaryItemPrimary',
-        iconFill: 'secondaryItemPrimary',
-    },
-};
-
-var badgeAppearanceSize = {
-    sizeXXL: {
-        size: 'xxl',
-        textSize: 'xl',
-        iconSize: 24,
-    },
-    sizeXL: {
-        size: 'xl',
-        textSize: 'l',
-    },
-    sizeL: {
-        size: 'l',
-        textSize: 'l',
-    },
-    sizeM: {
-        size: 'm',
-        textSize: 'm',
-    },
-    sizeS: {
-        size: 's',
-        textSize: 's',
-    },
-    sizeXS: {
-        size: 'xs',
-        textSize: 'xs',
-    },
-    sizeXXS: {
-        size: 'xxs',
-        textSize: 'xs',
-    },
-};
-
-var badgeAppearanceStyle = {
-    full: {
-        borderColor: null,
-    },
-    ghost: {
-        fill: null,
-        borderColor: null,
-    },
-    outlined: {
-        fill: null,
-    },
-    solid: {
-        borderColor: null,
-    },
-};
-
-var badgeAppearanceSuccess = {
-    success: {
-        fill: 'successPrimary',
-        fillHover: 'successPrimaryHover',
-        borderColor: 'successBorderPrimary',
-        textColor: 'successTextPrimary',
-        dotFill: 'successItemPrimary',
-        iconFill: 'successItemPrimary',
-    },
-};
-
-var badgeAppearanceSurface = {
-    surfacePrimary: {
-        fill: 'surfacePrimary',
-        fillHover: 'surfacePrimaryHover',
-        borderColor: 'surfaceBorderTertiary',
-        textColor: 'surfaceTextPrimary',
-        dotFill: 'surfaceItemPrimary',
-        iconFill: 'surfaceItemPrimary',
-    },
-    surfaceQuaternary: {
-        fill: 'accentPrimary',
-        fillHover: 'surfaceTertiaryHover',
-        borderColor: 'surfaceBorderPrimary',
-        textColor: 'surfaceTextInverse',
-    },
-    surfaceSecondary: {
-        fill: 'surfaceSecondary',
-        fillHover: 'surfaceSecondaryHover',
-        borderColor: 'surfaceBorderSecondary',
-        textColor: 'surfaceTextPrimary',
-    },
-    surfaceTertiary: {
-        fill: 'surfaceTertiary',
-        fillHover: 'surfaceTertiaryHover',
-        borderColor: 'surfaceBorderTertiary',
-        textColor: 'surfaceTextPrimary',
-    },
-};
-
-var badgeAppearanceWarning = {
-    warning: {
-        fill: 'warningPrimary',
-        fillHover: 'warningPrimary',
-        borderColor: 'warningBorderPrimary',
-        textColor: 'warningTextSecondary',
-        dotFill: 'warningItemPrimary',
-        iconFill: 'warningItemPrimary',
-    },
-};
-
-var badgeAppearance = 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(tslib_es6.__assign({}, badgeAppearanceSize), badgeAppearanceStyle), badgeAppearanceAccent), badgeAppearanceDanger), badgeAppearanceError), badgeAppearanceInfo), badgeAppearancePrimary), badgeAppearanceSecondary), badgeAppearanceSuccess), badgeAppearanceSurface), badgeAppearanceWarning);
-
-var badgeConfig = {
-    appearance: badgeAppearance,
-    setAppearance: function (appearanceConfig) {
-        badgeConfig.appearance = appearanceConfig;
-    },
-};
-function Badge(props) {
-    var className = props.className, appearance = props.appearance, dot = props.dot, icon = props.icon, iconSrc = props.iconSrc, value = props.value, isSkeleton = props.isSkeleton, children = props.children;
-    var appearanceConfig = appearance === null || appearance === void 0 ? void 0 : appearance.split(' ').reduce(function (resultConfig, appearanceKey) {
-        var _a;
-        return (tslib_es6.__assign(tslib_es6.__assign({}, resultConfig), (_a = badgeConfig.appearance) === null || _a === void 0 ? void 0 : _a[appearanceKey]));
-    }, {});
-    var propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
-    var fillClass = propsGenerator.fillClass, fillHoverClass = propsGenerator.fillHoverClass, borderColorClass = propsGenerator.borderColorClass, borderColorHoverClass = propsGenerator.borderColorHoverClass, borderTypeClass = propsGenerator.borderTypeClass, borderWidthClass = propsGenerator.borderWidthClass, textColor = propsGenerator.textColor, textSize = propsGenerator.textSize, dotFillClass = propsGenerator.dotFillClass, iconFill = propsGenerator.iconFill, iconShape = propsGenerator.iconShape, iconSize = propsGenerator.iconSize, positionClass = propsGenerator.positionClass, _a = propsGenerator.shapeClass, shapeClass = _a === void 0 ? 'rounded' : _a, _b = propsGenerator.sizeClass, sizeClass = _b === void 0 ? 'm' : _b;
-    // @ts-expect-error
-    var badgeStyles = useStyles.useStyles(props).styles;
-    var badgeTypeClass = value
-        ? icon
-            ? dot
-                ? 'badge_type_dot-icon-counter'
-                : 'badge_type_icon-counter'
-            : 'badge_type_counter'
-        : icon
-            ? 'badge_type_icon'
-            : dot
-                ? 'badge_type_dot'
-                : 'badge_type_fill';
-    return (jsxRuntime.jsxs("div", { className: clsx(className, 'badge', borderColorClass && "border-color_".concat(borderColorClass), borderColorHoverClass && "border-color_hover_".concat(borderColorHoverClass), borderWidthClass && "border-width_".concat(borderWidthClass), borderTypeClass && "border_type_".concat(borderTypeClass), fillClass && "fill_".concat(fillClass), fillHoverClass && "fill_hover_".concat(fillHoverClass), positionClass && "position_".concat(positionClass), sizeClass && "badge_size_".concat(sizeClass), shapeClass && "badge_shape_".concat(shapeClass), badgeTypeClass, isSkeleton && 'badge_skeleton'), style: badgeStyles, children: [dot && (jsxRuntime.jsx("div", { className: clsx('badge__dot', dotFillClass && "svg_fill_".concat(dotFillClass)), children: jsxRuntime.jsx("svg", { width: "6", height: "6", viewBox: "0 0 6 6", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("rect", { width: "6", height: "6", rx: "50" }) }) })), icon && (jsxRuntime.jsx(Icon.Icon, { className: "badge__icon", size: iconSize, iconFill: iconFill, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), children ||
-                (value && (jsxRuntime.jsx(Text.Text, { className: "badge__value", size: textSize, textColor: textColor, children: value })))] }));
-}
-
-exports.Badge = Badge;
-exports.badgeAppearance = badgeAppearance;
-exports.badgeConfig = badgeConfig;