@itcase/ui 1.0.92 → 1.0.94

package/dist/components/Flex.js

@@ -600,7 +600,9 @@ Flex.__docgenInfo = {
 function FlexItem(props) {
   const {
     children,
-    className
+    className,
+    tag: Tag,
+    htmlFor
   } = props;
   const alignSelfClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'flex__item_align-self_',
@@ -630,6 +632,10 @@ function FlexItem(props) {
     prefix: 'fill_',
     propsKey: 'fill'
   });
+  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_hover_',
+    propsKey: 'fillHover'
+  });
   const widthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'resize-horizontal_',
     propsKey: 'width'
@@ -645,8 +651,9 @@ function FlexItem(props) {
   const {
     styles: flexItemStyles
   } = useStyles.useStyles(props);
-  return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'flex__item', positionClass, alignItemsClass, alignSelfClass, directionClass, fillClass, growClass, justifyContentClass, shapeClass, widthClass, wrapClass),
+  return /*#__PURE__*/React__default.default.createElement(Tag, {
+    className: clsx__default.default(className, 'flex__item', positionClass, alignItemsClass, alignSelfClass, directionClass, fillClass, fillHoverClass, growClass, justifyContentClass, shapeClass, widthClass, wrapClass),
+    htmlFor: htmlFor,
     style: flexItemStyles
   }, children);
 }
@@ -706,11 +713,21 @@ FlexItem.propTypes = {
   wrapMobile: PropTypes__default.default.oneOf(flexWrap.default),
   wrapTablet: PropTypes__default.default.oneOf(flexWrap.default)
 };
+FlexItem.defaultProps = {
+  tag: 'div'
+};
 FlexItem.__docgenInfo = {
   "description": "",
   "methods": [],
   "displayName": "FlexItem",
   "props": {
+    "tag": {
+      "defaultValue": {
+        "value": "'div'",
+        "computed": false
+      },
+      "required": false
+    },
     "alignItems": {
       "description": "",
       "type": {

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/Grid.js

@@ -808,6 +808,10 @@ function GridItem(props) {
     prefix: 'fill_',
     propsKey: 'fill'
   });
+  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_hover_',
+    propsKey: 'fillHover'
+  });
   const gapClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'gap_',
     propsKey: 'gap'
@@ -828,7 +832,7 @@ function GridItem(props) {
     styles: gridItemStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'grid__item', orderClass, fillClass, alignSelfClass, justifySelfClass, columnStartClass, columnEndClass, columnSpanClass, rowStartClass, rowEndClass, rowSpanClass, directionClass, gapClass, rowGapClass, columnGapClass),
+    className: clsx__default.default(className, 'grid__item', orderClass, fillClass, fillHoverClass, alignSelfClass, justifySelfClass, columnStartClass, columnEndClass, columnSpanClass, rowStartClass, rowEndClass, rowSpanClass, directionClass, gapClass, rowGapClass, columnGapClass),
     "data-tour": dataTour,
     id: id,
     style: gridItemStyles,

package/dist/components/Group.js

@@ -32,6 +32,8 @@ function Group(props) {
     children,
     className,
     horizontalScroll,
+    tag: Tag,
+    htmlFor,
     set,
     style,
     dataTour,
@@ -113,9 +115,10 @@ function Group(props) {
     styles: groupStyles,
     wrapper: groupWrapperStyles
   } = useStyles.useStyles(props);
-  return /*#__PURE__*/React__default.default.createElement("div", {
+  return /*#__PURE__*/React__default.default.createElement(Tag, {
     className: clsx__default.default(className, 'group', widthClass, heightClass, columnsClass, contentAlignClass, alignDirectionClass, directionClass, alignClass, fillClass, fillHoverClass, set && `group_set_${set}`, horizontalScroll && 'group_type_horizontal_scroll', stackingClass, wrapClass, growClass, shapeClass, borderColorClass, borderWidthClass, borderTypeClass, elevationClass, justifyContentClass),
     "data-tour": dataTour,
+    htmlFor: htmlFor,
     id: id,
     style: Object.assign({}, groupStyles, style),
     onClick: onClick
@@ -140,6 +143,7 @@ Group.propTypes = {
   contentAlignDesktop: PropTypes__default.default.oneOf([null, 'center']),
   contentAlignMobile: PropTypes__default.default.oneOf([null, 'center']),
   contentAlignTablet: PropTypes__default.default.oneOf([null, 'center']),
+  tag: PropTypes__default.default.string,
   stacking: PropTypes__default.default.oneOf(stacking.default),
   stackingDesktop: PropTypes__default.default.oneOf(stacking.default),
   stackingMobile: PropTypes__default.default.oneOf(stacking.default),
@@ -166,13 +170,28 @@ Group.propTypes = {
   columnsTablet: PropTypes__default.default.number,
   set: PropTypes__default.default.string,
   horizontalScroll: PropTypes__default.default.bool,
-  onClick: PropTypes__default.default.func
+  onClick: PropTypes__default.default.func,
+  htmlFor: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number])
+};
+Group.defaultProps = {
+  tag: 'div'
 };
 Group.__docgenInfo = {
   "description": "",
   "methods": [],
   "displayName": "Group",
   "props": {
+    "tag": {
+      "defaultValue": {
+        "value": "'div'",
+        "computed": false
+      },
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
     "id": {
       "description": "",
       "type": {
@@ -542,6 +561,18 @@ Group.__docgenInfo = {
         "name": "func"
       },
       "required": false
+    },
+    "htmlFor": {
+      "description": "",
+      "type": {
+        "name": "union",
+        "value": [{
+          "name": "string"
+        }, {
+          "name": "number"
+        }]
+      },
+      "required": false
     }
   }
 };

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),

package/dist/components/Image.js

@@ -34,6 +34,7 @@ function Image(props) {
     className,
     imageWrapperClassName,
     imageClassName,
+    mode,
     overlay,
     src,
     title,
@@ -85,16 +86,21 @@ function Image(props) {
     prefix: 'border-color-image_',
     propsKey: 'borderColorImage'
   });
+  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_',
+    propsKey: 'fill'
+  });
+  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'fill_hover_',
+    propsKey: 'fillHover'
+  });
   const {
-    // left
     styles,
-    // leftImageWrapper
     wrapper: wrapperStyles,
-    // leftImage
     image: imageStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'image', type && `image_type_${type}`, cursorClass, horizontalAlignClass, verticalAlignClass, shapeClass, resizeModeClass, widthClass, heightClass),
+    className: clsx__default.default(className, 'image', mode && `image_mode_${mode}`, type && `image_type_${type}`, cursorClass, horizontalAlignClass, verticalAlignClass, shapeClass, fillClass, fillHoverClass, resizeModeClass, widthClass, heightClass),
     onClick: onClick,
     style: styles
   }, before, /*#__PURE__*/React__default.default.createElement("div", {

package/dist/components/InputPassword.js

@@ -28,6 +28,14 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.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');
 require('lodash/castArray');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }

package/dist/components/Label.js

@@ -48,6 +48,7 @@ function Label(props) {
     labelTextWrap,
     labelTextColor,
     labelTextColorHover,
+    mode,
     set,
     before,
     after,
@@ -104,7 +105,7 @@ function Label(props) {
     styles: labelStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'label', fillClass || labelConfig.appearance[appearance] && `fill_${labelConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || labelConfig.appearance[appearance] && `fill_hover_${labelConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, wrapClass, widthClass, alignDirectionClass, alignClass, textAlignClass, type && `label_type_${type}`, set && `label_set_${set}`, onClick && (cursor || 'cursor_type_pointer')),
+    className: clsx__default.default(className, 'label', fillClass || labelConfig.appearance[appearance] && `fill_${labelConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || labelConfig.appearance[appearance] && `fill_hover_${labelConfig.appearance[appearance].fillHover}`.replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, wrapClass, widthClass, alignDirectionClass, alignClass, textAlignClass, type && `label_type_${type}`, set && `label_set_${set}`, mode && `label_mode_${mode}`, onClick && (cursor || 'cursor_type_pointer')),
     "data-tour": dataTour,
     style: labelStyles,
     onClick: onClick

package/dist/components/LanguageSelector.js

@@ -29,6 +29,14 @@ require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
 require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
+require('./Tooltip.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 }; }
 

package/dist/components/Loader.js

@@ -28,6 +28,7 @@ var React__default = /*#__PURE__*/_interopDefault(React);
 var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 
+// TODO: is better to use context?
 const loaderConfig = {
   appearance: {},
   setAppearance: newComponent => {
@@ -67,18 +68,24 @@ function Loader(props) {
   const {
     styles: loader
   } = useStyles.useStyles(props);
-  const itemFill = itemFillClass || loaderConfig.appearance[appearance] && `fill_${loaderConfig.appearance[appearance].itemFillClass.replace(/([A-Z])/g, '-$1')}`.toLowerCase();
+
+  /*
+   * TODO: set temporary variables by other way
+   */
+  const temporaryFillClass = fillClass || loaderConfig.appearance[appearance] && `fill_${loaderConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase();
+  const temporaryItemFillClass = itemFillClass || loaderConfig.appearance[appearance] && `fill_${loaderConfig.appearance[appearance].itemFill?.replace(/([A-Z])/g, '-$1')}`.toLowerCase();
+  /* - */
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('loader', positionClass, widthClass, heightClass, fillClass || loaderConfig.appearance[appearance] && `fill_${loaderConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), className, set && `loader_set_${set}`),
+    className: clsx__default.default('loader', positionClass, widthClass, heightClass, temporaryFillClass, className, set && `loader_set_${set}`),
     style: loader
   }, children || /*#__PURE__*/React__default.default.createElement("div", {
     className: "loader__inner"
   }, /*#__PURE__*/React__default.default.createElement("span", {
-    className: clsx__default.default('loader__item', itemFill)
+    className: clsx__default.default('loader__item', temporaryItemFillClass)
   }), /*#__PURE__*/React__default.default.createElement("span", {
-    className: clsx__default.default('loader__item', itemFill)
+    className: clsx__default.default('loader__item', temporaryItemFillClass)
   }), /*#__PURE__*/React__default.default.createElement("span", {
-    className: clsx__default.default('loader__item', itemFill)
+    className: clsx__default.default('loader__item', temporaryItemFillClass)
   })), text && /*#__PURE__*/React__default.default.createElement(index.Text, {
     className: "loader__text",
     size: textSize,
@@ -86,19 +93,20 @@ function Loader(props) {
   }, text));
 }
 Loader.propTypes = {
-  className: PropTypes__default.default.string,
+  appearance: PropTypes__default.default.string,
   children: PropTypes__default.default.any,
+  className: PropTypes__default.default.string,
+  set: PropTypes__default.default.string,
   text: PropTypes__default.default.string,
-  textSize: PropTypes__default.default.string,
   textColor: PropTypes__default.default.string,
-  set: PropTypes__default.default.string
+  textSize: PropTypes__default.default.string
 };
 Loader.__docgenInfo = {
   "description": "",
   "methods": [],
   "displayName": "Loader",
   "props": {
-    "className": {
+    "appearance": {
       "description": "",
       "type": {
         "name": "string"
@@ -112,14 +120,21 @@ Loader.__docgenInfo = {
       },
       "required": false
     },
-    "text": {
+    "className": {
       "description": "",
       "type": {
         "name": "string"
       },
       "required": false
     },
-    "textSize": {
+    "set": {
+      "description": "",
+      "type": {
+        "name": "string"
+      },
+      "required": false
+    },
+    "text": {
       "description": "",
       "type": {
         "name": "string"
@@ -133,7 +148,7 @@ Loader.__docgenInfo = {
       },
       "required": false
     },
-    "set": {
+    "textSize": {
       "description": "",
       "type": {
         "name": "string"

package/dist/components/Logo.js

@@ -35,9 +35,10 @@ var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 function Logo(props) {
   const {
     className,
-    size,
-    link,
     href,
+    link,
+    mode,
+    size,
     source,
     src
   } = props;
@@ -61,7 +62,7 @@ function Logo(props) {
     styles: logo
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'logo', alignDirectionClass, alignClass, widthClass, alignItemsClass, size && `logo_size_${size}`),
+    className: clsx__default.default(className, 'logo', alignDirectionClass, alignClass, widthClass, alignItemsClass, size && `logo_size_${size}`, mode && `logo_mode_${mode}`),
     style: logo
   }, link || href ? /*#__PURE__*/React__default.default.createElement(index.LinkWrapper, {
     href: link || href

package/dist/components/MenuItem.js

@@ -135,7 +135,7 @@ function MenuItem(props) {
     styles: menuItem
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass, className, sizeClass, fillClass || appearance && `fill_${menuItemConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, set && `menu-item_set_${set}`, justifyContentClass),
+    className: clsx__default.default('menu-item', isActive && 'menu-item_state_active', isHover && 'menu-item_state_hover', directionClass, className, sizeClass, fillClass || appearance && `fill_${menuItemConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, set && `menu-item_set_${set}`, justifyContentClass),
     style: menuItem,
     onClick: onClick,
     onMouseEnter: onMouseEnter

package/dist/components/Notification.js

@@ -72,7 +72,7 @@ function NotificationItem(props) {
     propsKey: 'fill'
   });
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('notification__item', status && `notification__item_status_${status}`, set && `notification__item_set_${set}`, size && `notification__item_set_${size}`, closeButton && 'notification__item_type_close-button', fillClass || notificationItemConfig.appearance[appearance] && `fill_${notificationItemConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase()),
+    className: clsx__default.default('notification__item', status && `notification__item_status_${status}`, set && `notification__item_set_${set}`, size && `notification__item_set_${size}`, closeButton && 'notification__item_type_close-button', fillClass || notificationItemConfig.appearance[appearance] && `fill_${notificationItemConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase()),
     "data-tour": dataTour
   }, before, /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'notification__item-wrapper')

package/dist/components/Search.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('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');
 require('react-scrollbars-custom');

package/dist/components/Segmented.js

@@ -5,6 +5,7 @@ var PropTypes = require('prop-types');
 var clsx = require('clsx');
 var index = require('./Text.js');
 var fill = require('../constants/componentProps/fill.js');
+var textWrap = require('../constants/componentProps/textWrap.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 require('../constants/componentProps/textColor.js');
 require('../constants/componentProps/textColorActive.js');
@@ -41,6 +42,7 @@ const Segmented = /*#__PURE__*/React__default.default.forwardRef((props, ref) =>
     labelTextColor,
     labelTextActiveColor,
     labelTextSize,
+    labelTextWrap,
     onChange
   } = props;
   const controlRef = React.useRef(null);
@@ -116,7 +118,7 @@ const Segmented = /*#__PURE__*/React__default.default.forwardRef((props, ref) =>
     className: clsx__default.default('segmented__item-label'),
     htmlFor: item.label
   }, /*#__PURE__*/React__default.default.createElement(index.Text, {
-    className: "segmented__item-label-text",
+    className: clsx__default.default('segmented__item-label-text', labelTextWrap && `word-wrap_${labelTextWrap}`),
     size: labelTextSize,
     textColor: item.value === activeSegment.value ? labelTextActiveColor : labelTextColor
   }, item.label)))), /*#__PURE__*/React__default.default.createElement("div", {
@@ -132,6 +134,7 @@ Segmented.propTypes = {
    * цвет бэкграунда выбранного элемента
    */
   indicatorFill: PropTypes__default.default.oneOf(fill.default),
+  labelTextWrap: PropTypes__default.default.oneOf(textWrap.default),
   name: PropTypes__default.default.string,
   segments: PropTypes__default.default.array,
   setActiveSegment: PropTypes__default.default.func,
@@ -179,6 +182,15 @@ Segmented.__docgenInfo = {
       },
       "required": false
     },
+    "labelTextWrap": {
+      "description": "",
+      "type": {
+        "name": "enum",
+        "computed": true,
+        "value": "textWrapProps"
+      },
+      "required": false
+    },
     "name": {
       "description": "",
       "type": {

package/dist/components/Select.js

@@ -1,6 +1,6 @@
 'use strict';
 
-var SelectContainer = require('../SelectContainer-meg_EXPO.js');
+var SelectContainer = require('../SelectContainer-umrbJtB5.js');
 require('react');
 require('prop-types');
 require('clsx');
@@ -13,33 +13,38 @@ require('lodash/camelCase');
 require('../context/UIContext.js');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
-require('./Icon.js');
-require('react-inlinesvg');
-require('./Link.js');
-require('../constants/componentProps/fill.js');
-require('../constants/componentProps/size.js');
+require('./Badge.js');
+require('../constants/componentProps/shape.js');
+require('./Text.js');
 require('../constants/componentProps/textColor.js');
-require('../constants/componentProps/textGradient.js');
+require('../constants/componentProps/textColorActive.js');
+require('../constants/componentProps/textColorHover.js');
+require('../constants/componentProps/size.js');
 require('../constants/componentProps/textStyle.js');
+require('../constants/componentProps/textGradient.js');
 require('../constants/componentProps/textWeight.js');
-require('../constants/componentProps/type.js');
-require('../constants/componentProps/underline.js');
 require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
+require('./Icon.js');
+require('react-inlinesvg');
+require('./Link.js');
+require('../constants/componentProps/fill.js');
+require('../constants/componentProps/type.js');
+require('../constants/componentProps/underline.js');
 require('../constants/componentProps/borderColor.js');
 require('../constants/componentProps/borderType.js');
 require('../constants/componentProps/iconSize.js');
-require('../constants/componentProps/shape.js');
 require('../constants/componentProps/strokeColor.js');
-require('./Text.js');
-require('../constants/componentProps/textColorActive.js');
-require('../constants/componentProps/textColorHover.js');
+require('./Tooltip.js');
+require('./Title.js');
+require('../constants/componentProps/textAlign.js');
+require('../constants/componentProps/titleSize.js');
+require('../constants/componentProps/wrap.js');
 require('./Group.js');
 require('../constants/componentProps/direction.js');
 require('../constants/componentProps/stacking.js');
-require('../constants/componentProps/wrap.js');
 require('../constants/componentProps/width.js');
 require('./Divider.js');
 
@@ -50,6 +55,7 @@ exports.SelectClearIndicator = SelectContainer.SelectClearIndicator;
 exports.SelectControl = SelectContainer.SelectControl;
 exports.SelectDropdownIndicator = SelectContainer.SelectDropdownIndicator;
 exports.SelectGroupHeading = SelectContainer.SelectGroupHeading;
+exports.SelectIndicatorsContainer = SelectContainer.SelectIndicatorsContainer;
 exports.SelectInput = SelectContainer.SelectInput;
 exports.SelectMenu = SelectContainer.SelectMenu;
 exports.SelectMultiValueContainer = SelectContainer.SelectMultiValueContainer;

package/dist/components/SiteMenu.js

@@ -30,6 +30,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('../constants/componentProps/textColorActive.js');
 require('../constants/componentProps/textColorHover.js');
 

package/dist/components/Tab.js

@@ -139,7 +139,7 @@ function Tab(props) {
     styles: tab
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default('tab', isActive && 'tab_state_active', isHover && 'tab_state_hover', fillClass || tabConfig.appearance[appearance] && `fill_${tabConfig.appearance[appearance].fillClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || tabConfig.appearance[appearance] && `fill_hover_${tabConfig.appearance[appearance].fillHoverClass}`.replace(/([A-Z])/g, '-$1').toLowerCase(), className, sizeClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, reset && 'tab-reset', set && `tab_set_${set}`, justifyContentClass, onClick && 'cursor_type_pointer'),
+    className: clsx__default.default('tab', isActive && 'tab_state_active', isHover && 'tab_state_hover', fillClass || tabConfig.appearance[appearance] && `fill_${tabConfig.appearance[appearance].fill}`.replace(/([A-Z])/g, '-$1').toLowerCase(), fillHoverClass || tabConfig.appearance[appearance] && `fill_hover_${tabConfig.appearance[appearance].fillHover}`.replace(/([A-Z])/g, '-$1').toLowerCase(), className, sizeClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, reset && 'tab-reset', set && `tab_set_${set}`, justifyContentClass, onClick && 'cursor_type_pointer'),
     "data-tour": dataTour,
     style: tab,
     onClick: onClick,