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

package/lib/layout/SubtabLayout/SubtabLayout.js

@@ -1,255 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SubtabContent = exports.SubtabHeader = undefined;
-
-var _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; };
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _Layout = require('@zohodesk/components/lib/Layout');
-
-var _Card = require('@zohodesk/components/lib/Card');
-
-var _PlusIcon = require('../../PlusIcon/PlusIcon');
-
-var _PlusIcon2 = _interopRequireDefault(_PlusIcon);
-
-var _SubtabLayoutModule = require('./SubtabLayout.module.css');
-
-var _SubtabLayoutModule2 = _interopRequireDefault(_SubtabLayoutModule);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-//-----------style-----------//
-
-
-var SubtabHeader = exports.SubtabHeader = function (_React$Component) {
-  _inherits(SubtabHeader, _React$Component);
-
-  function SubtabHeader() {
-    _classCallCheck(this, SubtabHeader);
-
-    return _possibleConstructorReturn(this, (SubtabHeader.__proto__ || Object.getPrototypeOf(SubtabHeader)).apply(this, arguments));
-  }
-
-  _createClass(SubtabHeader, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          onAdd = _props.onAdd,
-          getLeftPlaceHolder = _props.getLeftPlaceHolder,
-          title = _props.title,
-          label = _props.label,
-          getRightPlaceHolder = _props.getRightPlaceHolder,
-          type = _props.type,
-          leftClassName = _props.leftClassName,
-          rightClassName = _props.rightClassName,
-          needBorder = _props.needBorder,
-          needShadow = _props.needShadow,
-          needPlusIconLine = _props.needPlusIconLine,
-          children = _props.children,
-          dataId = _props.dataId;
-
-      return _react2.default.createElement(
-        _Card.CardHeader,
-        _extends({
-          className: _SubtabLayoutModule2.default.tabHead + ' ' + (needShadow ? _SubtabLayoutModule2.default.shadowStyle : '') + ' ' + (needBorder ? _SubtabLayoutModule2.default.borderStyle : '')
-        }, this.props),
-        _react2.default.createElement(
-          _Layout.Container,
-          { alignBox: 'row', className: '' + _SubtabLayoutModule2.default[type], align: 'vertical' },
-          onAdd || children ? _react2.default.createElement(
-            _Layout.Box,
-            {
-              className: _SubtabLayoutModule2.default.left + ' ' + (needPlusIconLine ? _SubtabLayoutModule2.default.plusIconLine : '')
-            },
-            onAdd ? _react2.default.createElement(_PlusIcon2.default, { dataId: dataId, onClick: onAdd }) : children
-          ) : null,
-          title ? _react2.default.createElement(
-            _Layout.Box,
-            {
-              className: _SubtabLayoutModule2.default.title + ' ' + (onAdd ? _SubtabLayoutModule2.default.cursor : ''),
-              onClick: onAdd ? onAdd : null
-            },
-            title
-          ) : null,
-          getLeftPlaceHolder && _react2.default.createElement(
-            _Layout.Box,
-            {
-              flexible: true,
-              shrink: true,
-              adjust: getRightPlaceHolder ? true : false,
-              className: '' + (leftClassName ? leftClassName : '')
-            },
-            label ? _react2.default.createElement(
-              'div',
-              { className: _SubtabLayoutModule2.default.label },
-              label
-            ) : null,
-            getLeftPlaceHolder
-          ),
-          getRightPlaceHolder && _react2.default.createElement(
-            _Layout.Box,
-            {
-              flexible: true,
-              shrink: true,
-              adjust: getLeftPlaceHolder ? true : false,
-              className: ' ' + (rightClassName ? rightClassName : '')
-            },
-            _react2.default.createElement(
-              _Layout.Container,
-              {
-                alignBox: 'row',
-                align: 'vertical',
-                className: _SubtabLayoutModule2.default.aside
-              },
-              getRightPlaceHolder
-            )
-          )
-        )
-      );
-    }
-  }]);
-
-  return SubtabHeader;
-}(_react2.default.Component);
-
-SubtabHeader.propTypes = {
-  children: _propTypes2.default.element,
-  dataId: _propTypes2.default.string,
-  getLeftPlaceHolder: _propTypes2.default.oneOf([_propTypes2.default.func, _propTypes2.default.object]),
-  getRightPlaceHolder: _propTypes2.default.func,
-  label: _propTypes2.default.string,
-  leftClassName: _propTypes2.default.string,
-  needBorderShadow: _propTypes2.default.bool,
-  needPlusIconLine: _propTypes2.default.bool,
-  onAdd: _propTypes2.default.func,
-  rightClassName: _propTypes2.default.string,
-  title: _propTypes2.default.string,
-  type: _propTypes2.default.oneOf(['primary', 'secondary'])
-};
-
-SubtabHeader.defaultProps = {
-  type: 'primary',
-  needBorder: true,
-  needShadow: true,
-  needPlusIconLine: true,
-  dataId: 'addreqNowbutton'
-};
-
-var SubtabContent = exports.SubtabContent = function (_React$Component2) {
-  _inherits(SubtabContent, _React$Component2);
-
-  function SubtabContent() {
-    _classCallCheck(this, SubtabContent);
-
-    return _possibleConstructorReturn(this, (SubtabContent.__proto__ || Object.getPrototypeOf(SubtabContent)).apply(this, arguments));
-  }
-
-  _createClass(SubtabContent, [{
-    key: 'render',
-    value: function render() {
-      var _props2 = this.props,
-          children = _props2.children,
-          scroll = _props2.scroll,
-          className = _props2.className,
-          eleRef = _props2.eleRef,
-          dataId = _props2.dataId,
-          onScroll = _props2.onScroll;
-
-      return _react2.default.createElement(
-        _Card.CardContent,
-        {
-          scroll: scroll,
-          isScrollAttribute: true,
-          onScroll: onScroll,
-          className: className ? className : '',
-          eleRef: eleRef,
-          dataId: dataId
-        },
-        children
-      );
-    }
-  }]);
-
-  return SubtabContent;
-}(_react2.default.Component);
-
-SubtabContent.propTypes = {
-  children: _propTypes2.default.oneOf([_propTypes2.default.element, _propTypes2.default.array]),
-  className: _propTypes2.default.element,
-  dataId: _propTypes2.default.string,
-  eleRef: _propTypes2.default.func,
-  scroll: _propTypes2.default.oneOf(['vertical'])
-};
-
-SubtabContent.defaultProps = {
-  scroll: 'vertical'
-};
-
-var SubtabLayout = function (_React$Component3) {
-  _inherits(SubtabLayout, _React$Component3);
-
-  function SubtabLayout() {
-    _classCallCheck(this, SubtabLayout);
-
-    return _possibleConstructorReturn(this, (SubtabLayout.__proto__ || Object.getPrototypeOf(SubtabLayout)).apply(this, arguments));
-  }
-
-  _createClass(SubtabLayout, [{
-    key: 'render',
-    value: function render() {
-      var _props3 = this.props,
-          children = _props3.children,
-          dataId = _props3.dataId;
-
-      return _react2.default.createElement(
-        _Card.Card,
-        _extends({
-          isScrollAttribute: true,
-          dataId: dataId
-        }, this.props, {
-          childTypes: { cardHeader: SubtabHeader, cardContent: SubtabContent }
-        }),
-        children
-      );
-    }
-  }]);
-
-  return SubtabLayout;
-}(_react2.default.Component);
-
-exports.default = SubtabLayout;
-
-
-if (false) {
-  SubtabLayout.docs = {
-    componentGroup: 'Template',
-    folderName: 'Style Guide'
-  };
-}
-
-SubtabLayout.defaultProps = {
-  dataId: 'subTabLayout'
-};
-
-SubtabLayout.propTypes = {
-  children: _propTypes2.default.oneOf([_propTypes2.default.element, _propTypes2.default.array]),
-  dataId: _propTypes2.default.string
-};

package/lib/layout/SubtabLayout/SubtabLayout.module.css

@@ -1,90 +0,0 @@
-.tabHead,
-.shadowStyle {
-  position: relative;
-}.tabHead, .shadowStyle {
-  background: var(--dot_bg_white);
-}
-
-[dir=ltr] .left {
-  margin-right: var(--zd_size15);
-}
-
-[dir=rtl] .left {
-  margin-left: var(--zd_size15);
-}
-
-.plusIconLine {
-  position: relative;
-  z-index: 2;
-}
-
-.plusIconLine::before {
-  position: absolute;
-  content: '';
-  width: var(--zd_size1);
-  height: var(--zd_size28);
-  top: var(--zd_size38);
-  z-index: -1;
-  background: var(--zd_bg_smoke3);
-}
-
-[dir=ltr] .plusIconLine::before {
-  left: var(--zd_size20);
-}
-
-[dir=rtl] .plusIconLine::before {
-  right: var(--zd_size20);
-}
-
-.borderStyle {
-  border-bottom: 1px solid var(--zd_border_smoke5);
-}
-
-.shadowStyle::before {
-  bottom: 0;
-  content: '';
-  position: absolute;
-  top: var(--zd_size20);
-  z-index: -1;
-  box-shadow: 0 0 6px var(--zd_shadow_graytrans5);
-  border-radius: 100px/10px;
-}
-
-[dir=ltr] .shadowStyle::before {
-  left: var(--zd_size50);
-  right: var(--zd_size50);
-}
-
-[dir=rtl] .shadowStyle::before {
-  right: var(--zd_size50);
-  left: var(--zd_size50);
-}
-
-.aside {
-  composes: justifyFend from '~@zohodesk/components/lib/common/common.module.css';
-}
-
-.title {
-  color: var(--zd_text_primary);
-  font-size: var(--zd_size15);
-}
-
-.label {
-  font-size: var(--zd_size12);
-  color: var(--zd_text_smoke18);
-}
-
-.primary {
-  padding: var(--zd_size27) var(--zd_size25) var(--zd_size26) var(--zd_size25);
-}
-
-[dir=ltr] .secondary {
-  padding: var(--zd_size27) var(--zd_size115) var(--zd_size26) var(--zd_size25);
-}
-
-[dir=rtl] .secondary {
-  padding: var(--zd_size27) var(--zd_size25) var(--zd_size26) var(--zd_size115);
-}
-.cursor {
-  cursor: pointer;
-}

package/lib/layout/SubtabLayout/docs/SubtabLayout__default.docs.js

@@ -1,205 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _ = require('../');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-var SubtabLayout__default = function (_React$Component) {
-  _inherits(SubtabLayout__default, _React$Component);
-
-  function SubtabLayout__default(props) {
-    _classCallCheck(this, SubtabLayout__default);
-
-    var _this = _possibleConstructorReturn(this, (SubtabLayout__default.__proto__ || Object.getPrototypeOf(SubtabLayout__default)).call(this, props));
-
-    _this.state = { needBorder: true, needShadow: false };
-    _this.onScroll = _this.onScroll.bind(_this);
-    _this.interval = null;
-    return _this;
-  }
-
-  _createClass(SubtabLayout__default, [{
-    key: 'onScroll',
-    value: function onScroll() {
-      var _this2 = this;
-
-      this.setState({ needBorder: true, needShadow: true });
-      this.interval = null;
-      var intern = setTimeout(function () {
-        clearInterval(_this2.interval);
-        _this2.setState({ needBorder: true, needShadow: false });
-      }, 500);
-      this.interval = intern;
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var boxStyle = {
-        padding: 'var(--zd_size21)'
-      };
-      var _state = this.state,
-          needShadow = _state.needShadow,
-          needBorder = _state.needBorder;
-
-
-      return _react2.default.createElement(
-        'div',
-        { style: { height: '100vh', width: '100%' } },
-        _react2.default.createElement(
-          _.SubtabLayout,
-          null,
-          _react2.default.createElement(_.SubtabHeader, { needShadow: needShadow, needBorder: needBorder }),
-          _react2.default.createElement(
-            _.SubtabContent,
-            null,
-            _react2.default.createElement(
-              'div',
-              {
-                onScroll: this.onScroll,
-                style: { height: '100%', width: '100%' }
-              },
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 2'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 3345'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              ),
-              _react2.default.createElement(
-                'div',
-                { style: boxStyle },
-                'box 1'
-              )
-            )
-          )
-        )
-      );
-    }
-  }]);
-
-  return SubtabLayout__default;
-}(_react2.default.Component);
-
-exports.default = SubtabLayout__default;
-
-
-if (false) {
-  SubtabLayout__default.docs = {
-    componentGroup: 'Template',
-    folderName: 'Style Guide'
-  };
-}

package/lib/layout/SubtabLayout/index.js

@@ -1,28 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _SubtabLayout = require('./SubtabLayout');
-
-Object.defineProperty(exports, 'SubtabLayout', {
-  enumerable: true,
-  get: function get() {
-    return _interopRequireDefault(_SubtabLayout).default;
-  }
-});
-Object.defineProperty(exports, 'SubtabHeader', {
-  enumerable: true,
-  get: function get() {
-    return _SubtabLayout.SubtabHeader;
-  }
-});
-Object.defineProperty(exports, 'SubtabContent', {
-  enumerable: true,
-  get: function get() {
-    return _SubtabLayout.SubtabContent;
-  }
-});
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

package/lib/list/AvatarFlip/AvatarFlip.js

@@ -1,128 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _propTypes = require('prop-types');
-
-var _propTypes2 = _interopRequireDefault(_propTypes);
-
-var _FlipCard = require('../../FlipCard/FlipCard');
-
-var _FlipCard2 = _interopRequireDefault(_FlipCard);
-
-var _AvatarFlipModule = require('./AvatarFlip.module.css');
-
-var _AvatarFlipModule2 = _interopRequireDefault(_AvatarFlipModule);
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
-
-var AvatarFlip = function (_Component) {
-  _inherits(AvatarFlip, _Component);
-
-  function AvatarFlip() {
-    _classCallCheck(this, AvatarFlip);
-
-    return _possibleConstructorReturn(this, (AvatarFlip.__proto__ || Object.getPrototypeOf(AvatarFlip)).apply(this, arguments));
-  }
-
-  _createClass(AvatarFlip, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          id = _props.id,
-          action = _props.action,
-          name = _props.name,
-          isChecked = _props.isChecked,
-          onChange = _props.onChange,
-          noNeedFlip = _props.noNeedFlip,
-          size = _props.size,
-          onClick = _props.onClick,
-          isPaidUser = _props.isPaidUser,
-          isPortalUser = _props.isPortalUser,
-          channel = _props.channel,
-          src = _props.src,
-          icon = _props.icon,
-          initial = _props.initial,
-          dataId = _props.dataId,
-          className = _props.className,
-          palette = _props.palette,
-          frontClass = _props.frontClass,
-          needTitle = _props.needTitle;
-
-      return _react2.default.createElement(_FlipCard2.default, {
-        id: id,
-        action: action,
-        name: name,
-        initial: initial,
-        isChecked: isChecked,
-        onChange: onChange,
-        noNeedFlip: noNeedFlip,
-        size: size,
-        onClick: onClick,
-        isPaidUser: isPaidUser,
-        isPortalUser: isPortalUser,
-        channel: channel,
-        src: src,
-        icon: icon,
-        iconClass: '' + _AvatarFlipModule2.default.iconStyle,
-        dataId: dataId,
-        ticListContainer: 'tic-list-filp-cont',
-        ticList: 'tic-list-filp',
-        className: className,
-        palette: palette,
-        frontClass: frontClass,
-        needTitle: needTitle
-      });
-    }
-  }]);
-
-  return AvatarFlip;
-}(_react.Component);
-
-exports.default = AvatarFlip;
-
-AvatarFlip.propTypes = {
-  action: _propTypes2.default.string,
-  channel: _propTypes2.default.string,
-  className: _propTypes2.default.string,
-  dataId: _propTypes2.default.string,
-  frontClass: _propTypes2.default.string,
-  icon: _propTypes2.default.string,
-  id: _propTypes2.default.string.isRequired,
-  initial: _propTypes2.default.string,
-  isChecked: _propTypes2.default.bool,
-  isPaidUser: _propTypes2.default.bool,
-  isPortalUser: _propTypes2.default.bool,
-  name: _propTypes2.default.string,
-  needTitle: _propTypes2.default.bool,
-  noNeedFlip: _propTypes2.default.bool,
-  onChange: _propTypes2.default.func,
-  onClick: _propTypes2.default.func,
-  palette: _propTypes2.default.oneOf(['primary', 'secondary', 'info', 'default']),
-  size: _propTypes2.default.string,
-  src: _propTypes2.default.string
-};
-AvatarFlip.defaultProps = {
-  size: 'xmedium',
-  noNeedFlip: false
-};
-if (false) {
-  AvatarFlip.docs = {
-    folderName: 'List',
-    componentGroup: 'AvatarFlip'
-  };
-}