@itcase/ui 1.1.7 → 1.1.8

package/dist/cjs/components/Icon.js

@@ -1,641 +1,39 @@
 'use strict';
 
-var React = require('react');
-var PropTypes = require('prop-types');
-var clsx = require('clsx');
-var SVG = require('react-inlinesvg');
-var index = require('./Link.js');
-var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
-var useStyles = require('../hooks/useStyles.js');
-var fill = require('../constants/componentProps/fill.js');
-var borderColor = require('../constants/componentProps/borderColor.js');
-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');
-require('../constants/componentProps/textStyle.js');
-require('../constants/componentProps/textWeight.js');
-require('../constants/componentProps/type.js');
-require('../constants/componentProps/underline.js');
+var Icon = require('../Icon-UBahY607.js');
+require('../Link-BoShjCEw.js');
+require('../jsx-runtime-BCmQOGxJ.js');
+require('react');
+require('clsx');
+require('../hooks/useDeviceTargetClass.js');
 require('lodash/castArray');
 require('lodash/camelCase');
 require('../context/UIContext.js');
+require('prop-types');
 require('../hooks/useMediaQueries.js');
 require('react-responsive');
+require('../hooks/useStyles.js');
 require('lodash/maxBy');
 require('lodash/upperFirst');
 require('../hooks/styleAttributes.js');
-require('../Text-CfBPhwqK.js');
-require('../jsx-runtime-BCmQOGxJ.js');
+require('react-inlinesvg');
+require('./Tooltip.js');
+require('../Text-D7Aq1i5R.js');
 require('./Title.js');
+require('../constants/componentProps/fill.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/wrap.js');
+require('../constants/componentProps/size.js');
 require('../constants/componentProps/textSize.js');
+require('../constants/componentProps/shape.js');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
-
-var React__default = /*#__PURE__*/_interopDefault(React);
-var PropTypes__default = /*#__PURE__*/_interopDefault(PropTypes);
-var clsx__default = /*#__PURE__*/_interopDefault(clsx);
-var SVG__default = /*#__PURE__*/_interopDefault(SVG);
 
-const iconConfig = {
-  appearance: {},
-  setAppearance: newComponent => {
-    iconConfig.appearance = newComponent;
-  }
-};
-const Icon = /*#__PURE__*/React__default.default.forwardRef(function Icon(props, ref) {
-  const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
-  const {
-    Badge,
-    SvgImage,
-    after,
-    before,
-    className,
-    dataTour,
-    height,
-    href,
-    id,
-    imageSrc,
-    link,
-    linkRel,
-    linkTarget,
-    showTooltip,
-    tooltipAppearance,
-    tooltipText,
-    tooltipTextSize,
-    tooltipTitle,
-    tooltipTitleSize,
-    width,
-    onClick
-  } = props;
-  const svgSizes = React.useMemo(() => {
-    const sizes = {};
-    if (width) {
-      sizes.width = width;
-    }
-    if (height) {
-      sizes.height = height;
-    }
-    return sizes;
-  }, [height, width]);
-  const cursorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'cursor_',
-    propsKey: 'cursor'
-  });
-  const fillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_',
-    propsKey: 'fill'
-  });
-  const fillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_hover_',
-    propsKey: 'fillHover'
-  });
-  const fillDisabledClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'fill_disabled_',
-    propsKey: 'fillDisabled'
-  });
-  const fillSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_fill_size_',
-    propsKey: 'fillSize'
-  });
-  const iconFillClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_fill_',
-    propsKey: 'iconFill'
-  });
-  const iconFillHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_fill_hover_',
-    propsKey: 'iconFillHover'
-  });
-  const iconFillDisabledClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_fill_disabled_',
-    propsKey: 'iconFillDisabled'
-  });
-  const iconStrokeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_stroke_',
-    propsKey: 'iconStroke'
-  });
-  const iconStrokeHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_stroke_hover_',
-    propsKey: 'iconStrokeHover'
-  });
-  const iconStrokeDisabledClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_stroke_disabled_',
-    propsKey: 'iconStrokeDisabled'
-  });
-  const iconSizeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_size_',
-    propsKey: 'iconSize'
-  });
-  const shapeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'icon_shape_',
-    propsKey: 'shape'
-  });
-  const borderColorClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'border-color_',
-    propsKey: 'borderColor'
-  });
-  const borderColorHoverClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'border-color_hover_',
-    propsKey: 'borderColorHover'
-  });
-  const borderWidthClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'border-width_',
-    propsKey: 'borderWidth'
-  });
-  const borderTypeClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'border_type_',
-    propsKey: 'borderType'
-  });
-  const alignmentClass = useDeviceTargetClass.useDeviceTargetClass(props, {
-    prefix: 'alignment_',
-    propsKey: 'alignment'
-  });
-  const {
-    styles: iconStyles
-  } = useStyles.useStyles(props);
-  const ImageComponent = React.useMemo(() => {
-    if (SvgImage) {
-      return /*#__PURE__*/React__default.default.createElement(SvgImage, svgSizes);
-    }
-    if (imageSrc) {
-      if (imageSrc.endsWith('.svg')) {
-        return /*#__PURE__*/React__default.default.createElement(SVG__default.default, {
-          preProcessor: removeFillStroke,
-          src: imageSrc
-        });
-      }
-      return /*#__PURE__*/React__default.default.createElement("img", {
-        src: imageSrc
-      });
-    }
-    return null;
-  }, [SvgImage, svgSizes, imageSrc]);
-  return /*#__PURE__*/React__default.default.createElement("div", {
-    className: clsx__default.default(className, 'icon', fillClass, fillHoverClass, fillSizeClass, fillDisabledClass, iconFillClass, iconFillHoverClass, iconFillDisabledClass, shapeClass, iconStrokeClass, iconStrokeHoverClass, iconStrokeDisabledClass, 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: () => 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, isTooltipVisible && showTooltip && /*#__PURE__*/React__default.default.createElement(index$1.Tooltip, {
-    appearance: tooltipAppearance,
-    className: clsx__default.default(className, 'icon__tooltip', alignmentClass),
-    text: tooltipText,
-    textSize: tooltipTextSize,
-    title: tooltipTitle,
-    titleSize: tooltipTitleSize
-  })));
-});
-Icon.propTypes = {
-  after: PropTypes__default.default.any,
-  // "bool" type is valid for condition constructions, e.g. "Boolean(some) && <Badge>"
-  Badge: PropTypes__default.default.oneOfType([PropTypes__default.default.element, PropTypes__default.default.bool]),
-  before: PropTypes__default.default.any,
-  borderColor: PropTypes__default.default.oneOf(borderColor.default),
-  borderType: PropTypes__default.default.oneOf(borderType.default),
-  className: PropTypes__default.default.string,
-  dataTour: PropTypes__default.default.string,
-  fill: PropTypes__default.default.oneOf(fill.default),
-  fillDesktop: PropTypes__default.default.oneOf(fill.default),
-  fillMobile: PropTypes__default.default.oneOf(fill.default),
-  fillSize: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
-  fillSizeDesktop: PropTypes__default.default.string,
-  fillSizeMobile: PropTypes__default.default.string,
-  fillSizeTablet: PropTypes__default.default.string,
-  fillTablet: PropTypes__default.default.oneOf(fill.default),
-  height: PropTypes__default.default.string,
-  href: PropTypes__default.default.string,
-  iconStroke: PropTypes__default.default.oneOf(strokeColor.default),
-  iconStrokeDesktop: PropTypes__default.default.oneOf(strokeColor.default),
-  iconStrokeMobile: PropTypes__default.default.oneOf(strokeColor.default),
-  iconStrokeTablet: PropTypes__default.default.oneOf(strokeColor.default),
-  id: PropTypes__default.default.string,
-  imageSrc: PropTypes__default.default.string,
-  link: PropTypes__default.default.string,
-  LinkComponent: PropTypes__default.default.any,
-  linkRel: PropTypes__default.default.string,
-  linkTarget: PropTypes__default.default.string,
-  shape: PropTypes__default.default.oneOf(shape.default),
-  shapeDesktop: PropTypes__default.default.oneOf(shape.default),
-  shapeMobile: PropTypes__default.default.oneOf(shape.default),
-  shapeTablet: PropTypes__default.default.oneOf(shape.default),
-  showTooltip: PropTypes__default.default.bool,
-  size: PropTypes__default.default.oneOf(iconSize.default),
-  sizeDesktop: PropTypes__default.default.oneOf(iconSize.default),
-  sizeMobile: PropTypes__default.default.oneOf(iconSize.default),
-  sizeTablet: PropTypes__default.default.oneOf(iconSize.default),
-  SvgImage: PropTypes__default.default.oneOfType([PropTypes__default.default.elementType, PropTypes__default.default.func, PropTypes__default.default.object]),
-  tooltipAppearance: PropTypes__default.default.string,
-  tooltipText: PropTypes__default.default.string,
-  tooltipTextSize: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
-  tooltipTitle: PropTypes__default.default.string,
-  tooltipTitleSize: PropTypes__default.default.oneOfType([PropTypes__default.default.string, PropTypes__default.default.number]),
-  width: PropTypes__default.default.string,
-  onClick: PropTypes__default.default.func
-};
-Icon.defaultProps = {
-  LinkComponent: 'a'
-};
-function removeFillStroke(code) {
-  return code.replace(/fill=".*?"/g, 'fill=""').replace(/stroke=".*?"/g, 'stroke=""');
-}
-Icon.__docgenInfo = {
-  "description": "",
-  "methods": [],
-  "displayName": "Icon",
-  "props": {
-    "LinkComponent": {
-      "defaultValue": {
-        "value": "'a'",
-        "computed": false
-      },
-      "description": "",
-      "type": {
-        "name": "any"
-      },
-      "required": false
-    },
-    "after": {
-      "description": "",
-      "type": {
-        "name": "any"
-      },
-      "required": false
-    },
-    "Badge": {
-      "description": "",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "element"
-        }, {
-          "name": "bool"
-        }]
-      },
-      "required": false
-    },
-    "before": {
-      "description": "",
-      "type": {
-        "name": "any"
-      },
-      "required": false
-    },
-    "borderColor": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "borderColorProps"
-      },
-      "required": false
-    },
-    "borderType": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "borderTypeProps"
-      },
-      "required": false
-    },
-    "className": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "dataTour": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "fill": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
-      },
-      "required": false
-    },
-    "fillDesktop": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
-      },
-      "required": false
-    },
-    "fillMobile": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
-      },
-      "required": false
-    },
-    "fillSize": {
-      "description": "",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "string"
-        }, {
-          "name": "number"
-        }]
-      },
-      "required": false
-    },
-    "fillSizeDesktop": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "fillSizeMobile": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "fillSizeTablet": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "fillTablet": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "fillProps"
-      },
-      "required": false
-    },
-    "height": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "href": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "iconStroke": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "strokeColorProps"
-      },
-      "required": false
-    },
-    "iconStrokeDesktop": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "strokeColorProps"
-      },
-      "required": false
-    },
-    "iconStrokeMobile": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "strokeColorProps"
-      },
-      "required": false
-    },
-    "iconStrokeTablet": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "strokeColorProps"
-      },
-      "required": false
-    },
-    "id": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "imageSrc": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "link": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "linkRel": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "linkTarget": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "shape": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeDesktop": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeMobile": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "shapeTablet": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "shapeProps"
-      },
-      "required": false
-    },
-    "showTooltip": {
-      "description": "",
-      "type": {
-        "name": "bool"
-      },
-      "required": false
-    },
-    "size": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "iconSizeProps"
-      },
-      "required": false
-    },
-    "sizeDesktop": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "iconSizeProps"
-      },
-      "required": false
-    },
-    "sizeMobile": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "iconSizeProps"
-      },
-      "required": false
-    },
-    "sizeTablet": {
-      "description": "",
-      "type": {
-        "name": "enum",
-        "computed": true,
-        "value": "iconSizeProps"
-      },
-      "required": false
-    },
-    "SvgImage": {
-      "description": "",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "elementType"
-        }, {
-          "name": "func"
-        }, {
-          "name": "object"
-        }]
-      },
-      "required": false
-    },
-    "tooltipAppearance": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "tooltipText": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "tooltipTextSize": {
-      "description": "",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "string"
-        }, {
-          "name": "number"
-        }]
-      },
-      "required": false
-    },
-    "tooltipTitle": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "tooltipTitleSize": {
-      "description": "",
-      "type": {
-        "name": "union",
-        "value": [{
-          "name": "string"
-        }, {
-          "name": "number"
-        }]
-      },
-      "required": false
-    },
-    "width": {
-      "description": "",
-      "type": {
-        "name": "string"
-      },
-      "required": false
-    },
-    "onClick": {
-      "description": "",
-      "type": {
-        "name": "func"
-      },
-      "required": false
-    }
-  }
-};
 
-exports.Icon = Icon;
-exports.iconConfig = iconConfig;
+exports.Icon = Icon.Icon;
+exports.iconConfig = Icon.iconConfig;

package/dist/cjs/components/Image.js

@@ -7,16 +7,16 @@ var borderColor = require('../constants/componentProps/borderColor.js');
 var resizeMode = require('../constants/componentProps/resizeMode.js');
 var shape = require('../constants/componentProps/shape.js');
 var width = require('../constants/componentProps/width.js');
-var useStyles = require('../hooks/useStyles.js');
 var useDeviceTargetClass = require('../hooks/useDeviceTargetClass.js');
+var useStyles = require('../hooks/useStyles.js');
+require('lodash/castArray');
 require('lodash/camelCase');
-require('lodash/maxBy');
-require('lodash/upperFirst');
-require('../hooks/styleAttributes.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');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
@@ -80,7 +80,7 @@ function Image(props) {
   });
   const borderClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'border-color_',
-    propsKey: 'border'
+    propsKey: 'borderColor'
   });
   const borderColorImageClass = useDeviceTargetClass.useDeviceTargetClass(props, {
     prefix: 'border-color-image_',