@itcase/ui 1.0.49 → 1.0.50

package/dist/components/Avatar.js

@@ -9,10 +9,8 @@ var index$2 = require('./Icon.js');
 var size = require('../constants/componentProps/size.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
 require('../constants/componentProps/borderColor.js');
-require('../constants/componentProps/horizontalContentAlign.js');
 require('../constants/componentProps/resizeMode.js');
 require('../constants/componentProps/shape.js');
-require('../constants/componentProps/verticalContentAlign.js');
 require('../constants/componentProps/width.js');
 require('../hooks/useStyles.js');
 require('lodash/camelCase');

package/dist/components/Card.js

@@ -23,9 +23,7 @@ require('../context/UIContext.js');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
 require('../constants/componentProps/borderColor.js');
-require('../constants/componentProps/horizontalContentAlign.js');
 require('../constants/componentProps/resizeMode.js');
-require('../constants/componentProps/verticalContentAlign.js');
 require('../constants/componentProps/width.js');
 require('lodash/castArray');
 

package/dist/components/Icon.js

@@ -69,6 +69,10 @@ const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props,
     }
     return sizes;
   }, []);
+  const cursorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'cursor_',
+    propsKey: 'cursor'
+  });
   const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'fill_',
     propsKey: 'fill'
@@ -142,7 +146,7 @@ const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props,
     return null;
   }, [SvgImage, imageSrc]);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    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'),
+    className: clsx__default.default(className, 'icon', fillClass, fillHoverClass, fillSizeClass, iconFillClass, iconFillHoverClass, shapeClass, iconStrokeClass, iconStrokeHoverClass, borderColorClass, borderColorHoverClass, borderWidthClass, borderTypeClass, cursorClass, Badge && 'icon_type_with-badge', (link || href || onClick) && 'cursor_type_pointer'),
     id: id,
     ref: ref,
     "data-tour": dataTour,

package/dist/components/Image.js

@@ -4,10 +4,8 @@ var React = require('react');
 var PropTypes = require('prop-types');
 var clsx = require('clsx');
 var borderColor = require('../constants/componentProps/borderColor.js');
-var horizontalContentAlign = require('../constants/componentProps/horizontalContentAlign.js');
 var resizeMode = require('../constants/componentProps/resizeMode.js');
 var shape = require('../constants/componentProps/shape.js');
-var verticalContentAlign = require('../constants/componentProps/verticalContentAlign.js');
 var width = require('../constants/componentProps/width.js');
 var useStyles = require('../hooks/useStyles.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
@@ -43,12 +41,16 @@ function Image(props) {
     onClick,
     onError
   } = props;
-  const horizontalContentAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'image_horizontal-content-align_',
-    propsKey: 'horizontalContentAlign'
+  const cursorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'cursor_',
+    propsKey: 'cursor'
   });
-  const verticalContentAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'image_vertical-content-align_',
+  const horizontalAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'image_horizontal-align_',
+    propsKey: 'horizontalAlign'
+  });
+  const verticalAlignClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'image_vertical-align_',
     propsKey: 'verticalContentAlign'
   });
   const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
@@ -84,7 +86,7 @@ function Image(props) {
     image: imageStyles
   } = useStyles.useStyles(props);
   return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'image', type && `image_type_${type}`, horizontalContentAlignClass, verticalContentAlignClass, shapeClass, resizeModeClass),
+    className: clsx__default.default(className, 'image', type && `image_type_${type}`, cursorClass, horizontalAlignClass, verticalAlignClass, shapeClass, resizeModeClass),
     onClick: onClick,
     style: styles
   }, before, /*#__PURE__*/React__default.default.createElement("div", {
@@ -112,10 +114,6 @@ Image.propTypes = {
   caption: PropTypes__default.default.any,
   children: PropTypes__default.default.any,
   className: PropTypes__default.default.string,
-  horizontalContentAlign: PropTypes__default.default.oneOf(horizontalContentAlign.default),
-  horizontalContentAlignDesktop: PropTypes__default.default.oneOf(horizontalContentAlign.default),
-  horizontalContentAlignMobile: PropTypes__default.default.oneOf(horizontalContentAlign.default),
-  horizontalContentAlignTablet: PropTypes__default.default.oneOf(horizontalContentAlign.default),
   imageClassName: PropTypes__default.default.string,
   imgWrapClassName: PropTypes__default.default.string,
   onClick: PropTypes__default.default.func,
@@ -144,10 +142,6 @@ Image.propTypes = {
   imageWidthMobile: PropTypes__default.default.oneOf(width.default),
   imageWidthTablet: PropTypes__default.default.oneOf(width.default),
   imageWidthDesktop: PropTypes__default.default.oneOf(width.default),
-  verticalContentAlign: PropTypes__default.default.oneOf(verticalContentAlign.default),
-  verticalContentAlignDesktop: PropTypes__default.default.oneOf(verticalContentAlign.default),
-  verticalContentAlignMobile: PropTypes__default.default.oneOf(verticalContentAlign.default),
-  verticalContentAlignTablet: PropTypes__default.default.oneOf(verticalContentAlign.default),
   onError: PropTypes__default.default.func
 };
 

package/dist/components/Text.js

@@ -42,6 +42,10 @@ function Text(props) {
   const {
     styles: textStyles
   } = useStyles.useStyles(props);
+  const cursorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
+    prefix: 'cursor_',
+    propsKey: 'cursor'
+  });
   const sizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'text_size_',
     propsKey: 'size'
@@ -83,7 +87,7 @@ function Text(props) {
     propsKey: 'width'
   });
   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')),
+    className: clsx__default.default(className, 'text', sizeClass, weightClass, textColorClass, textColorActiveClass, textColorHoverClass, textGradientClass, textStyleClass, textTruncateClass, textWrapClass, type && `text_type_${type}`, widthClass, cursorClass, onClick && (cursor || 'cursor_type_pointer')),
     "data-tour": dataTour,
     htmlFor: htmlFor,
     style: textStyles,

package/dist/css/components/Image/Image.css

@@ -6,7 +6,7 @@
   }
 }
 .image {
-  &_horizontal-content-align {
+  &_horizontal-align {
     &_center {
       ^^&__wrapper {
         width: 100%;
@@ -26,6 +26,14 @@
         }
       }
     }
+    &_contain {
+      > ^^&__wrapper {
+        & > ^^^&__item {
+          width: 100%;
+          object-fit: contain;
+        }
+      }
+    }
   }
 }
 .image {
@@ -82,7 +90,7 @@
   }
 }
 .image {
-  &_vertical-content-align {
+  &_vertical-align {
     &_center {
       ^^&__wrapper {
         height: 100%;

package/package.json

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