@itcase/ui 1.2.17 → 1.2.19

package/dist/{Button-YvFWfIzn.js → Button--5mnRJi2.js}

@@ -3,8 +3,8 @@ import React from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
-import { I as Icon } from './Icon-BanAVsve.js';
-import { a as LinkWrapper } from './Link-BSquFKSX.js';
+import { I as Icon } from './Icon-DD_Vyrw0.js';
+import { a as LinkWrapper } from './Link-CeQuavin.js';
 import { L as Loader } from './Loader-CJ8ZCdwy.js';
 import { T as Text } from './Text-CG3xPG27.js';
 

package/dist/{Button-VFc2pmvE.js → Button-D1PnF1C-.js}

@@ -5,8 +5,8 @@ var React = require('react');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
 var useStyles = require('./cjs/hooks/useStyles.js');
-var Icon = require('./Icon-mG_ucnJz.js');
-var Link = require('./Link-BoJdm1hz.js');
+var Icon = require('./Icon-D-zjcPll.js');
+var Link = require('./Link-CqWzwh8V.js');
 var Loader = require('./Loader-fA11tUEJ.js');
 var Text = require('./Text-_YhyTsQ1.js');
 

package/dist/{DropdownItem-sLbGv_08.js → DropdownItem-D0dOP4NL.js}

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
 import { D as Divider } from './Divider-U5UdY-ef.js';
-import { L as Link } from './Link-BSquFKSX.js';
+import { L as Link } from './Link-CeQuavin.js';
 import { T as Text } from './Text-CG3xPG27.js';
 
 function Dropdown(props) {

package/dist/{DropdownItem-CEPQWGQ5.js → DropdownItem-D52wxY6I.js}

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
 var useStyles = require('./cjs/hooks/useStyles.js');
 var Divider = require('./Divider-BjB5MD6u.js');
-var Link = require('./Link-BoJdm1hz.js');
+var Link = require('./Link-CqWzwh8V.js');
 var Text = require('./Text-_YhyTsQ1.js');
 
 function Dropdown(props) {

package/dist/{Group-BDuYmoBK.js → Group-B2oTJg0t.js}

@@ -122,7 +122,7 @@ var Group = React.forwardRef(function Group(props, ref) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
                 "border-width_".concat(appearanceConfig.borderWidth)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, elevationClass, justifyContentClass), ref: ref, name: name, "data-tour": dataTour, htmlFor: htmlFor, id: id, style: Object.assign({}, groupStyles, style), onClick: onClick, children: horizontalScroll ? (jsxRuntime.jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
+                    .toLowerCase()), borderTypeClass, elevationClass, justifyContentClass, onClick && 'cursor_type_pointer'), ref: ref, name: name, "data-tour": dataTour, htmlFor: htmlFor, id: id, style: Object.assign({}, groupStyles, style), onClick: onClick, children: horizontalScroll ? (jsxRuntime.jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
 });
 
 exports.Group = Group;

package/dist/{Group-12uup5mu.js → Group-CVUfaHaS.js}

@@ -120,7 +120,7 @@ var Group = React.forwardRef(function Group(props, ref) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderWidth) &&
                 "border-width_".concat(appearanceConfig.borderWidth)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderTypeClass, elevationClass, justifyContentClass), ref: ref, name: name, "data-tour": dataTour, htmlFor: htmlFor, id: id, style: Object.assign({}, groupStyles, style), onClick: onClick, children: horizontalScroll ? (jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
+                    .toLowerCase()), borderTypeClass, elevationClass, justifyContentClass, onClick && 'cursor_type_pointer'), ref: ref, name: name, "data-tour": dataTour, htmlFor: htmlFor, id: id, style: Object.assign({}, groupStyles, style), onClick: onClick, children: horizontalScroll ? (jsx("div", { className: "group__wrapper", style: groupWrapperStyles, children: children })) : (children) }));
 });
 
 export { Group as G, groupConfig as g };

package/dist/{Icon-mG_ucnJz.js → Icon-D-zjcPll.js}

@@ -6,7 +6,7 @@ var clsx = require('clsx');
 var SVG = require('react-inlinesvg');
 var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
 var useStyles = require('./cjs/hooks/useStyles.js');
-var Link = require('./Link-BoJdm1hz.js');
+var Link = require('./Link-CqWzwh8V.js');
 var Tooltip = require('./Tooltip-DkTKx9n-.js');
 
 var iconConfig = {
@@ -17,7 +17,7 @@ var iconConfig = {
 };
 var Icon = React.forwardRef(function Icon(props, ref) {
     var _a = React.useState(false), isTooltipVisible = _a[0], setIsTooltipVisible = _a[1];
-    var Badge = props.Badge, SvgImage = props.SvgImage, after = props.after, before = props.before, className = props.className, dataTour = props.dataTour, height = props.height, href = props.href, id = props.id, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, width = props.width, onClick = props.onClick;
+    var id = props.id, width = props.width, height = props.height, after = props.after, Badge = props.Badge, before = props.before, className = props.className, dataTour = props.dataTour, href = props.href, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, SvgImage = props.SvgImage, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, onClick = props.onClick;
     // const svgSizes = useMemo(() => {
     //   const sizes: {
     //     width?: string
@@ -106,11 +106,8 @@ var Icon = React.forwardRef(function Icon(props, ref) {
     });
     // @ts-expect-error
     var iconStyles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), "data-tour": dataTour, id: id, ref: ref, style: iconStyles, onClick: onClick, onMouseEnter: function () { return setIsTooltipVisible(true); }, onMouseLeave: function () { return setIsTooltipVisible(false); }, children: jsxRuntime.jsxs(Link.LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, isTooltipVisible && showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { appearance: tooltipAppearance, className: clsx(className, 'icon__tooltip', alignmentClass), text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter: function () { return setIsTooltipVisible(true); }, onMouseLeave: function () { return setIsTooltipVisible(false); }, children: jsxRuntime.jsxs(Link.LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, isTooltipVisible && showTooltip && (jsxRuntime.jsx(Tooltip.Tooltip, { className: clsx(className, 'icon__tooltip', alignmentClass), appearance: tooltipAppearance, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
 });
-Icon.defaultProps = {
-    LinkComponent: 'a',
-};
 var removeFillStroke = function (code) {
     return code.replace(/fill=".*?"/g, 'fill=""').replace(/stroke=".*?"/g, 'stroke=""');
 };

package/dist/{Icon-BanAVsve.js → Icon-DD_Vyrw0.js}

@@ -4,7 +4,7 @@ import clsx from 'clsx';
 import SVG from 'react-inlinesvg';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
-import { a as LinkWrapper } from './Link-BSquFKSX.js';
+import { a as LinkWrapper } from './Link-CeQuavin.js';
 import { T as Tooltip } from './Tooltip-DJufHBiQ.js';
 
 var iconConfig = {
@@ -15,7 +15,7 @@ var iconConfig = {
 };
 var Icon = React.forwardRef(function Icon(props, ref) {
     var _a = useState(false), isTooltipVisible = _a[0], setIsTooltipVisible = _a[1];
-    var Badge = props.Badge, SvgImage = props.SvgImage, after = props.after, before = props.before, className = props.className, dataTour = props.dataTour, height = props.height, href = props.href, id = props.id, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, width = props.width, onClick = props.onClick;
+    var id = props.id, width = props.width, height = props.height, after = props.after, Badge = props.Badge, before = props.before, className = props.className, dataTour = props.dataTour, href = props.href, imageSrc = props.imageSrc, link = props.link, linkRel = props.linkRel, linkTarget = props.linkTarget, showTooltip = props.showTooltip, SvgImage = props.SvgImage, tooltipAppearance = props.tooltipAppearance, tooltipText = props.tooltipText, tooltipTextSize = props.tooltipTextSize, tooltipTitle = props.tooltipTitle, tooltipTitleSize = props.tooltipTitleSize, onClick = props.onClick;
     // const svgSizes = useMemo(() => {
     //   const sizes: {
     //     width?: string
@@ -104,11 +104,8 @@ var Icon = React.forwardRef(function Icon(props, ref) {
     });
     // @ts-expect-error
     var iconStyles = useStyles(props).styles;
-    return (jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), "data-tour": dataTour, id: id, ref: ref, style: iconStyles, onClick: onClick, onMouseEnter: function () { return setIsTooltipVisible(true); }, onMouseLeave: function () { return setIsTooltipVisible(false); }, children: jsxs(LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, isTooltipVisible && showTooltip && (jsx(Tooltip, { appearance: tooltipAppearance, className: clsx(className, 'icon__tooltip', alignmentClass), text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
+    return (jsx("div", { className: clsx(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'), ref: ref, "data-tour": dataTour, id: id, style: iconStyles, onClick: onClick, onMouseEnter: function () { return setIsTooltipVisible(true); }, onMouseLeave: function () { return setIsTooltipVisible(false); }, children: jsxs(LinkWrapper, { className: clsx(link || href ? 'icon__link' : 'icon__item', iconSizeClass), DefaultComponent: "div", href: link || href, rel: linkRel, target: linkTarget, children: [before, ImageComponent, after, Badge, isTooltipVisible && showTooltip && (jsx(Tooltip, { className: clsx(className, 'icon__tooltip', alignmentClass), appearance: tooltipAppearance, text: tooltipText, textSize: tooltipTextSize, title: tooltipTitle, titleSize: tooltipTitleSize }))] }) }));
 });
-Icon.defaultProps = {
-    LinkComponent: 'a',
-};
 var removeFillStroke = function (code) {
     return code.replace(/fill=".*?"/g, 'fill=""').replace(/stroke=".*?"/g, 'stroke=""');
 };

package/dist/{Link-BSquFKSX.js → Link-CeQuavin.js}

@@ -12,7 +12,7 @@ var linkConfig = {
     },
 };
 function Link(props) {
-    var after = props.after, before = props.before, children = props.children, className = props.className, LinkComponent = props.LinkComponent, href = props.href, link = props.link, target = props.target, rel = props.rel, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, style = props.style, onClick = props.onClick, onMouseDown = props.onMouseDown;
+    var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, onClick = props.onClick, onMouseDown = props.onMouseDown;
     var directionClass = useDeviceTargetClass(props, {
         prefix: 'link_direction_',
         propsKey: 'direction',
@@ -70,12 +70,9 @@ function Link(props) {
             weightClass) &&
             'text', textColorClass, textColorHoverClass, textGradientClass, textStyleClass, weightClass, fillClass), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
 }
-Link.defaultProps = {
-    underline: 'underline',
-};
 // Wrapper with "Link" by condition
 function LinkWrapper(props) {
-    var children = props.children, Component = props.Component, DefaultComponent = props.DefaultComponent, href = props.href, target = props.target, rel = props.rel, otherProps = __rest(props, ["children", "Component", "DefaultComponent", "href", "target", "rel"]);
+    var children = props.children, Component = props.Component, DefaultComponent = props.DefaultComponent, href = props.href, rel = props.rel, target = props.target, otherProps = __rest(props, ["children", "Component", "DefaultComponent", "href", "rel", "target"]);
     if (href) {
         // If href passed, make link-wrapper
         var LinkComponent = Component || linkConfig.LinkComponent;

package/dist/{Link-BoJdm1hz.js → Link-CqWzwh8V.js}

@@ -14,7 +14,7 @@ var linkConfig = {
     },
 };
 function Link(props) {
-    var after = props.after, before = props.before, children = props.children, className = props.className, LinkComponent = props.LinkComponent, href = props.href, link = props.link, target = props.target, rel = props.rel, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, style = props.style, onClick = props.onClick, onMouseDown = props.onMouseDown;
+    var children = props.children, after = props.after, before = props.before, className = props.className, href = props.href, link = props.link, LinkComponent = props.LinkComponent, rel = props.rel, style = props.style, target = props.target, text = props.text, _a = props.underline, underline = _a === void 0 ? 'underline' : _a, onClick = props.onClick, onMouseDown = props.onMouseDown;
     var directionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'link_direction_',
         propsKey: 'direction',
@@ -72,12 +72,9 @@ function Link(props) {
             weightClass) &&
             'text', textColorClass, textColorHoverClass, textGradientClass, textStyleClass, weightClass, fillClass), Component: LinkComponent, href: href || link, rel: rel, style: Object.assign({}, styles, style), target: target, onClick: onClick, onMouseDown: onMouseDown, children: [before, children || text, after] }));
 }
-Link.defaultProps = {
-    underline: 'underline',
-};
 // Wrapper with "Link" by condition
 function LinkWrapper(props) {
-    var children = props.children, Component = props.Component, DefaultComponent = props.DefaultComponent, href = props.href, target = props.target, rel = props.rel, otherProps = tslib_es6.__rest(props, ["children", "Component", "DefaultComponent", "href", "target", "rel"]);
+    var children = props.children, Component = props.Component, DefaultComponent = props.DefaultComponent, href = props.href, rel = props.rel, target = props.target, otherProps = tslib_es6.__rest(props, ["children", "Component", "DefaultComponent", "href", "rel", "target"]);
     if (href) {
         // If href passed, make link-wrapper
         var LinkComponent = Component || linkConfig.LinkComponent;

package/dist/{MenuItem-Snw0sSXT.js → MenuItem-B5ypY7Uo.js}

@@ -5,7 +5,7 @@ var React = require('react');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('./cjs/hooks/useDeviceTargetClass.js');
 var useStyles = require('./cjs/hooks/useStyles.js');
-var Link = require('./Link-BoJdm1hz.js');
+var Link = require('./Link-CqWzwh8V.js');
 var Text = require('./Text-_YhyTsQ1.js');
 
 var menuItemConfig = {

package/dist/{MenuItem-p5bhKFb0.js → MenuItem-BL6WBNjL.js}

@@ -3,7 +3,7 @@ import React from 'react';
 import clsx from 'clsx';
 import { useDeviceTargetClass } from './hooks/useDeviceTargetClass.js';
 import { useStyles } from './hooks/useStyles.js';
-import { L as Link } from './Link-BSquFKSX.js';
+import { L as Link } from './Link-CeQuavin.js';
 import { T as Text } from './Text-CG3xPG27.js';
 
 var menuItemConfig = {

package/dist/cjs/components/Accordion.js

@@ -7,7 +7,7 @@ var clsx = require('clsx');
 var castArray = require('lodash/castArray');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var useStyles = require('../hooks/useStyles.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('lodash/camelCase');
 require('../context/UIContext.js');
@@ -18,7 +18,7 @@ require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');
 
@@ -101,16 +101,13 @@ function AccordionItem(props) {
     });
     // @ts-expect-error
     var styles = useStyles.useStyles(props).styles;
-    return (jsxRuntime.jsxs("div", { style: styles, className: clsx('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), children: [jsxRuntime.jsx(Text.Text, { size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, className: clsx('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), onClick: onClickTitle, children: title }), jsxRuntime.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntime.jsx(Icon.Icon, { SvgImage: icon16.ChevronDown, iconFill: iconFill, size: "16" }) }), beforeContent && beforeContent, isExpanded && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
+    return (jsxRuntime.jsxs("div", { className: clsx('accordion-item', className, borderColorClass, fillClass, fillHoverClass, shapeClass, size && "accordion-item_size_".concat(size), isExpanded && 'accordion-item_state_open'), style: styles, children: [jsxRuntime.jsx(Text.Text, { className: clsx('accordion-item__title', titleBorderColorClass, titleFillClass, titleFillHoverClass, 'cursor_type_pointer'), size: titleTextSize, textColor: titleTextColor, textWeight: titleTextWeight, onClick: onClickTitle, children: title }), jsxRuntime.jsx("div", { className: clsx('accordion-item__icon', 'cursor_type_pointer'), onClick: onClickTitle, children: icon || jsxRuntime.jsx(Icon.Icon, { iconFill: iconFill, size: "16", SvgImage: icon16.ChevronDown }) }), beforeContent && beforeContent, isExpanded && (jsxRuntime.jsx("div", { className: clsx('accordion-item__content', contentBorderColorClass, contentFillClass, fillHoverClass), children: children ||
                     (content && (jsxRuntime.jsx(Text.Text, { size: contentTextSize, textColor: contentTextColor, textWeight: contentTextWeight, children: content }))) })), afterContent && afterContent] }));
 }
-AccordionItem.defaultProps = {
-    iconFill: 'surfaceItemAccent',
-};
 
 function Accordion(props) {
     var children = props.children, isMultiple = props.isMultiple, className = props.className, _a = props.initial, initial = _a === void 0 ? [] : _a, items = props.items, onClickItem = props.onClickItem;
-    var _b = React.useState(castArray(initial)), expandedItems = _b[0], setExpandedItems = _b[1];
+    var _b = React.useState(function () { return castArray(initial); }), expandedItems = _b[0], setExpandedItems = _b[1];
     var onClickAccordionItem = React.useCallback(function (targetItem) {
         setExpandedItems(function (prevState) {
             var isExpanded = prevState.find(function (id) { return id === targetItem.id; });
@@ -182,11 +179,8 @@ function Accordion(props) {
      */
     // @ts-expect-error
     var _c = useStyles.useStyles(props), accordionStyles = _c.styles, accordionWrapperStyles = _c.wrapper;
-    return (jsxRuntime.jsx("div", { style: accordionStyles, className: clsx(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), children: jsxRuntime.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
+    return (jsxRuntime.jsx("div", { className: clsx(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass), style: accordionStyles, children: jsxRuntime.jsx("div", { className: "accordion__wrapper", style: accordionWrapperStyles, children: accordionItemsList }) }));
 }
-Accordion.defaultProps = {
-    initial: [],
-};
 
 exports.Accordion = Accordion;
 exports.AccordionItem = AccordionItem;

package/dist/cjs/components/Avatar.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Image = require('../../Image-DrUlRMHa.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('lodash/castArray');
@@ -18,7 +18,7 @@ require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');

package/dist/cjs/components/Breadcrumbs.js

@@ -7,8 +7,8 @@ var clsx = require('clsx');
 var camelCase = require('lodash/camelCase');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var useStyles = require('../hooks/useStyles.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
-var Link = require('../../Link-BoJdm1hz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
+var Link = require('../../Link-CqWzwh8V.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('lodash/castArray');
 require('../context/UIContext.js');

package/dist/cjs/components/Button.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Button = require('../../Button-VFc2pmvE.js');
+var Button = require('../../Button-D1PnF1C-.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -15,9 +15,9 @@ require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../../Icon-mG_ucnJz.js');
+require('../../Icon-D-zjcPll.js');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Text-_YhyTsQ1.js');

package/dist/cjs/components/Cell.js

@@ -3,7 +3,7 @@
 var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Label = require('../../Label-CpSzGRtr.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 var useStyles = require('../hooks/useStyles.js');
@@ -15,7 +15,7 @@ require('prop-types');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');

package/dist/cjs/components/Choice.js

@@ -1,11 +1,10 @@
 'use strict';
 
-var tslib_es6 = require('../../tslib.es6-CCZ3TN_7.js');
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Loader = require('../../Loader-fA11tUEJ.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('lodash/castArray');
@@ -19,7 +18,8 @@ require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
+require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');
 
@@ -30,7 +30,7 @@ var choiceConfig = {
     },
 };
 var Choice = React.forwardRef(function Choice(props, ref) {
-    var gap = props.gap, _a = props.isCheckbox, isCheckbox = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isLoading, isLoading = _c === void 0 ? false : _c, _d = props.active, active = _d === void 0 ? { value: undefined } : _d, activeIcon = props.activeIcon, activeIconItemFill = props.activeIconItemFill, after = props.after, appearance = props.appearance, before = props.before, className = props.className, icon = props.icon, iconFillDisabled = props.iconFillDisabled, iconItemFill = props.iconItemFill, iconSize = props.iconSize, labelTextActiveColor = props.labelTextActiveColor, labelTextActiveColorDisabled = props.labelTextActiveColorDisabled, labelTextColor = props.labelTextColor, labelTextColorDisabled = props.labelTextColorDisabled, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, name = props.name, _e = props.options, options = _e === void 0 ? [] : _e, set = props.set, setActiveSegment = props.setActiveSegment, _f = props.size, size = _f === void 0 ? 'normal' : _f, type = props.type;
+    props.flexWrap; props.gap; var _a = props.isCheckbox, isCheckbox = _a === void 0 ? false : _a, _b = props.isDisabled, isDisabled = _b === void 0 ? false : _b, _c = props.isLoading, isLoading = _c === void 0 ? false : _c, _d = props.active, active = _d === void 0 ? { value: undefined } : _d, activeIcon = props.activeIcon, activeIconItemFill = props.activeIconItemFill, after = props.after, appearance = props.appearance, before = props.before, className = props.className, icon = props.icon, iconFillDisabled = props.iconFillDisabled, iconItemFill = props.iconItemFill, iconSize = props.iconSize, labelTextActiveColor = props.labelTextActiveColor, labelTextActiveColorDisabled = props.labelTextActiveColorDisabled, labelTextColor = props.labelTextColor, labelTextColorDisabled = props.labelTextColorDisabled, labelTextSize = props.labelTextSize, labelTextWeight = props.labelTextWeight, name = props.name, _e = props.options, options = _e === void 0 ? [] : _e, set = props.set, setActiveSegment = props.setActiveSegment, _f = props.size, size = _f === void 0 ? 'normal' : _f, type = props.type;
     var controlRef = React.useRef(null);
     var optionsRefs = React.useMemo(function () { return new Map(options.map(function (item) { return [item.value, React.createRef()]; })); }, [options]);
     var onChange = React.useCallback(function (event, item) {
@@ -73,6 +73,14 @@ var Choice = React.forwardRef(function Choice(props, ref) {
         prefix: 'fill_active_disabled_',
         propsKey: 'fillActiveDisabled',
     });
+    var wrapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'choice_wrap_',
+        propsKey: 'wrap',
+    });
+    var gapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+        prefix: 'gap_',
+        propsKey: 'gap',
+    });
     // prettier-ignore
     var appearanceConfig = (appearance && choiceConfig.appearance && choiceConfig.appearance[appearance]);
     return (jsxRuntime.jsx("div", { className: clsx(className, 'choice', shapeClass ||
@@ -81,34 +89,40 @@ var Choice = React.forwardRef(function Choice(props, ref) {
             ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.borderColor) &&
                 "border-color_".concat(appearanceConfig.borderColor)
                     .replace(/([A-Z])/g, '-$1')
-                    .toLowerCase()), borderWidthClass, borderTypeClass, set && "choice_set_".concat(set), size && "choice_size_".concat(size), type && "choice_type_".concat(type)), ref: controlRef, children: isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemAccent", set: "simple" })) : (jsxRuntime.jsx("div", { className: "choice__wrapper", style: tslib_es6.__assign({}, (gap && { gap: gap })), children: options.map(function (item) { return (jsxRuntime.jsxs("div", { className: clsx('choice__item', !isDisabled
-                    ? fillClass ||
-                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
-                            "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())
-                    : fillDisabledClass, !isDisabled &&
-                    (fillHoverClass ||
-                        ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
-                            "fill_hover_".concat(appearanceConfig.fillHover)
-                                .replace(/([A-Z])/g, '-$1')
-                                .toLowerCase())), item.value !== (active === null || active === void 0 ? void 0 : active.value) && isDisabled && 'choice__item_state_disabled', item.value === (active === null || active === void 0 ? void 0 : active.value)
-                    ? !isDisabled
-                        ? fillActiveClass ||
-                            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
-                                "fill_active_".concat(appearanceConfig.fillActive)
+                    .toLowerCase()), borderWidthClass, borderTypeClass, set && "choice_set_".concat(set), size && "choice_size_".concat(size), type && "choice_type_".concat(type)), ref: controlRef, children: isLoading ? (jsxRuntime.jsx(Loader.Loader, { width: "fill", height: "fill", fill: "surfacePrimary", itemFill: "surfaceItemAccent", set: "simple" })) : (jsxRuntime.jsx("div", { className: clsx(className, 'choice__wrapper', gapClass, wrapClass), children: options.map(function (item) {
+                // prettier-ignore
+                var isActive = typeof active === 'object'
+                    ? String(item.value) === String(active.value)
+                    : String(item.value) === String(active);
+                return (jsxRuntime.jsxs("div", { className: clsx('choice__item', !isDisabled
+                        ? fillClass ||
+                            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fill) &&
+                                "fill_".concat(appearanceConfig.fill).replace(/([A-Z])/g, '-$1').toLowerCase())
+                        : fillDisabledClass, !isDisabled &&
+                        (fillHoverClass ||
+                            ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillHover) &&
+                                "fill_hover_".concat(appearanceConfig.fillHover)
                                     .replace(/([A-Z])/g, '-$1')
-                                    .toLowerCase())
-                        : fillActiveDisabledClass
-                    : !isDisabled
-                        ? fillClass
-                        : fillDisabledClass, item.value === (active === null || active === void 0 ? void 0 : active.value) && isDisabled && 'choice__item_active_state_disabled', item.value === (active === null || active === void 0 ? void 0 : active.value) && 'choice__item_active'), ref: optionsRefs.get(item.value), children: [jsxRuntime.jsx("input", { className: "choice__item-radio", name: name, checked: item.value === (active === null || active === void 0 ? void 0 : active.value), disabled: isDisabled, id: "".concat(name, "-").concat(item.value), type: isCheckbox ? 'checkbox' : 'radio', value: item.value, onChange: function (event) { return onChange(event, item); } }), jsxRuntime.jsxs("label", { className: clsx('choice__item-label', isDisabled && 'choice__item-label_state_disabled'), htmlFor: "".concat(name, "-").concat(item.value), children: [before, item.label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textWeight: labelTextWeight, textColor: item.value === (active === null || active === void 0 ? void 0 : active.value)
-                                    ? !isDisabled
-                                        ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
-                                        : labelTextActiveColorDisabled
-                                    : !isDisabled
-                                        ? labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor)
-                                        : labelTextColorDisabled, children: item.label })), (icon || activeIcon) && (jsxRuntime.jsx(Icon.Icon, { className: "choice__item-icon", iconFillDisabled: isDisabled ? iconFillDisabled : undefined, iconSize: iconSize, SvgImage: item.value === (active === null || active === void 0 ? void 0 : active.value) ? activeIcon : icon, iconFill: item.value === (active === null || active === void 0 ? void 0 : active.value)
-                                    ? activeIconItemFill || item.activeIconItemFill
-                                    : iconItemFill || item.iconItemFill })), after] })] }, item.value)); }) })) }));
+                                    .toLowerCase())), !isActive && isDisabled && 'choice__item_state_disabled', isActive
+                        ? !isDisabled
+                            ? fillActiveClass ||
+                                ((appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.fillActive) &&
+                                    "fill_active_".concat(appearanceConfig.fillActive)
+                                        .replace(/([A-Z])/g, '-$1')
+                                        .toLowerCase())
+                            : fillActiveDisabledClass
+                        : !isDisabled
+                            ? fillClass
+                            : fillDisabledClass, isActive && isDisabled && 'choice__item_active_state_disabled', isActive && 'choice__item_active'), ref: optionsRefs.get(item.value), children: [jsxRuntime.jsx("input", { className: "choice__item-radio", name: name, checked: isActive, disabled: isDisabled, id: "".concat(name, "-").concat(item.value), type: isCheckbox ? 'checkbox' : 'radio', value: item.value, onChange: function (event) { return onChange(event, item); } }), jsxRuntime.jsxs("label", { className: clsx('choice__item-label', isDisabled && 'choice__item-label_state_disabled'), htmlFor: "".concat(name, "-").concat(item.value), children: [before, item.label && (jsxRuntime.jsx(Text.Text, { size: labelTextSize || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextSize), textWeight: labelTextWeight, textColor: isActive
+                                        ? !isDisabled
+                                            ? labelTextActiveColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextActiveColor)
+                                            : labelTextActiveColorDisabled
+                                        : !isDisabled
+                                            ? labelTextColor || (appearanceConfig === null || appearanceConfig === void 0 ? void 0 : appearanceConfig.labelTextColor)
+                                            : labelTextColorDisabled, children: item.label })), (icon || activeIcon) && (jsxRuntime.jsx(Icon.Icon, { className: "choice__item-icon", iconFillDisabled: isDisabled ? iconFillDisabled : undefined, iconSize: iconSize, SvgImage: isActive ? activeIcon : icon, iconFill: isActive
+                                        ? activeIconItemFill || item.activeIconItemFill
+                                        : iconItemFill || item.iconItemFill })), after] })] }, "".concat(name, "-").concat(item.value)));
+            }) })) }));
 });
 
 exports.Choice = Choice;

package/dist/cjs/components/ContextMenu.js

@@ -4,7 +4,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var Divider = require('../../Divider-BjB5MD6u.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('react');
 require('lodash/castArray');
@@ -18,7 +18,7 @@ require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');

package/dist/cjs/components/CookiesWarning.js

@@ -5,8 +5,8 @@ var React = require('react');
 var clsx = require('clsx');
 var Cookies = require('js-cookie');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var Button = require('../../Button-VFc2pmvE.js');
-var Group = require('../../Group-BDuYmoBK.js');
+var Button = require('../../Button-D1PnF1C-.js');
+var Group = require('../../Group-B2oTJg0t.js');
 var Text = require('../../Text-_YhyTsQ1.js');
 require('lodash/castArray');
 require('lodash/camelCase');
@@ -18,9 +18,9 @@ require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../../Icon-mG_ucnJz.js');
+require('../../Icon-D-zjcPll.js');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');

package/dist/cjs/components/DatePicker.js

@@ -7,8 +7,8 @@ var clsx = require('clsx');
 var DatePicker = require('react-datepicker');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var useStyles = require('../hooks/useStyles.js');
-var Button = require('../../Button-VFc2pmvE.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Button = require('../../Button-D1PnF1C-.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var Input = require('../../Input-BSpFMsrf.js');
 var Label = require('../../Label-CpSzGRtr.js');
 var Text = require('../../Text-_YhyTsQ1.js');
@@ -21,7 +21,7 @@ require('react-responsive');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../Loader-fA11tUEJ.js');
 require('react-inlinesvg');
 require('../../Tooltip-DkTKx9n-.js');

package/dist/cjs/components/Dropdown.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var DropdownItem = require('../../DropdownItem-CEPQWGQ5.js');
+var DropdownItem = require('../../DropdownItem-D52wxY6I.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');
@@ -16,7 +16,7 @@ require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
 require('../../Divider-BjB5MD6u.js');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../tslib.es6-CCZ3TN_7.js');
 require('../../Text-_YhyTsQ1.js');
 

package/dist/cjs/components/Flex.js

@@ -69,12 +69,9 @@ function Flex(props) {
     var _b = useStyles.useStyles(props), flexStyles = _b.styles, flexWrapperStyles = _b.wrapper;
     return (jsxRuntime.jsx(Tag, { className: clsx(className, 'flex', widthClass, alignContentClass, alignItemsClass, directionClass, fillClass, flowClass, borderColorClass, borderTypeClass, positionClass, justifyContentClass, shapeClass, type && "flex_type_".concat(type), wrapClass), id: id, style: flexStyles, onClick: onClick, children: jsxRuntime.jsx("div", { className: "flex__wrapper", style: flexWrapperStyles, children: children }) }));
 }
-Flex.defaultProps = {
-    tag: 'div',
-};
 
 function FlexItem(props) {
-    var children = props.children, className = props.className, _a = props.tag, Tag = _a === void 0 ? 'div' : _a, htmlFor = props.htmlFor;
+    var children = props.children, className = props.className, htmlFor = props.htmlFor, _a = props.tag, Tag = _a === void 0 ? 'div' : _a;
     var alignSelfClass = useDeviceTargetClass.useDeviceTargetClass(props, {
         prefix: 'flex__item_align-self_',
         propsKey: 'alignSelf',
@@ -123,9 +120,6 @@ function FlexItem(props) {
     var flexItemStyles = useStyles.useStyles(props).styles;
     return (jsxRuntime.jsx(Tag, { className: clsx(className, 'flex__item', positionClass, alignItemsClass, alignSelfClass, directionClass, fillClass, fillHoverClass, growClass, justifyContentClass, shapeClass, widthClass, wrapClass), htmlFor: htmlFor, style: flexItemStyles, children: children }));
 }
-FlexItem.defaultProps = {
-    tag: 'div',
-};
 
 exports.Flex = Flex;
 exports.FlexItem = FlexItem;

package/dist/cjs/components/FormField.js

@@ -5,7 +5,7 @@ var jsxRuntime = require('react/jsx-runtime');
 var clsx = require('clsx');
 var Divider = require('../../Divider-BjB5MD6u.js');
 var Text = require('../../Text-_YhyTsQ1.js');
-var Icon = require('../../Icon-mG_ucnJz.js');
+var Icon = require('../../Icon-D-zjcPll.js');
 var useStyles = require('../hooks/useStyles.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 var Radio = require('../../Radio-BQo97TZL.js');
@@ -13,10 +13,10 @@ require('react-select');
 var index = require('./Select.js');
 require('react');
 require('../../Badge-2JkquAEb.js');
-require('../../Group-BDuYmoBK.js');
+require('../../Group-B2oTJg0t.js');
 var Switch = require('../../Switch-B5yVEqxz.js');
 require('react-inlinesvg');
-require('../../Link-BoJdm1hz.js');
+require('../../Link-CqWzwh8V.js');
 require('../../Tooltip-DkTKx9n-.js');
 require('../../Title-zwP6c2U2.js');
 require('../context/UIContext.js');

package/dist/cjs/components/Group.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var Group = require('../../Group-BDuYmoBK.js');
+var Group = require('../../Group-B2oTJg0t.js');
 require('react/jsx-runtime');
 require('react');
 require('clsx');