@itcase/ui 1.9.57 → 1.9.59

package/dist/cjs/components/Response.js

@@ -4,32 +4,18 @@ var index = require('./Response/img.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
-var Button = require('../../Button_cjs_BCcz3-Fw.js');
-var Group = require('../../Group_cjs_MYtD5is_.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
-require('@itcase/common');
-require('../context/UrlAssetPrefix.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
+var Button = require('../../Button_cjs_DqbZe2Sk.js');
+var Group = require('../../Group_cjs_CvX0cIz2.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
+require('@itcase/common');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
-require('../../Icon_cjs_DTvdhr8B.js');
 require('react-inlinesvg');
-require('../../Link_cjs_Dn7UhCYe.js');
-require('../utils/mergeAppearanceKeys.js');
-require('../../Loader_cjs_CJpdLndn.js');
+require('../../Loader_cjs_BgiKK0BF.js');
 require('../hooks/useHoldProgress.js');
 
 const responseAppearanceConfirm = {
@@ -206,10 +192,10 @@ const responseConfig = {
         responseConfig.appearance = appearanceConfig;
     },
 };
-const Response = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(function Response(props, ref) {
+const Response = primitives.urlWithAssetPrefix(React.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.useAppearanceConfig(appearance, responseConfig);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, responseConfig);
+    const propsGenerator = primitives.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 ImageComponent = React.useMemo(() => {
         const src = imageSrc || svgSrc;
@@ -229,9 +215,9 @@ const Response = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(function
         }
         return null;
     }, [imageSrc, svgSrc, SvgImage, width, height]);
-    const { styles: responseStyles, wrapper: wrapperStyles } = useStyles.useStyles(props);
+    const { styles: responseStyles, wrapper: wrapperStyles } = primitives.useStyles(props);
     return (jsxRuntime.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 && `response_skeleton`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxRuntime.jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (jsxRuntime.jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), jsxRuntime.jsxs("div", { className: "response__wrapper-inner", children: [title && (jsxRuntime.jsx(Text.Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (jsxRuntime.jsx(Text.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}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, isSkeleton && `response_skeleton`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: responseStyles, children: [before, jsxRuntime.jsxs("div", { className: "response__wrapper", style: wrapperStyles, children: [ImageComponent && (jsxRuntime.jsx("div", { className: clsx('response__image', svgFillClass && `svg_fill_${svgFillClass}`, svgPathFillClass && `svg_path_fill_${svgPathFillClass}`), children: ImageComponent })), jsxRuntime.jsxs("div", { className: "response__wrapper-inner", children: [title && (jsxRuntime.jsx(primitives.Text, { className: "response__title", size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, children: title })), desc && (jsxRuntime.jsx(primitives.Text, { className: "response__desc", size: descTextSize, textColor: descTextColor, textWeight: descTextWeight, children: desc }))] })] }), (primaryButtonLabel ||
                 primaryButton ||
                 secondaryButtonLabel ||
                 secondaryButton ||

package/dist/cjs/components/SVGContent.js

@@ -4,29 +4,20 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var SVG = require('react-inlinesvg');
-var urlWithAssetPrefix = require('../hoc/urlWithAssetPrefix.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
-require('@itcase/common');
-require('../context/UrlAssetPrefix.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
+require('@itcase/common');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 
-const SVGContent = urlWithAssetPrefix.urlWithAssetPrefix(React.forwardRef(function SVGContent(props, ref) {
+const SVGContent = primitives.urlWithAssetPrefix(React.forwardRef(function SVGContent(props, ref) {
     const { className, dataTestId, dataTour, src, SvgImage } = props;
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { svgFillClass, svgFillHoverClass } = propsGenerator;
-    const { styles: svgContentStyles } = useStyles.useStyles(props);
+    const { styles: svgContentStyles } = primitives.useStyles(props);
     return (jsxRuntime.jsxs("div", { className: clsx(className, 'svg-content', svgFillClass && `svg_fill_${svgFillClass}`, svgFillHoverClass && `svg_fill_hover_${svgFillHoverClass}`), ref: ref, "data-testid": dataTestId, "data-tour": dataTour, style: svgContentStyles, children: [src && jsxRuntime.jsx(SVG, { src: src }), SvgImage && jsxRuntime.jsx(SvgImage, {})] }));
 }));
 

package/dist/cjs/components/ScrollOnDrag.js

@@ -5,28 +5,22 @@ var React = require('react');
 var clsx = require('clsx');
 var ScrollContainer = require('react-indiana-drag-scroll');
 var SimpleBar = require('simplebar-react');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
+require('react-inlinesvg');
 
 function ScrollOnDrag(props) {
     const { className, dataTestId, dataTour, scrollContainerProps, isScrollbar, children, } = props;
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { ref } = ScrollContainer.useScrollContainer();
     const { fillClass, fillHoverClass, borderColorClass, borderTypeClass, borderWidthClass, elevationClass, heightClass, widthClass = 'fill', } = propsGenerator;
-    const { scrollContainer: scrollContainerStyles, styles: styles } = useStyles.useStyles(props);
+    const { scrollContainer: scrollContainerStyles, styles: styles } = primitives.useStyles(props);
     const ScrollOnDragWrapper = isScrollbar ? SimpleBar : React.Fragment;
     const fixedProps = isScrollbar ? { scrollableNodeProps: { ref } } : {};
     return (jsxRuntime.jsx(ScrollOnDragWrapper, { ...fixedProps, children: jsxRuntime.jsx("div", { className: clsx('scroll-on-drag', className, borderColorClass && `border-color_${borderColorClass}`, borderTypeClass && `border_type_${borderTypeClass}`, borderWidthClass && `border-width_${borderWidthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, heightClass && `height_${heightClass}`, widthClass && `width_${widthClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: styles, children: jsxRuntime.jsx(ScrollContainer, { className: clsx(!isScrollbar && 'scroll-on-drag__wrapper'), ref: ref, ...scrollContainerProps, style: scrollContainerStyles, children: children }) }) }));

package/dist/cjs/components/ScrollToView.js

@@ -3,28 +3,22 @@
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var reactScroll = require('react-scroll');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
+require('react-inlinesvg');
 
 const ScrollToView = reactScroll.ScrollLink(function ScrollToView(props) {
     const { id, className, dataTestId, dataTour, styles, tag: Tag = 'div', onClick, children, } = props;
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { directionClass, justifyContentClass, alignClass, alignDirectionClass, alignItemsClass, alignSelfClass, textColorActiveClass, textColorClass, textColorHoverClass, heightClass, widthClass, } = propsGenerator;
-    const { styles: scrollToViewStyles } = useStyles.useStyles(props);
+    const { styles: scrollToViewStyles } = primitives.useStyles(props);
     return (jsxRuntime.jsx(Tag, { id: id, className: clsx(className, 'scroll-to-view', alignItemsClass && `align-items_${alignItemsClass}`, widthClass && `width_${widthClass}`, heightClass && `height_${heightClass}`, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`, textColorClass && `scroll-to-view_text-color_${textColorClass}`, textColorActiveClass &&
             `scroll-to-view_text-color_active_${textColorActiveClass}`, textColorHoverClass &&
             `scroll-to-view_text-color_hover_${textColorHoverClass}`, justifyContentClass && `justify-content_${justifyContentClass}`, directionClass && `direction_${directionClass}`, alignSelfClass && `align-self_${alignSelfClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, scrollToViewStyles, styles), onClick: onClick, children: children }));

package/dist/cjs/components/Search.js

@@ -4,30 +4,16 @@ var _default = require('@itcase/icons/default');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DTvdhr8B.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 var Scrollbar = require('../../Scrollbar_cjs_DHe1EK_B.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 require('react-inlinesvg');
-require('../../Link_cjs_Dn7UhCYe.js');
-require('../hoc/urlWithAssetPrefix.js');
-require('../context/UrlAssetPrefix.js');
-require('../utils/mergeAppearanceKeys.js');
 require('react-scrollbars-custom');
 
 const searchAppearanceDefault = {
@@ -220,15 +206,15 @@ const SearchInput = React.forwardRef(function SearchInput(props, ref) {
             onClickClean();
         }
     }, [onChange, onClickClean]);
-    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, searchInputConfig, isDisabled);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, searchInputConfig, isDisabled);
+    const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { size, fillClass, borderColorClass, borderColorHoverClass, borderTypeClass, borderWidthClass, iconAfter, iconAfterFill, iconAfterSize, iconAfterSrc, iconBefore, iconBeforeFill, iconBeforeSize, iconBeforeSrc, iconClear, iconClearFill, iconClearSize, iconClearSrc, inputFillClass, inputTextColorClass, inputTextSizeClass, inputTextStyleClass, inputTextWeightClass, placeholderTextColor, placeholderTextSize, placeholderTextStyle, placeholderTextWeight, shapeClass, shapeStrengthClass, widthClass, } = propsGenerator;
-    const { styles: searchInputStyles } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs("label", { className: clsx(className, 'search-input', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, widthClass && `width_${widthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, size && `search-input_size_${size}`, isSkeleton && `search-input_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && `fill_${inputFillClass}`), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
+    const { styles: searchInputStyles } = primitives.useStyles(props);
+    return (jsxRuntime.jsxs("label", { className: clsx(className, 'search-input', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, widthClass && `width_${widthClass}`, borderColorClass && `border-color_${borderColorClass}`, borderColorHoverClass && `border-color_hover_${borderColorHoverClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, size && `search-input_size_${size}`, isSkeleton && `search-input_skeleton`), "data-testid": dataTestId, "data-tour": dataTour, style: searchInputStyles, children: [before, (iconBefore || iconBeforeSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "search-input__icon-before", size: iconBeforeSize, iconFill: iconBeforeFill, imageSrc: iconBeforeSrc, SvgImage: iconBefore })), jsxRuntime.jsxs("div", { className: clsx('search-input__wrapper', inputFillClass && `fill_${inputFillClass}`), children: [jsxRuntime.jsx("input", { className: clsx('search-input__value', (inputTextSizeClass ||
                             inputTextWeightClass ||
                             inputTextColorClass ||
                             inputTextStyleClass) &&
-                            'text', inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextStyleClass && `text-style_${inputTextStyleClass}`), type: "text", ref: ref, required: true, value: value || '', onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx("div", { className: "search-input__placeholder", children: jsxRuntime.jsx(Text.Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize, textColor: placeholderTextColor, textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder }) }), value && (jsxRuntime.jsx(Icon.Icon, { className: clsx('search-input__clear', 'cursor_type_pointer', isActive && `fill_${iconClearFill}`), size: iconClearSize, iconFill: iconClearFill, imageSrc: iconClearSrc, SvgImage: iconClear, onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "search-input__icon-after", size: iconAfterSize, iconFill: iconAfterFill, imageSrc: iconAfterSrc, SvgImage: iconAfter })), after] }));
+                            'text', inputTextSizeClass && `text_size_${inputTextSizeClass}`, inputTextWeightClass && `text-weight_${inputTextWeightClass}`, inputTextColorClass && `text-color_${inputTextColorClass}`, inputTextStyleClass && `text-style_${inputTextStyleClass}`), type: "text", ref: ref, required: true, value: value || '', onChange: onChangeSearchInput, onFocus: onFocus, onKeyDown: onKeyDown }), jsxRuntime.jsx("div", { className: "search-input__placeholder", children: jsxRuntime.jsx(primitives.Text, { className: clsx('search-input__placeholder-value'), size: placeholderTextSize, textColor: placeholderTextColor, textStyle: placeholderTextStyle, textWeight: placeholderTextWeight, children: placeholder }) }), value && (jsxRuntime.jsx(primitives.Icon, { className: clsx('search-input__clear', 'cursor_type_pointer', isActive && `fill_${iconClearFill}`), size: iconClearSize, iconFill: iconClearFill, imageSrc: iconClearSrc, SvgImage: iconClear, onClick: onClickClearIcon }))] }), (iconAfter || iconAfterSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "search-input__icon-after", size: iconAfterSize, iconFill: iconAfterFill, imageSrc: iconAfterSrc, SvgImage: iconAfter })), after] }));
 });
 // @ts-expect-error
 SearchInput.DEFAULT_REF_STATE = {
@@ -237,7 +223,7 @@ SearchInput.DEFAULT_REF_STATE = {
 
 const SearchResult = React.forwardRef(function SearchResult(props) {
     const { className, dataTestId, dataTour, scrollHeight, before, after, children, } = props;
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { fillClass, shapeClass, shapeStrengthClass } = propsGenerator;
     return (jsxRuntime.jsx("div", { className: clsx(className, 'search-result', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`), "data-testid": dataTestId, "data-tour": dataTour, children: jsxRuntime.jsxs("div", { className: "search-result__wrapper", children: [before, React.Children.toArray(children).filter(Boolean).length && (jsxRuntime.jsx(Scrollbar.Scrollbar, { scrollHeight: scrollHeight || 300, children: children })), after] }) }));
 });

package/dist/cjs/components/Segmented.js

@@ -3,29 +3,15 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Icon = require('../../Icon_cjs_DTvdhr8B.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
-require('react-inlinesvg');
-require('../../Link_cjs_Dn7UhCYe.js');
-require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../hoc/urlWithAssetPrefix.js');
-require('../context/UrlAssetPrefix.js');
-require('../utils/mergeAppearanceKeys.js');
+require('react-inlinesvg');
 
 const segmentedAppearanceDefault = {
     defaultPrimary: {
@@ -230,8 +216,8 @@ const Segmented = (props) => {
         controlRef.current?.style.setProperty('--segmented-active-width', `${offsetWidth}px`);
         controlRef.current?.style.setProperty('--segmented-active-x-pos', `${offsetLeft}px`);
     }, [activeSegment, segmentsRefs]);
-    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, segmentedConfig, isDisabled);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, segmentedConfig, isDisabled);
+    const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, labelTextActiveColor, labelTextActiveColorHover, labelTextColor, labelTextColorHover, labelTextSize, labelTextWrap, borderColorClass, borderTypeClass, borderWidthClass, iconFill, iconFillActive, iconFillDisabled, iconSize, indicatorFillClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     return (jsxRuntime.jsx("div", { className: clsx(className, 'segmented', shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, fillClass && `fill_${fillClass}`, widthClass && `segmented_width_${widthClass}`, sizeClass && `segmented_size_${sizeClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`, isSkeleton && `segmented_skeleton`), ref: controlRef, "data-testid": dataTestId, "data-tour": dataTour, children: jsxRuntime.jsx("div", { className: "segmented__wrapper", children: jsxRuntime.jsxs("div", { className: clsx('segmented__wrapper-inner'), children: [segments?.map((item) => {
                         const isActive = activeSegment.value === item.value;
@@ -242,9 +228,9 @@ const Segmented = (props) => {
                                 : fillActiveHoverClass &&
                                     `fill_active_hover_${fillActiveHoverClass}`, isActive &&
                                 fillActiveClass &&
-                                `fill_active_${fillActiveClass}`), ref: segmentsRefs.get(item.value), onClick: () => !isDisabled && onChangeValue(item), children: jsxRuntime.jsxs("div", { className: clsx('segmented__item-label', sizeClass && `segmented_size_${sizeClass}`), children: [item.iconBefore || item.iconBeforeActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
+                                `fill_active_${fillActiveClass}`), ref: segmentsRefs.get(item.value), onClick: () => !isDisabled && onChangeValue(item), children: jsxRuntime.jsxs("div", { className: clsx('segmented__item-label', sizeClass && `segmented_size_${sizeClass}`), children: [item.iconBefore || item.iconBeforeActive ? (jsxRuntime.jsx(primitives.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
                                             ? item.iconBeforeActive || item.iconBefore
-                                            : item.iconBefore, isActive: isActive, isDisabled: isDisabled })) : null, item.label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWrap: labelTextWrap, isActive: isActive, children: item.label })), item.icon || item.iconActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive ? item.iconActive || item.icon : item.icon, isActive: isActive, isDisabled: isDisabled })) : null, item.iconAfter || item.iconAfterActive ? (jsxRuntime.jsx(Icon.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
+                                            : item.iconBefore, isActive: isActive, isDisabled: isDisabled })) : null, item.label && (jsxRuntime.jsx(primitives.Text, { size: labelTextSize, textColor: labelTextColor, textColorActive: labelTextActiveColor, textColorActiveHover: labelTextActiveColorHover, textColorHover: labelTextColorHover, textWrap: labelTextWrap, isActive: isActive, children: item.label })), item.icon || item.iconActive ? (jsxRuntime.jsx(primitives.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive ? item.iconActive || item.icon : item.icon, isActive: isActive, isDisabled: isDisabled })) : null, item.iconAfter || item.iconAfterActive ? (jsxRuntime.jsx(primitives.Icon, { className: "segmented__item-icon", iconFill: iconFill, iconFillActive: iconFillActive, iconFillDisabled: iconFillDisabled, iconSize: iconSize, SvgImage: isActive
                                             ? item.iconAfterActive || item.iconAfter
                                             : item.iconAfter, isActive: isActive, isDisabled: isDisabled })) : null] }) }, `${name}-${item.value}`));
                     }), jsxRuntime.jsx("div", { className: clsx('segmented__indicator', indicatorFillClass && `fill_${indicatorFillClass}`) })] }) }) }));

package/dist/cjs/components/Select.js

@@ -1,38 +1,23 @@
 'use strict';
 
-var SelectContainer = require('../../SelectContainer_cjs_DTIqXM5V.js');
+var SelectContainer = require('../../SelectContainer_cjs_CdxNPEhL.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
 require('react-select');
 require('react-select/creatable');
-require('../../Group_cjs_MYtD5is_.js');
-require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
+require('../../Group_cjs_CvX0cIz2.js');
+require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
-require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
-require('../../Text_cjs_erTy2pUN.js');
-require('@itcase/icons/default');
-require('../../Icon_cjs_DTvdhr8B.js');
 require('react-inlinesvg');
-require('../../Link_cjs_Dn7UhCYe.js');
-require('../hoc/urlWithAssetPrefix.js');
-require('../context/UrlAssetPrefix.js');
-require('../utils/mergeAppearanceKeys.js');
-require('../../Loader_cjs_CJpdLndn.js');
-require('../../Divider_cjs_C5Ou2Kqa.js');
+require('@itcase/icons/default');
+require('../../Loader_cjs_BgiKK0BF.js');
 
 
 

package/dist/cjs/components/Swiper.js

@@ -4,30 +4,16 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var react = require('swiper/react');
-var Group = require('../../Group_cjs_MYtD5is_.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DTvdhr8B.js');
-require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
+var Group = require('../../Group_cjs_CvX0cIz2.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 require('react-inlinesvg');
-require('../../Link_cjs_Dn7UhCYe.js');
-require('../hoc/urlWithAssetPrefix.js');
-require('../context/UrlAssetPrefix.js');
-require('../utils/mergeAppearanceKeys.js');
 
 function Swiper(props) {
     const { id, className, dataTestId, dataTour, direction, minZoom = 1, maxZoom = 5, title, titleAfter, titleSize, titleTextColor, titleWeight, activeSlideIndex = 0, allowTouchMove, autoHeight, breakpoints, forwardedRef, freeMode, items, keyboard, loop, modules, mousewheel, nextButton, normalizeSlideIndex, pagination, prevButton, preventClicks, preventClicksPropagation, simulateTouch, slidesPerView, spaceBetween, speed, swiperClass, swiperSlideClass, isChangeOnClickSlide, isInit, isNavigation = false, isScrollbar, isShowOriginalLink = false, isZoomEnabled = false, setNextBtnDisabled, setPrevBtnDisabled, onSlideNextTransitionEnd, onSlidePrevTransitionEnd, onSwiper, onUpdate, children, } = props;
@@ -72,15 +58,15 @@ function Swiper(props) {
             isMountedRef.current = true;
         }
     }, [activeSlideIndex]);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { alignClass, alignDirectionClass, fillClass, shapeClass } = propsGenerator;
-    const { styles: style } = useStyles.useStyles(props);
-    return (jsxRuntime.jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), "data-testid": dataTestId, "data-tour": dataTour, style: style, children: [title && (jsxRuntime.jsxs("div", { className: "swiper-block__wrapper", children: [title && (jsxRuntime.jsx(Icon.Title, { className: "swiper-block__title", size: titleSize, textColor: titleTextColor, textWeight: titleWeight, children: title })), titleAfter] })), prevButton && nextButton && (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { className: "swiper-block__prev swiper-button", ref: prevRef, children: prevButton }), jsxRuntime.jsx("div", { className: "swiper-block__next swiper-button", ref: nextRef, children: nextButton })] })), jsxRuntime.jsx(react.Swiper, { className: clsx('swiper-block__swiper', swiperClass), ref: swiperRef, direction: direction, allowTouchMove: allowTouchMove, autoHeight: autoHeight ?? false, breakpoints: breakpoints, centeredSlides: true, freeMode: freeMode, init: isInit ?? true, keyboard: keyboard, loop: isLoop, modules: modules, mousewheel: mousewheel, navigation: isNavigation ? { nextEl, prevEl } : false, normalizeSlideIndex: normalizeSlideIndex, pagination: pagination, preventClicks: preventClicks, preventClicksPropagation: preventClicksPropagation, scrollbar: isScrollbar, simulateTouch: simulateTouch, slidesPerView: slidesPerView, spaceBetween: spaceBetween, speed: speed ?? 500, zoom: {
+    const { styles: style } = primitives.useStyles(props);
+    return (jsxRuntime.jsxs("div", { id: id, className: clsx('swiper-block', slidesPerView === 'auto' && 'swiper-block_type_auto', fillClass && `fill_${fillClass}`, shapeClass && `swiper_shape_${shapeClass}`, className), "data-testid": dataTestId, "data-tour": dataTour, style: style, children: [title && (jsxRuntime.jsxs("div", { className: "swiper-block__wrapper", children: [title && (jsxRuntime.jsx(primitives.Title, { className: "swiper-block__title", size: titleSize, textColor: titleTextColor, textWeight: titleWeight, children: title })), titleAfter] })), prevButton && nextButton && (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsx("div", { className: "swiper-block__prev swiper-button", ref: prevRef, children: prevButton }), jsxRuntime.jsx("div", { className: "swiper-block__next swiper-button", ref: nextRef, children: nextButton })] })), jsxRuntime.jsx(react.Swiper, { className: clsx('swiper-block__swiper', swiperClass), ref: swiperRef, direction: direction, allowTouchMove: allowTouchMove, autoHeight: autoHeight ?? false, breakpoints: breakpoints, centeredSlides: true, freeMode: freeMode, init: isInit ?? true, keyboard: keyboard, loop: isLoop, modules: modules, mousewheel: mousewheel, navigation: isNavigation ? { nextEl, prevEl } : false, normalizeSlideIndex: normalizeSlideIndex, pagination: pagination, preventClicks: preventClicks, preventClicksPropagation: preventClicksPropagation, scrollbar: isScrollbar, simulateTouch: simulateTouch, slidesPerView: slidesPerView, spaceBetween: spaceBetween, speed: speed ?? 500, zoom: {
                     minRatio: minZoom,
                     maxRatio: maxZoom,
                     toggle: true,
                 }, onInit: onInitSwiper, onSlideChange: onSlideChange, onSlideNextTransitionEnd: onSlideNextTransitionEnd, onSlidePrevTransitionEnd: onSlidePrevTransitionEnd, onSwiper: onSwiper, onTransitionStart: onTransitionStart, onUpdate: onUpdate, children: children ||
-                    items?.map((item, i) => (jsxRuntime.jsx(react.SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsxRuntime.jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsxRuntime.jsx(Group.Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsxRuntime.jsx(Text.Text, { size: "s", textColor: "surfaceTextPrimary", textColorHover: "surfaceTextQuaternary", onClick: onClickShowOriginalButton, children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043E\u0440\u0438\u0433\u0438\u043D\u0430\u043B" }) }))] }));
+                    items?.map((item, i) => (jsxRuntime.jsx(react.SwiperSlide, { className: clsx('swiper-block__item', isZoomEnabled && 'swiper-block__item_zooming', swiperSlideClass, alignDirectionClass && `align_${alignDirectionClass}`, alignClass && `align_${alignClass}`), children: isZoomEnabled ? (jsxRuntime.jsx("div", { className: "swiper-zoom-container", children: item })) : (item) }, `swiper-slide_${i}`))) }), isShowOriginalLink && (jsxRuntime.jsx(Group.Group, { width: "fill", fill: "surfacePrimary", padding: "1m 0", children: jsxRuntime.jsx(primitives.Text, { size: "s", textColor: "surfaceTextPrimary", textColorHover: "surfaceTextQuaternary", onClick: onClickShowOriginalButton, children: "\u041F\u043E\u043A\u0430\u0437\u0430\u0442\u044C \u043E\u0440\u0438\u0433\u0438\u043D\u0430\u043B" }) }))] }));
 }
 const useSwiperRef = () => {
     const [wrapper, setWrapper] = React.useState(null);

package/dist/cjs/components/Switch.js

@@ -3,23 +3,15 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
-require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
+require('react-inlinesvg');
 
 const switchAppearanceDefault = {
     defaultPrimary: {
@@ -128,10 +120,10 @@ const switchConfig = {
 };
 const Switch = React.forwardRef(function Switch(props, ref) {
     const { id, appearance, className, dataTestId, dataTour, align = 'left', title, desc, isActive, isDisabled, onChange, } = props;
-    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, switchConfig, isDisabled);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, switchConfig, isDisabled);
+    const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { size, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, fillToggleActiveClass, fillToggleActiveHoverClass, fillToggleClass, fillToggleHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, widthClass, } = propsGenerator;
-    return (jsxRuntime.jsxs("div", { className: clsx('switch', className, widthClass && `width_${widthClass}`, align && `switch_align_${align}`, size && `switch_size_${size}`), "data-testid": dataTestId, "data-tour": dataTour, children: [jsxRuntime.jsxs("div", { className: "switch__wrapper", children: [title && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsxRuntime.jsx(Text.Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc }))] }), jsxRuntime.jsxs("div", { className: 'switch__item', children: [jsxRuntime.jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", ref: ref, checked: isActive, disabled: isDisabled, onChange: onChange }), jsxRuntime.jsx("div", { className: clsx('switch__bg', !isActive
+    return (jsxRuntime.jsxs("div", { className: clsx('switch', className, widthClass && `width_${widthClass}`, align && `switch_align_${align}`, size && `switch_size_${size}`), "data-testid": dataTestId, "data-tour": dataTour, children: [jsxRuntime.jsxs("div", { className: "switch__wrapper", children: [title && (jsxRuntime.jsx(primitives.Text, { className: clsx('switch__title'), size: titleTextSize, textColor: titleTextColor, children: title })), desc && (jsxRuntime.jsx(primitives.Text, { className: clsx('switch__desc'), size: descTextSize, textColor: descTextColor, children: desc }))] }), jsxRuntime.jsxs("div", { className: 'switch__item', children: [jsxRuntime.jsx("input", { id: id, className: "switch__checkbox", type: "checkbox", ref: ref, checked: isActive, disabled: isDisabled, onChange: onChange }), jsxRuntime.jsx("div", { className: clsx('switch__bg', !isActive
                             ? fillClass && `fill_${fillClass}`
                             : fillActiveClass && `fill_active_${fillActiveClass}`, !isActive
                             ? fillHoverClass && `fill_hover_${fillHoverClass}`

package/dist/cjs/components/Tab.js

@@ -3,32 +3,17 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
-var mergeAppearanceKeys = require('../utils/mergeAppearanceKeys.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 var useActiveClasses = require('../hooks/useActiveClasses/useActiveClasses.js');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
-var useStyles = require('../hooks/useStyles/useStyles.js');
-var Icon = require('../../Icon_cjs_DTvdhr8B.js');
-var Divider = require('../../Divider_cjs_C5Ou2Kqa.js');
-var Link = require('../../Link_cjs_Dn7UhCYe.js');
-var Text = require('../../Text_cjs_erTy2pUN.js');
-require('../hooks/useActiveClasses/useActiveClasses.helpers.js');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
 require('lodash/maxBy');
 require('react-inlinesvg');
-require('../hoc/urlWithAssetPrefix.js');
-require('../context/UrlAssetPrefix.js');
+require('../hooks/useActiveClasses/useActiveClasses.helpers.js');
 
 const tabAppearanceError = {
     errorPrimary: {
@@ -209,23 +194,23 @@ const tabConfig = {
 };
 function Tab(props) {
     const { appearance, className, dataTestId, dataTour, label, badgeValue, href, link, rel, target, before, after, isActive = false, isDisabled = false, isSkeleton, onClick, onMouseEnter, children, } = props;
-    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, tabConfig, isDisabled);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, tabConfig, isDisabled);
+    const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { rootClasses } = useActiveClasses.useActiveClasses({
         propsGenerator: propsGenerator,
         isActive: isActive,
         isDisabled: isDisabled,
     });
     const { justifyContentClass, alignClass, labelTextAlign, labelTextColor, labelTextColorActive, labelTextColorHover, labelTextSize, labelTextStyle, labelTextWeight, labelTextWrap, badgeAppearance, badgeAppearanceSize, badgeShape, badgeSize, badgeTextColor, badgeTextSize, dividerFill, dividerFillActive, dividerFillActiveHover, dividerFillDisabled, dividerFillHover, dividerSize, icon, iconFill, iconFillIcon, iconFillSize, iconShape, iconSize, iconSrc, linkFill, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    const { styles: tab } = useStyles.useStyles(props);
-    return (jsxRuntime.jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `tab_skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(Link.Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (jsxRuntime.jsx(Text.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (jsxRuntime.jsx(Icon.Badge, { appearance: mergeAppearanceKeys.mergeAppearanceKeys(badgeAppearance, badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(Icon.Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), jsxRuntime.jsx(Divider.Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
+    const { styles: tab } = primitives.useStyles(props);
+    return (jsxRuntime.jsx("div", { className: clsx('tab', className, rootClasses, isActive && 'tab_state_active', isDisabled && 'tab_state_disabled', sizeClass && `tab_size_${sizeClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, widthClass && `width_${widthClass}`, justifyContentClass && `tab_justify-content_${justifyContentClass}`, isSkeleton && `tab_skeleton`, onClick && 'cursor_type_pointer'), "data-testid": dataTestId && `${dataTestId}Tab`, "data-tour": dataTour, style: tab, onClick: onClick, onMouseEnter: onMouseEnter, children: jsxRuntime.jsxs(primitives.Link, { className: clsx('tab__link', !isDisabled && 'cursor_type_pointer'), fill: linkFill, href: link || href, rel: rel, target: target, children: [before, children || (jsxRuntime.jsxs(React.Fragment, { children: [jsxRuntime.jsxs("div", { className: clsx('tab__wrapper', alignClass && `align_${alignClass}`), children: [label && (jsxRuntime.jsx(primitives.Text, { className: "tab__label", size: labelTextSize, textAlign: labelTextAlign, textColor: labelTextColor, textColorActive: labelTextColorActive, textColorHover: labelTextColorHover, textStyle: labelTextStyle, textWeight: labelTextWeight, textWrap: labelTextWrap, isActive: isActive, isDisabled: isDisabled, children: label })), Boolean(badgeValue) && (jsxRuntime.jsx(primitives.Badge, { appearance: primitives.mergeAppearanceKeys(badgeAppearance, badgeAppearanceSize), size: badgeSize, textColor: badgeTextColor, textSize: badgeTextSize, shape: badgeShape, value: badgeValue })), (icon || iconSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "tab__icon_after", fill: iconFill, fillSize: iconFillSize, iconFill: iconFillIcon, iconSize: iconSize, imageSrc: iconSrc, shape: iconShape, SvgImage: icon }))] }), jsxRuntime.jsx(primitives.Divider, { className: "tab__divider", width: "fill", direction: "horizontal", size: dividerSize, fill: dividerFill, fillActive: dividerFillActive, fillActiveHover: dividerFillActiveHover, fillDisabled: dividerFillDisabled, fillHover: dividerFillHover, zIndex: "1", isActive: isActive, isDisabled: isDisabled })] })), after] }) }));
 }
 
 function TabGroup(props) {
     const { className, dataTestId, dataTour, horizontalScroll, style, tabAppearance, tabList, children, } = props;
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props);
+    const propsGenerator = primitives.useDevicePropsGenerator(props);
     const { directionClass, alignClass, alignDirectionClass, fillClass, borderColorClass, borderTypeClass, borderWidthClass, widthClass, wrapClass, } = propsGenerator;
-    const { styles: groupStyles, wrapper: groupWrapperStyles } = useStyles.useStyles(props);
+    const { styles: groupStyles, wrapper: groupWrapperStyles } = primitives.useStyles(props);
     return (jsxRuntime.jsx("div", { className: clsx(className, 'tab-group', 'group', widthClass && `width_${widthClass}`, alignDirectionClass && `align_${alignDirectionClass}`, directionClass && `group_direction_${directionClass}`, alignClass && `align_${alignClass}`, fillClass && `fill_${fillClass}`, horizontalScroll && 'group_scroll_horizontal', wrapClass && `group_wrap_${wrapClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderTypeClass && `border_type_${borderTypeClass}`), "data-testid": dataTestId, "data-tour": dataTour, style: Object.assign({}, groupStyles, style), children: horizontalScroll ? (jsxRuntime.jsxs("div", { className: "tab-group__wrapper", style: groupWrapperStyles, children: [tabList?.map((item) => (jsxRuntime.jsx(Tab, { appearance: tabAppearance, label: item.label, isActive: item.isActive }, item.key))), children] })) : (jsxRuntime.jsxs(React.Fragment, { children: [tabList?.map((item) => (jsxRuntime.jsx(Tab, { appearance: tabAppearance, label: item.label, badgeValue: item.badgeValue, icon: item.icon, iconSrc: item.icon, isActive: item.isActive, onClick: item.onClick }, item.key))), children] })) }));
 }
 

package/dist/cjs/components/Text.js

@@ -1,28 +1,20 @@
 'use strict';
 
-var Text = require('../../Text_cjs_erTy2pUN.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('react/jsx-runtime');
-require('clsx');
-require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
 require('react');
-require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
+require('clsx');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
-require('../hooks/useStyles/useStyles.js');
 require('lodash/maxBy');
+require('react-inlinesvg');
 
 
 
-exports.Text = Text.Text;
-exports.textAppearance = Text.textAppearance;
-exports.textConfig = Text.textConfig;
+exports.Text = primitives.Text;
+exports.textAppearance = primitives.textAppearance;
+exports.textConfig = primitives.textConfig;

package/dist/cjs/components/Textarea.js

@@ -2,21 +2,16 @@
 
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
-var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
-var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
+var primitives = require('../../primitives_cjs_DX--6Yn5.js');
 require('react');
 require('lodash/camelCase');
 require('lodash/castArray');
 require('lodash/upperFirst');
-require('../context/Notifications.js');
 require('uuid');
 require('@itcase/common');
-require('../context/UIContext.js');
-require('../hooks/useMediaQueries/useMediaQueries.js');
 require('react-responsive');
-require('../utils/setViewportProperty.js');
-require('../hooks.js');
-require('../hooks/useStyles/styleAttributes.js');
+require('lodash/maxBy');
+require('react-inlinesvg');
 
 const textareaAppearanceDefault = {
     defaultPrimary: {
@@ -215,8 +210,8 @@ const textareaConfig = {
 };
 function Textarea(props) {
     const { id, appearance, className, dataTestId, dataTour, name, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
-    const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, textareaConfig, isDisabled);
-    const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
+    const appearanceConfig = primitives.useAppearanceConfig(appearance, textareaConfig, isDisabled);
+    const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, borderColorClass, borderHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
     return (jsxRuntime.jsx("div", { className: clsx('textarea', className, sizeClass && `textarea_size_${sizeClass}`), "data-tour": dataTour, children: jsxRuntime.jsx("textarea", { id: id, className: clsx('textarea__input', (textSizeClass || textColorClass || textWeightClass) && 'text', caretClass && `caret-color_${caretClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_hover_${fillHoverClass}`, borderColorClass && `border-color_${borderColorClass}`, borderWidthClass && `border-width_${borderWidthClass}`, borderHoverClass && `border-color_hover_${borderHoverClass}`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`, placeholderTextColorClass &&
                 `placeholder-text-color_${placeholderTextColorClass}`, textSizeClass && `text_size_${textSizeClass}`, textColorClass && `text-color_${textColorClass}`, textWeightClass && `text-weight_${textWeightClass}`, widthClass && `width_${widthClass}`), "data-testid": dataTestId || (name ? `${name}-textarea` : 'textarea'), disabled: isDisabled, placeholder: placeholder, value: value, onBlur: onBlur, onChange: onChange, onFocus: onFocus, onKeyDown: onKeyDown }) }));