@itcase/ui 1.0.18 → 1.0.20

package/dist/components/Button.js

@@ -51,6 +51,7 @@ var Button = /*#__PURE__*/React__default.default.forwardRef(function Button(prop
   var before = props.before,
     after = props.after,
     className = props.className,
+    dataTour = props.dataTour,
     Badge = props.Badge,
     children = props.children,
     iconAfter = props.iconAfter,
@@ -132,7 +133,8 @@ var Button = /*#__PURE__*/React__default.default.forwardRef(function Button(prop
     target: target,
     type: htmlType,
     onClick: onClick,
-    onMouseDown: onMouseDown
+    onMouseDown: onMouseDown,
+    "data-tour": dataTour
   }, /*#__PURE__*/React__default.default.createElement("div", {
     className: "button__wrapper",
     ref: ref

package/dist/components/Grid.js

@@ -39,6 +39,7 @@ function Grid(props) {
     type = props.type,
     useGridSystem = props.useGridSystem,
     Tag = props.tag,
+    dataTour = props.dataTour,
     verticalResizing = props.verticalResizing;
   var columnsClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'grid_columns_',
@@ -100,7 +101,8 @@ function Grid(props) {
     className: clsx__default.default(className, 'grid', useGridSystem && "grid_state_system", type && "grid_type_" + type, columnsClass, rowsClass, rowGapClass, columnGapClass, alignContentClass, alignItemsClass, justifyContentClass, justifyItemsClass, fillClass, horizontalResizing && "grid_horizontal-resizing_" + horizontalResizing, verticalResizing && "grid_vertical-resizing_" + verticalResizing),
     id: id,
     style: gridStyles,
-    onClick: onClick
+    onClick: onClick,
+    "data-tour": dataTour
   }, before && /*#__PURE__*/React__default.default.createElement("div", {
     className: "grid__before"
   }, before), children, after && /*#__PURE__*/React__default.default.createElement("div", {
@@ -186,7 +188,8 @@ Grid.defaultProps = {
 function GridItem(props) {
   var id = props.id,
     children = props.children,
-    className = props.className;
+    className = props.className,
+    dataTour = props.dataTour;
   var orderClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'order_',
     propsKey: 'order'
@@ -236,6 +239,7 @@ function GridItem(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),
     id: id,
+    "data-tour": dataTour,
     style: gridItemStyles
   }, children);
 }
@@ -292,7 +296,8 @@ GridItem.propTypes = {
 function GridRow(props) {
   var id = props.id,
     children = props.children,
-    className = props.className;
+    className = props.className,
+    dataTour = props.dataTour;
   var fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'fill_',
     propsKey: 'fill'
@@ -306,7 +311,8 @@ function GridRow(props) {
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'grid__row', fillClass, fillHoverClass),
     id: id,
-    style: gridRowStyles
+    style: gridRowStyles,
+    "data-tour": dataTour
   }, children);
 }
 GridRow.propTypes = {

package/dist/components/Group.js

@@ -32,7 +32,8 @@ function Group(props) {
     className = props.className,
     horizontalScroll = props.horizontalScroll,
     set = props.set,
-    style = props.style;
+    style = props.style,
+    dataTour = props.dataTour;
   var contentAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'group_content-align_',
     propsKey: 'contentAlign'
@@ -107,6 +108,7 @@ function Group(props) {
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'group', widthClass, 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),
     id: id,
+    "data-tour": dataTour,
     style: Object.assign({}, groupStyles, style)
   }, horizontalScroll ? /*#__PURE__*/React__default.default.createElement("div", {
     className: "group__wrapper",

package/dist/components/Icon.js

@@ -48,7 +48,8 @@ var Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props, r
     id = props.id,
     imageSrc = props.imageSrc;
     props.simple;
-    var className = props.className,
+    var dataTour = props.dataTour,
+    className = props.className,
     href = props.href,
     link = props.link,
     linkTarget = props.linkTarget,
@@ -141,6 +142,7 @@ var Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props, r
     className: clsx__default.default(className, 'icon', fillClass, fillHoverClass, fillSizeClass, iconFillClass, iconFillHoverClass, shapeClass, iconStrokeClass, iconStrokeHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'),
     id: id,
     ref: ref,
+    "data-tour": dataTour,
     style: iconStyles,
     onClick: onClick
   }, /*#__PURE__*/React__default.default.createElement(index.LinkWrapper, {

package/dist/components/Label.js

@@ -45,6 +45,7 @@ function Label(props) {
     labelTextWrap = props.labelTextWrap,
     labelTextColor = props.labelTextColor,
     set = props.set,
+    dataTour = props.dataTour,
     type = props.type;
   var alignDirectionClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'align_',
@@ -78,6 +79,7 @@ function Label(props) {
     labelStyles = _useStyles.styles;
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'label', fillClass || appearance && ("fill_" + labelConfig.appearance[appearance].fillClass).replace(/([A-Z])/g, '-$1').toLowerCase(), shapeClass, borderClass, borderTypeClass, sizeClass, alignDirectionClass, alignClass, type && "label_type_" + type, set && "label_set_" + set),
+    "data-tour": dataTour,
     style: labelStyles
   }, /*#__PURE__*/React__default.default.createElement("div", {
     className: "label__inner"

package/dist/components/Search.js

@@ -44,6 +44,7 @@ var SearchInput = /*#__PURE__*/React__default.default.forwardRef(function Search
     before = props.before,
     className = props.className,
     size = props.size,
+    dataTour = props.dataTour,
     iconAfter = props.iconAfter;
     props.iconAfterBgFill;
     var iconAfterFill = props.iconAfterFill,
@@ -158,6 +159,7 @@ var SearchInput = /*#__PURE__*/React__default.default.forwardRef(function Search
     searchInputStyles = _useStyles.styles;
   return /*#__PURE__*/React__default.default.createElement("label", {
     className: clsx__default.default(className, 'search-input', shapeClass, fillClass, widthClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, size && "search-input_size_" + size, type && "search-input_type_" + type),
+    "data-tour": dataTour,
     style: searchInputStyles
   }, before, iconBefore && /*#__PURE__*/React__default.default.createElement(index.Icon, {
     className: "search-input__icon search-input__icon-before",

package/dist/components/Segmented.js

@@ -109,6 +109,7 @@ var Segmented = /*#__PURE__*/React__default.default.forwardRef(function (props,
       className: clsx__default.default('segmented__item-label'),
       htmlFor: item.label
     }, /*#__PURE__*/React__default.default.createElement(index.Text, {
+      className: "segmented__item-label-text",
       textColor: item.value === activeSegment.value ? labelTextActiveColor : labelTextColor,
       size: labelTextSize
     }, item.label)));

package/dist/components/Tab.js

@@ -68,7 +68,8 @@ function Tab(props) {
     labelTextSize = props.labelTextSize,
     labelTextWrap = props.labelTextWrap,
     labelTextStyle = props.labelTextStyle,
-    labeTextlWeight = props.labeTextlWeight,
+    labelTextWeight = props.labelTextWeight,
+    dataTour = props.dataTour,
     dividerFill = props.dividerFill,
     dividerFillHover = props.dividerFillHover,
     dividerFillActive = props.dividerFillActive,
@@ -140,7 +141,8 @@ function Tab(props) {
     className: clsx__default.default('tab', isActive && 'tab_state_active', isHover && 'tab_state_hover', appearance && ("fill_" + tabConfig.appearance[appearance].fillClass).replace(/([A-Z])/g, '-$1').toLowerCase(), appearance && ("fill_hover_" + tabConfig.appearance[appearance].fillHoverClass).replace(/([A-Z])/g, '-$1').toLowerCase(), className, sizeClass, fillClass, fillHoverClass, fillActiveClass, fillActiveHoverClass, fillDisabledClass, shapeClass, typeClass, widthClass, set && "tab_set_" + set, justifyContentClass),
     style: tab,
     onClick: onClick,
-    onMouseEnter: onMouseEnter
+    onMouseEnter: onMouseEnter,
+    "data-tour": dataTour
   }, /*#__PURE__*/React__default.default.createElement(index.Link, {
     href: link || href,
     className: clsx__default.default('tab__link', alignDirectionClass, alignClass),
@@ -154,7 +156,7 @@ function Tab(props) {
     textColorActive: isActive && labelColorActive || appearance && tabConfig.appearance[appearance].labelColorActive.replace(/([A-Z])/g, '-$1').toLowerCase(),
     textGradient: labelTextGradient,
     size: labelTextSize,
-    textWeight: labeTextlWeight,
+    textWeight: labelTextWeight,
     textColor: labelColor || appearance && tabConfig.appearance[appearance].labelColor.replace(/([A-Z])/g, '-$1').toLowerCase(),
     textWrap: labelTextWrap,
     textColorHover: labelTextColorHover,
@@ -211,7 +213,7 @@ Tab.propTypes = (_Tab$propTypes = {
   labelTextColorHover: PropTypes__default.default.oneOf(textColorHover.default),
   labelColorActive: PropTypes__default.default.oneOf(textColorActive.default),
   labelTextGradient: PropTypes__default.default.oneOf(textGradient.default)
-}, _Tab$propTypes["labelTextSize"] = PropTypes__default.default.oneOf(size.default), _Tab$propTypes.labelTextWrap = PropTypes__default.default.string, _Tab$propTypes.labelTextStyle = PropTypes__default.default.oneOf(textStyle.default), _Tab$propTypes.labeTextlWeight = PropTypes__default.default.oneOf(textWeight.default), _Tab$propTypes.type = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeDesktop = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeMobile = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeTablet = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.title = PropTypes__default.default.string, _Tab$propTypes.underline = PropTypes__default.default.oneOf(underline.default), _Tab$propTypes);
+}, _Tab$propTypes["labelTextSize"] = PropTypes__default.default.oneOf(size.default), _Tab$propTypes.labelTextWrap = PropTypes__default.default.string, _Tab$propTypes.labelTextStyle = PropTypes__default.default.oneOf(textStyle.default), _Tab$propTypes.labelTextWeight = PropTypes__default.default.oneOf(textWeight.default), _Tab$propTypes.type = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeDesktop = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeMobile = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.typeTablet = PropTypes__default.default.oneOf(type.default), _Tab$propTypes.title = PropTypes__default.default.string, _Tab$propTypes.underline = PropTypes__default.default.oneOf(underline.default), _Tab$propTypes);
 Tab.defaultProps = {
   size: 'normal',
   LinkComponent: 'a',
@@ -220,6 +222,7 @@ Tab.defaultProps = {
 
 function TabGroup(props) {
   var id = props.id,
+    dataTour = props.dataTour,
     children = props.children,
     className = props.className,
     horizontalScroll = props.horizontalScroll,
@@ -271,6 +274,7 @@ function TabGroup(props) {
   return /*#__PURE__*/React__default.default.createElement("div", {
     className: clsx__default.default(className, 'tab-group', 'group', widthClass, contentAlignClass, alignDirectionClass, directionClass, alignClass, fillClass, set && "group_set_" + set, horizontalScroll && 'group_type_horizontal_scroll', wrapClass, borderColorClass, borderWidthClass, borderTypeClass),
     id: id,
+    "data-tour": dataTour,
     style: Object.assign({}, groupStyles, style)
   }, horizontalScroll ? /*#__PURE__*/React__default.default.createElement("div", {
     className: "group__wrapper",

package/dist/components/Text.js

@@ -28,6 +28,7 @@ var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 
 function Text(props) {
   var after = props.after,
+    dataTour = props.dataTour,
     before = props.before,
     children = props.children,
     className = props.className,
@@ -80,6 +81,7 @@ function Text(props) {
   });
   return /*#__PURE__*/React__default.default.createElement(Tag, {
     className: clsx__default.default(className, 'text', sizeClass, weightClass, textColorClass, textColorActiveClass, textColorHoverClass, textGradientClass, textStyleClass, textTruncateClass, textWrapClass, type && "text_type_" + type, widthClass, onClick && (cursor || 'cursor_type_pointer')),
+    "data-tour": dataTour,
     htmlFor: htmlFor,
     style: textStyles,
     onClick: onClick

package/dist/components/Title.js

@@ -30,7 +30,8 @@ var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
 var clsx__default = /*#__PURE__*/_interopDefault(clsx);
 
 function Title(props) {
-  var tag = props.tag,
+  var dataTour = props.dataTour,
+    tag = props.tag,
     text = props.text,
     textWrap = props.textWrap;
   var children = props.children,
@@ -105,6 +106,7 @@ function Title(props) {
   }, [isMobile, isTablet, isDesktop]);
   return /*#__PURE__*/React__default.default.createElement(Tag, {
     className: clsx__default.default(className, 'title', fillColorClass, size && "title_size_" + size, textColorClass, textColorActiveClass, textColorHoverClass, typeClass, textGradientClass, textStyleClass, weightClass, textWrap && "word-wrap_" + textWrap),
+    "data-tour": dataTour,
     onClick: onClick,
     style: titleStyles
   }, /*#__PURE__*/React__default.default.createElement("span", {

package/dist/css/components/Notification/Notification.css

@@ -12,6 +12,7 @@
       width: 100%;
       align-items: flex-end;
       display: flex;
+      flex-flow: column nowrap;
     }
   }
 }

package/dist/css/components/Segmented/Segmented.css

@@ -66,6 +66,9 @@
           z-index: 3;
           transition: color 0.5s ease;
           cursor: pointer;
+          &-text {
+             @mixin word-wrap;
+          }
         }
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@itcase/ui",
-  "version": "1.0.18",
+  "version": "1.0.20",
   "description": "UI components (Modal, Loader, Popup, etc)",
   "keywords": [
     "Modal",