@itcase/ui 1.0.92 → 1.0.93

package/dist/{SelectContainer-meg_EXPO.js → SelectContainer-umrbJtB5.js}

@@ -7,10 +7,11 @@ var Select$1 = require('react-select');
 var defineProperty = require('./defineProperty-ujK-k7aM.js');
 var ReactDOM = require('react-dom');
 var useDeviceTargetClass = require('./hooks/useDeviceTargetClass.js');
+var index$2 = require('./components/Badge.js');
 var index$1 = require('./components/Icon.js');
-var index$2 = require('./components/Text.js');
-var index$3 = require('./components/Group.js');
-var index$4 = require('./components/Divider.js');
+var index$3 = require('./components/Text.js');
+var index$4 = require('./components/Group.js');
+var index$5 = require('./components/Divider.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -7658,6 +7659,28 @@ SelectControl.__docgenInfo = {
   }
 };
 
+const SelectIndicatorsContainer = props => {
+  const {
+    badgeAppearance,
+    badgeSize,
+    badgeTextSize,
+    showBadge,
+    value
+  } = props.selectProps;
+  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.IndicatorsContainer, props, showBadge && value?.length > 0 ? /*#__PURE__*/React__namespace.default.createElement(index$2.Badge, {
+    appearance: badgeAppearance,
+    size: badgeSize,
+    textSize: badgeTextSize,
+    value: value.length
+  }) : null, props.children);
+};
+SelectIndicatorsContainer.propTypes = {};
+SelectIndicatorsContainer.__docgenInfo = {
+  "description": "",
+  "methods": [],
+  "displayName": "SelectIndicatorsContainer"
+};
+
 const SelectDropdownIndicator = props => {
   const {
     dropdownIcon,
@@ -7722,7 +7745,7 @@ const SelectGroupHeading = props => {
   } = props.selectProps;
   return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.GroupHeading, Object.assign({}, props, {
     className: clsx__default.default('select__menu-group-heading', headingFill, headingFillHover)
-  }), /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  }), /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     size: headingTextSize,
     textWeight: headingTextWeight,
     textColor: headingTextColor
@@ -7857,7 +7880,7 @@ const SelectMultiValueContainer = props => {
     multipleItemFill,
     multipleItemFillHover
   } = props.selectProps;
-  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.MultiValueContainer, props, /*#__PURE__*/React__namespace.default.createElement(index$3.Group, {
+  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.MultiValueContainer, props, /*#__PURE__*/React__namespace.default.createElement(index$4.Group, {
     className: "select__multi-value-wrapper",
     direction: "horizontal",
     alignItems: "center",
@@ -7877,7 +7900,7 @@ const SelectMultiValueLabel = props => {
     multipleItemTextSize,
     multipleItemTextColor
   } = props.selectProps;
-  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.MultiValueLabel, props, /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.MultiValueLabel, props, /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     size: multipleItemTextSize,
     textColor: multipleItemTextColor
   }, props.data.label));
@@ -7917,7 +7940,7 @@ const SelectNoOptions = props => {
   } = props.selectProps;
   return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.NoOptionsMessage, Object.assign({}, props, {
     className: clsx__default.default(optionFill, optionBorder, optionBorderType)
-  }), /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  }), /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     size: noOptionsTextSize,
     textColor: noOptionsTextColor
   }, noOptionsText));
@@ -7991,13 +8014,13 @@ const SelectOption = props => {
   } = props.selectProps;
   return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.Option, Object.assign({}, props, {
     className: clsx__default.default('select__menu-list-item', isSelected && 'select__menu-list-item_state_selected', menuItemSize && `select__menu-list-item_size_${menuItemSize}`, optionFill, optionBorder, optionBorderType, optionFillHover, optionShape)
-  }), optionBefore, /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  }), optionBefore, /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     className: "select__menu-list-item_option",
     size: optionTextSize,
     textColor: optionTextColor
   }, label), isSelected && /*#__PURE__*/React__namespace.default.createElement("div", {
     className: "select__menu-list-item_selected"
-  }, optionSelected), optionAfter, showDivider && /*#__PURE__*/React__namespace.default.createElement(index$4.Divider, {
+  }, optionSelected), optionAfter, showDivider && /*#__PURE__*/React__namespace.default.createElement(index$5.Divider, {
     direction: dividerDirection,
     fill: dividerFill,
     size: dividerSize,
@@ -8076,7 +8099,7 @@ const SelectPlaceholder = props => {
     placeholderTextSize,
     placeholderTextColor
   } = props.selectProps;
-  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.Placeholder, props, /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.Placeholder, props, /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     size: placeholderTextSize,
     textColor: placeholderTextColor
   }, props.children));
@@ -8128,7 +8151,7 @@ const SelectSingleValue = props => {
     inputTextSize,
     inputTextColor
   } = props.selectProps;
-  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.SingleValue, props, data.optionBefore, /*#__PURE__*/React__namespace.default.createElement(index$2.Text, {
+  return /*#__PURE__*/React__namespace.default.createElement(Select$1.components.SingleValue, props, data.optionBefore, /*#__PURE__*/React__namespace.default.createElement(index$3.Text, {
     size: inputTextSize,
     textColor: inputTextColor
   }, props.children), data.optionAfter);
@@ -8234,6 +8257,9 @@ const SelectContainer = /*#__PURE__*/React__namespace.default.forwardRef(functio
     className,
     after,
     before,
+    badgeAppearance,
+    badgeSize,
+    badgeTextSize,
     hideSelectedOptions,
     menuAfter,
     menuBefore,
@@ -8273,6 +8299,7 @@ const SelectContainer = /*#__PURE__*/React__namespace.default.forwardRef(functio
     placeholderTextSize,
     placeholderTextColor,
     set,
+    showBadge,
     value,
     onChange
   } = props;
@@ -8397,75 +8424,77 @@ const SelectContainer = /*#__PURE__*/React__namespace.default.forwardRef(functio
     className: clsx__default.default(className, 'select', fillClass, fillHoverClass, shapeClass, borderColorClass, sizeClass, hideValueContainer && 'select_state_hide-value-container', set && `select_set_${set}`),
     classNamePrefix: "select",
     styles: clearStyle,
-    value: value,
     after: after,
+    badgeAppearance: badgeAppearance,
+    badgeSize: badgeSize,
+    badgeTextSize: badgeTextSize,
     before: before,
-    menuAfter: menuAfter,
-    menuBefore: menuBefore,
-    elevation: elevation,
-    isClearable: isClearable,
-    openMenuOnClick: openMenuOnClick,
     clearIcon: clearIcon,
     clearIconFill: clearIconFill,
     clearIconStroke: clearIconStroke,
     closeMenuOnSelect: closeMenuOnSelect ?? false,
     defaultValue: initialValue,
-    showDivider: showDivider,
     dividerDirection: dividerDirection,
     dividerFill: dividerFill,
     dividerSize: dividerSize,
     dropdownIcon: dropdownIcon,
     dropdownIconFill: dropdownIconFill,
     dropdownIconStroke: dropdownIconStroke,
+    elevation: elevation,
     filterOption: filterOption,
-    hideSelectedOptions: hideSelectedOptions,
-    isMulti: isMulti,
-    isSearchable: isSearchable,
-    set: set,
-    optionFill: optionFillClass,
-    menuItemSize: menuItemSize,
-    optionFillHover: optionFillHoverClass,
-    optionTextSize: optionTextSizeClass,
-    optionTextColor: optionTextColorClass,
-    optionShape: optionShapeClass,
-    optionBorder: optionBorderClass,
-    optionBorderType: optionBorderTypeClass,
-    optionSelected: optionSelected,
-    optionBefore: optionBefore,
-    optionAfter: optionAfter,
-    inputBefore: inputBefore,
-    inputAfter: inputAfter,
-    inputFill: inputFillClass,
-    inputTextSize: inputTextSizeClass,
-    inputTextColor: inputTextColorClass,
-    inputCaretColor: inputCaretColorClass,
-    inputShape: inputShapeClass,
-    inputBorderColor: inputBorderColorClass,
-    inputBorderColorHover: inputBorderColorHoverClass,
-    placeholder: placeholder,
-    placeholderTextSize: placeholderTextSize,
-    placeholderTextColor: placeholderTextColor,
-    noOptionsTextSize: noOptionsTextSizeClass,
-    noOptionsTextColor: noOptionsTextColorClass,
-    noOptionsText: noOptionsText,
-    noOptionsFill: optionFillClass,
-    noOptionBorder: optionBorderClass,
-    noOptionBorderType: optionBorderTypeClass,
     headingFill: headingFillClass,
     headingFillHover: headingFillHoverClass,
-    headingTextSize: headingTextSizeClass,
     headingTextColor: headingTextColorClass,
+    headingTextSize: headingTextSizeClass,
     headingTextWeight: headingTextWeightClass,
+    hideSelectedOptions: hideSelectedOptions,
+    inputAfter: inputAfter,
+    inputBefore: inputBefore,
+    inputBorderColor: inputBorderColorClass,
+    inputBorderColorHover: inputBorderColorHoverClass,
+    inputCaretColor: inputCaretColorClass,
+    inputFill: inputFillClass,
+    inputShape: inputShapeClass,
+    inputTextColor: inputTextColorClass,
+    inputTextSize: inputTextSizeClass,
+    menuAfter: menuAfter,
+    menuBefore: menuBefore,
+    menuItemSize: menuItemSize,
     multipleItemFill: multipleItemFill,
     multipleItemFillHover: multipleItemFillHover,
-    multipleItemTextSize: multipleItemTextSizeClass,
-    multipleItemTextColor: multipleItemTextColorClass,
     multipleItemIcon: multipleItemIcon,
     multipleItemIconFill: multipleItemIconFill,
+    multipleItemTextColor: multipleItemTextColorClass,
+    multipleItemTextSize: multipleItemTextSizeClass,
+    noOptionBorder: optionBorderClass,
+    noOptionBorderType: optionBorderTypeClass,
+    noOptionsFill: optionFillClass,
+    noOptionsText: noOptionsText,
+    noOptionsTextColor: noOptionsTextColorClass,
+    noOptionsTextSize: noOptionsTextSizeClass,
+    openMenuOnClick: openMenuOnClick,
+    optionAfter: optionAfter,
+    optionBefore: optionBefore,
+    optionBorder: optionBorderClass,
+    optionBorderType: optionBorderTypeClass,
+    optionFill: optionFillClass,
+    optionFillHover: optionFillHoverClass,
     options: options,
+    optionSelected: optionSelected,
+    optionShape: optionShapeClass,
+    optionTextColor: optionTextColorClass,
+    optionTextSize: optionTextSizeClass,
+    placeholder: placeholder,
+    placeholderTextColor: placeholderTextColor,
+    placeholderTextSize: placeholderTextSize,
     ref: selectRef,
+    set: set,
+    showDivider: showDivider,
+    showBadge: showBadge,
+    value: value,
     components: {
       Control: SelectControl,
+      IndicatorsContainer: SelectIndicatorsContainer,
       ClearIndicator: SelectClearIndicator,
       DropdownIndicator: SelectDropdownIndicator,
       IndicatorSeparator: () => null,
@@ -8481,6 +8510,9 @@ const SelectContainer = /*#__PURE__*/React__namespace.default.forwardRef(functio
       NoOptionsMessage: SelectNoOptions,
       GroupHeading: SelectGroupHeading
     },
+    isClearable: isClearable,
+    isMulti: isMulti,
+    isSearchable: isSearchable,
     onChange: onChange
   });
 });
@@ -8684,6 +8716,7 @@ exports.SelectContainer = SelectContainer;
 exports.SelectControl = SelectControl;
 exports.SelectDropdownIndicator = SelectDropdownIndicator;
 exports.SelectGroupHeading = SelectGroupHeading;
+exports.SelectIndicatorsContainer = SelectIndicatorsContainer;
 exports.SelectInput = SelectInput;
 exports.SelectMenu = SelectMenu;
 exports.SelectMultiValueContainer = SelectMultiValueContainer;

package/dist/components/Accordion.js

@@ -31,6 +31,11 @@ require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');
 
@@ -500,6 +505,10 @@ function Accordion(props) {
     prefix: 'accordion_shape_',
     propsKey: 'shape'
   });
+  const widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'width_',
+    propsKey: 'width'
+  });
 
   /*
    * paddingHorizontalWrapper="16px"
@@ -511,7 +520,7 @@ function Accordion(props) {
     wrapper: accordionWrapperStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass),
+    className: clsx__default.default(className, 'accordion', borderColorClass, directionClass, fillClass, shapeClass, widthClass),
     style: accordionStyles
   }, /*#__PURE__*/React__default.default.createElement("div", {
     className: "accordion__wrapper",

package/dist/components/Avatar.js

@@ -35,6 +35,11 @@ require('../constants/componentProps/underline.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('lodash/castArray');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/components/Badge.js

@@ -80,7 +80,7 @@ function Badge(props) {
     styles: badgeStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'badge', !value && 'badge_type_status', borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, fillClass || badgeConfig.appearance[appearance] && `fill_${badgeConfig.appearance[appearance].fillClass}`?.replace(/([A-Z])/g, '-$1').toLowerCase(), positionClass, sizeClass, shapeClass),
+    className: clsx__default.default(className, 'badge', !value && 'badge_type_status', borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, fillClass || badgeConfig.appearance[appearance] && `fill_${badgeConfig.appearance[appearance].fill}`?.replace(/([A-Z])/g, '-$1').toLowerCase(), positionClass, sizeClass, shapeClass),
     style: badgeStyles
   }, children || value && /*#__PURE__*/React__default.default.createElement(index.Text, {
     size: textSize,

package/dist/components/Breadcrumbs.js

@@ -19,22 +19,27 @@ require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
-require('../constants/componentProps/size.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
 require('../constants/componentProps/textColor.js');
 require('../constants/componentProps/textGradient.js');
 require('../constants/componentProps/textStyle.js');
 require('../constants/componentProps/textWeight.js');
+require('../constants/componentProps/titleSize.js');
 require('../constants/componentProps/type.js');
-require('../constants/componentProps/underline.js');
-require('lodash/castArray');
+require('../constants/componentProps/wrap.js');
 require('../context/UIContext.js');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
+require('lodash/castArray');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
+require('../constants/componentProps/size.js');
 require('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');
+require('../constants/componentProps/underline.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 

package/dist/components/Button.js

@@ -19,18 +19,23 @@ require('react-inlinesvg');
 require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
 require('../constants/componentProps/textColor.js');
-require('../constants/componentProps/textColorActive.js');
-require('../constants/componentProps/textColorHover.js');
-require('../constants/componentProps/textStyle.js');
 require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/textStyle.js');
 require('../constants/componentProps/textWeight.js');
-require('../constants/componentProps/underline.js');
-require('lodash/castArray');
-require('lodash/camelCase');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('../context/UIContext.js');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.js');
+require('../constants/componentProps/underline.js');
+require('lodash/castArray');
+require('lodash/camelCase');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
@@ -132,7 +137,7 @@ const Button = /*#__PURE__*/React__default.default.forwardRef(function Button(pr
     label: labelStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement(index.LinkWrapper, {
-    className: clsx__default.default(className, 'button', type && `button_type_${type}`, borderWidthClass, borderColorClass, borderTypeClass, fillClass || buttonConfig.appearance[appearance] && `fill_${buttonConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || buttonConfig.appearance[appearance] && `fill_hover_${buttonConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, sizeClass, widthClass, elevationClass, onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading', !label && (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc || icon || iconSrc) && 'button_type_icon', label && (after || before || icon || iconAfter || iconAfterSrc || iconBefore || iconBeforeSrc || iconSrc) && `button_type_with-icon button_type_with-icon_${size}`),
+    className: clsx__default.default(className, 'button', type && `button_type_${type}`, borderWidthClass, borderColorClass, borderTypeClass, fillClass || buttonConfig.appearance[appearance] && `fill_${buttonConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || buttonConfig.appearance[appearance] && `fill_hover_${buttonConfig.appearance[appearance].fillHover}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, sizeClass, widthClass, elevationClass, onClick && 'cursor_type_pointer', isDisabled && 'cursor_type_default', Badge && 'button_type_badge', loading && 'button_state_loading', !label && (iconBefore || iconBeforeSrc || iconAfter || iconAfterSrc || icon || iconSrc) && 'button_type_icon', label && (after || before || icon || iconAfter || iconAfterSrc || iconBefore || iconBeforeSrc || iconSrc) && `button_type_with-icon button_type_with-icon_${size}`),
     "data-tour": dataTour,
     DefaultComponent: "button",
     disabled: isDisabled,

package/dist/components/Cell.js

@@ -30,9 +30,13 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');
-require('../constants/componentProps/textAlign.js');
 require('lodash/castArray');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/components/Chips.js

@@ -85,7 +85,7 @@ function Chips(props) {
     styles: chipsStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'chips', fillClass || chipsConfig.appearance[appearance] && `fill_${chipsConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || chipsConfig.appearance[appearance] && `fill_hover_${chipsConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && `chips_type_${type}`),
+    className: clsx__default.default(className, 'chips', fillClass || chipsConfig.appearance[appearance] && `fill_${chipsConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || chipsConfig.appearance[appearance] && `fill_hover_${chipsConfig.appearance[appearance].fillHover}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && `chips_type_${type}`),
     style: chipsStyles,
     onClick: onClick
   }, /*#__PURE__*/React__default.default.createElement("div", {

package/dist/components/Choice.js

@@ -31,6 +31,11 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('lodash/castArray');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/components/ContextMenu.js

@@ -33,6 +33,11 @@ require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('../constants/componentProps/direction.js');
 require('../constants/componentProps/width.js');
 

package/dist/components/CookiesWarning.js

@@ -32,11 +32,15 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('./Loader.js');
 require('../constants/componentProps/width.js');
 require('../constants/componentProps/direction.js');
 require('../constants/componentProps/stacking.js');
-require('../constants/componentProps/wrap.js');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
 require('lodash/castArray');

package/dist/components/DatePicker.js

@@ -41,6 +41,10 @@ require('react-inlinesvg');
 require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 

package/dist/components/Dropdown.js

@@ -105,11 +105,15 @@ function Dropdown(props) {
     prefix: 'elevation_',
     propsKey: 'elevation'
   });
+  const alignmentClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'alignment_',
+    propsKey: 'alignment'
+  });
   const {
     styles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'dropdown', set && `dropdown_set_${set}`, shapeClass, elevationClass, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className),
+    className: clsx__default.default(className, 'dropdown', alignmentClass, set && `dropdown_set_${set}`, shapeClass, elevationClass, isOpen ? 'dropdown_state_open' : 'dropdown_state_close', animationState.className),
     ref: dropdownRef,
     style: styles
   }, children && /*#__PURE__*/React__default.default.createElement("div", {
@@ -125,7 +129,8 @@ Dropdown.propTypes = {
 };
 Dropdown.defaultProps = {
   animationOpen: 'dropdown_animation_open',
-  animationClose: 'dropdown_animation_close'
+  animationClose: 'dropdown_animation_close',
+  set: 'normal'
 };
 Dropdown.__docgenInfo = {
   "description": "",
@@ -146,6 +151,13 @@ Dropdown.__docgenInfo = {
       },
       "required": false
     },
+    "set": {
+      "defaultValue": {
+        "value": "'normal'",
+        "computed": false
+      },
+      "required": false
+    },
     "className": {
       "description": "",
       "type": {

package/dist/components/Empty.js

@@ -32,6 +32,11 @@ require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('./Loader.js');
 require('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');

package/dist/components/FormField.js

@@ -15,7 +15,7 @@ require('lodash/castArray');
 require('lodash/camelCase');
 require('../context/UIContext.js');
 var index$4 = require('./Switch.js');
-var SelectContainer = require('../SelectContainer-meg_EXPO.js');
+var SelectContainer = require('../SelectContainer-umrbJtB5.js');
 require('../constants/componentProps/fill.js');
 require('../constants/componentProps/width.js');
 require('lodash/maxBy');
@@ -38,12 +38,17 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('react-select');
 require('../defineProperty-ujK-k7aM.js');
 require('react-dom');
+require('./Badge.js');
 require('./Group.js');
 require('../constants/componentProps/stacking.js');
-require('../constants/componentProps/wrap.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 

package/dist/components/Icon.js

@@ -13,6 +13,7 @@ var borderType = require('../constants/componentProps/borderType.js');
 var iconSize = require('../constants/componentProps/iconSize.js');
 var shape = require('../constants/componentProps/shape.js');
 var strokeColor = require('../constants/componentProps/strokeColor.js');
+var index$1 = require('./Tooltip.js');
 require('../constants/componentProps/size.js');
 require('../constants/componentProps/textColor.js');
 require('../constants/componentProps/textGradient.js');
@@ -28,6 +29,13 @@ require('react-responsive');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
+require('./Text.js');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -43,6 +51,7 @@ const iconConfig = {
   }
 };
 const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props, ref) {
+  const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
   const {
     before,
     after,
@@ -58,6 +67,12 @@ const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props,
     linkRel,
     width,
     height,
+    showTooltip,
+    tooltipText,
+    tooltipTextSize,
+    tooltipTitle,
+    tooltipTitleSize,
+    tooltipAppearance,
     onClick
   } = props;
   const svgSizes = React.useMemo(() => {
@@ -138,6 +153,10 @@ const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props,
     prefix: 'border_type_',
     propsKey: 'borderType'
   });
+  const alignmentClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'alignment_',
+    propsKey: 'alignment'
+  });
   const {
     styles: iconStyles
   } = useStyles.useStyles(props);
@@ -164,14 +183,23 @@ const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props,
     id: id,
     ref: ref,
     style: iconStyles,
-    onClick: onClick
+    onClick: onClick,
+    onMouseEnter: () => setIsTooltipVisible(true),
+    onMouseLeave: () => setIsTooltipVisible(false)
   }, /*#__PURE__*/React__default.default.createElement(index.LinkWrapper, {
     className: clsx__default.default(link || href ? 'icon__link' : 'icon__item', iconSizeClass),
     DefaultComponent: "div",
     href: link || href,
     rel: linkRel,
     target: linkTarget
-  }, before, ImageComponent, after, Badge));
+  }, before, ImageComponent, after, Badge, isTooltipVisible && showTooltip && /*#__PURE__*/React__default.default.createElement(index$1.Tooltip, {
+    className: clsx__default.default(className, 'icon__tooltip', alignmentClass),
+    appearance: tooltipAppearance,
+    text: tooltipText,
+    textSize: tooltipTextSize,
+    title: tooltipTitle,
+    titleSize: tooltipTitleSize
+  })));
 });
 Icon.propTypes = {
   borderColor: PropTypes__default.default.oneOf(borderColor.default),