@zohodesk/dot 1.0.0-beta.21 → 1.0.0-beta.212

package/es/avatar/AvatarStatus/AvatarStatus.module.css

@@ -1,93 +0,0 @@
-.container {
-  position: relative;
-  composes: dInflex from "~@zohodesk/components/lib/common/common.module.css";
-  vertical-align: middle;
-}
-.state {
-  position: absolute;
-  composes: rounded from "~@zohodesk/components/lib/common/common.module.css";
-  display: inline-block;
-  border: 1px solid var(--zd_border_pure);
-}
-
-.online {
-  composes: state;
-  background-color: var(--zd_bg_olive);
-}
-
-.offline {
-  composes: state;
-  background-color: var(--zd_bg_danger);
-}
-.idle {
-  composes: state;
-  background-color: var(--zd_bg_vermilion);
-}
-
-.small .state,
-.xsmall .state {
-  width: var(--zd_size7);
-  height: var(--zd_size7);
-}
-.medium .state,
-.xmedium .state {
-  width: var(--zd_size9);
-  height: var(--zd_size9);
-}
-.large .state,
-.xlarge .state {
-  width: var(--zd_size11);
-  height: var(--zd_size11);
-}
-
-.small .state {
-  bottom: var(--zd_size1);
-}
-
-[dir=ltr] .small .state {
-  right: calc(var(--zd_size1) * -1);
-}
-
-[dir=rtl] .small .state {
-  left: calc(var(--zd_size1) * -1);
-}
-.xsmall .state {
-  bottom: var(--zd_size3);
-}
-[dir=ltr] .xsmall .state {
-  right: 0;
-}
-[dir=rtl] .xsmall .state {
-  left: 0;
-}
-.medium .state,
-.xmedium .state {
-  bottom: var(--zd_size3);
-}
-[dir=ltr] .medium .state, [dir=ltr] .xmedium .state {
-  right: 0;
-}
-[dir=rtl] .medium .state, [dir=rtl] .xmedium .state {
-  left: 0;
-}
-.large .state {
-  bottom: var(--zd_size7);
-}
-[dir=ltr] .large .state {
-  right: var(--zd_size1);
-}
-[dir=rtl] .large .state {
-  left: var(--zd_size1);
-}
-
-.xlarge .state {
-  bottom: var(--zd_size15);
-}
-
-[dir=ltr] .xlarge .state {
-  right: var(--zd_size11);
-}
-
-[dir=rtl] .xlarge .state {
-  left: var(--zd_size11);
-}

package/es/avatar/AvatarStatus/docs/AvatarStatus__size.docs.js

@@ -1,52 +0,0 @@
-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 AvatarStatus from '../AvatarStatus';
-import style from '@zohodesk/components/lib/common/docStyle.module.css';
-
-var AvatarStatus__size = function (_React$Component) {
-  _inherits(AvatarStatus__size, _React$Component);
-
-  function AvatarStatus__size(props) {
-    _classCallCheck(this, AvatarStatus__size);
-
-    return _possibleConstructorReturn(this, (AvatarStatus__size.__proto__ || _Object$getPrototypeOf(AvatarStatus__size)).call(this, props));
-  }
-
-  _createClass(AvatarStatus__size, [{
-    key: 'render',
-    value: function render() {
-      var sizes = ['small', 'xsmall', 'medium', 'xmedium', 'large', 'xlarge'];
-      return React.createElement(
-        'div',
-        null,
-        sizes.map(function (size) {
-          return React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop, key: size },
-            React.createElement(AvatarStatus, {
-              name: 'Bharathikannan',
-              size: size
-            })
-          );
-        })
-      );
-    }
-  }]);
-
-  return AvatarStatus__size;
-}(React.Component);
-
-export default AvatarStatus__size;
-
-
-if (false) {
-  AvatarStatus__size.docs = {
-    componentGroup: 'Avatar Group',
-    description: ' '
-  };
-}

package/es/avatar/AvatarStatus/docs/AvatarStatus__state.docs.js

@@ -1,75 +0,0 @@
-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 AvatarStatus from '../AvatarStatus';
-import style from '@zohodesk/components/lib/common/docStyle.module.css';
-
-var AvatarStatus__state = function (_React$Component) {
-  _inherits(AvatarStatus__state, _React$Component);
-
-  function AvatarStatus__state(props) {
-    _classCallCheck(this, AvatarStatus__state);
-
-    return _possibleConstructorReturn(this, (AvatarStatus__state.__proto__ || _Object$getPrototypeOf(AvatarStatus__state)).call(this, props));
-  }
-
-  _createClass(AvatarStatus__state, [{
-    key: 'render',
-    value: function render() {
-      var states = ['online', 'offline', 'idle'];
-      return React.createElement(
-        'div',
-        null,
-        states.map(function (state) {
-          return React.createElement(
-            'span',
-            { className: style.docspan + ' ' + style.vtop, key: state },
-            React.createElement(AvatarStatus, {
-              name: 'Bharathikannan',
-              size: 'xmedium',
-              state: state
-            })
-          );
-        })
-      );
-      /*return (
-        <div>
-            <span className={style.docspan + ' ' + style.vtop}>
-              <AvatarStatus
-              name="Bharathikannan"
-                size="xmedium" palette="primary" state='online'
-              />
-            </span>
-             <span className={style.docspan + ' ' + style.vtop}>
-              <AvatarStatus
-                name="Bharathikannan"
-                size="xmedium" palette="secondary" state='offline'
-              />
-            </span>
-             <span className={style.docspan + ' ' + style.vtop}>
-              <AvatarStatus
-              name="Bharathikannan"
-                size="xmedium" palette="primary" filled state='idle'
-              />
-            </span>
-            </div>
-      );*/
-    }
-  }]);
-
-  return AvatarStatus__state;
-}(React.Component);
-
-export default AvatarStatus__state;
-
-
-if (false) {
-  AvatarStatus__state.docs = {
-    componentGroup: 'Avatar Group',
-    description: ' '
-  };
-}

package/es/avatar/AvatarThread/AvatarThread.js

@@ -1,107 +0,0 @@
-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 from 'react';
-import PropTypes from 'prop-types';
-import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
-import Icon from '@zohodesk/icons/lib/Icon';
-import style from './AvatarThread.module.css';
-
-var AvatarThread = function (_React$Component) {
-  _inherits(AvatarThread, _React$Component);
-
-  function AvatarThread() {
-    _classCallCheck(this, AvatarThread);
-
-    return _possibleConstructorReturn(this, (AvatarThread.__proto__ || _Object$getPrototypeOf(AvatarThread)).apply(this, arguments));
-  }
-
-  _createClass(AvatarThread, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          src = _props.src,
-          name = _props.name,
-          size = _props.size,
-          iconColor = _props.iconColor,
-          iconName = _props.iconName,
-          iconSize = _props.iconSize,
-          borderPalette = _props.borderPalette,
-          onClick = _props.onClick,
-          title = _props.title,
-          iconTitle = _props.iconTitle,
-          onIconClick = _props.onIconClick,
-          showOnHover = _props.showOnHover,
-          dataId = _props.dataId,
-          initial = _props.initial;
-
-      var hoverEffect = showOnHover ? style.hover : '';
-      return React.createElement(
-        'div',
-        { className: style.container + ' ' + hoverEffect },
-        React.createElement(Avatar, {
-          initial: initial,
-          src: src,
-          name: name,
-          title: title,
-          size: size,
-          onClick: onClick,
-          dataId: dataId
-        }),
-        iconName && React.createElement(
-          'span',
-          {
-            className: style.thread + ' ' + style['border_' + borderPalette],
-            'data-title': iconTitle,
-            'data-id': iconTitle === 'Remove Follower' && 'removeFollower',
-            onClick: onIconClick
-          },
-          React.createElement(
-            'span',
-            { className: style.icon },
-            React.createElement(Icon, {
-              name: iconName,
-              size: iconSize,
-              iconClass: style['text_' + iconColor] ? style['text_' + iconColor] : iconColor
-            })
-          )
-        )
-      );
-    }
-  }]);
-
-  return AvatarThread;
-}(React.Component);
-
-export default AvatarThread;
-
-
-AvatarThread.defaultProps = {
-  size: 'medium',
-  iconSize: '6',
-  borderPalette: 'default'
-};
-
-AvatarThread.propTypes = {
-  borderPalette: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  iconColor: PropTypes.string,
-  iconName: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  iconSize: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  iconTitle: PropTypes.string,
-  initial: PropTypes.string,
-  name: PropTypes.string,
-  onClick: PropTypes.func,
-  onIconClick: PropTypes.func,
-  showOnHover: PropTypes.bool,
-  size: PropTypes.string,
-  src: PropTypes.string,
-  title: PropTypes.string
-};
-
-if (false) {
-  AvatarThread.docs = {
-    componentGroup: 'Avatar Group'
-  };
-}

package/es/avatar/AvatarThread/AvatarThread.module.css

@@ -1,65 +0,0 @@
-.container {
-  position: relative;
-  composes: dInflex from '~@zohodesk/components/lib/common/common.module.css';
-  vertical-align: middle;
-  border-radius: 50%;
-  cursor: pointer;
-}
-
-.thread {
-  composes: rounded from '~@zohodesk/components/lib/common/common.module.css';
-  position: absolute;
-  top: calc(var(--zd_size3) * -1);
-  height: var(--zd_size15);
-  width: var(--zd_size15);
-  border: 1px solid var(--zd_border_smoke23);
-  background-color: var(--dot_bg_white);
-  cursor: pointer;
-}
-
-[dir=ltr] .thread {
-  right: var(--zd_size2);
-}
-
-[dir=rtl] .thread {
-  left: var(--zd_size2);
-}
-
-.icon {
-  position: absolute;
-  line-height: 0;
-  composes: middleBoth from '~@zohodesk/components/lib/common/common.module.css';
-}
-
-.border_primary {
-  border-color: var(--zd_border_primary);
-}
-
-.border_success {
-  border-color: var(--zd_border_olive5);
-}
-
-.border_danger {
-  border-color: var(--zd_border_danger);
-}
-
-.hover .thread {
-  display: none;
-}
-
-.hover .thread {
-  z-index: 1;
-  cursor: pointer;
-}
-
-.hover:hover .thread {
-  display: block;
-}
-
-.text_primary {
-  color: var(--zd_text_primary);
-}
-
-.text_danger {
-  color: var(--zd_text_danger);
-}

package/es/avatar/AvatarThread/docs/AvatarThread__default.docs.js

@@ -1,69 +0,0 @@
-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 AvatarThread from '../AvatarThread';
-import style from '@zohodesk/components/lib/common/docStyle.module.css';
-
-var AvatarThread__default = function (_Component) {
-  _inherits(AvatarThread__default, _Component);
-
-  function AvatarThread__default(props) {
-    _classCallCheck(this, AvatarThread__default);
-
-    return _possibleConstructorReturn(this, (AvatarThread__default.__proto__ || _Object$getPrototypeOf(AvatarThread__default)).call(this, props));
-  }
-
-  _createClass(AvatarThread__default, [{
-    key: 'render',
-    value: function render() {
-      return React.createElement(
-        'span',
-        null,
-        React.createElement(
-          'div',
-          null,
-          React.createElement(
-            'span',
-            { className: style.docspan },
-            React.createElement(AvatarThread, {
-              name: 'Bharathikannan',
-              size: 'medium',
-              iconName: 'ZD-minus',
-              iconSize: '8',
-              iconColor: 'primary',
-              borderPalette: 'primary',
-              showOnHover: true
-            })
-          ),
-          React.createElement(
-            'span',
-            { className: style.docspan },
-            React.createElement(AvatarThread, {
-              src: 'https://contacts.zoho.com/file?ID=8237519&exp=6000&t=user&fs=thumb',
-              name: 'Bharathikannan',
-              size: 'medium',
-              iconName: 'ZD-emailIn',
-              iconSize: '10',
-              borderPalette: 'success'
-            })
-          )
-        )
-      );
-    }
-  }]);
-
-  return AvatarThread__default;
-}(Component);
-
-export default AvatarThread__default;
-
-
-if (false) {
-  AvatarThread__default.docs = {
-    componentGroup: 'Avatar Group'
-  };
-}

package/es/avatar/AvatarUser/AvatarUser.js

@@ -1,119 +0,0 @@
-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';
-/**** Libraries ****/
-import React from 'react';
-import PropTypes from 'prop-types';
-/**** Components ****/
-import Avatar from '@zohodesk/components/lib/Avatar/Avatar';
-import Icon from '@zohodesk/icons/lib/Icon';
-import style from './AvatarUser.module.css';
-/**** Methods ****/
-import { i18NProviderUtils } from '@zohodesk/i18n';
-
-var AvatarUser = function (_React$Component) {
-  _inherits(AvatarUser, _React$Component);
-
-  function AvatarUser() {
-    _classCallCheck(this, AvatarUser);
-
-    return _possibleConstructorReturn(this, (AvatarUser.__proto__ || _Object$getPrototypeOf(AvatarUser)).apply(this, arguments));
-  }
-
-  _createClass(AvatarUser, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          src = _props.src,
-          name = _props.name,
-          size = _props.size,
-          onClick = _props.onClick,
-          onDelete = _props.onDelete,
-          title = _props.title,
-          isPaid = _props.isPaid,
-          isPortal = _props.isPortal,
-          dataId = _props.dataId,
-          needTitle = _props.needTitle,
-          needDelete = _props.needDelete,
-          initial = _props.initial;
-
-      return React.createElement(
-        'div',
-        {
-          className: style.container + ' ' + style[size],
-          'data-id': dataId || name
-        },
-        React.createElement(Avatar, {
-          src: src,
-          name: name,
-          initial: initial,
-          title: title,
-          onClick: onClick,
-          size: size,
-          needTitle: needTitle
-        }),
-        isPaid ? React.createElement(
-          'span',
-          {
-            'data-title': i18NProviderUtils.getI18NValue('support.customerPortal.users.paidUser'),
-            className: style.paid,
-            'data-id': 'paidUser'
-          },
-          React.createElement(Icon, { name: 'ZD-paiduser' })
-        ) : null,
-        isPortal ? React.createElement(
-          'span',
-          {
-            'data-title': i18NProviderUtils.getI18NValue('crm.end.user'),
-            className: style.portal,
-            'data-id': 'portalUser'
-          },
-          React.createElement(Icon, { name: 'ZD-globe1' })
-        ) : null,
-        needDelete ? React.createElement(
-          'span',
-          {
-            className: style.delete,
-            'data-id': 'dltContactPhoto',
-            onClick: onDelete
-          },
-          React.createElement(Icon, { name: 'ZD-delete2', size: '15' })
-        ) : null
-      );
-    }
-  }]);
-
-  return AvatarUser;
-}(React.Component);
-
-export default AvatarUser;
-
-
-AvatarUser.propTypes = {
-  dataId: PropTypes.string,
-  initial: PropTypes.string,
-  isPaid: PropTypes.bool,
-  isPortal: PropTypes.bool,
-  name: PropTypes.string,
-  needDelete: PropTypes.bool,
-  needTitle: PropTypes.bool,
-  onClick: PropTypes.func,
-  onDelete: PropTypes.func,
-  size: PropTypes.string,
-  src: PropTypes.string,
-  title: PropTypes.string
-};
-
-AvatarUser.defaultProps = {
-  needTitle: true,
-  size: 'medium',
-  needDelete: false
-};
-
-if (false) {
-  AvatarUser.docs = {
-    componentGroup: 'Avatar Group'
-  };
-}

package/es/avatar/AvatarUser/AvatarUser.module.css

@@ -1,101 +0,0 @@
-.container {
-  position: relative;
-  composes: dInflex from '~@zohodesk/components/lib/common/common.module.css';
-  vertical-align: middle;
-}
-.paid,
-.portal,
-.delete {
-  position: absolute;
-  line-height: 0;
-  font-size: var(--zd_size10);
-}
-.paid {
-  composes: middle from '~@zohodesk/components/lib/common/common.module.css';
-}
-[dir=ltr] .paid {
-  left: 50%;
-}
-[dir=rtl] .paid {
-  right: 50%;
-}
-.paid {
-  top: calc(var(--zd_size2) * -1);
-}
-.portal {
-  composes: middle from '~@zohodesk/components/lib/common/common.module.css';
-}
-.delete {
-  top: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 0;
-  transition: all 0.3s;
-  composes: dflex from '~@zohodesk/components/lib/common/common.module.css';
-  composes: alignHorizontal from '~@zohodesk/components/lib/common/common.module.css';
-  composes: alignVertical from '~@zohodesk/components/lib/common/common.module.css';
-  cursor: pointer;
-}
-[dir=ltr] .delete {
-  left: 0;
-}
-[dir=rtl] .delete {
-  right: 0;
-}
-.container:hover .delete {
-  opacity: 1;
-}
-.small .portal {
-  top: var(--zd_size5);
-}
-[dir=ltr] .small .portal {
-  right: calc(var(--zd_size9) * -1);
-}
-[dir=rtl] .small .portal {
-  left: calc(var(--zd_size9) * -1);
-}
-.xsmall .portal {
-  top: var(--zd_size6);
-}
-[dir=ltr] .xsmall .portal {
-  right: calc(var(--zd_size7) * -1);
-}
-[dir=rtl] .xsmall .portal {
-  left: calc(var(--zd_size7) * -1);
-}
-.medium .portal {
-  top: var(--zd_size6);
-}
-[dir=ltr] .medium .portal {
-  right: calc(var(--zd_size6) * -1);
-}
-[dir=rtl] .medium .portal {
-  left: calc(var(--zd_size6) * -1);
-}
-.xmedium .portal {
-  top: var(--zd_size8);
-}
-[dir=ltr] .xmedium .portal {
-  right: calc(var(--zd_size5) * -1);
-}
-[dir=rtl] .xmedium .portal {
-  left: calc(var(--zd_size5) * -1);
-}
-.large .portal {
-  top: var(--zd_size13);
-}
-[dir=ltr] .large .portal {
-  right: calc(var(--zd_size4) * -1);
-}
-[dir=rtl] .large .portal {
-  left: calc(var(--zd_size4) * -1);
-}
-.xlarge .portal {
-  top: var(--zd_size20);
-}
-[dir=ltr] .xlarge .portal {
-  right: var(--zd_size7);
-}
-[dir=rtl] .xlarge .portal {
-  left: var(--zd_size7);
-}