@itcase/ui 1.9.71 → 1.9.72

package/dist/cjs/components/Cell.js

@@ -151,7 +151,7 @@ const cellConfig = {
     },
 };
 function Cell(props) {
-    const { appearance, className, dataTestId, dataTour, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
+    const { appearance, className, isSkeleton, dataTestId, dataTour, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
     const appearanceConfig = primitives.useAppearanceConfig(appearance, cellConfig);
     const propsGenerator = primitives.useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, titleIconFill, titleIconFillHover, titleIconFillSize, titleIconItemFill, titleIconShape, titleIconSrc, titleLabelAppearance, titleLabelAppearanceSize, titleLabelShape, titleLabelSize, titleLabelTextSize, titleTextColor, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWrap, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, reverseClass, shapeClass, sizeClass, valueIconFill, valueIconFillHover, valueIconFillSize, valueIconItemFill, valueIconShape, valueIconSrc, valueLabel, valueLabelAppearance, valueLabelAppearanceSize, valueLabelShape, valueLabelSize, valueLabelTextSize, valueTextAlign, valueTextColor, valueTextSize, valueTextTruncate, valueTextWeight, valueTextWrap, widthClass, zeroGap, zeroPadding, } = propsGenerator;
@@ -167,7 +167,7 @@ function Cell(props) {
             ? borderColorHoverClass &&
                 `border-color_hover_${borderColorHoverClass}`
             : borderColorActiveHoverClass &&
-                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), "data-testid": dataTestId, "data-tour": dataTour, style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(primitives.Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsxRuntime.jsx(Label.Label, { appearance: primitives.mergeAppearanceKeys(titleLabelAppearance, titleLabelAppearanceSize), className: "cell__title-label", size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(primitives.Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsxRuntime.jsx(Label.Label, { appearance: primitives.mergeAppearanceKeys(valueLabelAppearance, valueLabelAppearanceSize), className: "cell__value-label", size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
+                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, isSkeleton && `cell_skeleton`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), "data-testid": dataTestId, "data-tour": dataTour, style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsxRuntime.jsx("div", { className: "cell__before", children: before }), jsxRuntime.jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(primitives.Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsxRuntime.jsx(Label.Label, { appearance: primitives.mergeAppearanceKeys(titleLabelAppearance, titleLabelAppearanceSize), className: "cell__title-label", size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxRuntime.jsxs("div", { className: "cell__data", style: dataStyles, children: [jsxRuntime.jsx(primitives.Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsxRuntime.jsx(primitives.Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsxRuntime.jsx(Label.Label, { appearance: primitives.mergeAppearanceKeys(valueLabelAppearance, valueLabelAppearanceSize), className: "cell__value-label", size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsxRuntime.jsx("div", { className: "cell__after", children: after })] }));
 }
 
 exports.Cell = Cell;

package/dist/cjs/components/Textarea.js

@@ -209,11 +209,11 @@ const textareaConfig = {
     },
 };
 function Textarea(props) {
-    const { id, appearance, className, dataTestId, dataTour, name, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
+    const { id, appearance, className, dataTestId, dataTour, name, placeholder, value, isActive, isDisabled, isSkeleton, onBlur, onChange, onFocus, onKeyDown, } = props;
     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 &&
+    return (jsxRuntime.jsx("div", { className: clsx('textarea', className, sizeClass && `textarea_size_${sizeClass}`, isSkeleton && `textarea_skeleton`, isActive && `textarea_active`), "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 }) }));
 }
 

package/dist/cjs/components/Video.js

@@ -14,9 +14,9 @@ require('lodash/maxBy');
 require('react-inlinesvg');
 
 function Video(props) {
-    const { id, className, dataTestId, dataTour, position, mp4, ogv, poster, webm, children, } = props;
+    const { id, className, dataTestId, dataTour, position, mp4, ogv, poster, webm, isSkeleton, children, } = props;
     const { styles: videoStyles } = primitives.useStyles(props);
-    return (jsxRuntime.jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, position && `video_position_${position}`), "data-testid": dataTestId, "data-tour": dataTour, style: videoStyles, children: [jsxRuntime.jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsxRuntime.jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsxRuntime.jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsxRuntime.jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
+    return (jsxRuntime.jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, isSkeleton && `video_skeleton`, position && `video_position_${position}`), "data-testid": dataTestId, "data-tour": dataTour, style: videoStyles, children: [jsxRuntime.jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsxRuntime.jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsxRuntime.jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsxRuntime.jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
 }
 
 exports.Video = Video;

package/dist/components/Cell.js

@@ -149,7 +149,7 @@ const cellConfig = {
     },
 };
 function Cell(props) {
-    const { appearance, className, dataTestId, dataTour, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
+    const { appearance, className, isSkeleton, dataTestId, dataTour, title, titleIcon, titleLabel, titleTag, showTitleLabel, showValueLabel, value, valueIcon, valueTag, before, after, isActive, isEqual, isSameWidth, onClick, onMouseEnter, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, cellConfig);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { directionClass, fillActiveClass, fillActiveHoverClass, fillClass, fillHoverClass, titleIconFill, titleIconFillHover, titleIconFillSize, titleIconItemFill, titleIconShape, titleIconSrc, titleLabelAppearance, titleLabelAppearanceSize, titleLabelShape, titleLabelSize, titleLabelTextSize, titleTextColor, titleTextSize, titleTextTruncate, titleTextWeight, titleTextWrap, borderColorActiveClass, borderColorActiveHoverClass, borderColorClass, borderColorHoverClass, reverseClass, shapeClass, sizeClass, valueIconFill, valueIconFillHover, valueIconFillSize, valueIconItemFill, valueIconShape, valueIconSrc, valueLabel, valueLabelAppearance, valueLabelAppearanceSize, valueLabelShape, valueLabelSize, valueLabelTextSize, valueTextAlign, valueTextColor, valueTextSize, valueTextTruncate, valueTextWeight, valueTextWrap, widthClass, zeroGap, zeroPadding, } = propsGenerator;
@@ -165,7 +165,7 @@ function Cell(props) {
             ? borderColorHoverClass &&
                 `border-color_hover_${borderColorHoverClass}`
             : borderColorActiveHoverClass &&
-                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), "data-testid": dataTestId, "data-tour": dataTour, style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { appearance: mergeAppearanceKeys(titleLabelAppearance, titleLabelAppearanceSize), className: "cell__title-label", size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { appearance: mergeAppearanceKeys(valueLabelAppearance, valueLabelAppearanceSize), className: "cell__value-label", size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
+                `border-color_active_hover_${borderColorActiveHoverClass}`, reverseClass && `cell_reverse_${reverseClass}`, shapeClass && `cell_shape_${shapeClass}`, widthClass && `width_${widthClass}`, isSkeleton && `cell_skeleton`, zeroPadding && 'cell_reset-padding', zeroGap && 'cell_reset-gap'), "data-testid": dataTestId, "data-tour": dataTour, style: cellStyles, onClick: onClick, onMouseEnter: onMouseEnter, children: [before && jsx("div", { className: "cell__before", children: before }), jsxs("div", { className: clsx('cell__wrapper', directionClass && `cell__wrapper_direction_${directionClass}`, isEqual && 'cell__wrapper-equal', isSameWidth && 'cell__wrapper-same-width'), children: [title && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__title", size: titleTextSize, textColor: titleTextColor, textTruncate: titleTextTruncate, textWeight: titleTextWeight, textWrap: titleTextWrap, tag: titleTag, children: title }), (titleIcon || titleIconSrc) && (jsx(Icon, { className: "cell__title-icon", fill: titleIconFill, fillSize: titleIconFillSize, iconFill: titleIconItemFill, iconFillHover: titleIconFillHover, imageSrc: titleIconSrc, shape: titleIconShape, SvgImage: titleIcon })), (showTitleLabel || titleLabel) && (jsx(Label, { appearance: mergeAppearanceKeys(titleLabelAppearance, titleLabelAppearanceSize), className: "cell__title-label", size: titleLabelSize, label: titleLabel, labelTextSize: titleLabelTextSize, shape: titleLabelShape }))] })), value && (jsxs("div", { className: "cell__data", style: dataStyles, children: [jsx(Text, { className: "cell__value", size: valueTextSize, textAlign: valueTextAlign, textColor: valueTextColor, textTruncate: valueTextTruncate, textWeight: valueTextWeight, textWrap: valueTextWrap, tag: valueTag, children: value }), (valueIcon || valueIconSrc) && (jsx(Icon, { className: "cell__value-icon", fill: valueIconFill, fillSize: valueIconFillSize, iconFill: valueIconItemFill, iconFillHover: valueIconFillHover, imageSrc: valueIconSrc, shape: valueIconShape, SvgImage: valueIcon })), (showValueLabel || valueLabel) && (jsx(Label, { appearance: mergeAppearanceKeys(valueLabelAppearance, valueLabelAppearanceSize), className: "cell__value-label", size: valueLabelSize, label: valueLabel, labelTextSize: valueLabelTextSize, shape: valueLabelShape }))] }))] }), after && jsx("div", { className: "cell__after", children: after })] }));
 }
 
 export { Cell, cellAppearance, cellConfig };

package/dist/components/Textarea.js

@@ -207,11 +207,11 @@ const textareaConfig = {
     },
 };
 function Textarea(props) {
-    const { id, appearance, className, dataTestId, dataTour, name, placeholder, value, isDisabled, onBlur, onChange, onFocus, onKeyDown, } = props;
+    const { id, appearance, className, dataTestId, dataTour, name, placeholder, value, isActive, isDisabled, isSkeleton, onBlur, onChange, onFocus, onKeyDown, } = props;
     const appearanceConfig = useAppearanceConfig(appearance, textareaConfig, isDisabled);
     const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
     const { fillClass, fillHoverClass, borderColorClass, borderHoverClass, borderWidthClass, textColorClass, textSizeClass, textWeightClass, caretClass, placeholderTextColorClass, shapeClass, shapeStrengthClass, sizeClass, widthClass, } = propsGenerator;
-    return (jsx("div", { className: clsx('textarea', className, sizeClass && `textarea_size_${sizeClass}`), "data-tour": dataTour, children: 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 &&
+    return (jsx("div", { className: clsx('textarea', className, sizeClass && `textarea_size_${sizeClass}`, isSkeleton && `textarea_skeleton`, isActive && `textarea_active`), "data-tour": dataTour, children: 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 }) }));
 }
 

package/dist/components/Video.js

@@ -12,9 +12,9 @@ import 'lodash/maxBy';
 import 'react-inlinesvg';
 
 function Video(props) {
-    const { id, className, dataTestId, dataTour, position, mp4, ogv, poster, webm, children, } = props;
+    const { id, className, dataTestId, dataTour, position, mp4, ogv, poster, webm, isSkeleton, children, } = props;
     const { styles: videoStyles } = useStyles(props);
-    return (jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, position && `video_position_${position}`), "data-testid": dataTestId, "data-tour": dataTour, style: videoStyles, children: [jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
+    return (jsxs("div", { id: id, className: clsx('video', className, poster && `video_poster`, isSkeleton && `video_skeleton`, position && `video_position_${position}`), "data-testid": dataTestId, "data-tour": dataTour, style: videoStyles, children: [jsxs("video", { className: "video__wrapper", autoPlay: true, loop: true, muted: true, playsInline: false, poster: poster, children: [webm && jsx("source", { type: 'video/webm; codecs="vp8, vorbis"', src: webm }), ogv && jsx("source", { type: 'video/ogg; codecs="theora, vorbi"', src: ogv }), mp4 && (jsx("source", { type: 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"', src: mp4 }))] }), children] }));
 }
 
 export { Video };

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

@@ -0,0 +1,3 @@
+import { AccordionItemAppearance } from './Accordion.interface';
+declare const accordionAppearance: AccordionItemAppearance;
+export { accordionAppearance };

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

@@ -0,0 +1,3 @@
+import type { AccordionProps } from './Accordion.interface';
+declare function Accordion(props: AccordionProps): import("react/jsx-runtime").JSX.Element;
+export { Accordion };

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

@@ -0,0 +1,99 @@
+import type { CSSProperties, ReactNode } from 'react';
+import { AppearanceKeysDefault, AppearanceShapeKey, CompositeAppearanceKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorProps, DirectionProps, FillHoverProps, FillProps, HeightProps, ShapeProps, ShapeStrengthProps, SizeProps, WidthProps } from '@itcase/types-ui';
+import type { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
+import { BadgeProps } from '../Badge/Badge.interface';
+import { DividerProps } from '../Divider/Divider.interface';
+import { IconProps } from '../Icon/Icon.interface';
+import { TextProps } from '../Text/Text.interface';
+import { TitleProps } from '../Title/Title.interface';
+type AccordionAppearanceProps = {
+    borderColor?: BorderColorProps;
+    fill?: FillProps;
+    shape?: ShapeProps;
+    shapeStrength?: ShapeStrengthProps;
+};
+type AccordionProps = AccordionAppearanceProps & StyleAttributes & {
+    appearance?: AccordionItemProps['appearance'];
+    children?: ReactNode;
+    className?: string;
+    dataTestId?: string;
+    dataTour?: string;
+    initial?: Array<string | null>;
+    isMultiple?: boolean;
+    items?: Omit<AccordionItemEventData, 'isExpanded'>[];
+    onClickItem?: (item: AccordionItemEventData) => void;
+};
+type AccordionItemEventData = {
+    id: string;
+    content: ReactNode;
+    isExpanded: boolean;
+    title: string;
+};
+type AccordionItemAppearanceProps = {
+    badgeAppearance?: BadgeProps['appearance'];
+    badgeAppearanceSize?: AppearanceSizeKey;
+    badgeShape?: BadgeProps['shape'];
+    badgeSize?: BadgeProps['size'];
+    badgeTextColor?: BadgeProps['textColor'];
+    badgeTextSize?: BadgeProps['textSize'];
+    badgeValue?: BadgeProps['value'];
+    borderColor?: BorderColorProps;
+    contentTextColor?: TextProps['textColor'];
+    contentTextSize?: TextProps['size'];
+    contentTextWeight?: TextProps['textWeight'];
+    direction?: DirectionProps;
+    dividerDirection?: DividerProps['direction'];
+    dividerFill?: DividerProps['fill'];
+    dividerSize?: DividerProps['size'];
+    fill?: FillProps;
+    fillHover?: FillHoverProps;
+    height?: HeightProps;
+    icon?: IconProps['SvgImage'];
+    iconFill?: IconProps['fill'];
+    iconFillIcon?: IconProps['iconFill'];
+    iconFillSize?: IconProps['fillSize'];
+    iconShape?: IconProps['shape'];
+    iconSize?: IconProps['iconSize'];
+    iconSrc?: IconProps['imageSrc'];
+    isMultiple?: boolean;
+    labelTextColor?: TextProps['textColor'];
+    shape?: ShapeProps;
+    shapeDesktop?: ShapeProps;
+    shapeMobile?: ShapeProps;
+    shapeStrength?: ShapeStrengthProps;
+    shapeTablet?: ShapeProps;
+    showDivider?: boolean;
+    size?: SizeProps;
+    titleBorderColor?: TitleProps['borderColor'];
+    titleFill?: TitleProps['fill'];
+    titleFillHover?: TitleProps['fillHover'];
+    titleTextColor?: TitleProps['textColor'];
+    titleTextSize?: TextProps['size'];
+    titleTextWeight?: TitleProps['textWeight'];
+    titleWidth?: TitleProps['textWeight'];
+    width?: WidthProps;
+    zeroGap?: boolean;
+    zeroPadding?: boolean;
+};
+type AccordionItemProps = AccordionItemAppearanceProps & StyleAttributes & {
+    id?: string | null;
+    afterContent?: ReactNode;
+    appearance?: CompositeAppearanceKey;
+    beforeContent?: ReactNode;
+    children?: ReactNode;
+    className?: string;
+    content?: ReactNode;
+    isExpanded?: boolean;
+    onClick?: (item: AccordionItemEventData) => void;
+    style?: CSSProperties;
+    title?: string;
+};
+type AccordionItemAppearanceKey = AppearanceKeysDefault | AppearanceShapeKey | AppearanceSizeKey | AppearanceStyleKey;
+type AccordionItemAppearance = {
+    [key in AccordionItemAppearanceKey]?: AccordionItemAppearanceProps;
+};
+type AccordionItemConfig = {
+    appearance: AccordionItemAppearance;
+    setAppearance: (appearanceConfig: AccordionItemAppearance) => void;
+};
+export type { AccordionItemAppearance, AccordionItemConfig, AccordionItemEventData, AccordionItemProps, AccordionProps, };

package/dist/types/components/Accordion/AccordionItem.d.ts

@@ -0,0 +1,4 @@
+import type { AccordionItemConfig, AccordionItemProps } from './Accordion.interface';
+declare const accordionItemConfig: AccordionItemConfig;
+declare function AccordionItem(props: AccordionItemProps): import("react/jsx-runtime").JSX.Element;
+export { AccordionItem, accordionItemConfig };

package/dist/types/components/Accordion/appearance/accordionSize.d.ts

@@ -0,0 +1,3 @@
+import { AccordionItemAppearance } from '../Accordion.interface';
+declare const accordionAppearanceSize: AccordionItemAppearance;
+export { accordionAppearanceSize };

package/dist/types/components/Accordion/appearance/accordionStyle.d.ts

@@ -0,0 +1,3 @@
+import { AccordionItemAppearance } from '../Accordion.interface';
+declare const accordionAppearanceStyle: AccordionItemAppearance;
+export { accordionAppearanceStyle };

package/dist/types/components/Accordion/appearance/accordionSurface.d.ts

@@ -0,0 +1,3 @@
+import { AccordionItemAppearance } from '../Accordion.interface';
+declare const accordionAppearanceSurface: AccordionItemAppearance;
+export { accordionAppearanceSurface };

package/dist/types/components/Accordion/index.d.ts

@@ -0,0 +1,5 @@
+import { Accordion } from './Accordion';
+import { accordionAppearance } from './Accordion.appearance';
+import { AccordionItem, accordionItemConfig } from './AccordionItem';
+export { Accordion, accordionAppearance, AccordionItem, accordionItemConfig };
+export type { AccordionItemAppearance, AccordionItemConfig, AccordionItemEventData, AccordionItemProps, AccordionProps, } from './Accordion.interface';

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

@@ -0,0 +1,3 @@
+import { AvatarAppearance } from './Avatar.interface';
+declare const avatarAppearance: AvatarAppearance;
+export { avatarAppearance };

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

@@ -0,0 +1,4 @@
+import type { AvatarConfig, AvatarProps } from './Avatar.interface';
+declare const avatarConfig: AvatarConfig;
+declare function Avatar(props: AvatarProps): import("react/jsx-runtime").JSX.Element;
+export { Avatar, avatarConfig };

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

@@ -0,0 +1,58 @@
+import { CSSProperties, ReactNode } from 'react';
+import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizePxKey, AppearanceStyleKey, BorderColorProps, CompositeAppearanceKey, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizePXProps } from '@itcase/types-ui';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
+import { BadgeProps } from '../Badge/Badge.interface';
+import { IconProps } from '../Icon/Icon.interface';
+import { TextProps } from '../Text/Text.interface';
+type AvatarAppearanceProps = {
+    badge?: boolean;
+    badgeAppearance?: BadgeProps['appearance'];
+    badgeShape?: BadgeProps['shape'];
+    badgeSize?: BadgeProps['size'];
+    badgeTextColor?: BadgeProps['textColor'];
+    badgeTextSize?: BadgeProps['textSize'];
+    badgeValue?: BadgeProps['value'];
+    borderColor?: BorderColorProps;
+    fill?: FillProps;
+    fillHover?: FillHoverProps;
+    icon?: IconProps['SvgImage'];
+    iconFill?: IconProps['fill'];
+    iconFillHover?: IconProps['fillHover'];
+    iconFillSize?: IconProps['fillSize'];
+    iconItemFill?: IconProps['iconFill'];
+    iconShape?: IconProps['shape'];
+    iconSize?: IconProps['iconSize'];
+    iconSrc?: string;
+    placeholderUrl?: string;
+    shape?: ShapeProps;
+    shapeStrength?: ShapeStrengthProps;
+    size?: SizePXProps;
+    textColor?: TextProps['textColor'];
+    textSize?: TextProps['size'];
+    textWeight?: TextProps['textWeight'];
+};
+type AvatarProps = AvatarAppearanceProps & StyleAttributes & {
+    after?: string;
+    appearance?: CompositeAppearanceKey;
+    before?: string;
+    children?: ReactNode;
+    className?: string;
+    count?: number | string;
+    dataTestId?: string;
+    dataTour?: string;
+    firstName?: string;
+    isSkeleton?: boolean;
+    onClick?: () => void;
+    secondName?: string;
+    src?: string;
+    style?: CSSProperties;
+};
+type AvatarAppearanceKey = AppearanceKeysDefault | AppearanceShapeKey | AppearanceSizePxKey | AppearanceStyleKey;
+type AvatarAppearance = {
+    [key in AvatarAppearanceKey]?: AvatarAppearanceProps;
+};
+type AvatarConfig = {
+    appearance: AvatarAppearance;
+    setAppearance: (appearanceConfig: AvatarAppearance) => void;
+};
+export type { AvatarAppearance, AvatarConfig, AvatarProps };

package/dist/types/components/Avatar/appearance/avatarDefault.d.ts

@@ -0,0 +1,3 @@
+import { AvatarAppearance } from '../Avatar.interface';
+declare const avatarAppearanceDefault: AvatarAppearance;
+export { avatarAppearanceDefault };

package/dist/types/components/Avatar/appearance/avatarShape.d.ts

@@ -0,0 +1,3 @@
+import { AvatarAppearance } from '../Avatar.interface';
+declare const avatarAppearanceShape: AvatarAppearance;
+export { avatarAppearanceShape };

package/dist/types/components/Avatar/appearance/avatarSize.d.ts

@@ -0,0 +1,3 @@
+import { AvatarAppearance } from '../Avatar.interface';
+declare const avatarAppearanceSize: AvatarAppearance;
+export { avatarAppearanceSize };

package/dist/types/components/Avatar/appearance/avatarStyle.d.ts

@@ -0,0 +1,3 @@
+import { AvatarAppearance } from '../Avatar.interface';
+declare const avatarAppearanceStyle: AvatarAppearance;
+export { avatarAppearanceStyle };

package/dist/types/components/Avatar/index.d.ts

@@ -0,0 +1,3 @@
+export { Avatar, avatarConfig } from './Avatar';
+export { avatarAppearance } from './Avatar.appearance';
+export type { AvatarAppearance, AvatarConfig, AvatarProps, } from './Avatar.interface';

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

@@ -0,0 +1,3 @@
+import { AvatarStackAppearance } from './AvatarStack.interface';
+declare const avatarStackAppearance: AvatarStackAppearance;
+export { avatarStackAppearance };

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

@@ -0,0 +1,3 @@
+import { AvatarStackProps } from './AvatarStack.interface';
+declare function AvatarStack(props: AvatarStackProps): import("react/jsx-runtime").JSX.Element;
+export { AvatarStack };

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

@@ -0,0 +1,26 @@
+import type { AppearanceSizePxKey, DirectionProps, SizePXProps } from '@itcase/types-ui';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
+import { AvatarProps } from '../Avatar/Avatar.interface';
+type AvatarStackAppearanceProps = {
+    size: SizePXProps;
+};
+type AvatarsItem = {
+    id: string;
+    firstName: string;
+    lastName: string;
+    src: string;
+};
+type AvatarStackProps = AvatarStackAppearanceProps & StyleAttributes & {
+    appearance?: AppearanceKeys;
+    avatarAppearance?: AvatarProps['appearance'];
+    avatarsList: AvatarsItem[];
+    className?: string;
+    direction?: DirectionProps;
+    isSkeleton?: boolean;
+    length?: number;
+};
+type AppearanceKeys = AppearanceSizePxKey & {};
+type AvatarStackAppearance = {
+    [key in AppearanceKeys]?: AvatarStackAppearanceProps;
+};
+export type { AvatarStackAppearance, AvatarStackProps };

package/dist/types/components/AvatarStack/appearance/avatarStackSize.d.ts

@@ -0,0 +1,3 @@
+import { AvatarStackAppearance } from '../AvatarStack.interface';
+declare const avatarStackAppearanceSize: AvatarStackAppearance;
+export { avatarStackAppearanceSize };

package/dist/types/components/AvatarStack/index.d.ts

@@ -0,0 +1,3 @@
+import { AvatarStack } from './AvatarStack';
+export { AvatarStack };
+export type { AvatarStackAppearance, AvatarStackProps, } from './AvatarStack.interface';

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

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from './Badge.interface';
+declare const badgeAppearance: BadgeAppearance;
+export { badgeAppearance };

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

@@ -0,0 +1,4 @@
+import type { BadgeConfig, BadgeProps } from './Badge.interface';
+declare const badgeConfig: BadgeConfig;
+declare function Badge(props: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeConfig };

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

@@ -0,0 +1,46 @@
+import { CSSProperties, ReactNode } from 'react';
+import { AppearanceKeysDefault, AppearanceShapeKey, AppearanceSizeKey, AppearanceStyleKey, BorderColorHoverProps, BorderColorProps, BorderTypeProps, BorderWidthProps, CompositeAppearanceKey, FillHoverProps, FillProps, ShapeProps, ShapeStrengthProps, SizeProps, SvgFillItemProps } from '@itcase/types-ui';
+import { StyleAttributes } from '../../hooks/useStyles/styleAttributes.interface';
+import { IconProps } from '../Icon/Icon.interface';
+import { TextProps } from '../Text/Text.interface';
+type BadgeAppearanceProps = {
+    borderColor?: BorderColorProps;
+    borderColorHover?: BorderColorHoverProps;
+    borderType?: BorderTypeProps;
+    borderWidth?: BorderWidthProps;
+    dotFill?: SvgFillItemProps;
+    fill?: FillProps;
+    fillHover?: FillHoverProps;
+    iconFill?: IconProps['iconFill'];
+    iconShape?: IconProps['shape'];
+    iconSize?: IconProps['size'];
+    shape?: ShapeProps;
+    shapeStrength?: ShapeStrengthProps;
+    size?: SizeProps;
+    textColor?: TextProps['textColor'];
+    textSize?: TextProps['size'];
+};
+type BadgeProps = BadgeAppearanceProps & StyleAttributes & {
+    appearance?: CompositeAppearanceKey;
+    children?: ReactNode;
+    className?: string;
+    dataTestId?: string;
+    dataTour?: string;
+    dot?: boolean;
+    icon?: IconProps['SvgImage'];
+    iconSrc?: IconProps['imageSrc'];
+    isSkeleton?: boolean;
+    style?: CSSProperties;
+    text?: string;
+    type?: 'counter' | 'dot' | 'dot-icon-counter' | 'fill' | 'icon' | 'icon-counter';
+    value?: number | string;
+};
+type BadgeAppearanceKey = AppearanceKeysDefault | AppearanceShapeKey | AppearanceSizeKey | AppearanceStyleKey;
+type BadgeAppearance = {
+    [key in BadgeAppearanceKey]?: BadgeAppearanceProps;
+};
+type BadgeConfig = {
+    appearance: BadgeAppearance;
+    setAppearance: (appearanceConfig: BadgeAppearance) => void;
+};
+export type { BadgeAppearance, BadgeAppearanceKey, BadgeConfig, BadgeProps };

package/dist/types/components/Badge/appearance/badgeAccent.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceAccent: BadgeAppearance;
+export { badgeAppearanceAccent };

package/dist/types/components/Badge/appearance/badgeDanger.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceDanger: BadgeAppearance;
+export { badgeAppearanceDanger };

package/dist/types/components/Badge/appearance/badgeDisabled.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceDisabled: BadgeAppearance;
+export { badgeAppearanceDisabled };

package/dist/types/components/Badge/appearance/badgeError.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceError: BadgeAppearance;
+export { badgeAppearanceError };

package/dist/types/components/Badge/appearance/badgeExtra.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceExtra: BadgeAppearance;
+export { badgeAppearanceExtra };

package/dist/types/components/Badge/appearance/badgeInfo.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceInfo: BadgeAppearance;
+export { badgeAppearanceInfo };

package/dist/types/components/Badge/appearance/badgeShape.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceShape: BadgeAppearance;
+export { badgeAppearanceShape };

package/dist/types/components/Badge/appearance/badgeSize.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceSize: BadgeAppearance;
+export { badgeAppearanceSize };

package/dist/types/components/Badge/appearance/badgeSpecial.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceSpecial: BadgeAppearance;
+export { badgeAppearanceSpecial };

package/dist/types/components/Badge/appearance/badgeStyle.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceStyle: BadgeAppearance;
+export { badgeAppearanceStyle };

package/dist/types/components/Badge/appearance/badgeSuccess.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceSuccess: BadgeAppearance;
+export { badgeAppearanceSuccess };

package/dist/types/components/Badge/appearance/badgeSurface.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceSurface: BadgeAppearance;
+export { badgeAppearanceSurface };

package/dist/types/components/Badge/appearance/badgeWarning.d.ts

@@ -0,0 +1,3 @@
+import { BadgeAppearance } from '../Badge.interface';
+declare const badgeAppearanceWarning: BadgeAppearance;
+export { badgeAppearanceWarning };

package/dist/types/components/Badge/index.d.ts

@@ -0,0 +1,3 @@
+export { Badge, badgeConfig } from './Badge';
+export { badgeAppearance } from './Badge.appearance';
+export type { BadgeAppearance, BadgeAppearanceKey, BadgeConfig, BadgeProps, } from './Badge.interface';

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

@@ -0,0 +1,3 @@
+import { BreadcrumbsAppearance } from './Breadcrumbs.interface';
+declare const breadcrumbsAppearance: BreadcrumbsAppearance;
+export { breadcrumbsAppearance };

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

@@ -0,0 +1,3 @@
+import type { BreadcrumbsProps } from './Breadcrumbs.interface';
+declare function Breadcrumbs(props: BreadcrumbsProps): import("react/jsx-runtime").JSX.Element;
+export { Breadcrumbs };