@zohodesk/components 1.1.1 → 1.2.0-temp-195

package/es/Avatar/__tests__/__snapshots__/Avatar.spec.js.snap

@@ -0,0 +1,591 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Avatar rendering BorderOnActive true 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border borderOnActive  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering Name in 2 Word 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+    data-title="Gowtham Kathirvel"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    >
+      GK
+    </span>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering NeedBorder false 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering alternateSrc 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <img
+      class="image animate "
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      src="https://www.w3schools.com/images/w3schools_green.jpg"
+    />
+    <span
+      class="shadow black "
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering borderOnHover true 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border borderOnHover  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering customClass true 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   customClassAvatar"
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering initial 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    >
+      AvatarTeam
+    </span>
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering isAnimate is false 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <img
+      class="image  "
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      src="https://www.w3schools.com/images/w3schools_green.jpg"
+    />
+    <span
+      class="shadow black "
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering needInnerBorder is true 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <img
+      class="image  innerBorder"
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      src="https://www.w3schools.com/images/w3schools_green.jpg"
+    />
+    <span
+      class="shadow black "
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering needTitle 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+    data-title="AvatarNameTitile"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering showAlternateAvatar is enabled border get disabled 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <img
+      class="image animate "
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      src="https://www.w3schools.com/css/img_5terre.jpg"
+    />
+    <span
+      class="shadow black "
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering showDefaultBorder is true 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <img
+      class="image animate "
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      src="https://www.w3schools.com/images/w3schools_green.jpg"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering src 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black  "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+    data-title="AvatarName"
+  >
+    <img
+      alt="AvatarName"
+      class="image animate "
+      data-id="Avatar_AvatarImg"
+      data-selector-id="avatar_AvatarImg"
+      data-test-id="Avatar_AvatarImg"
+      name="AvatarName"
+      src="https://www.w3schools.com/images/w3schools_green.jpg"
+    />
+    <span
+      class="shadow black "
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the Custom props 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-avatar="true"
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the defult props 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the palette of- default 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle default black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the palette of- info 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle info black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the palette of- primary 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the palette of- secondary 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle secondary white border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the shape of- circle 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the shape of- square 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium square_medium primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- black 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- large 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar large large circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- medium 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- small 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar small small circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- white 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary white border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- xlarge 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar xlarge xlarge circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- xmedium 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar xmedium xmedium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- xsmall 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar xsmall xsmall circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering the size of- xxsmall 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar xxsmall xxsmall circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;
+
+exports[`Avatar rendering title 1`] = `
+<DocumentFragment>
+  <div
+    class="avatar medium medium circle primary black border   "
+    data-id="Avatar"
+    data-selector-id="avatar"
+    data-test-id="Avatar"
+    data-title="AvatarNameTitile"
+  >
+    <span
+      class="initial"
+      data-id="Avatar_AvatarInitial"
+      data-selector-id="avatar_AvatarInitial"
+      data-test-id="Avatar_AvatarInitial"
+    />
+  </div>
+</DocumentFragment>
+`;

package/es/AvatarTeam/AvatarTeam.js

@@ -1,19 +1,17 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-
 import React from 'react';
 import { defaultProps } from './props/defaultProps';
 import { propTypes } from './props/propTypes';
 import Avatar from '../Avatar/Avatar';
 import style from './AvatarTeam.module.css';
-/* once avatar support firstname lastname and pattern
-pass lastName as team name and pattern ["FIRST_NAME","LAST_NAME"] as props
-
-Not going to export to external then can kept inside supportapp
+/* once avatar support firstname lastname and pattern
+pass lastName as team name and pattern ["FIRST_NAME","LAST_NAME"] as props
+
+Not going to export to external then can kept inside supportapp
 */
 
-/*
-eslint css-modules/no-unused-class: [2, { markAsUsed: ["primary", "secondary",
-"small", "xsmall", "medium", "xmedium", "large", "xlarge"] }]
+/*
+eslint css-modules/no-unused-class: [2, { markAsUsed: ["primary", "secondary",
+"small", "xsmall", "medium", "xmedium", "large", "xlarge"] }]
 */
 
 export default class AvatarTeam extends React.Component {
@@ -47,12 +45,13 @@ export default class AvatarTeam extends React.Component {
       customAvatarTeam = ''
     } = customClass;
     let border = borderOnHover || onClick;
-    return /*#__PURE__*/React.createElement("span", _extends({
+    return /*#__PURE__*/React.createElement("span", {
       className: `${style.container} ${borderOnActive ? style.borderOnActive : border ? style.borderOnHover : ''} `,
       "data-id": dataId,
       "data-test-id": dataId,
-      "data-selector-id": dataSelectorId
-    }, AvatarTeamProps), /*#__PURE__*/React.createElement(Avatar, _extends({
+      "data-selector-id": dataSelectorId,
+      ...AvatarTeamProps
+    }, /*#__PURE__*/React.createElement(Avatar, {
       name: name,
       onClick: onClick,
       palette: palette,
@@ -66,8 +65,9 @@ export default class AvatarTeam extends React.Component {
       borderOnHover: border,
       needInnerBorder: needInnerBorder,
       needBorder: needBorder,
-      needDefaultBorder: needDefaultBorder
-    }, AvatarProps)), /*#__PURE__*/React.createElement("span", {
+      needDefaultBorder: needDefaultBorder,
+      ...AvatarProps
+    }), /*#__PURE__*/React.createElement("span", {
       className: `${style.team} ${isFilled ? `${style[`${palette}Filled`]}` : style.nofill} 
           ${style[`${size}team`]} ${customAvatarTeam}`
     }));