@itcase/ui-web 1.9.81 → 1.9.83

package/dist/types/components/Loader/Loader.js

@@ -13,8 +13,8 @@ function Loader(props) {
     const { appearance, className, dataTestId, dataTour, type = 'dot', text, isDisabled, isSkeleton, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, loaderConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, borderColorClass, textColor, textSize, heightClass, itemFillClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    const { fillClass, borderColorClass, textColor, textSize, heightClass, itemFillClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
     const { styles: loader } = useStyles(props);
-    return (_jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: loader, children: [children || (_jsxs("div", { className: "loader__inner", children: [_jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`, type === 'circular' && `border-color_${borderColorClass}`), children: "\u00A0" }), _jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), _jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (_jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
+    return (_jsxs("div", { className: clsx('loader', className, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, fillClass && `fill_${fillClass}`, sizeClass && `loader_size_${sizeClass}`, isSkeleton && `skeleton`, type && `loader_type_${type}`, shapeClass && `shape_${shapeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: loader, children: [children || (_jsxs("div", { className: "loader__inner", children: [_jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`, type === 'circular' && `border-color_${borderColorClass}`), children: "\u00A0" }), _jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" }), _jsx("span", { className: clsx('loader__item', itemFillClass && `fill_${itemFillClass}`), children: "\u00A0" })] })), text && (_jsx(Text, { className: "loader__text", size: textSize, textColor: textColor, children: text }))] }));
 }
 export { Loader, loaderConfig };

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

@@ -1,6 +1,6 @@
 import type { CSSProperties, ElementType, ReactNode } from 'react';
 import type { LinkProps } from 'react-scroll';
-import type { AlignProps, AppearanceConfig, AppearanceKeysDefault, ArrowPosition, BorderColorProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, ShapeStrengthProps, TextSizeProps, UnderlineProps } from '@itcase/types-ui';
+import type { AlignProps, AppearanceConfig, AppearanceKeysDefault, ArrowPosition, BorderColorProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, TextSizeProps, UnderlineProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import type { IconProps } from '../Icon/Icon.interface';
 import type { TextProps } from '../Text/Text.interface';
@@ -47,11 +47,9 @@ type MenuItemAppearanceProps = {
     labelWeight?: TextProps['textWeight'];
     labelWrap?: TextProps['textWrap'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: TextSizeProps;
     tooltipFill?: TooltipProps['fill'];
     tooltipShape?: TooltipProps['shape'];
-    tooltipShapeStrength?: TooltipProps['shapeStrength'];
     tooltipSize?: TooltipProps['size'];
     tooltipText?: TooltipProps['text'];
     tooltipTextColor?: TooltipProps['textColor'];

package/dist/types/components/MenuItem/MenuItem.js

@@ -17,18 +17,16 @@ function MenuItem(props) {
     const { appearance, className, dataTestId, dataTour, label, easing, href, link, LinkComponent, rel, showTooltip, target, tooltipAppearance, tooltipArrowPosition, tooltipContent, underline, before, after, isActive, isDisabled, onClick, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, menuItemConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { directionClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorDisabled, labelTextColorHover, labelTextSize, labelWeight, labelWrap, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, tooltipFill, tooltipPlacement = 'top', tooltipShape, tooltipShapeStrength, tooltipSize, tooltipText, tooltipTextColor, tooltipTextSize, tooltipTitle, tooltipTitleTextColor, typeClass, widthClass, isSkeleton, } = propsGenerator;
+    const { directionClass, justifyContentClass, alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorDisabled, labelTextColorHover, labelTextSize, labelWeight, labelWrap, borderColorClass, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, sizeClass, tooltipFill, tooltipPlacement = 'top', tooltipShape, tooltipSize, tooltipText, tooltipTextColor, tooltipTextSize, tooltipTitle, tooltipTitleTextColor, typeClass, widthClass, isSkeleton, } = propsGenerator;
     const { styles: menuItem } = useStyles(props);
     const TooltipWrapperComponent = showTooltip ? TooltipWrapper : React.Fragment;
-    return (_jsx(TooltipWrapperComponent, { appearance: tooltipAppearance, minWidth: "auto", size: tooltipSize, fill: tooltipFill, title: tooltipTitle, titleColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, placement: tooltipPlacement, shape: tooltipShape, shapeStrength: tooltipShapeStrength, tooltipContent: tooltipContent, children: _jsx("div", { className: clsx('menu-item', easing && `easing_${easing}`, isActive && 'menu-item_state_active', isDisabled && `menu-item_state_disabled`, directionClass && `menu-item_direction_${directionClass}`, className, (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc) &&
+    return (_jsx(TooltipWrapperComponent, { appearance: tooltipAppearance, minWidth: "auto", size: tooltipSize, fill: tooltipFill, title: tooltipTitle, titleColor: tooltipTitleTextColor, text: tooltipText, textColor: tooltipTextColor, textSize: tooltipTextSize, arrowPosition: tooltipArrowPosition, placement: tooltipPlacement, shape: tooltipShape, tooltipContent: tooltipContent, children: _jsx("div", { className: clsx('menu-item', easing && `easing_${easing}`, isActive && 'menu-item_state_active', isDisabled && `menu-item_state_disabled`, directionClass && `menu-item_direction_${directionClass}`, className, (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc) &&
                 'menu-item_label-icon', sizeClass && `menu-item_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, !isActive
                 ? fillClass && `fill_${fillClass}`
                 : fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
                 ? fillHoverClass && `fill_hover_${fillHoverClass}`
                 : fillActiveHoverClass &&
-                    `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass
-                ? `shape-strength_${shapeStrengthClass}`
-                : shapeClass === 'rounded' && 'shape-strength_default', typeClass && `menu-item_type_${typeClass}`, widthClass && `width_${widthClass}`, justifyContentClass &&
+                    `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeClass === 'rounded' && 'shape-strength_default', typeClass && `menu-item_type_${typeClass}`, widthClass && `width_${widthClass}`, justifyContentClass &&
                 `menu-item_justify-content_${justifyContentClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: menuItem, children: _jsxs(Link, { className: clsx('menu-item__wrapper', alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), href: link || href, LinkComponent: LinkComponent, rel: rel, target: target, underline: underline, onClick: onClick, children: [before, children || (_jsxs(React.Fragment, { children: [(iconBefore || iconBeforeSrc) && (_jsx(Icon, { className: clsx('menu-item__icon_before', iconBadgeValue && 'menu-item__icon_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'menu-item__icon_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), label && (_jsx(Text, { className: "menu-item__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorDisabled: labelTextColorDisabled, textColorHover: labelTextColorHover, textWeight: labelWeight, textWrap: labelWrap, isActive: isActive, isDisabled: isDisabled, children: label })), (iconAfter || iconAfterSrc) && (_jsx(Icon, { className: clsx('menu-item__icon_after', iconBadgeValue && 'menu-item__icon_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: "menu-item__icon_after_badge", badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] })), after] }) }) }));
 }
 export { MenuItem, menuItemConfig };

package/dist/types/components/MenuItem/appearance/menuItemShape.js

@@ -7,19 +7,15 @@ const menuItemAppearanceShape = {
     },
     roundedXL: {
         shape: 'rounded',
-        shapeStrength: '2m',
     },
     roundedL: {
         shape: 'rounded',
-        shapeStrength: '1_5m',
     },
     roundedM: {
         shape: 'rounded',
-        shapeStrength: '1m',
     },
     roundedS: {
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { menuItemAppearanceShape };

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

@@ -21,7 +21,6 @@ declare const Modal: React.ForwardRefExoticComponent<{
     overlayOpacity?: import("src/components/Overlay").OverlayProps["opacity"];
     print?: boolean;
     shape?: import("@itcase/types-ui").ShapeProps;
-    shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
     size?: import("@itcase/types-ui").SizeProps;
     textColor?: import("../Text").TextProps["textColor"];
     textSize?: import("../Text").TextProps["size"];

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

@@ -1,5 +1,5 @@
 import { CSSProperties, MouseEventHandler, ReactNode } from 'react';
-import { AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, ElevationProps, FillProps, ItemFillProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, ElevationProps, FillProps, ItemFillProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { IconProps } from 'src/components/Icon/Icon.interface';
 import { OverlayProps } from 'src/components/Overlay/Overlay.interface';
@@ -25,7 +25,6 @@ type ModalAppearanceProps = {
     overlayOpacity?: OverlayProps['opacity'];
     print?: boolean;
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     textColor?: TextProps['textColor'];
     textSize?: TextProps['size'];

package/dist/types/components/Modal/Modal.js

@@ -125,10 +125,10 @@ const Modal = React.forwardRef(function Modal(props, ref) {
     useImperativeHandle(ref, () => ({ modalElement, openModal, closeModal, isOpen }), [isOpen, openModal, closeModal, modalElement]);
     const appearanceConfig = useAppearanceConfig(appearance, modalConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, overlayFill, overlayOpacity, shapeClass, shapeStrengthClass, sizeClass, closeIconAppearance, closeIconAppearanceSize, closeIconFillSize, closeIconImage, closeIconShape, closeIconSize, } = propsGenerator;
+    const { fillClass, titleTextColor, titleTextColorHover, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWidth, titleTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, overlayFill, overlayOpacity, shapeClass, sizeClass, closeIconAppearance, closeIconAppearanceSize, closeIconFillSize, closeIconImage, closeIconShape, closeIconSize, } = propsGenerator;
     const { styles: modalStyles } = useStyles(props);
     return (modalElement &&
-        ReactDOM.createPortal(isOpen ? (_jsxs(React.Fragment, { children: [_jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [before, (title || closeIcon) && (_jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (_jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (_jsx("div", { className: "modal__close", onClick: closeModal, children: _jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), _jsx("div", { className: "modal__content-wrapper", children: children }), after] }), _jsx(Overlay, { className: "modal__overlay", 
+        ReactDOM.createPortal(isOpen ? (_jsxs(React.Fragment, { children: [_jsxs("div", { id: id, className: clsx('modal__content', absoluteHeader && 'modal__content-absolute-header', !title && !closeIcon && 'modal__content-no-header', fillClass && `fill_${fillClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `modal_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, elevationClass && `elevation_${elevationClass}`, scroll && `modal-scroll_${scroll}`, stickyHeader && 'modal-scroll_header_sticky', isSkeleton && 'skeleton'), ref: modalContentRef, "data-testid": dataTestId, "data-tour": dataTour, style: modalStyles, tabIndex: 0, children: [before, (title || closeIcon) && (_jsxs("div", { className: clsx('modal__header', fillClass && `fill_${fillClass}`), children: [title && (_jsx(Title, { width: titleTextWidth, flex: "1", size: titleTextSize, textColor: titleTextColor, textColorHover: titleTextColorHover, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, children: title })), closeIcon && (_jsx("div", { className: "modal__close", onClick: closeModal, children: _jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), fillSize: closeIconFillSize, iconSize: closeIconSize, shape: closeIconShape, SvgImage: closeIconImage ?? icons24.Action.Close }) }))] })), _jsx("div", { className: "modal__content-wrapper", children: children }), after] }), _jsx(Overlay, { className: "modal__overlay", 
                     // ref={modalOverlayRef}
                     fill: overlayFill, opacity: overlayOpacity, isOverlay: isOverlay, onClick: handleClickOverlay })] })) : null, 
         // A DOM element

package/dist/types/components/Modal/appearance/modalShape.js

@@ -7,19 +7,15 @@ const modalAppearanceShape = {
     },
     roundedXL: {
         shape: 'rounded',
-        shapeStrength: '2m',
     },
     roundedL: {
         shape: 'rounded',
-        shapeStrength: '1_5m',
     },
     roundedM: {
         shape: 'rounded',
-        shapeStrength: '1m',
     },
     roundedS: {
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { modalAppearanceShape };

package/dist/types/components/Modal/stories/ModalAbsoluteHeader.stories.d.ts

@@ -21,7 +21,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

package/dist/types/components/Modal/stories/ModalDemo.stories.d.ts

@@ -22,7 +22,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

package/dist/types/components/Modal/stories/ModalScroll.stories.d.ts

@@ -21,7 +21,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

package/dist/types/components/Modal/stories/ModalSize.stories.d.ts

@@ -21,7 +21,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

package/dist/types/components/Modal/stories/ModalStickyHeader.stories.d.ts

@@ -21,7 +21,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

package/dist/types/components/Modal/stories/ModalStyle.stories.d.ts

@@ -21,7 +21,6 @@ declare const meta: {
         overlayOpacity?: import("../../Overlay").OverlayProps["opacity"];
         print?: boolean;
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         textColor?: import("../../Text").TextProps["textColor"];
         textSize?: import("../../Text").TextProps["size"];

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

@@ -1,6 +1,6 @@
 import type { CSSProperties, MouseEventHandler, ReactNode } from 'react';
 import { GeneratedId } from '@itcase/types-core';
-import { AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysNotification, BorderColorProps, CompositeAppearanceNotificationKeys, ElevationProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysNotification, BorderColorProps, CompositeAppearanceNotificationKeys, ElevationProps, FillHoverProps, FillProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { ButtonProps } from 'src/components/Button/Button.interface';
 import { IconProps } from 'src/components/Icon/Icon.interface';
@@ -27,7 +27,6 @@ type NotificationAppearanceProps = {
     loaderType?: LoaderProps['type'];
     set?: string;
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     status?: string;
     text?: string;

package/dist/types/components/Notification/Notification.js

@@ -17,8 +17,8 @@ function Notification(props) {
     const { id, appearance, className, dataTestId, dataTour, type = 'float', title, text, before, after, isSkeleton, isLoading, onClickButton, onClickClose, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, notificationConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
+    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconAppearanceSize, closeIconSrc, } = propsGenerator;
     const { styles: notificationStyles } = useStyles(props);
-    return (_jsxs("div", { className: clsx('notification__item', `notification__item_${type}`, widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, type && `notification__item_type_${type}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, _jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (_jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (_jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (_jsx(Loader, { appearance: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (_jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), onClickButton && buttonLabel && (_jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
+    return (_jsxs("div", { className: clsx('notification__item', `notification__item_${type}`, widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, type && `notification__item_type_${type}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `skeleton`, shapeClass && `shape_${shapeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, _jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (_jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (_jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (_jsx(Loader, { appearance: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (_jsx(Icon, { appearance: mergeAppearanceKeys(closeIconAppearance, closeIconAppearanceSize), className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), onClickButton && buttonLabel && (_jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
 }
 export { Notification, notificationConfig };

package/dist/types/components/Notification/appearance/notificationShape.js

@@ -7,19 +7,15 @@ const notificationAppearanceShape = {
     },
     roundedXL: {
         shape: 'rounded',
-        shapeStrength: '2m',
     },
     roundedL: {
         shape: 'rounded',
-        shapeStrength: '1_5m',
     },
     roundedM: {
         shape: 'rounded',
-        shapeStrength: '1m',
     },
     roundedS: {
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { notificationAppearanceShape };

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

@@ -1,5 +1,5 @@
 import { type ReactNode } from 'react';
-import { AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, ShapeStrengthProps, SizeProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, SizeProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { DropdownItemProps, DropdownProps } from 'src/components/Dropdown/Dropdown.interface';
 import { IconProps } from 'src/components/Icon/Icon.interface';
@@ -18,7 +18,6 @@ type PaginationAppearanceProps = {
     fillInput?: FillProps;
     fillInputHover?: FillHoverProps;
     fillInputShape?: ShapeProps;
-    fillInputShapeStrength?: ShapeStrengthProps;
     gap?: string;
     justifyContent?: JustifyContentProps;
     labelTextColor?: TextProps['textColor'];
@@ -55,7 +54,6 @@ type PaginationAppearanceProps = {
     pageCountDropdownItemSize?: DropdownItemProps['size'];
     pageCountDropdownItemWidth?: DropdownItemProps['width'];
     pageCountDropdownShape?: DropdownItemProps['shape'];
-    pageCountDropdownShapeStrength?: DropdownProps['shapeStrength'];
     pageCountInputIcon?: IconProps['SvgImage'];
     pageCountInputIconColor?: IconProps['iconFill'];
     pageCountInputIconFillSize?: IconProps['fillSize'];

package/dist/types/components/Pagination/Pagination.js

@@ -98,7 +98,7 @@ function Pagination(props) {
     }, [allItemsCount]);
     const appearanceConfig = useAppearanceConfig(appearance, paginationConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, fillInputClass, fillInputHoverClass, fillInputShapeClass, fillInputShapeStrengthClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorHoverClass, textSizeClass, builderIcon, builderIconFill, builderIconFillIcon, builderIconFillSize, builderIconSize, marginPagesDisplayed, nextIcon, nextIconFill, nextIconFillIcon, nextIconFillSize, nextIconSize, pageCountDescTextColor, pageCountDescTextSize, pageCountDropdownAlignment, pageCountDropdownElevation, pageCountDropdownFill, pageCountDropdownFillHover, pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize, pageCountDropdownItemFill, pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider, pageCountDropdownItemSize, pageCountDropdownItemWidth, pageCountDropdownShape, pageCountDropdownShapeStrength, pageCountInputIcon, pageCountInputIconColor, pageCountInputIconFillSize, pageCountInputIconSrc, pageCountInputTextColor, pageCountInputTextSize, pageRangeDisplayed, previousIcon, previousIconFill, previousIconFillIcon, previousIconFillSize, previousIconSize, sizeClass, } = propsGenerator;
+    const { justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, fillInputClass, fillInputHoverClass, fillInputShapeClass, textColorActiveClass, textColorActiveHoverClass, textColorClass, textColorHoverClass, textSizeClass, builderIcon, builderIconFill, builderIconFillIcon, builderIconFillSize, builderIconSize, marginPagesDisplayed, nextIcon, nextIconFill, nextIconFillIcon, nextIconFillSize, nextIconSize, pageCountDescTextColor, pageCountDescTextSize, pageCountDropdownAlignment, pageCountDropdownElevation, pageCountDropdownFill, pageCountDropdownFillHover, pageCountDropdownItemDividerFill, pageCountDropdownItemDividerSize, pageCountDropdownItemFill, pageCountDropdownItemFillActive, pageCountDropdownItemFillActiveHover, pageCountDropdownItemFillHover, pageCountDropdownItemLabelAlign, pageCountDropdownItemLabelColor, pageCountDropdownItemLabelColorActive, pageCountDropdownItemLabelColorActiveHover, pageCountDropdownItemLabelColorHover, pageCountDropdownItemLabelSize, pageCountDropdownItemLabelWrap, pageCountDropdownItemShowDivider, pageCountDropdownItemSize, pageCountDropdownItemWidth, pageCountDropdownShape, pageCountInputIcon, pageCountInputIconColor, pageCountInputIconFillSize, pageCountInputIconSrc, pageCountInputTextColor, pageCountInputTextSize, pageRangeDisplayed, previousIcon, previousIconFill, previousIconFillIcon, previousIconFillSize, previousIconSize, sizeClass, } = propsGenerator;
     const { styles: paginationStyles } = useStyles(props);
     const minPageSize = Math.min(perPageCount, ...pageCountList);
     const isPaginationDisplayed = allItemsCount > minPageSize;
@@ -107,8 +107,7 @@ function Pagination(props) {
                     `text text-color_active_${textColorActiveClass}`, textColorActiveHoverClass &&
                     `text text-color_active_hover_${textColorActiveHoverClass}`), breakClassName: "pagination__item pagination__item_break", breakLabel: "...", breakLinkClassName: "pagination__item-link", containerClassName: clsx(className, 'pagination__container', justifyContentClass &&
                     `pagination_justify-content_${justifyContentClass}`), disabledClassName: "pagination__item_state_disabled cursor_type_default", disabledLinkClassName: "pagination__item_state_disabled", forcePage: paginationPageIndex, marginPagesDisplayed: marginPagesDisplayed, nextClassName: clsx('pagination__item pagination__item_next', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), nextLabel: _jsx(Icon, { fill: nextIconFill, fillSize: nextIconFillSize, iconFill: nextIconFillIcon, iconSize: nextIconSize, shape: "circular", SvgImage: nextIcon }), nextLinkClassName: "pagination__item-link", pageClassName: clsx('pagination__item', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), pageCount: paginationPagesCount, pageLabelBuilder: isPageLabelBuilder &&
-                    (() => (_jsx(Icon, { fill: builderIconFill, fillSize: builderIconFillSize, iconFill: builderIconFillIcon, iconSize: builderIconSize, shape: "circular", SvgImage: builderIcon }))), pageLinkClassName: clsx('pagination__item-link', textSizeClass && `pagination__item-link_size_${textSizeClass}`, textColorClass && `text text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`), pageRangeDisplayed: pageRangeDisplayed ?? 8, previousClassName: clsx('pagination__item pagination__item_previous', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), previousLabel: _jsx(Icon, { fill: previousIconFill, fillSize: previousIconFillSize, iconFill: previousIconFillIcon, iconSize: previousIconSize, shape: "circular", SvgImage: previousIcon }), previousLinkClassName: "pagination__item-link", onPageChange: _onChangePage }), isPageCount && (_jsxs("div", { className: clsx(className, 'pagination__count'), children: [_jsx(Text, { className: "pagination__count-text", size: pageCountDescTextSize, textColor: pageCountDescTextColor, children: pageCountDesc }), _jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillInputClass && `fill_${fillInputClass}`, fillInputHoverClass && `fill_hover_${fillInputHoverClass}`, fillInputShapeClass && `shape_${fillInputShapeClass}`, fillInputShapeStrengthClass &&
-                            `shape-strength_${fillInputShapeStrengthClass}`), onClick: onClickCommandMenuButton, children: [_jsx(Text, { size: pageCountInputTextSize, textColor: pageCountInputTextColor, children: activeDropdownItem }), _jsx(Icon, { fillSize: pageCountInputIconFillSize, iconFill: pageCountInputIconColor, imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), _jsx(Dropdown, { className: "pagination__dropdown", alignment: pageCountDropdownAlignment, fill: pageCountDropdownFill, fillHover: pageCountDropdownFillHover, elevation: pageCountDropdownElevation, shape: pageCountDropdownShape, shapeStrength: pageCountDropdownShapeStrength, isOpen: isOpenDropdown, setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map((item, index) => activeDropdownItem === item ? (_jsx(DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillActive: pageCountDropdownItemFillActive, fillActiveHover: pageCountDropdownItemFillActiveHover, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorActive: pageCountDropdownItemLabelColorActive, labelTextColorActiveHover: pageCountDropdownItemLabelColorActiveHover, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountList.length - 1 &&
+                    (() => (_jsx(Icon, { fill: builderIconFill, fillSize: builderIconFillSize, iconFill: builderIconFillIcon, iconSize: builderIconSize, shape: "circular", SvgImage: builderIcon }))), pageLinkClassName: clsx('pagination__item-link', textSizeClass && `pagination__item-link_size_${textSizeClass}`, textColorClass && `text text-color_${textColorClass}`, textColorHoverClass && `text-color_hover_${textColorHoverClass}`), pageRangeDisplayed: pageRangeDisplayed ?? 8, previousClassName: clsx('pagination__item pagination__item_previous', sizeClass && `pagination__item_size_${sizeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`), previousLabel: _jsx(Icon, { fill: previousIconFill, fillSize: previousIconFillSize, iconFill: previousIconFillIcon, iconSize: previousIconSize, shape: "circular", SvgImage: previousIcon }), previousLinkClassName: "pagination__item-link", onPageChange: _onChangePage }), isPageCount && (_jsxs("div", { className: clsx(className, 'pagination__count'), children: [_jsx(Text, { className: "pagination__count-text", size: pageCountDescTextSize, textColor: pageCountDescTextColor, children: pageCountDesc }), _jsxs("div", { className: clsx('pagination__input', 'cursor_type_pointer', fillInputClass && `fill_${fillInputClass}`, fillInputHoverClass && `fill_hover_${fillInputHoverClass}`, fillInputShapeClass && `shape_${fillInputShapeClass}`), onClick: onClickCommandMenuButton, children: [_jsx(Text, { size: pageCountInputTextSize, textColor: pageCountInputTextColor, children: activeDropdownItem }), _jsx(Icon, { fillSize: pageCountInputIconFillSize, iconFill: pageCountInputIconColor, imageSrc: pageCountInputIconSrc, SvgImage: pageCountInputIcon }), _jsx(Dropdown, { className: "pagination__dropdown", alignment: pageCountDropdownAlignment, fill: pageCountDropdownFill, fillHover: pageCountDropdownFillHover, elevation: pageCountDropdownElevation, shape: pageCountDropdownShape, isOpen: isOpenDropdown, setIsOpen: setIsOpenDropdown, children: pageCountDropdownArray.map((item, index) => activeDropdownItem === item ? (_jsx(DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillActive: pageCountDropdownItemFillActive, fillActiveHover: pageCountDropdownItemFillActiveHover, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorActive: pageCountDropdownItemLabelColorActive, labelTextColorActiveHover: pageCountDropdownItemLabelColorActiveHover, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountList.length - 1 &&
                                         pageCountDropdownItemShowDivider, isActive: true, onClick: (event) => handleDropdownItemClick(event, item) }, item)) : (_jsx(DropdownItem, { width: pageCountDropdownItemWidth, size: pageCountDropdownItemSize, fill: pageCountDropdownItemFill, fillHover: pageCountDropdownItemFillHover, label: item.toString(), labelTextAlign: pageCountDropdownItemLabelAlign, labelTextColor: pageCountDropdownItemLabelColor, labelTextColorHover: pageCountDropdownItemLabelColorHover, labelTextSize: pageCountDropdownItemLabelSize, labelTextWrap: pageCountDropdownItemLabelWrap, dividerDirection: pageCountDropdownItemDividerDirection, dividerFill: pageCountDropdownItemDividerFill, dividerSize: pageCountDropdownItemDividerSize, showDivider: index < pageCountList.length - 1 &&
                                         pageCountDropdownItemShowDivider, isActive: false, onClick: (event) => handleDropdownItemClick(event, item) }, item))) })] })] }))] })));
 }

package/dist/types/components/Pagination/appearance/paginationShape.js

@@ -8,27 +8,19 @@ const paginationAppearanceShape = {
     },
     roundedXL: {
         fillInputShape: 'rounded',
-        fillInputShapeStrength: '2m',
         pageCountDropdownShape: 'rounded',
-        pageCountDropdownShapeStrength: '2m',
     },
     roundedL: {
         fillInputShape: 'rounded',
-        fillInputShapeStrength: '1_5m',
         pageCountDropdownShape: 'rounded',
-        pageCountDropdownShapeStrength: '1_5m',
     },
     roundedM: {
         fillInputShape: 'rounded',
-        fillInputShapeStrength: '1m',
         pageCountDropdownShape: 'rounded',
-        pageCountDropdownShapeStrength: '1m',
     },
     roundedS: {
         fillInputShape: 'rounded',
-        fillInputShapeStrength: '0_5m',
         pageCountDropdownShape: 'rounded',
-        pageCountDropdownShapeStrength: '0_5m',
     },
 };
 export { paginationAppearanceShape };

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

@@ -1,5 +1,5 @@
 import { ElementType } from 'react';
-import { AppearanceConfig, AppearanceKeysState, BorderColorActiveProps, BorderColorHoverProps, BorderColorProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysState, BorderColorActiveProps, BorderColorHoverProps, BorderColorProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, SizeProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { TextProps } from 'src/components/Text/Text.interface';
 type RadioAppearanceProps = {
@@ -23,7 +23,6 @@ type RadioAppearanceProps = {
     labelTextSize?: TextProps['size'];
     labelTextWeight?: TextProps['textWeight'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
 };
 type RadioProps = RadioAppearanceProps & StyleAttributes & {

package/dist/types/components/Radio/Radio.js

@@ -13,7 +13,7 @@ function Radio(props) {
     const { id, appearance, className, dataTestId, dataTour, label, desc, checked, tag: Tag = 'label', value, isActive, isDisabled, isSkeleton, onChange, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, radioConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillCheckmarkClass, fillClass, fillHoverClass, fillRadioActiveClass, fillRadioActiveHoverClass, fillRadioClass, fillRadioHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderRadioColorActiveClass, borderRadioColorActiveHoverClass, borderRadioColorClass, borderRadioColorHoverClass, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
+    const { fillCheckmarkClass, fillClass, fillHoverClass, fillRadioActiveClass, fillRadioActiveHoverClass, fillRadioClass, fillRadioHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderRadioColorActiveClass, borderRadioColorActiveHoverClass, borderRadioColorClass, borderRadioColorHoverClass, shapeClass, sizeClass, } = propsGenerator;
     return (_jsxs(Tag, { className: clsx(className, 'radio', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && 'skeleton', sizeClass && `radio_size_${sizeClass}`, !checked || !isActive
             ? fillRadioClass && `radio_fill_${fillRadioClass}`
             : fillRadioActiveClass && `radio_fill_active_${fillRadioActiveClass}`, !checked || !isActive
@@ -27,6 +27,6 @@ function Radio(props) {
             ? borderRadioColorHoverClass &&
                 `radio_border-color_hover_${borderRadioColorHoverClass}`
             : borderRadioColorActiveHoverClass &&
-                `radio_border-color_active_hover_${borderRadioColorActiveHoverClass}`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: id, children: [_jsxs("div", { className: clsx('radio__item'), children: [_jsx("input", { id: String(id), className: "radio__input", type: "radio", checked: checked, disabled: isDisabled, value: value, onChange: onChange }), _jsx("div", { className: clsx('radio__state', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), children: "\u00A0" }), _jsx("div", { className: clsx('radio__state-checkmark', checked && fillCheckmarkClass && `fill_${fillCheckmarkClass}`), children: "\u00A0" })] }), label && (_jsx(Text, { className: "radio__label", size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), desc && (_jsx(Text, { className: "radio__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] }));
+                `radio_border-color_active_hover_${borderRadioColorActiveHoverClass}`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: id, children: [_jsxs("div", { className: clsx('radio__item'), children: [_jsx("input", { id: String(id), className: "radio__input", type: "radio", checked: checked, disabled: isDisabled, value: value, onChange: onChange }), _jsx("div", { className: clsx('radio__state', shapeClass && `shape_${shapeClass}`), children: "\u00A0" }), _jsx("div", { className: clsx('radio__state-checkmark', checked && fillCheckmarkClass && `fill_${fillCheckmarkClass}`), children: "\u00A0" })] }), label && (_jsx(Text, { className: "radio__label", size: labelTextSize, textColor: labelTextColor, textWeight: labelTextWeight, children: label })), desc && (_jsx(Text, { className: "radio__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] }));
 }
 export { Radio, radioConfig };

package/dist/types/components/Radio/appearance/radioShape.js

@@ -7,19 +7,15 @@ const radioAppearanceShape = {
     },
     roundedXL: {
         shape: 'rounded',
-        shapeStrength: '2m',
     },
     roundedL: {
         shape: 'rounded',
-        shapeStrength: '1_5m',
     },
     roundedM: {
         shape: 'rounded',
-        shapeStrength: '1m',
     },
     roundedS: {
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { radioAppearanceShape };

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

@@ -35,7 +35,6 @@ declare const Response: import("react").ForwardRefExoticComponent<Omit<{
     secondaryButtonSize?: import("src/components/Button").ButtonProps["size"];
     secondaryButtonWidth?: import("src/components/Button").ButtonProps["width"];
     shape?: import("@itcase/types-ui").ShapeProps;
-    shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
     svgFill?: import("@itcase/types-ui").SvgFillProps;
     SvgImage?: ComponentType<SVGProps<SVGSVGElement>> | import("../Icon").IconProps["SvgImage"];
     svgPathFill?: import("@itcase/types-ui").SvgFillProps;

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

@@ -1,5 +1,5 @@
 import { ComponentType, CSSProperties, ReactNode, SVGProps } from 'react';
-import { AppearanceConfig, AppearanceKeysResponse, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceResponseKeys, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SvgFillProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysResponse, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceResponseKeys, FillHoverProps, FillProps, ShapeProps, SvgFillProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { ButtonProps } from 'src/components/Button/Button.interface';
 import { IconProps } from 'src/components/Icon/Icon.interface';
@@ -38,7 +38,6 @@ type ResponseAppearanceProps = {
     secondaryButtonSize?: ButtonProps['size'];
     secondaryButtonWidth?: ButtonProps['width'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     svgFill?: SvgFillProps;
     SvgImage?: ComponentType<SVGProps<SVGSVGElement>> | IconProps['SvgImage'];
     svgPathFill?: SvgFillProps;

package/dist/types/components/Response/Response.js

@@ -17,7 +17,7 @@ const Response = urlWithAssetPrefix(forwardRef(function Response(props, ref) {
     const { appearance, className, dataTestId, dataTour, width, height, title, desc, primaryButton, secondaryButton, showPrimaryButton = true, showSecondaryButton = true, before, after, isSkeleton, isBottomButton, onClickPrimaryButton, onClickSecondaryButton, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, responseConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, titleTextWeight, descTextColor, descTextSize, descTextWeight, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, heightClass, imageSrc, primaryButtonAfter, primaryButtonAppearance, primaryButtonBefore, primaryButtonFill, primaryButtonFillHover, primaryButtonLabel, primaryButtonLabelTextColor, primaryButtonLabelTextSize, primaryButtonShape, primaryButtonSize, primaryButtonWidth, secondaryButtonAfter, secondaryButtonAppearance, secondaryButtonBefore, secondaryButtonFill, secondaryButtonFillHover, secondaryButtonLabel, secondaryButtonLabelTextColor, secondaryButtonLabelTextSize, secondaryButtonShape, secondaryButtonSize, secondaryButtonWidth, shapeClass, shapeStrengthClass, svgFillClass, SvgImage, svgPathFillClass, svgSrc, widthClass, } = propsGenerator;
+    const { fillClass, fillHoverClass, titleTextColor, titleTextSize, titleTextWeight, descTextColor, descTextSize, descTextWeight, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, heightClass, imageSrc, primaryButtonAfter, primaryButtonAppearance, primaryButtonBefore, primaryButtonFill, primaryButtonFillHover, primaryButtonLabel, primaryButtonLabelTextColor, primaryButtonLabelTextSize, primaryButtonShape, primaryButtonSize, primaryButtonWidth, secondaryButtonAfter, secondaryButtonAppearance, secondaryButtonBefore, secondaryButtonFill, secondaryButtonFillHover, secondaryButtonLabel, secondaryButtonLabelTextColor, secondaryButtonLabelTextSize, secondaryButtonShape, secondaryButtonSize, secondaryButtonWidth, shapeClass, svgFillClass, SvgImage, svgPathFillClass, svgSrc, widthClass, } = propsGenerator;
     const ImageComponent = useMemo(() => {
         const src = imageSrc || svgSrc;
         const Image = SvgImage;
@@ -38,7 +38,7 @@ const Response = urlWithAssetPrefix(forwardRef(function Response(props, ref) {
     }, [imageSrc, svgSrc, SvgImage, width, height]);
     const { styles: responseStyles, wrapper: wrapperStyles } = useStyles(props);
     return (_jsxs("div", { className: clsx(className, 'response', isBottomButton && `response_bottom-button`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass &&
-            `border-color_hover_${borderColorHoverClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, heightClass && `height_${heightClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, isSkeleton && `skeleton`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, _jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (_jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), _jsxs("div", { className: "response__wrapper-inner", children: [title && (_jsx(Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (_jsx(Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||
+            `border-color_hover_${borderColorHoverClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, heightClass && `height_${heightClass}`, shapeClass && `shape_${shapeClass}`, widthClass && `width_${widthClass}`, isSkeleton && `skeleton`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, _jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (_jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), _jsxs("div", { className: "response__wrapper-inner", children: [title && (_jsx(Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (_jsx(Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||

package/dist/types/components/Response/stories/ResponseConfirm.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseDemo.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseError.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseFail.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseNothingFound.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseRefresh.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseSuccess.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseUnableLoadData.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

package/dist/types/components/Response/stories/ResponseWarning.stories.d.ts

@@ -35,7 +35,6 @@ declare const meta: {
         secondaryButtonSize?: import("../../Button").ButtonProps["size"];
         secondaryButtonWidth?: import("../../Button").ButtonProps["width"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         svgFill?: import("@itcase/types-ui").SvgFillProps;
         SvgImage?: import("react").ComponentType<import("react").SVGProps<SVGSVGElement>> | import("../../Icon").IconProps["SvgImage"];
         svgPathFill?: import("@itcase/types-ui").SvgFillProps;

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

@@ -1,5 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
-import { AppearanceConfig, AppearanceKeysState, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceStateDefault, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, TextWeightProps, WidthProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysState, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceStateDefault, FillProps, ShapeProps, SizeProps, TextWeightProps, WidthProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { IconProps } from 'src/components/Icon/Icon.interface';
 import { TextProps } from '../Text/Text.interface';
@@ -32,7 +32,6 @@ type SearchAppearanceProps = {
     placeholderTextStyle?: TextProps['textStyle'];
     placeholderTextWeight?: TextProps['textWeight'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     width?: WidthProps;
 };
@@ -57,7 +56,6 @@ type SearchProps = SearchAppearanceProps & StyleAttributes & {
 type SearchResultAppearanceProps = {
     fill?: FillProps;
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
 };
 type SearchResultProps = SearchResultAppearanceProps & StyleAttributes & {
     after?: ReactNode;

package/dist/types/components/Search/SearchInput.d.ts

@@ -30,7 +30,6 @@ declare const SearchInput: React.ForwardRefExoticComponent<{
     placeholderTextStyle?: import("src/components/Text").TextProps["textStyle"];
     placeholderTextWeight?: import("src/components/Text").TextProps["textWeight"];
     shape?: import("@itcase/types-ui").ShapeProps;
-    shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
     size?: import("@itcase/types-ui").SizeProps;
     width?: import("@itcase/types-ui").WidthProps;
 } & import("@itcase/ui-core/hooks").StyleAttributes & {