@zohodesk/dot 1.0.0-beta.2 → 1.0.0-beta.202

package/es/avatar/AvatarUser/docs/AvatarUser__default.docs.js

@@ -1,142 +1,169 @@
-import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
-import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
-import _createClass from 'babel-runtime/helpers/createClass';
-import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
-import _inherits from 'babel-runtime/helpers/inherits';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import AvatarUser from '../AvatarUser';
 import style from '@zohodesk/components/lib/common/docStyle.module.css';
-
-var AvatarUser__default = function (_React$Component) {
-  _inherits(AvatarUser__default, _React$Component);
-
-  function AvatarUser__default(props) {
-    _classCallCheck(this, AvatarUser__default);
-
-    return _possibleConstructorReturn(this, (AvatarUser__default.__proto__ || _Object$getPrototypeOf(AvatarUser__default)).call(this, props));
+export default class AvatarUser__default extends React.Component {
+  constructor(props) {
+    super(props);
   }
 
-  _createClass(AvatarUser__default, [{
-    key: 'render',
-    value: function render() {
-      return React.createElement(
-        'div',
-        null,
-        React.createElement(
-          'div',
-          null,
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'small', isPaid: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xsmall', isPaid: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'medium', isPaid: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xmedium', isPaid: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'large', isPaid: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xlarge', isPaid: true
-            })
-          )
-        ),
-        React.createElement(
-          'div',
-          null,
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'small',
-              isPortal: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xsmall', isPortal: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'medium', isPortal: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xmedium', isPortal: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'large', isPortal: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop },
-            React.createElement(AvatarUser, {
-              name: 'Bharathikannan',
-              size: 'xlarge', isPortal: true
-            })
-          )
-        )
-      );
-    }
-  }]);
-
-  return AvatarUser__default;
-}(React.Component);
-
-export default AvatarUser__default;
+  render() {
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "small",
+      isPaid: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xsmall",
+      isPaid: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "medium",
+      isPaid: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xmedium",
+      isPaid: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "large",
+      isPaid: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xlarge",
+      isPaid: true
+    }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "small",
+      isPortal: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xsmall",
+      isPortal: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "medium",
+      isPortal: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xmedium",
+      isPortal: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "large",
+      isPortal: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xlarge",
+      isPortal: true
+    }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      iconName: "ZD-chTwitter",
+      iconSize: "8",
+      title: "Twitter",
+      size: "small",
+      isLocked: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      iconName: "ZD-chTwitter",
+      iconSize: "10",
+      title: "Twitter",
+      size: "xsmall",
+      isLocked: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "medium",
+      isLocked: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xmedium",
+      isLocked: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "large",
+      isLocked: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xlarge",
+      isLocked: true
+    }))), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      iconName: "ZD-chTwitter",
+      iconSize: "8",
+      title: "Twitter",
+      size: "small",
+      needDelete: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      iconName: "ZD-chTwitter",
+      iconSize: "10",
+      title: "Twitter",
+      size: "xsmall",
+      needDelete: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "medium",
+      needDelete: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xmedium",
+      needDelete: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "large",
+      needDelete: true
+    })), /*#__PURE__*/React.createElement("span", {
+      className: `${style.docspan} ${style.vtop}`
+    }, /*#__PURE__*/React.createElement(AvatarUser, {
+      name: "Bharathikannan",
+      size: "xlarge",
+      needDelete: true
+    }))));
+  }
 
+}
 
 if (false) {
   AvatarUser__default.docs = {

package/es/avatar/AvatarWithTeam/AvatarWithTeam.js

@@ -1,75 +1,117 @@
-import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
-import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
-import _createClass from 'babel-runtime/helpers/createClass';
-import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
-import _inherits from 'babel-runtime/helpers/inherits';
+function _extends() { _extends = Object.assign || 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 PropTypes from 'prop-types';
 import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
 import AvatarTeam from '@zohodesk/components/lib/AvatarTeam/AvatarTeam';
 import style from './AvatarWithTeam.module.css';
-
-var AvatarWithTeam = function (_React$Component) {
-  _inherits(AvatarWithTeam, _React$Component);
-
-  function AvatarWithTeam() {
-    _classCallCheck(this, AvatarWithTeam);
-
-    return _possibleConstructorReturn(this, (AvatarWithTeam.__proto__ || _Object$getPrototypeOf(AvatarWithTeam)).apply(this, arguments));
+export default class AvatarWithTeam extends React.Component {
+  render() {
+    let {
+      name,
+      size,
+      src,
+      teamName,
+      isTeam,
+      needTitle = false,
+      initial,
+      title,
+      palette,
+      textPalette,
+      customTextClass,
+      teamClassName,
+      borderOnActive,
+      customProps
+    } = this.props;
+    let {
+      AvatarWithTeamProps = {},
+      Avatar1Props = {},
+      AvatarTeam1Props = {},
+      Avatar2Props = {},
+      AvatarTeam2Props = {}
+    } = customProps;
+    return /*#__PURE__*/React.createElement("span", _extends({
+      className: `${style.container} `,
+      "data-id": "avatarWithTeamId"
+    }, AvatarWithTeamProps), isTeam && teamName ? /*#__PURE__*/React.createElement(Avatar, _extends({
+      name: name,
+      src: src,
+      size: size,
+      initial: initial,
+      needTitle: needTitle,
+      palette: palette,
+      textPalette: textPalette,
+      customClass: customTextClass,
+      borderOnActive: borderOnActive
+    }, Avatar1Props)) : isTeam ? /*#__PURE__*/React.createElement(AvatarTeam, _extends({
+      name: name,
+      src: src,
+      size: size,
+      needTitle: needTitle,
+      title: needTitle ? title : undefined,
+      palette: palette,
+      textPalette: textPalette,
+      customClass: {
+        customAvatar: customTextClass
+      },
+      borderOnActive: borderOnActive
+    }, AvatarTeam1Props)) : /*#__PURE__*/React.createElement(Avatar, _extends({
+      name: name,
+      src: src,
+      size: size,
+      initial: initial,
+      needTitle: needTitle,
+      palette: palette,
+      textPalette: textPalette,
+      customClass: customTextClass,
+      borderOnActive: borderOnActive
+    }, Avatar2Props)), teamName ? /*#__PURE__*/React.createElement("span", {
+      className: `${style.teamAvatar} ${teamClassName} `,
+      "data-id": "teamNameTestId",
+      "data-title": needTitle ? title : undefined
+    }, /*#__PURE__*/React.createElement(AvatarTeam, _extends({
+      name: teamName,
+      size: "small",
+      palette: palette,
+      textPalette: textPalette,
+      isFilled: true,
+      needTitle: needTitle,
+      customClass: {
+        customAvatar: customTextClass
+      },
+      borderOnActive: borderOnActive
+    }, AvatarTeam2Props))) : null);
   }
 
-  _createClass(AvatarWithTeam, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          name = _props.name,
-          size = _props.size,
-          src = _props.src,
-          teamName = _props.teamName,
-          isTeam = _props.isTeam,
-          _props$needTitle = _props.needTitle,
-          needTitle = _props$needTitle === undefined ? false : _props$needTitle,
-          initial = _props.initial;
-
-
-      return React.createElement(
-        'span',
-        { className: style.container + ' ', 'data-id': 'avatarWithTeamId' },
-        isTeam && teamName ? React.createElement(Avatar, { name: name, src: src, size: size, initial: initial, needTitle: needTitle }) : isTeam ? React.createElement(AvatarTeam, { name: name, src: src, size: size, needTitle: needTitle }) : React.createElement(Avatar, { name: name, src: src, size: size, initial: initial, needTitle: needTitle }),
-        teamName ? React.createElement(
-          'span',
-          { className: style.teamAvatar, 'data-id': 'teamNameTestId' },
-          React.createElement(AvatarTeam, {
-            name: teamName,
-            size: 'small',
-            palette: 'primary',
-            isFilled: true,
-            needTitle: needTitle
-          })
-        ) : null
-      );
-    }
-  }]);
-
-  return AvatarWithTeam;
-}(React.Component);
-
-export default AvatarWithTeam;
-
-
+}
 AvatarWithTeam.defaultProps = {
   size: 'xmedium',
-  isTeam: false
+  isTeam: false,
+  teamClassName: '',
+  borderOnActive: false,
+  customProps: {}
 };
-
 AvatarWithTeam.propTypes = {
+  customTextClass: PropTypes.string,
   initial: PropTypes.string,
   isTeam: PropTypes.bool,
   name: PropTypes.string,
   needTitle: PropTypes.bool,
+  palette: PropTypes.oneOf(['primary', 'secondary', 'info', 'default']),
   size: PropTypes.string,
   src: PropTypes.string,
-  teamName: PropTypes.string
+  teamClassName: PropTypes.string,
+  teamName: PropTypes.string,
+  textPalette: PropTypes.oneOf(['white', 'black']),
+  title: PropTypes.string,
+  borderOnActive: PropTypes.bool,
+  customProps: PropTypes.shape({
+    AvatarWithTeamProps: PropTypes.object,
+    Avatar1Props: PropTypes.object,
+    AvatarTeam1Props: PropTypes.object,
+    Avatar2Props: PropTypes.object,
+    AvatarTeam2Props: PropTypes.object
+  })
 };
 
 if (false) {

package/es/avatar/AvatarWithTeam/AvatarWithTeam.module.css

@@ -6,18 +6,18 @@
 
 .teamAvatar {
   position: absolute;
-  bottom: -6px;
+  bottom: calc(var(--zd_size6) * -1);
   font-size: 0;
-  padding: 3px;
+  padding: var(--zd_size2);
   border-radius: 50%;
   transform: scale(0.8);
-  background-color: var(--zd_bg_pure);
+  background-color: var(--zdt_avatarteam_default_bg);
 }
 
 [dir=ltr] .teamAvatar {
-  right: -10px;
+  right: calc(var(--zd_size10) * -1);
 }
 
 [dir=rtl] .teamAvatar {
-  left: -10px;
+  left: calc(var(--zd_size10) * -1);
 }

package/es/avatar/AvatarWithTeam/__tests__/AvatarWithTeam.spec.js

@@ -1,48 +1,47 @@
-import _Object$assign from 'babel-runtime/core-js/object/assign';
 import expect from 'expect';
 import AvatarWithTeam from '../AvatarWithTeam';
-
-var defaultProps = {
-    name: "Tested Team",
-    src: null,
-    teamName: null,
-    isTeam: null
+let defaultProps = {
+  name: "Tested Team",
+  src: null,
+  teamName: null,
+  isTeam: null
 };
-
-describe('SampleTest', function () {
-    var _global$setup = global.setup(AvatarWithTeam, defaultProps),
-        renderedDOM = _global$setup.renderedDOM,
-        props = _global$setup.props;
-
-    var Avatarid = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'avatarWithTeamId');
-
-    it('Check whether Avatar mounted or not', function () {
-        expect(global.TestUtils.isDOMComponent(Avatarid)).toBeTruthy();
-    });
-
-    it('Check children length ', function () {
-        expect(Avatarid.children.length).toBe(1);
-    });
-
-    var properties = _Object$assign({}, defaultProps, { isTeam: true, teamName: "Tested Team", name: "Sangeetha" });
-
-    it('Check whether AvatarWithTeam mounted or not', function () {
-        var _global$setup2 = global.setup(AvatarWithTeam, properties),
-            renderedDOM = _global$setup2.renderedDOM,
-            props = _global$setup2.props;
-
-        var AvatarWithTeamId = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'teamNameTestId');
-        expect(global.TestUtils.isDOMComponent(AvatarWithTeamId)).toBeTruthy();
-    });
-
-    var property = _Object$assign({}, defaultProps, { isTeam: true, name: "Tested Team", teamName: null });
-
-    it('Check whether AvatarTeam  mounted or not', function () {
-        var _global$setup3 = global.setup(AvatarWithTeam, property),
-            renderedDOM = _global$setup3.renderedDOM,
-            props = _global$setup3.props;
-
-        var AvatarTeamId = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'avatarWithTeamId');
-        expect(global.TestUtils.isDOMComponent(AvatarTeamId)).toBeTruthy();
-    });
+describe('SampleTest', () => {
+  let {
+    renderedDOM,
+    props
+  } = global.setup(AvatarWithTeam, defaultProps);
+  let Avatarid = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'avatarWithTeamId');
+  it(`Check whether Avatar mounted or not`, () => {
+    expect(global.TestUtils.isDOMComponent(Avatarid)).toBeTruthy();
+  });
+  it(`Check children length `, () => {
+    expect(Avatarid.children.length).toBe(1);
+  });
+  let properties = Object.assign({}, defaultProps, {
+    isTeam: true,
+    teamName: "Tested Team",
+    name: "Sangeetha"
+  });
+  it(`Check whether AvatarWithTeam mounted or not`, () => {
+    let {
+      renderedDOM,
+      props
+    } = global.setup(AvatarWithTeam, properties);
+    let AvatarWithTeamId = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'teamNameTestId');
+    expect(global.TestUtils.isDOMComponent(AvatarWithTeamId)).toBeTruthy();
+  });
+  let property = Object.assign({}, defaultProps, {
+    isTeam: true,
+    name: "Tested Team",
+    teamName: null
+  });
+  it(`Check whether AvatarTeam  mounted or not`, () => {
+    let {
+      renderedDOM,
+      props
+    } = global.setup(AvatarWithTeam, property);
+    let AvatarTeamId = global.TestUtils.findRenderedComponentsWithTestid(renderedDOM, 'avatarWithTeamId');
+    expect(global.TestUtils.isDOMComponent(AvatarTeamId)).toBeTruthy();
+  });
 });

package/es/avatar/AvatarWithTeam/docs/AvatarWithTeam__default.docs.js

@@ -1,41 +1,20 @@
-import _Object$getPrototypeOf from 'babel-runtime/core-js/object/get-prototype-of';
-import _classCallCheck from 'babel-runtime/helpers/classCallCheck';
-import _createClass from 'babel-runtime/helpers/createClass';
-import _possibleConstructorReturn from 'babel-runtime/helpers/possibleConstructorReturn';
-import _inherits from 'babel-runtime/helpers/inherits';
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import AvatarWithTeam from '../AvatarWithTeam';
-
-var AvatarWithTeam__default = function (_React$Component) {
-  _inherits(AvatarWithTeam__default, _React$Component);
-
-  function AvatarWithTeam__default(props) {
-    _classCallCheck(this, AvatarWithTeam__default);
-
-    return _possibleConstructorReturn(this, (AvatarWithTeam__default.__proto__ || _Object$getPrototypeOf(AvatarWithTeam__default)).call(this, props));
+export default class AvatarWithTeam__default extends React.Component {
+  constructor(props) {
+    super(props);
   }
 
-  _createClass(AvatarWithTeam__default, [{
-    key: 'render',
-    value: function render() {
-      return React.createElement(
-        'div',
-        null,
-        React.createElement(AvatarWithTeam, {
-          name: 'feedback',
-          src: 'https://hjemly.dk/wp-content/uploads/2016/05/facebook-default-no-profile-pic.jpg',
-          teamName: 'BK'
-        })
-      );
-    }
-  }]);
-
-  return AvatarWithTeam__default;
-}(React.Component);
-
-export default AvatarWithTeam__default;
+  render() {
+    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(AvatarWithTeam, {
+      name: "feedback",
+      src: "https://hjemly.dk/wp-content/uploads/2016/05/facebook-default-no-profile-pic.jpg",
+      teamName: "BK"
+    }));
+  }
 
+}
 
 if (false) {
   AvatarWithTeam__default.docs = {