@zohodesk/dot 1.3.0 → 1.3.2

package/es/v1/avatar/AvatarClose/AvatarClose.js

@@ -6,48 +6,37 @@ import { propTypes } from '../../../avatar/AvatarClose/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
 import style from '../../../avatar/AvatarClose/AvatarClose.module.css';
-export default class AvatarClose extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      title,
-      src,
-      name,
-      size,
-      isClose,
-      onClick,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarCloseProps = {},
-      AvatarProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: style.container,
-      "data-selector-id": dataSelectorId
-    }, AvatarCloseProps), /*#__PURE__*/React.createElement(Avatar, _extends({
-      src: src,
-      name: name,
-      title: title,
-      size: size
-    }, AvatarProps)), isClose && /*#__PURE__*/React.createElement("span", {
-      className: style.pop,
-      onClick: onClick
-    }, /*#__PURE__*/React.createElement("span", {
-      className: style.icon
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-plus"
-    }))));
-  }
-
+export default function AvatarClose(props) {
+  let {
+    title,
+    src,
+    name,
+    size,
+    isClose,
+    onClick,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarCloseProps = {},
+    AvatarProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: style.container,
+    "data-selector-id": dataSelectorId
+  }, AvatarCloseProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+    src: src,
+    name: name,
+    title: title,
+    size: size
+  }, AvatarProps)), isClose && /*#__PURE__*/React.createElement("span", {
+    className: style.pop,
+    onClick: onClick
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-plus"
+  }))));
 }
 AvatarClose.propTypes = propTypes;
-AvatarClose.defaultProps = defaultProps; // if (__DOCS__) {
-//   AvatarClose.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarClose.defaultProps = defaultProps;

package/es/v1/avatar/AvatarCollision/AvatarCollision.js

@@ -6,57 +6,46 @@ import { propTypes } from '../../../avatar/AvatarCollision/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
 import style from '../../../avatar/AvatarCollision/AvatarCollision.module.css';
-export default class AvatarCollision extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      title,
-      src,
-      name,
-      size,
-      onClick,
-      needCreateChat,
-      isLeft,
-      isIdle,
-      initial,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarCollisionProps = {},
-      AvatarProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: `${style.container} ${isLeft ? style.off : isIdle ? style.idle : style.on}`,
-      onClick: onClick,
-      "data-id": "collsionPop",
-      "data-test-id": "collsionPop",
-      "data-title": title,
-      "data-selector-id": dataSelectorId
-    }, AvatarCollisionProps), /*#__PURE__*/React.createElement(Avatar, _extends({
-      src: src,
-      name: name,
-      size: size,
-      palette: "default",
-      needTitle: false,
-      initial: initial
-    }, AvatarProps)), needCreateChat && !isLeft && /*#__PURE__*/React.createElement("span", {
-      className: style.pop,
-      "data-title": title
-    }, /*#__PURE__*/React.createElement("span", {
-      className: style.icon
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-livechat3"
-    }))));
-  }
-
+export default function AvatarCollision(props) {
+  let {
+    title,
+    src,
+    name,
+    size,
+    onClick,
+    needCreateChat,
+    isLeft,
+    isIdle,
+    initial,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarCollisionProps = {},
+    AvatarProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: `${style.container} ${isLeft ? style.off : isIdle ? style.idle : style.on}`,
+    onClick: onClick,
+    "data-id": "collsionPop",
+    "data-test-id": "collsionPop",
+    "data-title": title,
+    "data-selector-id": dataSelectorId
+  }, AvatarCollisionProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+    src: src,
+    name: name,
+    size: size,
+    palette: "default",
+    needTitle: false,
+    initial: initial
+  }, AvatarProps)), needCreateChat && !isLeft && /*#__PURE__*/React.createElement("span", {
+    className: style.pop,
+    "data-title": title
+  }, /*#__PURE__*/React.createElement("span", {
+    className: style.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: "ZD-livechat3"
+  }))));
 }
 AvatarCollision.propTypes = propTypes;
-AvatarCollision.defaultProps = defaultProps; // if (__DOCS__) {
-//   AvatarCollision.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarCollision.defaultProps = defaultProps;

package/es/v1/avatar/AvatarIcon/AvatarIcon.js

@@ -7,48 +7,43 @@ import { Icon } from '@zohodesk/icons';
 import { Container } from '@zohodesk/components/es/v1/Layout';
 import AvatarSize from '@zohodesk/components/es/v1/Provider/AvatarSize';
 import style from '../../../avatar/AvatarIcon/AvatarIcon.module.css';
-export default class AvatarIcon extends React.Component {
-  render() {
-    let {
-      name,
-      size,
-      iconSize,
-      iconClass,
-      iconColor,
-      onClick,
-      palette,
-      dataId,
-      className,
-      isIconBold,
-      title,
-      borderOnActive,
-      borderOnHover,
-      customProps,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarIconProps = {}
-    } = customProps;
-    let border = borderOnHover || onClick;
-    return /*#__PURE__*/React.createElement(Container, _extends({
-      className: `${style.container} ${borderOnActive ? style.borderOnActive : border ? style.borderOnHover : ''} ${AvatarSize(size)} ${style[palette]} ${className}`,
-      onClick: onClick,
-      dataId: dataId,
-      "data-title": title,
-      isInline: true,
-      align: "both",
-      isCover: false,
-      dataSelectorId: dataSelectorId
-    }, AvatarIconProps), /*#__PURE__*/React.createElement(Icon, {
-      name: name,
-      size: iconSize,
-      iconClass: ` ${iconClass} ${style.iconColor} ${iconColor ? ` ${style[`icon_${iconColor}`]}` : ''} `,
-      isBold: isIconBold
-    }));
-  }
-
+export default function AvatarIcon(props) {
+  let {
+    name,
+    size,
+    iconSize,
+    iconClass,
+    iconColor,
+    onClick,
+    palette,
+    dataId,
+    className,
+    isIconBold,
+    title,
+    borderOnActive,
+    borderOnHover,
+    customProps,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarIconProps = {}
+  } = customProps;
+  let border = borderOnHover || onClick;
+  return /*#__PURE__*/React.createElement(Container, _extends({
+    className: `${style.container} ${borderOnActive ? style.borderOnActive : border ? style.borderOnHover : ''} ${AvatarSize(size)} ${style[palette]} ${className}`,
+    onClick: onClick,
+    dataId: dataId,
+    "data-title": title,
+    isInline: true,
+    align: "both",
+    isCover: false,
+    dataSelectorId: dataSelectorId
+  }, AvatarIconProps), /*#__PURE__*/React.createElement(Icon, {
+    name: name,
+    size: iconSize,
+    iconClass: ` ${iconClass} ${style.iconColor} ${iconColor ? ` ${style[`icon_${iconColor}`]}` : ''} `,
+    isBold: isIconBold
+  }));
 }
 AvatarIcon.defaultProps = defaultProps;
-AvatarIcon.propTypes = propTypes; // if (__DOCS__) {
-//   AvatarIcon.docs = { componentGroup: 'Avatar Group' };
-// }
+AvatarIcon.propTypes = propTypes;

package/es/v1/avatar/AvatarStatus/AvatarStatus.js

@@ -5,68 +5,57 @@ import { defaultProps } from '../../../avatar/AvatarStatus/props/defaultProps';
 import { propTypes } from '../../../avatar/AvatarStatus/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import style from '../../../avatar/AvatarStatus/AvatarStatus.module.css';
-export default class AvatarStatus extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    let {
-      src,
-      name,
-      size,
-      onClick,
-      title,
-      state,
-      dataId,
-      initial,
-      shape,
-      needTitle,
-      className,
-      needBorder,
-      palette,
-      textPalette,
-      customTextClass,
-      statusTitle,
-      customProps,
-      dataSelectorId,
-      needDefaultBorder
-    } = this.props;
-    let {
-      AvatarStatusProps = {},
-      AvatarProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: `${style.container} ${className} `
-    }, AvatarStatusProps, {
-      tabIndex: "0",
-      "aria-label": `${title}, ${name}, ${statusTitle}`,
-      "data-selector-id": dataSelectorId
-    }), /*#__PURE__*/React.createElement(Avatar, _extends({
-      src: src,
-      name: name,
-      palette: palette,
-      textPalette: textPalette,
-      customClass: customTextClass,
-      title: title,
-      onClick: onClick,
-      size: size,
-      dataId: dataId,
-      initial: initial,
-      shape: shape,
-      needTitle: needTitle,
-      needDefaultBorder: needDefaultBorder,
-      needBorder: needBorder
-    }, AvatarProps)), /*#__PURE__*/React.createElement("span", {
-      "data-title": statusTitle,
-      className: `${style.state} ${style[state]} ${style[size]} ${style[shape]}`
-    }));
-  }
-
+export default function AvatarStatus(props) {
+  let {
+    src,
+    name,
+    size,
+    onClick,
+    title,
+    state,
+    dataId,
+    initial,
+    shape,
+    needTitle,
+    className,
+    needBorder,
+    palette,
+    textPalette,
+    customTextClass,
+    statusTitle,
+    customProps,
+    dataSelectorId,
+    needDefaultBorder
+  } = props;
+  let {
+    AvatarStatusProps = {},
+    AvatarProps = {}
+  } = customProps;
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: `${style.container} ${className} `
+  }, AvatarStatusProps, {
+    tabIndex: "0",
+    "aria-label": `${title}, ${name}, ${statusTitle}`,
+    "data-selector-id": dataSelectorId
+  }), /*#__PURE__*/React.createElement(Avatar, _extends({
+    src: src,
+    name: name,
+    palette: palette,
+    textPalette: textPalette,
+    customClass: customTextClass,
+    title: title,
+    onClick: onClick,
+    size: size,
+    dataId: dataId,
+    initial: initial,
+    shape: shape,
+    needTitle: needTitle,
+    needDefaultBorder: needDefaultBorder,
+    needBorder: needBorder
+  }, AvatarProps)), /*#__PURE__*/React.createElement("span", {
+    "data-title": statusTitle,
+    className: `${style.state} ${style[state]} ${style[size]} ${style[shape]}`
+  }));
 }
 AvatarStatus.defaultProps = defaultProps;
-AvatarStatus.propTypes = propTypes; // if (__DOCS__) {
-//   AvatarStatus.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarStatus.propTypes = propTypes;

package/es/v1/avatar/AvatarThread/AvatarThread.js

@@ -6,74 +6,67 @@ import { propTypes } from '../../../avatar/AvatarThread/props/propTypes';
 import Avatar from '@zohodesk/components/es/v1/Avatar/Avatar';
 import { Icon } from '@zohodesk/icons';
 import style from '../../../avatar/AvatarThread/AvatarThread.module.css';
-export default class AvatarThread extends React.Component {
-  render() {
-    let {
-      src,
-      name,
-      size,
-      iconColor,
-      iconName,
-      iconSize,
-      borderPalette,
-      onClick,
-      title,
-      iconTitle,
-      onIconClick,
-      showOnHover,
-      dataId,
-      initial,
-      needBorder,
-      needBackground,
-      palette,
-      textPalette,
-      customTextClass,
-      needTitle,
-      customProps,
-      iconClass,
-      getCustomThread,
-      dataSelectorId
-    } = this.props;
-    let {
-      AvatarThreadProps = {},
-      AvatarProps = {}
-    } = customProps;
-    let hoverEffect = showOnHover ? style.hover : '';
-    return /*#__PURE__*/React.createElement("div", _extends({
-      className: `${style.container} ${onClick ? style.pointer : ''} ${hoverEffect}`,
-      "data-selector-id": dataSelectorId
-    }, AvatarThreadProps), /*#__PURE__*/React.createElement(Avatar, _extends({
-      initial: initial,
-      src: src,
-      name: name,
-      title: title,
-      size: size,
-      onClick: onClick,
-      dataId: dataId,
-      palette: palette,
-      textPalette: textPalette,
-      customClass: customTextClass,
-      needTitle: needTitle
-    }, AvatarProps)), (iconName || getCustomThread) && /*#__PURE__*/React.createElement("span", {
-      className: `${style.thread} ${onIconClick ? style.pointer : style.defaultCursor} ${needBackground ? style.threadBg : ''} ${style[`thread_${size}_pos`]} ${needBorder ? style[`border_${borderPalette}`] : ''}`,
-      "data-title": iconTitle,
-      "data-id": iconTitle === 'Remove Follower' && 'removeFollower',
-      "data-test-id": iconTitle === 'Remove Follower' && 'removeFollower',
-      onClick: onIconClick
-    }, iconName && /*#__PURE__*/React.createElement("span", {
-      className: style.icon
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: iconName,
-      size: iconSize,
-      iconClass: `${iconClass}
-                  ${style[`text_${iconColor}`] ? style[`text_${iconColor}`] : iconColor}`
-    })), getCustomThread && getCustomThread()));
-  }
-
+export default function AvatarThread(props) {
+  let {
+    src,
+    name,
+    size,
+    iconColor,
+    iconName,
+    iconSize,
+    borderPalette,
+    onClick,
+    title,
+    iconTitle,
+    onIconClick,
+    showOnHover,
+    dataId,
+    initial,
+    needBorder,
+    needBackground,
+    palette,
+    textPalette,
+    customTextClass,
+    needTitle,
+    customProps,
+    iconClass,
+    getCustomThread,
+    dataSelectorId
+  } = props;
+  let {
+    AvatarThreadProps = {},
+    AvatarProps = {}
+  } = customProps;
+  let hoverEffect = showOnHover ? style.hover : '';
+  return /*#__PURE__*/React.createElement("div", _extends({
+    className: `${style.container} ${onClick ? style.pointer : ''} ${hoverEffect}`,
+    "data-selector-id": dataSelectorId
+  }, AvatarThreadProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+    initial: initial,
+    src: src,
+    name: name,
+    title: title,
+    size: size,
+    onClick: onClick,
+    dataId: dataId,
+    palette: palette,
+    textPalette: textPalette,
+    customClass: customTextClass,
+    needTitle: needTitle
+  }, AvatarProps)), (iconName || getCustomThread) && /*#__PURE__*/React.createElement("span", {
+    className: `${style.thread} ${onIconClick ? style.pointer : style.defaultCursor} ${needBackground ? style.threadBg : ''} ${style[`thread_${size}_pos`]} ${needBorder ? style[`border_${borderPalette}`] : ''}`,
+    "data-title": iconTitle,
+    "data-id": iconTitle === 'Remove Follower' && 'removeFollower',
+    "data-test-id": iconTitle === 'Remove Follower' && 'removeFollower',
+    onClick: onIconClick
+  }, iconName && /*#__PURE__*/React.createElement("span", {
+    className: style.icon
+  }, /*#__PURE__*/React.createElement(Icon, {
+    name: iconName,
+    size: iconSize,
+    iconClass: `${iconClass}
+                ${style[`text_${iconColor}`] ? style[`text_${iconColor}`] : iconColor}`
+  })), getCustomThread && getCustomThread()));
 }
 AvatarThread.defaultProps = defaultProps;
-AvatarThread.propTypes = propTypes; // if (__DOCS__) {
-//   AvatarThread.docs = {
-//     componentGroup: 'Avatar Group'
-//   };
-// }
+AvatarThread.propTypes = propTypes;