@zohodesk/dot 1.0.0-temp-60 → 1.0.0-temp.213

package/es/Drawer/docs/Drawer__default.docs.js

@@ -1,87 +0,0 @@
-import React from 'react';
-import Drawer, { Header, Content, Footer } from '../Drawer';
-import Button from '@zohodesk/components/lib/Button/Button';
-import style from '../Drawer.module.css';
-export default class Drawer__default extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isActive: true,
-      size: 'xsmall'
-    };
-    this.onClose = this.onClose.bind(this);
-    this.getFooter = this.getFooter.bind();
-  }
-
-  onClose() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  changeSize(drawersize) {
-    this.setState({
-      size: drawersize
-    });
-  }
-
-  getFooter() {
-    return /*#__PURE__*/React.createElement("p", null, "getChildren");
-  }
-
-  render() {
-    let {
-      isActive,
-      size
-    } = this.state;
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: isActive,
-      needFreeze: false,
-      paddingSize: "small",
-      size: size
-    }, /*#__PURE__*/React.createElement(Header, {
-      title: "Add Component",
-      onClose: this.onClose,
-      iconName: "ZD-zdDuetimeQueueNew",
-      iconSize: "15",
-      align: "column",
-      getChildren: this.getFooter
-    }, /*#__PURE__*/React.createElement("span", null, "children")), /*#__PURE__*/React.createElement(Content, {
-      className: style.headerTest
-    }, /*#__PURE__*/React.createElement(Button, {
-      text: "small",
-      onClick: this.changeSize.bind(this, 'small')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xsmall",
-      onClick: this.changeSize.bind(this, 'xsmall')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "medium",
-      onClick: this.changeSize.bind(this, 'medium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xmedium",
-      onClick: this.changeSize.bind(this, 'xmedium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "large",
-      onClick: this.changeSize.bind(this, 'large')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xlarge",
-      onClick: this.changeSize.bind(this, 'xlarge')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xxlarge",
-      onClick: this.changeSize.bind(this, 'xxlarge')
-    })), /*#__PURE__*/React.createElement(Footer, null, /*#__PURE__*/React.createElement(Button, {
-      text: "Save",
-      palette: "primaryFilled"
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "Cancel",
-      palette: "secondary"
-    })));
-  }
-
-}
-
-if (false) {
-  Drawer__default.docs = {
-    componentGroup: 'Template'
-  };
-}

package/es/Drawer/docs/Drawer__multiDrawer.docs.js

@@ -1,112 +0,0 @@
-import React from 'react';
-import Drawer, { Header, Content } from '../Drawer';
-import Button from '@zohodesk/components/lib/Button/Button';
-import style from '../Drawer.module.css';
-export default class Drawer__multiDrawer extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isActive: true,
-      subDrawerActive: true,
-      size: 'xsmall'
-    };
-    this.onClose = this.onClose.bind(this);
-    this.openSecondDrawer = this.openSecondDrawer.bind(this);
-    this.closeDrawers = this.closeDrawers.bind(this);
-    this.closeSubDrawer = this.closeSubDrawer.bind(this);
-    this.subDrawerChildren = this.subDrawerChildren.bind(this);
-  }
-
-  onClose() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  openSecondDrawer() {
-    this.setState({
-      subDrawerActive: true
-    });
-  }
-
-  closeDrawers() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  closeSubDrawer() {
-    this.setState({
-      subDrawerActive: false
-    });
-  }
-
-  changeSize(drawersize) {
-    this.setState({
-      size: drawersize
-    });
-  }
-
-  subDrawerChildren() {
-    return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Header, {
-      title: "Second Drawer",
-      onClose: this.closeSubDrawer
-    }), /*#__PURE__*/React.createElement(Content, {
-      paddingSize: "small"
-    }, /*#__PURE__*/React.createElement("div", null, "Hi, I am Second Drawer Content Area")));
-  }
-
-  render() {
-    let {
-      isActive,
-      subDrawerActive,
-      size
-    } = this.state;
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: isActive,
-      needFreeze: true,
-      paddingSize: "small",
-      subDrawerActive: subDrawerActive,
-      subDrawerSize: "small",
-      onClose: this.closeDrawers,
-      subDrawerChildren: this.subDrawerChildren(),
-      size: size,
-      needAutoZindex: true
-    }, /*#__PURE__*/React.createElement(Header, {
-      title: "First Drawer",
-      onClose: this.onClose
-    }), /*#__PURE__*/React.createElement(Content, {
-      className: style.headerTest
-    }, /*#__PURE__*/React.createElement("div", {
-      onClick: this.openSecondDrawer
-    }, "Click here to Open Second Drawer ..:-)"), /*#__PURE__*/React.createElement(Button, {
-      text: "small",
-      onClick: this.changeSize.bind(this, 'small')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xsmall",
-      onClick: this.changeSize.bind(this, 'xsmall')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "medium",
-      onClick: this.changeSize.bind(this, 'medium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xmedium",
-      onClick: this.changeSize.bind(this, 'xmedium')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "large",
-      onClick: this.changeSize.bind(this, 'large')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xlarge",
-      onClick: this.changeSize.bind(this, 'xlarge')
-    }), /*#__PURE__*/React.createElement(Button, {
-      text: "xxlarge",
-      onClick: this.changeSize.bind(this, 'xxlarge')
-    })));
-  }
-
-}
-
-if (false) {
-  Drawer__multiDrawer.docs = {
-    componentGroup: 'Template'
-  };
-}

package/es/Drawer/docs/Drawer__noFreeze.docs.js

@@ -1,20 +0,0 @@
-import React from 'react';
-import Drawer from '../Drawer';
-export default class Drawer__noFreeze extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: true
-    }, /*#__PURE__*/React.createElement("div", null, "Children"));
-  }
-
-}
-
-if (false) {
-  Drawer__noFreeze.docs = {
-    componentGroup: 'Template'
-  };
-}

package/es/Drawer/docs/Drawer__withModal.docs.js

@@ -1,74 +0,0 @@
-import React from 'react';
-import Drawer, { Header, Content } from '../Drawer';
-import Modal from '@zohodesk/components/lib/Modal/Modal';
-import { getUniqueId } from '@zohodesk/components/lib/Provider/IdProvider';
-import style from '../Drawer.module.css';
-export default class Drawer__withModal extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isActive: true,
-      modalActive: true
-    };
-    this.onClose = this.onClose.bind(this);
-    this.openModal = this.openModal.bind(this);
-    this.closeDrawers = this.closeDrawers.bind(this);
-    this.getNextId = getUniqueId(this);
-  }
-
-  onClose() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  openModal() {
-    this.setState({
-      modalActive: true
-    });
-  }
-
-  closeDrawers() {
-    this.setState({
-      isActive: false
-    });
-  }
-
-  render() {
-    let {
-      isActive,
-      modalActive
-    } = this.state;
-    let uniqueId = this.getNextId();
-    return /*#__PURE__*/React.createElement(Drawer, {
-      isActive: isActive,
-      needFreeze: true,
-      paddingSize: "small",
-      onClose: this.closeDrawers,
-      innerPortalName: uniqueId
-    }, /*#__PURE__*/React.createElement(Header, {
-      title: "Drawer with Modal",
-      onClose: this.onClose
-    }), /*#__PURE__*/React.createElement(Content, {
-      className: style.headerTest
-    }, /*#__PURE__*/React.createElement("div", {
-      onClick: this.openModal
-    }, "Click here to Open Modal ..:-)"), modalActive ? /*#__PURE__*/React.createElement(Modal, {
-      portalId: uniqueId
-    }, /*#__PURE__*/React.createElement("div", {
-      style: {
-        width: '90%',
-        height: '400px',
-        background: '#fff',
-        margin: '50px auto'
-      }
-    }, "Drawer Modal")) : null));
-  }
-
-}
-
-if (false) {
-  Drawer__withModal.docs = {
-    componentGroup: 'Template'
-  };
-}

package/es/ExternalLink/ExternalLink.js

@@ -1,66 +0,0 @@
-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); }
-
-/**** Libraries ****/
-import React from 'react';
-import PropTypes from 'prop-types';
-/**** CSS ****/
-
-import style from './ExternalLink.module.css';
-export default class ExternalLink extends React.Component {
-  addHttp(url) {
-    const regEx = new RegExp(/(^(ftp|https|mailto|tel|http|simplehelp|dynamicsnav?):)/i);
-
-    if (!regEx.test(url)) {
-      return `http://${url}`;
-    }
-
-    return url;
-  }
-
-  render() {
-    const {
-      href,
-      title,
-      target,
-      className,
-      children,
-      rel,
-      dataId,
-      onClick,
-      customProps
-    } = this.props;
-    const urlOutput = href && typeof href !== 'boolean' ? this.addHttp(String(href)) : 'javascript:void(0);';
-    return /*#__PURE__*/React.createElement("a", _extends({
-      href: urlOutput,
-      target: target,
-      className: `${style.link} ${className ? className : ''}`,
-      "data-title": title,
-      rel: rel,
-      "data-id": dataId,
-      onClick: onClick
-    }, customProps), children);
-  }
-
-}
-ExternalLink.defaultProps = {
-  rel: 'noopener noreferrer',
-  target: '_blank',
-  customProps: {}
-};
-ExternalLink.propTypes = {
-  children: PropTypes.node,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  href: PropTypes.string,
-  rel: PropTypes.string,
-  target: PropTypes.oneOf(['_blank', '_self']),
-  title: PropTypes.string,
-  onClick: PropTypes.func,
-  customProps: PropTypes.object
-};
-
-if (false) {
-  ExternalLink.docs = {
-    componentGroup: 'Atom'
-  };
-}

package/es/ExternalLink/ExternalLink.module.css

@@ -1,4 +0,0 @@
-.link {
-  text-decoration: none;
-  color: inherit
-}

package/es/ExternalLink/__tests__/ExternalLink.spec.js

@@ -1,28 +0,0 @@
-import "core-js/modules/web.url.to-json";
-import React from 'react';
-import ExternalLink from '../ExternalLink';
-import renderer from 'react-test-renderer';
-describe('ExternalLink Component', () => {
-  it('should add http/https to href tag if it is not already present', () => {
-    const checkLinks = ['javascript:alert(1)', 'www.test.com', 'test.com', '#'];
-    checkLinks.forEach(link => {
-      let ele = renderer.create( /*#__PURE__*/React.createElement(ExternalLink, {
-        href: link
-      }, link));
-      const renderedElement = ele.toJSON();
-      expect(renderedElement.props.href).toEqual(`http://${link}`);
-    });
-  });
-  it('should not add http/https to href tag if it is already present', () => {
-    let ele = renderer.create( /*#__PURE__*/React.createElement(ExternalLink, {
-      href: "https://www.google.com"
-    }, "www.google.com"));
-    const renderedElement = ele.toJSON();
-    expect(renderedElement.props.href).toEqual('https://www.google.com');
-  });
-  it('should default to / if href is undefined', () => {
-    let ele = renderer.create( /*#__PURE__*/React.createElement(ExternalLink, null, "www.google.com"));
-    const renderedElement = ele.toJSON();
-    expect(renderedElement.props.href).toEqual('javascript:void(0);');
-  });
-});

package/es/ExternalLink/docs/ExternalLink__default.docs.js

@@ -1,19 +0,0 @@
-import React, { Component } from 'react';
-import ExternalLink from '../ExternalLink';
-export default class ExternalLink__default extends React.Component {
-  constructor(props) {
-    super(props);
-  }
-
-  render() {
-    ///agent/:orgName/:deptName/:moduleName/details/:moduleId
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(ExternalLink, null));
-  }
-
-}
-
-if (false) {
-  ExternalLink__default.docs = {
-    componentGroup: 'Atom'
-  };
-}

package/es/FlipCard/FlipCard.js

@@ -1,183 +0,0 @@
-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, { Component } from 'react';
-import PropTypes from 'prop-types';
-import AvatarUser from '../avatar/AvatarUser/AvatarUser';
-import AvatarIcon from '../avatar/AvatarIcon/AvatarIcon';
-import CheckBox from '@zohodesk/components/lib/CheckBox/CheckBox';
-import { Container } from '@zohodesk/components/lib/Layout';
-import ChannelIcon from '../ChannelIcon/ChannelIcon';
-import AvatarSize from '@zohodesk/components/lib/Provider/AvatarSize';
-import style from './FlipCard.module.css';
-import { stopBubbling } from '../utils/General';
-export default class FlipCard extends Component {
-  constructor(props) {
-    super(props);
-    this.onChange = this.onChange.bind(this);
-    this.onClick = this.onClick.bind(this);
-  }
-
-  onClick(e) {
-    let {
-      noNeedFlip
-    } = this.props;
-
-    if (!noNeedFlip) {
-      stopBubbling(e);
-    }
-  }
-
-  onChange(isChecked, e) {
-    let {
-      onChange
-    } = this.props;
-    stopBubbling(e);
-    let {
-      id
-    } = this.props;
-    onChange(id, isChecked, e);
-  }
-
-  render() {
-    let {
-      id,
-      action,
-      name,
-      initial,
-      isChecked,
-      noNeedFlip,
-      size,
-      channel,
-      isPaidUser,
-      isPortalUser,
-      src,
-      icon,
-      iconSize,
-      iconClass,
-      ticListContainer,
-      ticList,
-      dataId,
-      className,
-      palette,
-      textPalette,
-      customTextClass,
-      frontClass,
-      needTitle,
-      iconColor,
-      tourId,
-      isFilledCheckbox,
-      channelTitle,
-      customProps
-    } = this.props;
-    const {
-      CheckBoxProps = {},
-      ChannelIconProps = {},
-      AvatarIconProps = {},
-      AvatarUserProps = {}
-    } = customProps;
-    return /*#__PURE__*/React.createElement("div", {
-      className: `${AvatarSize(size)}  ${noNeedFlip ? style.flipNone : isChecked ? style.notFlip : style.flip}`,
-      onClick: this.onClick,
-      "data-id": ticListContainer,
-      "data-tour": tourId
-    }, /*#__PURE__*/React.createElement("div", {
-      className: style.container,
-      "data-id": ticList
-    }, !noNeedFlip ? /*#__PURE__*/React.createElement(Container, {
-      align: "both",
-      className: `${style.front} ${frontClass ? frontClass : ''}`
-    }, /*#__PURE__*/React.createElement(CheckBox, _extends({
-      isFilled: isFilledCheckbox,
-      checked: isChecked,
-      onChange: this.onChange,
-      id: `checkbox_${id}`,
-      dataId: `listViewCheckBox_${id}`
-    }, CheckBoxProps))) : null, /*#__PURE__*/React.createElement(Container, {
-      align: "both",
-      className: style.back
-    }, channel && action ? /*#__PURE__*/React.createElement(ChannelIcon, _extends({
-      name: channel,
-      action: action,
-      size: size,
-      iconSize: iconSize,
-      iconClass: iconClass,
-      dataId: channel,
-      className: className,
-      palette: palette,
-      textPalette: textPalette,
-      customTextClass: customTextClass,
-      iconColor: iconColor,
-      title: channelTitle,
-      iconTitle: channelTitle
-    }, ChannelIconProps)) : icon ? /*#__PURE__*/React.createElement(AvatarIcon, _extends({
-      name: icon,
-      iconSize: iconSize,
-      size: size,
-      iconClass: iconClass,
-      dataId: icon,
-      className: className,
-      iconColor: iconColor,
-      title: needTitle ? name : ''
-    }, AvatarIconProps)) : /*#__PURE__*/React.createElement(AvatarUser, _extends({
-      name: name,
-      initial: initial,
-      size: size,
-      isPaid: isPaidUser,
-      isPortal: isPortalUser,
-      src: src,
-      dataId: dataId,
-      needTitle: needTitle,
-      palette: palette,
-      textPalette: textPalette,
-      customTextClass: customTextClass
-    }, AvatarUserProps)))));
-  }
-
-}
-FlipCard.propTypes = {
-  action: PropTypes.string,
-  channel: PropTypes.string,
-  channelTitle: PropTypes.oneOfType([PropTypes.string, PropTypes.bool]),
-  className: PropTypes.string,
-  customTextClass: PropTypes.string,
-  dataId: PropTypes.string,
-  frontClass: PropTypes.string,
-  icon: PropTypes.string,
-  iconClass: PropTypes.string,
-  iconColor: PropTypes.string,
-  iconSize: PropTypes.string,
-  id: PropTypes.string.isRequired,
-  initial: PropTypes.string,
-  isChecked: PropTypes.bool,
-  isFilledCheckbox: PropTypes.bool,
-  isPaidUser: PropTypes.bool,
-  isPortalUser: PropTypes.bool,
-  name: PropTypes.string,
-  needTitle: PropTypes.bool,
-  noNeedFlip: PropTypes.bool,
-  onChange: PropTypes.func,
-  palette: PropTypes.oneOf(['primary', 'secondary', 'info', 'default']),
-  size: PropTypes.string,
-  src: PropTypes.string,
-  textPalette: PropTypes.oneOf(['white', 'black']),
-  ticList: PropTypes.string,
-  ticListContainer: PropTypes.string,
-  tourId: PropTypes.string,
-  customProps: PropTypes.shape({
-    CheckBoxProps: PropTypes.object,
-    ChannelIconProps: PropTypes.object,
-    AvatarIconProps: PropTypes.object,
-    AvatarUserProps: PropTypes.object
-  })
-};
-FlipCard.defaultProps = {
-  size: 'medium',
-  needTitle: true,
-  customProps: {}
-};
-
-if (false) {
-  FlipCard.docs = {
-    componentGroup: 'Molecule'
-  };
-}

package/es/FlipCard/FlipCard.module.css

@@ -1,35 +0,0 @@
-.flip,
-.flipNone {
-  background-color: var(--zdt_flipcard_default_bg);
-  color: var(--zdt_flipcard_default_text);
-}
-.container {
-  position: relative;
-  transition: var(--zd_transition3) all;
-  transform-style: preserve-3d;
-}
-.container,
-.front,
-.back {
-  width: inherit;
-  height: inherit;
-}
-.front,
-.back {
-  position: absolute;
-  backface-visibility: hidden;
-  -webkit-backface-visibility: hidden;
-}
-.front {
-  transform: rotateY(180deg) perspective(1px);
-}
-.back {
-  transform: rotateY(0deg) perspective(1px);
-}
-.notFlip .container {
-  transform: rotateY(180deg);
-}
-.flip:hover .container,
-.hoverContainer:hover .container {
-  transform: rotateY(180deg);
-}

package/es/FlipCard/docs/FlipCard__default.docs.js

@@ -1,66 +0,0 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import FlipCard from '../FlipCard';
-export default class FlipCard__default extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      isChecked: false
-    };
-  }
-
-  render() {
-    return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlipCard, {
-      channel: "email",
-      action: "incoming",
-      id: "test1",
-      onChange: (id, checked) => {
-        this.setState({
-          isChecked: checked
-        });
-      },
-      noNeedFlip: true,
-      isChecked: this.state.isChecked,
-      size: "xmedium"
-    })), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlipCard, {
-      id: "test2",
-      name: "phone",
-      onChange: (id, checked) => {
-        this.setState({
-          isChecked: checked
-        });
-      },
-      isChecked: this.state.isChecked,
-      size: "xmedium"
-    })), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlipCard, {
-      id: "test3",
-      name: "EL",
-      isPaidUser: true,
-      onChange: (id, checked) => {
-        this.setState({
-          isChecked: checked
-        });
-      },
-      isChecked: this.state.isChecked,
-      size: "xmedium"
-    })), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("br", null), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(FlipCard, {
-      id: "test4",
-      name: "BK",
-      isPortalUser: true,
-      onChange: (id, checked) => {
-        this.setState({
-          isChecked: checked
-        });
-      },
-      isChecked: this.state.isChecked,
-      size: "xmedium"
-    })));
-  }
-
-}
-
-if (false) {
-  FlipCard__default.docs = {
-    componentGroup: 'Molecule'
-  };
-}