@itcase/ui-web 1.9.82 → 1.9.84

package/dist/types/components/Badge/appearance/badgeShape.js

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

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

@@ -49,7 +49,6 @@ declare const Button: React.ForwardRefExoticComponent<{
     loaderSize?: import("src/components/Loader").LoaderProps["size"];
     loaderType?: import("src/components/Loader").LoaderProps["type"];
     shape?: import("@itcase/types-ui").ShapeProps;
-    shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
     size?: import("@itcase/types-ui").SizeProps;
     wrap?: import("@itcase/types-ui").WrapProps;
     zeroGap?: boolean;

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

@@ -1,5 +1,5 @@
 import type { CSSProperties, MouseEventHandler, ReactNode } from 'react';
-import { AlignProps, AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysDefault, AppearanceSizeKey, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, ElevationProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WrapProps } from '@itcase/types-ui';
+import { AlignProps, AppearanceConfig, AppearanceIconSizeKey, AppearanceKeysDefault, AppearanceSizeKey, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, ElevationProps, FillHoverProps, FillProps, ShapeProps, SizeProps, WrapProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { IconProps } from '../Icon/Icon.interface';
 import { LinkWrapperProps } from '../Link/Link.interface';
@@ -53,7 +53,6 @@ type ButtonAppearanceProps = {
     loaderSize?: LoaderProps['size'];
     loaderType?: LoaderProps['type'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     wrap?: WrapProps;
     zeroGap?: boolean;

package/dist/types/components/Button/Button.js

@@ -19,7 +19,7 @@ const Button = React.forwardRef(function Button(props, ref) {
     const { appearance, className, dataTestId, dataTour, label, Badge, href, htmlType = 'button', link, rel, target, tooltip, before, after, isDisabled, isHolding, isLoading = false, onClick, onHoldComplete, onMouseDown, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, buttonConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterAppearance, iconAfterAppearanceSize, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconAppearance, iconAppearanceSize, iconBefore, iconBeforeAppearance, iconBeforeAppearanceSize, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, shapeStrengthClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
+    const { fillClass, fillHoverClass, labelTextColor, labelTextColorHover, labelTextSize, labelTextTruncate, labelTextWeight, labelTextWidth, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, icon, iconAfter, iconAfterAppearance, iconAfterAppearanceSize, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconAppearance, iconAppearanceSize, iconBefore, iconBeforeAppearance, iconBeforeAppearanceSize, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType = 'dot', shapeClass, sizeClass, widthClass, zeroGap, zeroPadding, isSkeleton, } = propsGenerator;
     const { label: labelStyles, styles: buttonStyles } = useStyles(props);
     const { holdState, onHoldEnd, onHoldStart } = useHoldProgress({
         holdDurationMs: 500, // hardcoded in button.css
@@ -40,6 +40,6 @@ const Button = React.forwardRef(function Button(props, ref) {
                 ? 'button_type_label'
                 : buttonTypeClass
                     ? 'button_type_icon'
-                    : '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && 'skeleton', isHolding && 'button_holding', holdState && `button_state_${holdState}`), type: htmlType, title: tooltip, "data-testid": dataTestId && `${dataTestId}-button`, "data-tour": dataTour, disabled: isDisabled, href: link || href, LinkComponent: "button", rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, onPointerCancel: onHoldEnd, onPointerDown: onHoldStart, onPointerLeave: onHoldEnd, onPointerUp: onHoldEnd, children: _jsxs("div", { className: "button__wrapper", ref: ref, children: [isHolding && (_jsx("div", { className: clsx('button__indication', `button__indication_${holdState}`), children: _jsx("div", { className: "button__indication-item", children: "\u00A0" }) })), isLoading && (_jsx(Loader, { appearance: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconBeforeAppearance, iconBeforeAppearanceSize), className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), (icon || iconSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconAppearance, iconAppearanceSize), className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (children || label) && (_jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconAfterAppearance, iconAfterAppearanceSize), className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), Badge, after] }) }));
+                    : '', borderWidthClass && `border-width_${borderWidthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && !isDisabled && `fill_hover_${fillHoverClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `button_size_${sizeClass}`, widthClass && `button_width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, onClick && 'cursor_type_pointer', isDisabled && 'button_state_disabled cursor_type_default', Badge && 'button_type_badge', zeroPadding && 'button_reset-padding', zeroGap && 'button_reset-gap', isLoading && 'button_state_loading', isSkeleton && 'skeleton', isHolding && 'button_holding', holdState && `button_state_${holdState}`), type: htmlType, title: tooltip, "data-testid": dataTestId && `${dataTestId}-button`, "data-tour": dataTour, disabled: isDisabled, href: link || href, LinkComponent: "button", rel: rel, style: buttonStyles, target: target, onClick: onClick, onMouseDown: onMouseDown, onPointerCancel: onHoldEnd, onPointerDown: onHoldStart, onPointerLeave: onHoldEnd, onPointerUp: onHoldEnd, children: _jsxs("div", { className: "button__wrapper", ref: ref, children: [isHolding && (_jsx("div", { className: clsx('button__indication', `button__indication_${holdState}`), children: _jsx("div", { className: "button__indication-item", children: "\u00A0" }) })), isLoading && (_jsx(Loader, { appearance: mergeAppearanceKeys(loaderAppearance, loaderAppearanceSize), className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), before, (iconBefore || iconBeforeSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconBeforeAppearance, iconBeforeAppearanceSize), className: "button__icon_before", fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), (icon || iconSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconAppearance, iconAppearanceSize), className: "button__icon", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon })), (children || label) && (_jsx(Text, { className: "button__label", width: labelTextWidth, size: labelTextSize, textColor: labelTextColor, textColorHover: labelTextColorHover, textTruncate: labelTextTruncate, textWeight: labelTextWeight, textWrap: labelTextWrap, style: labelStyles, children: children || label })), (iconAfter || iconAfterSrc) && (_jsx(Icon, { appearance: mergeAppearanceKeys(iconAfterAppearance, iconAfterAppearanceSize), className: "button__icon_after", fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter })), Badge, after] }) }));
 });
 export { Button, buttonConfig };

package/dist/types/components/Button/__test__/ButtonTest.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/appearance/buttonShape.js

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

package/dist/types/components/Button/stories/ButtonDefault.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonDemo.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonIcon.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonLabel.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonLoading.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonMuted.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonMutedIcon.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonShape.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

package/dist/types/components/Button/stories/ButtonSize.stories.d.ts

@@ -49,7 +49,6 @@ declare const meta: {
         loaderSize?: import("../../Loader").LoaderProps["size"];
         loaderType?: import("../../Loader").LoaderProps["type"];
         shape?: import("@itcase/types-ui").ShapeProps;
-        shapeStrength?: import("@itcase/types-ui").ShapeStrengthProps;
         size?: import("@itcase/types-ui").SizeProps;
         wrap?: import("@itcase/types-ui").WrapProps;
         zeroGap?: boolean;

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

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

package/dist/types/components/Checkbox/Checkbox.js

@@ -13,7 +13,7 @@ function Checkbox(props) {
     const { id, appearance, className, dataTestId, dataTour, label, desc, checked, disabled, indeterminate, Tag = 'label', value, before, after, isActive, isChecked, isDisabled, isSkeleton, onBlur, onChange, onFocus, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, checkboxConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillCheckboxActiveClass, fillCheckboxActiveHoverClass, fillCheckboxClass, fillCheckboxHoverClass, fillCheckmarkClass, fillClass, fillHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderColorCheckboxActiveClass, borderColorCheckboxActiveHoverClass, borderColorCheckboxClass, borderColorCheckboxHoverClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    const { fillCheckboxActiveClass, fillCheckboxActiveHoverClass, fillCheckboxClass, fillCheckboxHoverClass, fillCheckmarkClass, fillClass, fillHoverClass, labelTextColor, labelTextSize, labelTextWeight, descTextColor, descTextSize, descTextWeight, borderColorCheckboxActiveClass, borderColorCheckboxActiveHoverClass, borderColorCheckboxClass, borderColorCheckboxHoverClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
     return (_jsxs(Tag, { className: clsx(className, 'checkbox', fillClass && `fill_${fillClass}`, fillHoverClass && `fill_${fillHoverClass}`, sizeClass && `checkbox_size_${sizeClass}`, !checked
             ? fillCheckboxClass && `checkbox_fill_${fillCheckboxClass}`
             : fillCheckboxActiveClass &&
@@ -29,7 +29,7 @@ function Checkbox(props) {
             ? borderColorCheckboxHoverClass &&
                 `checkbox_border-color_hover_${borderColorCheckboxHoverClass}`
             : borderColorCheckboxActiveHoverClass &&
-                `checkbox_border-color_active_hover_${borderColorCheckboxActiveHoverClass}`, widthClass && `width_${widthClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: Tag === 'label' && id, children: [before, _jsxs("div", { className: "checkbox__item", children: [_jsx("input", { id: id, className: "checkbox__input", type: "checkbox", checked: isActive || isChecked || checked, disabled: isDisabled || disabled, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus }), _jsx("div", { className: clsx('checkbox__state', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), children: "\u00A0" }), _jsx("div", { className: clsx(!indeterminate
+                `checkbox_border-color_active_hover_${borderColorCheckboxActiveHoverClass}`, widthClass && `width_${widthClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, htmlFor: Tag === 'label' && id, children: [before, _jsxs("div", { className: "checkbox__item", children: [_jsx("input", { id: id, className: "checkbox__input", type: "checkbox", checked: isActive || isChecked || checked, disabled: isDisabled || disabled, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus }), _jsx("div", { className: clsx('checkbox__state', shapeClass && `shape_${shapeClass}`), children: "\u00A0" }), _jsx("div", { className: clsx(!indeterminate
                             ? 'checkbox__state-checkmark'
                             : 'checkbox__state-indeterminate', (checked || indeterminate) &&
                             fillCheckmarkClass &&

package/dist/types/components/Checkbox/appearance/checkboxShape.js

@@ -1,7 +1,6 @@
 const checkboxAppearanceShape = {
     rounded: {
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { checkboxAppearanceShape };

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

@@ -1,5 +1,5 @@
 import { CSSProperties, ReactNode } from 'react';
-import { AlignProps, AppearanceConfig, AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, TextColorProps, WrapProps } from '@itcase/types-ui';
+import { AlignProps, AppearanceConfig, AppearanceKeysDefault, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, SizeProps, TextColorProps, WrapProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { BadgeProps } from '../Badge/Badge.interface';
 import { IconProps } from '../Icon/Icon.interface';
@@ -51,7 +51,6 @@ type ChipsAppearanceProps = {
     labelTextWeight?: TextProps['textWeight'];
     labelTextWrap?: TextProps['textWrap'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
 };
 type ChipsProps = ChipsAppearanceProps & StyleAttributes & {

package/dist/types/components/Chips/Chips.js

@@ -15,12 +15,12 @@ function Chips(props) {
     const { appearance, className, dataTestId, dataTour, label = '', isActive, isDisabled, isSkeleton, onClick, onClickIconAfter, onClickIconBefore, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, chipsConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfter, iconAfterActive, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeActive, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
+    const { alignClass, alignDirectionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, badgeValue, cursorClass, iconAfter, iconAfterActive, iconAfterFill, iconAfterFillActiveIcon, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeActive, iconBeforeFill, iconBeforeFillActiveIcon, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, sizeClass, } = propsGenerator;
     const { styles: chipsStyles } = useStyles(props);
     return (_jsx("div", { className: clsx(className, 'chips', !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}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `skeleton`), "data-testid": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: _jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc || (iconBeforeActive && isActive)) && (_jsx(Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBeforeActive && isActive ? iconBeforeActive : iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (_jsx(Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (_jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc || (iconAfterActive && isActive)) && (_jsx(Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfterActive && isActive ? iconAfterActive : iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (_jsx(Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
+            : fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, sizeClass && `chips_size_${sizeClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, isActive && 'chips_state_active', isDisabled && `chips_state_disabled`, cursorClass && `cursor_${cursorClass}`, onClick && 'cursor_type_pointer', isSkeleton && `skeleton`), "data-testid": dataTestId && `${dataTestId}Chips`, "data-tour": dataTour, style: chipsStyles, onClick: !isDisabled ? onClick : undefined, children: _jsxs("div", { className: "chips__inner", children: [(iconBefore || iconBeforeSrc || (iconBeforeActive && isActive)) && (_jsx(Icon, { className: "chips__icon_before", size: iconBeforeSize, fill: iconBeforeFill, fillSize: iconBeforeFillSize, iconFill: iconBeforeFillIcon, iconFillActive: iconBeforeFillActiveIcon, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBeforeActive && isActive ? iconBeforeActive : iconBefore, isActive: isActive, onClick: onClickIconBefore })), typeof label === 'string' ? (_jsx(Text, { className: "chips__label", size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })) : (_jsx("div", { className: "chips__label", children: label })), children, (iconAfter || iconAfterSrc || (iconAfterActive && isActive)) && (_jsx(Icon, { className: "chips__icon_after", size: iconAfterSize, fill: iconAfterFill, fillSize: iconAfterFillSize, iconFill: iconAfterFillIcon, iconFillActive: iconAfterFillActiveIcon, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfterActive && isActive ? iconAfterActive : iconAfter, isActive: isActive, onClick: onClickIconAfter })), badgeValue && (_jsx(Badge, { appearance: badgeAppearance, className: "chips__badge", size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue }))] }) }));
 }
 export { Chips, chipsConfig };

package/dist/types/components/Chips/appearance/chipsShape.js

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

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

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import { AppearanceConfig, AppearanceKeysState, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillDisabledProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, WrapProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysState, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceStateDefault, FillActiveHoverProps, FillActiveProps, FillDisabledProps, FillHoverProps, FillProps, ShapeProps, SizeProps, WrapProps } from '@itcase/types-ui';
 import type { StyleAttributes } from '@itcase/ui-core/hooks';
 import { IconProps } from 'src/components/Icon/Icon.interface';
 import { TextProps } from 'src/components/Text/Text.interface';
@@ -43,7 +43,6 @@ type ChoiceAppearanceProps = {
     labelTextWeight?: TextProps['textWeight'];
     labelTextWrap?: TextProps['textWrap'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     wrap?: WrapProps;
 };

package/dist/types/components/Choice/Choice.js

@@ -22,13 +22,13 @@ function Choice(props) {
     }, [isCheckbox, setActiveSegment]);
     const appearanceConfig = useAppearanceConfig(appearance, choiceConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { size, fillClass, fillItemActiveClass, fillItemActiveDisabledClass, fillItemActiveHoverClass, fillItemClass, fillItemDisabledClass, fillItemHoverClass, labelTextColor, labelTextColorActive, labelTextColorActiveHover, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, iconAfterFill, iconAfterFillActive, iconAfterFillDisabled, iconAfterSize, iconBeforeFill, iconBeforeFillActive, iconBeforeFillDisabled, iconBeforeSize, iconFill, iconFillActive, iconFillDisabled, iconSize, shapeClass, shapeStrengthClass, wrapClass, } = propsGenerator;
+    const { size, fillClass, fillItemActiveClass, fillItemActiveDisabledClass, fillItemActiveHoverClass, fillItemClass, fillItemDisabledClass, fillItemHoverClass, labelTextColor, labelTextColorActive, labelTextColorActiveHover, labelTextColorHover, labelTextSize, labelTextWeight, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, iconAfterFill, iconAfterFillActive, iconAfterFillDisabled, iconAfterSize, iconBeforeFill, iconBeforeFillActive, iconBeforeFillDisabled, iconBeforeSize, iconFill, iconFillActive, iconFillDisabled, iconSize, shapeClass, wrapClass, } = propsGenerator;
     const { styles } = useStyles(props);
-    return (_jsxs("div", { id: id, className: clsx(className, 'choice', size && `choice_size_${size}`, fillClass && `fill_${fillClass}`, wrapClass && `choice_wrap_${wrapClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, isSkeleton && `skeleton`), ref: controlRef, "data-testid": dataTestId && `${dataTestId}Choice`, "data-tour": dataTour, style: styles, children: [before && _jsx("div", { className: "choice__before", children: before }), isLoading ? (_jsx(Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemPrimary" })) : (_jsx(React.Fragment, { children: options.map((item) => {
+    return (_jsxs("div", { id: id, className: clsx(className, 'choice', size && `choice_size_${size}`, fillClass && `fill_${fillClass}`, wrapClass && `choice_wrap_${wrapClass}`, shapeClass && `shape_${shapeClass}`, isSkeleton && `skeleton`), ref: controlRef, "data-testid": dataTestId && `${dataTestId}Choice`, "data-tour": dataTour, style: styles, children: [before && _jsx("div", { className: "choice__before", children: before }), isLoading ? (_jsx(Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemPrimary" })) : (_jsx(React.Fragment, { children: options.map((item) => {
                     const isActive = typeof active === 'object'
                         ? String(item.value) === String(active.value)
                         : String(item.value) === String(active);
-                    return (_jsxs("div", { className: clsx('choice__item', size && `choice__item_size_${size}`, (item.icon || item.iconActive) && 'choice__item_icon', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, !isActive && !isDisabled
+                    return (_jsxs("div", { className: clsx('choice__item', size && `choice__item_size_${size}`, (item.icon || item.iconActive) && 'choice__item_icon', shapeClass && `shape_${shapeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, !isActive && !isDisabled
                             ? fillItemClass && `fill_${fillItemClass}`
                             : fillItemDisabledClass &&
                                 `fill_disabled_${fillItemDisabledClass}`, !isActive && !isDisabled

package/dist/types/components/Choice/appearance/choiceShape.js

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

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

@@ -1,6 +1,6 @@
 import { FocusEvent, ReactNode } from 'react';
 import { AllowedInputTypes } from 'react-otp-input';
-import { AppearanceConfig, AppearanceKeysState, BorderColorHoverProps, BorderColorProps, BorderWidthProps, CompositeAppearanceStateDefault, FillHoverProps, FillProps, ItemFillProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysState, BorderColorHoverProps, BorderColorProps, BorderWidthProps, CompositeAppearanceStateDefault, FillHoverProps, FillProps, ItemFillProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { LabelProps } from 'src/components/Label/Label.interface';
 import { TextProps } from 'src/components/Text/Text.interface';
@@ -24,7 +24,6 @@ type CodeAppearanceProps = {
     labelTextColor?: LabelProps['labelTextColor'];
     labelTextSize?: LabelProps['labelTextSize'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     width?: WidthProps;
 };

package/dist/types/components/Code/Code.js

@@ -15,10 +15,10 @@ function Code(props) {
     const [otp, setOtp] = useState(initialValue);
     const appearanceConfig = useAppearanceConfig(appearance, codeConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { inputBorderColorClass, inputBorderColorHoverClass, inputBorderFocusColorClass, inputBorderWidthClass, inputCaretColorClass, inputFillClass, inputFillHoverClass, inputPlaceholderTextColorClass, inputSizeClass, inputTextColorClass, inputTextSizeClass, inputTextWeightClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    const { inputBorderColorClass, inputBorderColorHoverClass, inputBorderFocusColorClass, inputBorderWidthClass, inputCaretColorClass, inputFillClass, inputFillHoverClass, inputPlaceholderTextColorClass, inputSizeClass, inputTextColorClass, inputTextSizeClass, inputTextWeightClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
     const renderInput = (otpInputProps, index) => {
         return (_jsx("input", { ...otpInputProps, className: clsx('code__input', inputCaretColorClass && `caret-color_${inputCaretColorClass}`, inputFillClass && `fill_${inputFillClass}`, inputFillHoverClass && `fill_hover_${inputFillHoverClass}`, inputPlaceholderTextColorClass &&
-                `placeholder-text-color_${inputPlaceholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputBorderWidthClass && `border-width_${inputBorderWidthClass}`, inputBorderColorClass && `border-color_${inputBorderColorClass}`, inputBorderColorHoverClass &&
+                `placeholder-text-color_${inputPlaceholderTextColorClass}`, shapeClass && `shape_${shapeClass}`, inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputBorderWidthClass && `border-width_${inputBorderWidthClass}`, inputBorderColorClass && `border-color_${inputBorderColorClass}`, inputBorderColorHoverClass &&
                 `border-color_hover_${inputBorderColorHoverClass}`, inputBorderFocusColorClass &&
                 `border-color_focus_${inputBorderFocusColorClass}`, inputSizeClass && `code__input_size_${inputSizeClass}`, widthClass && `width_${widthClass}`, isSkeleton && `skeleton`), name: `code-${index}`, autoComplete: "one-time-code", placeholder: inputPlaceholder, onBlur: (event) => {
                 onBlur && onBlur(event);

package/dist/types/components/Code/appearance/codeShape.js

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

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

@@ -1,6 +1,6 @@
 import type { DatePeriodItem } from '@itcase/common/types';
 import { Option as SelectOption } from '@itcase/types-core';
-import type { AppearanceConfig, AppearanceKeysDefault, AppearanceSizeKey, CompositeAppearanceKeys, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps } from '@itcase/types-ui';
+import type { AppearanceConfig, AppearanceKeysDefault, AppearanceSizeKey, CompositeAppearanceKeys, FillHoverProps, FillProps, ShapeProps, SizeProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { ChipsProps } from 'src/components/Chips/Chips.interface';
 import { DatePickerInputProps } from 'src/components/DatePicker/DatePicker.interface';
@@ -22,7 +22,6 @@ type DatePeriodAppearanceProps<Option> = {
     selectAppearanceSize?: AppearanceSizeKey;
     selectShape?: SelectProps<Option>['shape'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
 };
 type DatePeriodProps<Option = SelectOption> = DatePeriodAppearanceProps<Option> & StyleAttributes & {

package/dist/types/components/DatePeriod/DatePeriod.js

@@ -19,7 +19,7 @@ function DatePeriod(props) {
     const { appearance, className, dataTestId, dataTour, datePeriodIntervalsList = Object.values(DATE_PERIOD_INTERVALS), datePeriodSelectFirstOptions, datePeriodSelectFirstPlaceholder, datePeriodSelectFirstValue, datePeriodSelectSecondOptions, datePeriodSelectSecondPlaceholder, datePeriodSelectSecondValue, datePeriodValueEnd, datePeriodValueStart, monthsShown, popperPlacement, selectsRange = true, showWeekNumbers = true, isDisabled, isSkeleton, onChangeDatePeriod, onChangeDatePeriodFirstSelect, onChangeDatePeriodSecondSelect, onKeyDown, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, datePeriodConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { fillClass, chipsAppearance, chipsAppearanceSize, chipsShape, datePickerAppearance, datePickerAppearanceSize, datePickerInputAppearance, datePickerInputAppearanceSize, datePickerInputFillHover, datePickerInputTextSize, selectAppearance, selectAppearanceSize, selectShape, shapeClass, shapeStrengthClass, sizeClass, } = propsGenerator;
+    const { fillClass, chipsAppearance, chipsAppearanceSize, chipsShape, datePickerAppearance, datePickerAppearanceSize, datePickerInputAppearance, datePickerInputAppearanceSize, datePickerInputFillHover, datePickerInputTextSize, selectAppearance, selectAppearanceSize, selectShape, shapeClass, sizeClass, } = propsGenerator;
     const onClickPeriodChips = useCallback((selectedPeriodItem) => {
         const dateStartIso = selectedPeriodItem.dateIntervalsList[0];
         const dateEndIso = selectedPeriodItem.dateIntervalsList[1];
@@ -39,7 +39,7 @@ function DatePeriod(props) {
         return (dateStartIso === normalizedDatePeriodValueStart &&
             dateEndIso === normalizedDatePeriodValueEnd);
     }, [datePeriodValueEnd, datePeriodValueStart]);
-    return (_jsxs("div", { className: clsx(className, 'date-period', sizeClass && `date-period_size_${sizeClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, children: [_jsxs("div", { className: clsx('date-period__wrapper', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, 'cursor_type_pointer'), children: [_jsx(ChipsGroup, { className: "date-period__choice", direction: "horizontal", children: datePeriodIntervalsList.map((datePeriodItem) => (_jsx(Chips, { appearance: mergeAppearanceKeys(chipsAppearance, chipsAppearanceSize), label: datePeriodItem.label, shape: chipsShape, isActive: checkIsChipsActive(datePeriodItem), onClick: () => onClickPeriodChips(datePeriodItem) }, datePeriodItem.value))) }), _jsx(DatePickerInput, { className: "date-period__datepicker", datePickerProps: {
+    return (_jsxs("div", { className: clsx(className, 'date-period', sizeClass && `date-period_size_${sizeClass}`, isSkeleton && `skeleton`), "data-testid": dataTestId, "data-tour": dataTour, children: [_jsxs("div", { className: clsx('date-period__wrapper', shapeClass && `shape_${shapeClass}`, fillClass && `fill_${fillClass}`, 'cursor_type_pointer'), children: [_jsx(ChipsGroup, { className: "date-period__choice", direction: "horizontal", children: datePeriodIntervalsList.map((datePeriodItem) => (_jsx(Chips, { appearance: mergeAppearanceKeys(chipsAppearance, chipsAppearanceSize), label: datePeriodItem.label, shape: chipsShape, isActive: checkIsChipsActive(datePeriodItem), onClick: () => onClickPeriodChips(datePeriodItem) }, datePeriodItem.value))) }), _jsx(DatePickerInput, { className: "date-period__datepicker", datePickerProps: {
                             appearance: mergeAppearanceKeys(datePickerAppearance, datePickerAppearanceSize),
                             dateFormat: 'dd/MM/yyyy',
                             monthsShown: monthsShown,

package/dist/types/components/DatePeriod/appearance/datePeriodShape.js

@@ -11,25 +11,21 @@ const datePeriodAppearanceShape = {
         chipsShape: 'rounded',
         selectShape: 'rounded',
         shape: 'rounded',
-        shapeStrength: '2m',
     },
     roundedL: {
         chipsShape: 'rounded',
         selectShape: 'rounded',
         shape: 'rounded',
-        shapeStrength: '1_5m',
     },
     roundedM: {
         chipsShape: 'rounded',
         selectShape: 'rounded',
         shape: 'rounded',
-        shapeStrength: '1m',
     },
     roundedS: {
         chipsShape: 'rounded',
         selectShape: 'rounded',
         shape: 'rounded',
-        shapeStrength: '0_5m',
     },
 };
 export { datePeriodAppearanceShape };

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

@@ -1,5 +1,5 @@
 import { CSSProperties } from 'react';
-import { AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps } from '@itcase/types-ui';
+import { AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, 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 DividerAppearanceProps = {
@@ -11,7 +11,6 @@ type DividerAppearanceProps = {
     fillDisabled?: FillProps;
     fillHover?: FillHoverProps;
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     textColor?: TextProps['textColor'];
     textSize?: TextProps['size'];

package/dist/types/components/Divider/Divider.js

@@ -12,9 +12,9 @@ function Divider(props) {
     const { appearance, className, dataTestId, dataTour, print, isActive, isDisabled, isSkeleton, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, dividerConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { directionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    const { directionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, shapeClass, sizeClass, widthClass, } = propsGenerator;
     const { styles: hrStyles } = useStyles(props);
-    return (_jsx("hr", { className: clsx(className, 'divider', widthClass && `width_${widthClass}`, directionClass && `divider_direction_${directionClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, sizeClass && `divider_size_${sizeClass}`, !isActive
+    return (_jsx("hr", { className: clsx(className, 'divider', widthClass && `width_${widthClass}`, directionClass && `divider_direction_${directionClass}`, shapeClass && `shape_${shapeClass}`, sizeClass && `divider_size_${sizeClass}`, !isActive
             ? fillClass && `fill_${fillClass}`
             : fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
             ? fillHoverClass && `fill_hover_${fillHoverClass}`

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

@@ -1,5 +1,5 @@
 import { CSSProperties, MouseEvent, MouseEventHandler, ReactNode } from 'react';
-import { AlignmentProps, AlignProps, AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, ElevationProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types-ui';
+import { AlignmentProps, AlignProps, AppearanceConfig, AppearanceKeysDefault, BorderColorProps, CompositeAppearanceKeys, DirectionProps, ElevationProps, FillActiveHoverProps, FillActiveProps, FillHoverProps, FillProps, JustifyContentProps, ShapeProps, SizeProps, WidthProps } from '@itcase/types-ui';
 import { StyleAttributes } from '@itcase/ui-core/hooks';
 import { BadgeProps } from 'src/components/Badge/Badge.interface';
 import { DividerProps } from 'src/components/Divider/Divider.interface';
@@ -36,7 +36,6 @@ type DropdownAppearanceProps = {
     labelTextColorHover?: TextProps['textColorHover'];
     labelTextSize?: TextProps['size'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
 };
 type DropdownListItem = {
@@ -130,7 +129,6 @@ type DropdownItemAppearanceProps = {
     labelTextWeight?: TextProps['textWeight'];
     labelTextWrap?: TextProps['textWrap'];
     shape?: ShapeProps;
-    shapeStrength?: ShapeStrengthProps;
     size?: SizeProps;
     width?: WidthProps;
 };

package/dist/types/components/Dropdown/Dropdown.js

@@ -47,8 +47,8 @@ function Dropdown(props) {
         };
     }, [animationOpen, setIsOpen]);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { alignmentClass, fillClass, elevationClass, shapeClass, shapeStrengthClass, } = propsGenerator;
+    const { alignmentClass, fillClass, elevationClass, shapeClass } = propsGenerator;
     const { styles } = useStyles(props);
-    return (_jsxs("div", { className: clsx(className, 'dropdown', alignmentClass && `alignment_${alignmentClass}`, fillClass && `fill_${fillClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, elevationClass && `elevation_${elevationClass}`, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className), ref: dropdownRef, "data-testid": dataTestId, "data-tour": dataTour, style: styles, children: [before, (children || dropdownList) && (_jsxs("div", { className: clsx('dropdown__wrapper'), onAnimationEnd: onAnimationEnd, children: [dropdownList?.map((item) => (_jsx(DropdownItem, { appearance: appearance, label: item.label, badgeValue: item.badgeValue, emptyMessage: item.emptyMessage, iconAfter: item.iconAfter, iconBefore: item.iconBefore, iconSrc: item.icon, showDivider: showDivider, isActive: item.isActive, isSkeleton: isSkeleton, onClick: item.onClick || ((event) => onClickItem?.(item, event)) }, item.key))), children] })), after] }));
+    return (_jsxs("div", { className: clsx(className, 'dropdown', alignmentClass && `alignment_${alignmentClass}`, fillClass && `fill_${fillClass}`, shapeClass && `shape_${shapeClass}`, elevationClass && `elevation_${elevationClass}`, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className), ref: dropdownRef, "data-testid": dataTestId, "data-tour": dataTour, style: styles, children: [before, (children || dropdownList) && (_jsxs("div", { className: clsx('dropdown__wrapper'), onAnimationEnd: onAnimationEnd, children: [dropdownList?.map((item) => (_jsx(DropdownItem, { appearance: appearance, label: item.label, badgeValue: item.badgeValue, emptyMessage: item.emptyMessage, iconAfter: item.iconAfter, iconBefore: item.iconBefore, iconSrc: item.icon, showDivider: showDivider, isActive: item.isActive, isSkeleton: isSkeleton, onClick: item.onClick || ((event) => onClickItem?.(item, event)) }, item.key))), children] })), after] }));
 }
 export { Dropdown };

package/dist/types/components/Dropdown/DropdownItem.js

@@ -17,13 +17,13 @@ function DropdownItem(props) {
     const { appearance, className, dataTestId, dataTour, label, desc, badgeValue, emptyMessage, showDivider, before, after, isActive, isDisabled, isSkeleton, isHover, onClick, onMouseEnter, children, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, dropdownItemConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
-    const { directionClass, justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, labelTextAlign, labelTextColor, labelTextColorActive, labelTextColorActiveHover, labelTextColorHover, labelTextSize, labelTextStyle, labelTextWeight, labelTextWrap, descTextColor, descTextColorHover, descTextGradient, descTextSize, descTextStyle, descTextWeight, descTextWrap, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, dividerDirection, dividerFill, dividerSize, emptyMessageTextColor, emptyMessageTextColorHover, emptyMessageTextSize, emptyMessageTextStyle, emptyMessageTextWeight, emptyMessageTextWrap, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
+    const { directionClass, justifyContentClass, fillActiveClass, fillActiveHoverClass, fillClass, fillDisabledClass, fillHoverClass, labelTextAlign, labelTextColor, labelTextColorActive, labelTextColorActiveHover, labelTextColorHover, labelTextSize, labelTextStyle, labelTextWeight, labelTextWrap, descTextColor, descTextColorHover, descTextGradient, descTextSize, descTextStyle, descTextWeight, descTextWrap, badgeAppearance, badgeShape, badgeSize, badgeTextColor, badgeTextSize, dividerDirection, dividerFill, dividerSize, emptyMessageTextColor, emptyMessageTextColorHover, emptyMessageTextSize, emptyMessageTextStyle, emptyMessageTextWeight, emptyMessageTextWrap, iconAfter, iconAfterFill, iconAfterFillIcon, iconAfterFillSize, iconAfterShape, iconAfterSize, iconAfterSrc, iconBadgeAppearance, iconBadgeShape, iconBadgeSize, iconBadgeTextColor, iconBadgeTextSize, iconBadgeValue, iconBefore, iconBeforeFill, iconBeforeFillIcon, iconBeforeFillSize, iconBeforeShape, iconBeforeSize, iconBeforeSrc, shapeClass, sizeClass, widthClass, } = propsGenerator;
     const { styles: dropdownItem } = useStyles(props);
     return (_jsxs("div", { className: clsx('dropdown__item', isActive && 'dropdown__item_state_active', isHover && 'dropdown__item_state_hover', directionClass && `dropdown__item_direction_${directionClass}`, className, !isActive
             ? fillClass && `fill_${fillClass}`
             : fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
             ? fillHoverClass && `fill_hover_${fillHoverClass}`
-            : fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, fillDisabledClass && `fill_disabled_${fillDisabledClass}`, sizeClass && `dropdown__item_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `dropdown__item_width_${widthClass}`, isDisabled && `dropdown__item_state_disabled`, onClick && 'cursor_type_pointer', isSkeleton && `skeleton`, justifyContentClass &&
+            : fillActiveHoverClass && `fill_active_hover_${fillActiveHoverClass}`, fillDisabledClass && `fill_disabled_${fillDisabledClass}`, sizeClass && `dropdown__item_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, widthClass && `dropdown__item_width_${widthClass}`, isDisabled && `dropdown__item_state_disabled`, onClick && 'cursor_type_pointer', isSkeleton && `skeleton`, justifyContentClass &&
             `dropdown__item_justify-content_${justifyContentClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: dropdownItem, onClick: onClick, onMouseEnter: onMouseEnter, children: [_jsx("div", { className: "dropdown__item-wrapper", children: _jsxs(React.Fragment, { children: [before, (iconBefore || iconBeforeSrc) && (_jsx(Icon, { className: clsx('dropdown__item_before', iconBadgeValue && 'dropdown__item_before-badge'), fill: iconBeforeFill, fillSize: iconBeforeFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'dropdown__item_before_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconBeforeFillIcon, iconSize: iconBeforeSize, imageSrc: iconBeforeSrc, shape: iconBeforeShape, SvgImage: iconBefore })), children || (_jsxs(React.Fragment, { children: [label && (_jsx(Text, { className: "dropdown__item-label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorActiveHover: labelTextColorActiveHover, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, children: label })), badgeValue && (_jsx(Badge, { appearance: badgeAppearance, size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), desc && (_jsx(Text, { className: "dropdown__item-desc", size: descTextSize, textColor: descTextColor, textColorGradient: descTextGradient, textColorHover: descTextColorHover, textStyle: descTextStyle, textWeight: descTextWeight, textWrap: descTextWrap, isActive: isActive, children: desc })), emptyMessage && (_jsx(Text, { className: "dropdown__item", size: emptyMessageTextSize, textColor: emptyMessageTextColor, textColorHover: emptyMessageTextColorHover, textStyle: emptyMessageTextStyle, textWeight: emptyMessageTextWeight, textWrap: emptyMessageTextWrap, isActive: isActive, children: emptyMessage }))] })), after, (iconAfter || iconAfterSrc) && (_jsx(Icon, { className: clsx('dropdown__item_after', iconBadgeValue && 'dropdown__item_after-badge'), fill: iconAfterFill, fillSize: iconAfterFillSize, badgeAppearance: iconBadgeAppearance, badgeClass: 'dropdown__item_after_badge', badgeShape: iconBadgeShape, badgeSize: iconBadgeSize, badgeTextColor: iconBadgeTextColor, badgeTextSize: iconBadgeTextSize, badgeValue: iconBadgeValue, iconFill: iconAfterFillIcon, iconSize: iconAfterSize, imageSrc: iconAfterSrc, shape: iconAfterShape, SvgImage: iconAfter }))] }) }), showDivider && (_jsx(Divider, { width: "fill", direction: dividerDirection, size: dividerSize, fill: dividerFill }))] }));
 }
 export { DropdownItem, dropdownItemConfig };