@hitachivantara/uikit-react-core 3.62.5 → 3.62.6

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [3.62.6](https://github.com/lumada-design/hv-uikit-react/compare/@hitachivantara/uikit-react-core@3.62.5...@hitachivantara/uikit-react-core@3.62.6) (2022-04-20)
+
+
+### Bug Fixes
+
+* **Avatar:** add containerProps ([#2747](https://github.com/lumada-design/hv-uikit-react/issues/2747)) ([872a22c](https://github.com/lumada-design/hv-uikit-react/commit/872a22c69083eda96ac02cd7c831b25c8153dac0))
+
+
+
+
+
 ## 3.62.5 (2022-04-19)
 
 

package/dist/Avatar/Avatar.d.ts

@@ -76,6 +76,10 @@ export interface HvAvatarProps
    * A string representing the color of the avatar badge.
    */
   badge?: "sema0" | HvSemanticColorKeys | HvAtmosphereColorKeys;
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: object;
 }
 
 export default function HvAvatar(props: HvAvatarProps): JSX.Element | null;

package/dist/Avatar/Avatar.js

@@ -43,7 +43,7 @@ var _utils = require("../utils");
 
 var _styles = _interopRequireDefault(require("./styles"));
 
-var _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant"];
+var _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant", "containerProps"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -104,6 +104,7 @@ var HvAvatar = function HvAvatar(props) {
       badge = props.badge,
       _props$variant = props.variant,
       variant = _props$variant === void 0 ? "circular" : _props$variant,
+      containerProps = props.containerProps,
       others = (0, _objectWithoutProperties2.default)(props, _excluded); // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL
 
   var normalizedSize = normalizeSize(size);
@@ -159,12 +160,17 @@ var HvAvatar = function HvAvatar(props) {
   }
 
   var badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: classes.container,
-    tabIndex: 0,
-    role: "button",
-    "aria-label": "avatar"
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  /**
+   * Note: on the next major release this should be updated. the `others` prop should be
+   * used in the container instead of the `containerProps` and a new `avatarProps`
+   * should be created to pass on any props down to the avatar component. This wasn't
+   * done now in order to not break the current API. Also, consider using the `root` class
+   * on the container element as it makes more semantic sense.
+   */
+
+  return /*#__PURE__*/_react.default.createElement("div", (0, _extends2.default)({
+    className: classes.container
+  }, containerProps), /*#__PURE__*/_react.default.createElement("div", {
     className: (0, _clsx.default)(classes.status, classes[variant], classes[normalizedSize]),
     style: statusInlineStyle
   }, badge && /*#__PURE__*/_react.default.createElement("div", {
@@ -332,7 +338,12 @@ process.env.NODE_ENV !== "production" ? HvAvatar.propTypes = {
   /**
    * A string representing the color of the avatar badge.
    */
-  badge: _propTypes.default.string
+  badge: _propTypes.default.string,
+
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: _propTypes.default.instanceOf(Object)
 } : void 0;
 
 var _default = (0, _core.withStyles)(_styles.default, {

package/dist/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Avatar/Avatar.js"],"names":["getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","childrenProp","children","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","PropTypes","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","styles","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  return (\n    <div className={classes.container} tabIndex={0} role=\"button\" aria-label=\"avatar\">\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}
+{"version":3,"sources":["../../src/Avatar/Avatar.js"],"names":["getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","childrenProp","children","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","containerProps","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","PropTypes","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","styles","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    containerProps,\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  /**\n   * Note: on the next major release this should be updated. the `others` prop should be\n   * used in the container instead of the `containerProps` and a new `avatarProps`\n   * should be created to pass on any props down to the avatar component. This wasn't\n   * done now in order to not break the current API. Also, consider using the `root` class\n   * on the container element as it makes more semantic sense.\n   */\n  return (\n    <div className={classes.container} {...containerProps}>\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n  /**\n   * Attributes applied to the container element.\n   */\n  containerProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}

package/dist/legacy/Avatar/Avatar.d.ts

@@ -76,6 +76,10 @@ export interface HvAvatarProps
    * A string representing the color of the avatar badge.
    */
   badge?: "sema0" | HvSemanticColorKeys | HvAtmosphereColorKeys;
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: object;
 }
 
 export default function HvAvatar(props: HvAvatarProps): JSX.Element | null;

package/dist/legacy/Avatar/Avatar.js

@@ -9,7 +9,7 @@ import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-var _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant"];
+var _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant", "containerProps"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -78,6 +78,7 @@ var HvAvatar = function HvAvatar(props) {
       badge = props.badge,
       _props$variant = props.variant,
       variant = _props$variant === void 0 ? "circular" : _props$variant,
+      containerProps = props.containerProps,
       others = _objectWithoutProperties(props, _excluded); // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL
 
 
@@ -134,12 +135,17 @@ var HvAvatar = function HvAvatar(props) {
   }
 
   var badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);
-  return /*#__PURE__*/React.createElement("div", {
-    className: classes.container,
-    tabIndex: 0,
-    role: "button",
-    "aria-label": "avatar"
-  }, /*#__PURE__*/React.createElement("div", {
+  /**
+   * Note: on the next major release this should be updated. the `others` prop should be
+   * used in the container instead of the `containerProps` and a new `avatarProps`
+   * should be created to pass on any props down to the avatar component. This wasn't
+   * done now in order to not break the current API. Also, consider using the `root` class
+   * on the container element as it makes more semantic sense.
+   */
+
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: classes.container
+  }, containerProps), /*#__PURE__*/React.createElement("div", {
     className: clsx(classes.status, classes[variant], classes[normalizedSize]),
     style: statusInlineStyle
   }, badge && /*#__PURE__*/React.createElement("div", {
@@ -307,7 +313,12 @@ process.env.NODE_ENV !== "production" ? HvAvatar.propTypes = {
   /**
    * A string representing the color of the avatar badge.
    */
-  badge: PropTypes.string
+  badge: PropTypes.string,
+
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: PropTypes.instanceOf(Object)
 } : void 0;
 export default withStyles(styles, {
   name: "HvAvatar"

package/dist/legacy/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Avatar/Avatar.js"],"names":["React","PropTypes","clsx","Avatar","withStyles","useTheme","User","decreaseSize","useImageLoaded","styles","getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","childrenProp","children","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  return (\n    <div className={classes.container} tabIndex={0} role=\"button\" aria-label=\"avatar\">\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}
+{"version":3,"sources":["../../../src/Avatar/Avatar.js"],"names":["React","PropTypes","clsx","Avatar","withStyles","useTheme","User","decreaseSize","useImageLoaded","styles","getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","childrenProp","children","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","containerProps","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    containerProps,\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  /**\n   * Note: on the next major release this should be updated. the `others` prop should be\n   * used in the container instead of the `containerProps` and a new `avatarProps`\n   * should be created to pass on any props down to the avatar component. This wasn't\n   * done now in order to not break the current API. Also, consider using the `root` class\n   * on the container element as it makes more semantic sense.\n   */\n  return (\n    <div className={classes.container} {...containerProps}>\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n  /**\n   * Attributes applied to the container element.\n   */\n  containerProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}

package/dist/modern/Avatar/Avatar.d.ts

@@ -76,6 +76,10 @@ export interface HvAvatarProps
    * A string representing the color of the avatar badge.
    */
   badge?: "sema0" | HvSemanticColorKeys | HvAtmosphereColorKeys;
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: object;
 }
 
 export default function HvAvatar(props: HvAvatarProps): JSX.Element | null;

package/dist/modern/Avatar/Avatar.js

@@ -1,7 +1,7 @@
 import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
 import _extends from "@babel/runtime/helpers/esm/extends";
 import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
-const _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant"];
+const _excluded = ["className", "style", "classes", "children", "component", "size", "backgroundColor", "color", "src", "srcSet", "sizes", "alt", "imgProps", "status", "badge", "variant", "containerProps"];
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
@@ -65,7 +65,8 @@ const HvAvatar = props => {
     imgProps,
     status,
     badge,
-    variant = "circular"
+    variant = "circular",
+    containerProps
   } = props,
         others = _objectWithoutProperties(props, _excluded); // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL
 
@@ -121,12 +122,17 @@ const HvAvatar = props => {
   }
 
   const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);
-  return /*#__PURE__*/React.createElement("div", {
-    className: classes.container,
-    tabIndex: 0,
-    role: "button",
-    "aria-label": "avatar"
-  }, /*#__PURE__*/React.createElement("div", {
+  /**
+   * Note: on the next major release this should be updated. the `others` prop should be
+   * used in the container instead of the `containerProps` and a new `avatarProps`
+   * should be created to pass on any props down to the avatar component. This wasn't
+   * done now in order to not break the current API. Also, consider using the `root` class
+   * on the container element as it makes more semantic sense.
+   */
+
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: classes.container
+  }, containerProps), /*#__PURE__*/React.createElement("div", {
     className: clsx(classes.status, classes[variant], classes[normalizedSize]),
     style: statusInlineStyle
   }, badge && /*#__PURE__*/React.createElement("div", {
@@ -294,7 +300,12 @@ process.env.NODE_ENV !== "production" ? HvAvatar.propTypes = {
   /**
    * A string representing the color of the avatar badge.
    */
-  badge: PropTypes.string
+  badge: PropTypes.string,
+
+  /**
+   * Attributes applied to the container element.
+   */
+  containerProps: PropTypes.instanceOf(Object)
 } : void 0;
 export default withStyles(styles, {
   name: "HvAvatar"

package/dist/modern/Avatar/Avatar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/Avatar/Avatar.js"],"names":["React","PropTypes","clsx","Avatar","withStyles","useTheme","User","decreaseSize","useImageLoaded","styles","getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","children","childrenProp","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  return (\n    <div className={classes.container} tabIndex={0} role=\"button\" aria-label=\"avatar\">\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}
+{"version":3,"sources":["../../../src/Avatar/Avatar.js"],"names":["React","PropTypes","clsx","Avatar","withStyles","useTheme","User","decreaseSize","useImageLoaded","styles","getColor","theme","color","defaultColor","palette","normalizeSize","size","console","warn","HvAvatar","props","className","style","classes","children","childrenProp","component","backgroundColor","src","srcSet","sizes","alt","imgProps","status","badge","variant","containerProps","others","normalizedSize","imageLoaded","hasImg","hasImgNotFailing","img","fallback","inlineStyle","borderRadius","hv","accent","acce1","atmosphere","atmo1","statusInlineStyle","statusColor","semantic","sema1","boxShadow","badgeColor","container","root","avatar","propTypes","id","string","instanceOf","Object","shape","XS","SM","MD","LG","XL","isRequired","node","elementType","oneOf","name"],"mappings":"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","sourcesContent":["import React from \"react\";\nimport PropTypes from \"prop-types\";\nimport clsx from \"clsx\";\n\nimport { Avatar, withStyles, useTheme } from \"@material-ui/core\";\n\nimport { User } from \"@hitachivantara/uikit-react-icons\";\n\nimport { decreaseSize, useImageLoaded } from \"../utils\";\n\nimport styles from \"./styles\";\n\nconst getColor = (theme, color, defaultColor) => theme.palette[color] || color || defaultColor;\n\nconst normalizeSize = (size) => {\n  if (size === \"S\" || size === \"M\" || size === \"L\") {\n    // eslint-disable-next-line no-console\n    console.warn(\n      \"`size` values S, M and L are deprecated. Please use XS, SM, MD, LG or XL instead\"\n    );\n    switch (size) {\n      case \"S\":\n        return \"SM\";\n      case \"M\":\n        return \"MD\";\n      case \"L\":\n        // this is intentional. the old L corresponds to the new XL. should be\n        // removed once the old nomenclature is removed.\n        return \"XL\";\n      default:\n        break;\n    }\n  }\n  return size;\n};\n\n/**\n * Avatars can be used to represent a user or a brand.\n * They can show an image, an icon or the initial letters of a name, for example.\n */\nconst HvAvatar = (props) => {\n  const {\n    className,\n    style,\n    classes,\n    children: childrenProp,\n    component,\n    size = \"SM\",\n    backgroundColor = \"acce1\",\n    color = \"atmo1\",\n    src,\n    srcSet,\n    sizes,\n    alt,\n    imgProps,\n    status,\n    badge,\n    variant = \"circular\",\n    containerProps,\n    ...others\n  } = props;\n\n  // S, M and L are now deprecated, this intends to normalize the size to the new norm of XS, SM, MD, LG and XL\n  const normalizedSize = normalizeSize(size);\n\n  let children = null;\n\n  // Use a hook instead of onError on the img element to support server-side rendering.\n  const imageLoaded = useImageLoaded(src, srcSet);\n  const hasImg = src || srcSet;\n  const hasImgNotFailing = hasImg && imageLoaded !== \"error\";\n\n  if (hasImgNotFailing) {\n    children = (\n      <img\n        alt={alt}\n        src={src}\n        srcSet={srcSet}\n        sizes={sizes}\n        className={classes.img}\n        {...imgProps}\n      />\n    );\n  } else if (childrenProp != null) {\n    children = childrenProp;\n  } else if (hasImg && alt) {\n    [children] = alt;\n  } else {\n    children = (\n      <User color={color} iconSize={decreaseSize(normalizedSize)} className={classes.fallback} />\n    );\n  }\n\n  const inlineStyle = {\n    ...style,\n  };\n\n  if (component != null && typeof component !== \"string\") {\n    // override border-radius with custom components\n    inlineStyle.borderRadius = \"50%\";\n  }\n\n  const theme = useTheme();\n  if (!hasImgNotFailing) {\n    inlineStyle.backgroundColor = getColor(theme, backgroundColor, theme.hv.palette.accent.acce1);\n    inlineStyle.color = getColor(theme, color, theme.hv.palette.atmosphere.atmo1);\n  }\n\n  const statusInlineStyle = {};\n  if (status) {\n    // set the status border. we're using the boxShadow property to set the border\n    // to be inside the container and not on its edge.\n    const statusColor = getColor(theme, status, theme.hv.palette.semantic.sema1);\n    statusInlineStyle.boxShadow = `inset 0px 0px 0px 2px ${statusColor}`;\n  }\n\n  const badgeColor = getColor(theme, badge, theme.hv.palette.semantic.sema1);\n\n  /**\n   * Note: on the next major release this should be updated. the `others` prop should be\n   * used in the container instead of the `containerProps` and a new `avatarProps`\n   * should be created to pass on any props down to the avatar component. This wasn't\n   * done now in order to not break the current API. Also, consider using the `root` class\n   * on the container element as it makes more semantic sense.\n   */\n  return (\n    <div className={classes.container} {...containerProps}>\n      <div\n        className={clsx(classes.status, classes[variant], classes[normalizedSize])}\n        style={statusInlineStyle}\n      >\n        {badge && <div className={classes.badge} style={{ backgroundColor: badgeColor }} />}\n        <Avatar\n          component={component}\n          className={clsx(className, classes.root, classes.avatar, classes[normalizedSize])}\n          style={inlineStyle}\n          variant={variant}\n          {...others}\n        >\n          {children}\n        </Avatar>\n      </div>\n    </div>\n  );\n};\n\nHvAvatar.propTypes = {\n  /**\n   * Identifier to be applied to the root element.\n   */\n  id: PropTypes.string,\n\n  /**\n   * Class names to be applied to the root element.\n   */\n  className: PropTypes.string,\n  /**\n   * Inline styles to be applied to the root element.\n   */\n  style: PropTypes.instanceOf(Object),\n  /**\n   * A Jss Object used to override or extend the component styles.\n   */\n  classes: PropTypes.shape({\n    /**\n     * Styles applied to the root element.\n     */\n    root: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XS.\n     */\n    XS: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is SM.\n     */\n    SM: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is MD.\n     */\n    MD: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is LG.\n     */\n    LG: PropTypes.string,\n    /**\n     * Styles applied to the root element when size is XL.\n     */\n    XL: PropTypes.string,\n    /**\n     * Styles applied to the img element if either `src` or `srcSet` is defined.\n     */\n    img: PropTypes.string,\n    /**\n     * Styles applied to the fallback icon.\n     */\n    fallback: PropTypes.string,\n    /**\n     * Styles applied to the container element.\n     */\n    container: PropTypes.string,\n    /**\n     * Styles applied to the avatar element.\n     */\n    avatar: PropTypes.string,\n    /**\n     * Styles applied to the badge element.\n     */\n    badge: PropTypes.string,\n    /**\n     * Styles applied to the status element.\n     */\n    status: PropTypes.string,\n  }).isRequired,\n\n  /**\n   * Used to render icon or text elements inside the Avatar if `src` is not set.\n   * This can be an element, or just a string.\n   */\n  children: PropTypes.node,\n  /**\n   * The component used for the root node.\n   * Either a string to use a DOM element or a component.\n   */\n  component: PropTypes.elementType,\n\n  /**\n   * Sets one of the standard sizes of the icons\n   */\n  size: PropTypes.oneOf([\"S\", \"M\", \"L\", \"XS\", \"SM\", \"MD\", \"LG\", \"XL\"]),\n\n  /**\n   * A String representing the background color of the avatar.\n   * You can use either an HEX or color name from the palette.\n   */\n  backgroundColor: PropTypes.string,\n  /**\n   * A String representing the foreground color of the avatar's\n   * letters or the generic User icon fallback.\n   * You can use either an HEX or color name from the palette.\n   */\n  color: PropTypes.string,\n\n  /**\n   * The `src` attribute for the `img` element.\n   */\n  src: PropTypes.string,\n  /**\n   * The `srcSet` attribute for the `img` element.\n   * Use this attribute for responsive image display.\n   */\n  srcSet: PropTypes.string,\n  /**\n   * The `sizes` attribute for the `img` element.\n   */\n  sizes: PropTypes.string,\n  /**\n   * Used in combination with `src` or `srcSet` to\n   * provide an alt attribute for the rendered `img` element.\n   */\n  alt: PropTypes.string,\n  /**\n   * Attributes applied to the `img` element if the component is used to display an image.\n   * It can be used to listen for the loading error event.\n   */\n  imgProps: PropTypes.instanceOf(Object),\n  /**\n   * A string representing the type of avatar to display, circular or square.\n   */\n  variant: PropTypes.oneOf([\"circular\", \"square\"]),\n  /**\n   * A string representing the color of the avatar border that represents its status.\n   */\n  status: PropTypes.string,\n  /**\n   * A string representing the color of the avatar badge.\n   */\n  badge: PropTypes.string,\n  /**\n   * Attributes applied to the container element.\n   */\n  containerProps: PropTypes.instanceOf(Object),\n};\n\nexport default withStyles(styles, { name: \"HvAvatar\" })(HvAvatar);\n"],"file":"Avatar.js"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hitachivantara/uikit-react-core",
-  "version": "3.62.5",
+  "version": "3.62.6",
   "description": "A collection of React components for the Hitachi Vantara's Design System.",
   "homepage": "https://github.com/lumada-design/hv-uikit-react",
   "license": "Apache-2.0",
@@ -104,5 +104,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "05d53e8bbde381c55e5bdd8842e5cf2b4805d437"
+  "gitHead": "28769b802d7a8370b9d330cd62f964cf82b9f0a4"
 }