@zohodesk/dot 1.0.0-temp-187.22 → 1.0.0-temp-187.24

package/es/list/status/StatusDropdown/__tests__/StatusDropdown.spec.js

@@ -1,27 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import StatusDropdown from "../StatusDropdown";
-describe('StatusDropdown', () => {
-  test('rendering the defult props', () => {
-    const {
-      asFragment
-    } = render( /*#__PURE__*/React.createElement(StatusDropdown, null));
-    expect(asFragment()).toMatchSnapshot();
-  }), test('rendering target element', () => {
-    const renderTargetElement = _ref => {
-      let {
-        isPopupOpen
-      } = _ref;
-      return /*#__PURE__*/React.createElement("div", {
-        className: isPopupOpen ? 'popupOpened' : 'popupClosed'
-      }, "Target Element");
-    };
-
-    const {
-      asFragment
-    } = render( /*#__PURE__*/React.createElement(StatusDropdown, {
-      renderTargetElement: renderTargetElement
-    }));
-    expect(asFragment()).toMatchSnapshot();
-  });
-});

package/es/list/status/StatusDropdown/__tests__/__snapshots__/StatusDropdown.spec.js.snap

@@ -1,49 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`StatusDropdown rendering target element 1`] = `
-<DocumentFragment>
-  <div
-    class="posRel"
-  >
-    <div
-      class="popupClosed"
-    >
-      Target Element
-    </div>
-  </div>
-</DocumentFragment>
-`;
-
-exports[`StatusDropdown rendering the defult props 1`] = `
-<DocumentFragment>
-  <div
-    class="posRel"
-  >
-    <button
-      aria-disabled="false"
-      aria-expanded="false"
-      aria-haspopup="menu"
-      class="container   cursor  buttonReset flex rowdir vCenter"
-      data-id="containerComponent"
-      data-selector-id="container"
-      data-test-id="containerComponent"
-      tabindex="0"
-    >
-      <span
-        class="value toggleDropText shrinkOn"
-        data-id="undefined_value"
-        data-selector-id="box"
-        data-test-id="undefined_value"
-      />
-      <i
-        aria-hidden="true"
-        class="zd_font_icons basic icon-down  toggleDropIcon arrow default_arrow  "
-        data-id="statusdownarrow"
-        data-selector-id="fontIcon"
-        data-test-id="statusdownarrow"
-        style="--zd-iconfont-size: var(--zd_font_size7);"
-      />
-    </button>
-  </div>
-</DocumentFragment>
-`;

package/es/list/status/StatusDropdown/props/defaultProps.js

@@ -1,23 +0,0 @@
-export const defaultProps = {
-  keyName: 'name',
-  idName: 'key',
-  isArrow: false,
-  searchBoxSize: 'small',
-  isDisabled: false,
-  showIconOnHover: false,
-  isReadOnly: false,
-  isEditable: true,
-  isDataLoaded: true,
-  needTick: true,
-  targetAlign: 'vertical',
-  needResponsive: true,
-  arrowIconPosition: 'default',
-  boxSize: 'medium',
-  needExternalPopupState: false,
-  statusColor: 'statusColor',
-  needMultiLineText: false,
-  isFetchingOptions: false,
-  isAbsolutePositioningNeeded: true,
-  isRestrictScroll: false,
-  customClass: {}
-};

package/es/list/status/StatusDropdown/props/propTypes.js

@@ -1,63 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  activeStyle: PropTypes.string,
-  arrowIconPosition: PropTypes.oneOf(['default', 'overlay']),
-  bottom: PropTypes.number,
-  boxPosition: PropTypes.oneOf(['bottomRight', 'bottomLeft', 'bottomCenter', 'topRight', 'topLeft', 'topCenter', 'rightTop', 'rightBottom', 'rightCenter', 'leftTop', 'leftBottom', 'leftCenter']),
-  boxSize: PropTypes.oneOf(['small', 'medium', 'mlarge', 'large']),
-  children: PropTypes.node,
-  className: PropTypes.string,
-  dataId: PropTypes.string,
-  dataTitle: PropTypes.string,
-  getContainerRef: PropTypes.func,
-  getNextOptions: PropTypes.func,
-  getTargetRef: PropTypes.func,
-  hoverStyle: PropTypes.string,
-  idName: PropTypes.string,
-  isArrow: PropTypes.bool,
-  isDataLoaded: PropTypes.bool,
-  isDataLoaded: PropTypes.bool,
-  isDisabled: PropTypes.bool,
-  isEditable: PropTypes.bool,
-  isFetchingOptions: PropTypes.bool,
-  isPopupActive: PropTypes.bool,
-  isPopupOpen: PropTypes.bool,
-  isPopupReady: PropTypes.bool,
-  isReadOnly: PropTypes.bool,
-  isSearch: PropTypes.bool,
-  keyName: PropTypes.string,
-  left: PropTypes.number,
-  needExternalPopupState: PropTypes.bool,
-  needResponsive: PropTypes.bool,
-  needTick: PropTypes.bool,
-  onClick: PropTypes.func,
-  onTogglePopup: PropTypes.func,
-  options: PropTypes.array.isRequired,
-  placeHolderText: PropTypes.string,
-  position: PropTypes.string,
-  removeClose: PropTypes.func,
-  right: PropTypes.number,
-  searchBoxSize: PropTypes.oneOf(['small', 'medium', 'xmedium']),
-  searchEmptyHint: PropTypes.string,
-  searchErrorText: PropTypes.string,
-  showIconOnHover: PropTypes.bool,
-  showOnHover: PropTypes.bool,
-  statusColor: PropTypes.string,
-  targetAlign: PropTypes.oneOf(['vertical', 'horizontal', 'both', 'top', 'right', 'bottom', 'left', 'between', 'around']),
-  title: PropTypes.string,
-  togglePopup: PropTypes.func,
-  value: PropTypes.node,
-  needMultiLineText: PropTypes.bool,
-  onSelectLabel: PropTypes.func,
-  top: PropTypes.number,
-  a11y: PropTypes.object,
-  isAbsolutePositioningNeeded: PropTypes.bool,
-  isRestrictScroll: PropTypes.bool,
-  positionsOffset: PropTypes.object,
-  renderTargetElement: PropTypes.func,
-  renderFooterElement: PropTypes.node,
-  targetOffset: PropTypes.object,
-  customClass: PropTypes.shape({
-    dropBoxClass: PropTypes.string
-  })
-};

package/es/list/status/StatusListItem/StatusListItem.js

@@ -1,135 +0,0 @@
-/**** Libraries ****/
-import React from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import { Container, Box } from '@zohodesk/components/es/Layout';
-/**** Components ****/
-
-import { Icon } from '@zohodesk/icons';
-import CssProvider from '@zohodesk/components/es/Provider/CssProvider';
-/**** CSS ****/
-
-import style from "./StatusListItem.module.css";
-export default class StatusListItem extends React.Component {
-  constructor(props) {
-    super(props);
-    this.handleClick = this.handleClick.bind(this);
-    this.getRef = this.getRef.bind(this);
-    this.handleMouseEnter = this.handleMouseEnter.bind(this);
-  }
-
-  getRef(ele) {
-    this.ele = ele;
-    let {
-      index,
-      getRef,
-      id
-    } = this.props;
-    getRef && getRef(ele, index, id);
-  }
-
-  handleClick(e) {
-    let {
-      onClick,
-      id,
-      value,
-      index
-    } = this.props;
-    onClick && onClick(id, value, index, e);
-  }
-
-  handleMouseEnter(e) {
-    let {
-      onMouseEnter,
-      id,
-      value,
-      index
-    } = this.props;
-    onMouseEnter && onMouseEnter(id, value, index, e);
-  }
-
-  render() {
-    let {
-      size,
-      active,
-      highlight,
-      value,
-      autoHover,
-      palette,
-      title,
-      disableTitle,
-      needTick,
-      isLink,
-      href,
-      target,
-      needBorder,
-      isDisabled,
-      bulletColor,
-      a11y,
-      needMultiLineText,
-      customClass,
-      children
-    } = this.props;
-    let options = {};
-    let {
-      role,
-      ariaSelected,
-      ariaHidden = true,
-      ariaLabel,
-      insetFocus = true
-    } = a11y;
-
-    if (isLink) {
-      options.href = href;
-      options.target = `_${target}`;
-    }
-
-    return /*#__PURE__*/React.createElement(Container, {
-      role: role,
-      "aria-selected": ariaSelected,
-      "aria-label": ariaLabel,
-      "data-a11y-inset-focus": insetFocus,
-      isCover: false,
-      align: "vertical",
-      alignBox: "row",
-      className: `${style.list} ${style[size]} ${style[palette]} ${active ? style.active : highlight && !isDisabled ? style.hover : ''} ${autoHover && !isDisabled ? style.effect : ''} ${needTick ? style.withTick : ''} ${isDisabled ? CssProvider('isDisable') : ''} ${needBorder ? style.withBorder : ''} ${customClass}`,
-      dataId: String(value).replace("'", '_'),
-      onClick: !isDisabled && this.handleClick,
-      onMouseEnter: this.handleMouseEnter,
-      eleRef: this.getRef,
-      tagName: isLink ? 'a' : 'li',
-      "data-title": isDisabled ? disableTitle : null,
-      tabindex: isDisabled ? '-1' : '0',
-      ...options,
-      ...a11y
-    }, /*#__PURE__*/React.createElement(Box, {
-      className: style.contentWrapper
-    }, /*#__PURE__*/React.createElement(Box, {
-      className: `${style.statusType} ${style[bulletColor]}`
-    }), /*#__PURE__*/React.createElement(Box, {
-      flexible: true,
-      shrink: true
-    }, /*#__PURE__*/React.createElement(Container, {
-      alignBox: "row",
-      align: needMultiLineText ? 'top' : 'vertical'
-    }, /*#__PURE__*/React.createElement(Box, {
-      "data-title": isDisabled ? null : title,
-      shrink: true,
-      className: needMultiLineText ? style.multiLineValue : style.value
-    }, value), /*#__PURE__*/React.createElement(Box, null, children && children))), needTick && active ? /*#__PURE__*/React.createElement("div", {
-      className: style.tickIcon,
-      "aria-hidden": ariaHidden
-    }, /*#__PURE__*/React.createElement(Icon, {
-      name: "ZD-ticknew",
-      size: "8"
-    })) : null));
-  }
-
-}
-StatusListItem.defaultProps = defaultProps;
-StatusListItem.propTypes = propTypes; // if (__DOCS__) {
-//   StatusListItem.docs = {
-//     componentGroup: 'StatusListItem',
-//     folderName: 'List'
-//   };
-// }

package/es/list/status/StatusListItem/StatusListItem.module.css

@@ -1,137 +0,0 @@
-.varClass {
-  --statuslistitem_multiline_lineheight: 1.5385;
-  --statuslistitem_font_size: var(--zd_font_size13);
-  --statuslistitem_min_height: var(--zd_size35);
-}
-
-.list {
-  composes: varClass;
-  color: var(--zdt_statuslistitem_list_text);
-  font-size: var(--statuslistitem_font_size);
-  position: relative;
-  list-style: none;
-  min-height: var(--statuslistitem_min_height);
-  cursor: pointer;
-}
-[dir=ltr] .withBorder {
-  border-left: 1px solid var(--zdt_statuslistitem_default_border);
-}
-[dir=rtl] .withBorder {
-  border-right: 1px solid var(--zdt_statuslistitem_default_border);
-}
-[dir=ltr] .small {
-  padding: var(--zd_size7) var(--zd_size3) var(--zd_size7) var(--zd_size5) ;
-}
-[dir=rtl] .small {
-  padding: var(--zd_size7) var(--zd_size5) var(--zd_size7) var(--zd_size3) ;
-}
-.medium {
-  padding: var(--zd_size7) var(--zd_size20) ;
-}
-.large {
-  --statuslistitem_min_height: var(--zd_size48);
-}
-[dir=ltr] .large {
-  padding: var(--zd_size10) var(--zd_size3) var(--zd_size10) var(--zd_size25) ;
-}
-[dir=rtl] .large {
-  padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size3) ;
-}
-.value,.multiLineValue {
-  line-height: 1.5385;
-}
-.value {
-  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
-}
-.multiLineValue {
-  composes: lineClamp from '~@zohodesk/components/es/common/common.module.css';
-}
-[dir=ltr] .withBorder.active {
-  border-left-color: var(--zdt_statuslistitem_default_active_border);
-}
-[dir=rtl] .withBorder.active {
-  border-right-color: var(--zdt_statuslistitem_default_active_border);
-}
-
-.default.hover, .default.effect:hover {
-  background-color: var(--zdt_statuslistitem_default_effect_bg);
-}
-.primary.hover, .primary.effect:hover, .selected {
-  background-color: var(--zdt_statuslistitem_primary_efffect_bg);
-}
-.secondary.hover, .secondary.effect:hover {
-  background-color: var(--zdt_statuslistitem_secondary_effect_bg);
-}
-.list.active.default, .list.active.primary {
-  background-color: var(--zdt_statuslistitem_primary_efffect_bg);
-}
-.list.active.secondary {
-  background-color: var(--zdt_statuslistitem_secondary_effect_bg);
-}
-.secondary.hover,
-.secondary.effect:hover,
-.list.active.secondary {
-  color: var(--zdt_statuslistitem_secondary_effect_text);
-}
-.tickIcon {
-  color: var(--zdt_statuslistitem_tickicon);
-  position: absolute;
-  top:50% ;
-  transform: translateY(-50%);
-}
-[dir=ltr] .tickIcon {
-  right: var(--zd_size20) ;
-}
-[dir=rtl] .tickIcon {
-  left: var(--zd_size20) ;
-}
-.tickIcon > i {
-  display: block;
-}
-[dir=ltr] .active.withTick {
-  padding-right: var(--zd_size39) ;
-}
-[dir=rtl] .active.withTick {
-  padding-left: var(--zd_size39) ;
-}
-.contentWrapper {
-  composes: dflex flexrow alignVertical from '~@zohodesk/components/es/common/common.module.css';
-  width: 100% ;
-}
-/* Status Type */
-.statusType{
-  position: relative;
-  composes: dflex alignVertical alignHorizontal from '~@zohodesk/components/es/common/common.module.css';
-  align-self: flex-start;
-  min-height: calc(var(--statuslistitem_font_size) * var(--statuslistitem_multiline_lineheight));
-  min-width: var(--zd_size20) ;
-}
-.statusType::after{
-  /* css:validation:ignore */
-  --status_listitem_bullet_min_height: var(--zd_font_size8);
-  /* css:validation:ignore */
-  --status_listitem_bullet_min_width: var(--zd_font_size8);
-
-  content: '';
-  height: var(--status_listitem_bullet_min_height);
-  width: var(--status_listitem_bullet_min_width);
-  /* css:theme-validation:ignore */
-  border-radius: 50%;
-  background-color: var(--zdt_statuslistitem_black_bg);
-}
-[dir=ltr] .statusType::after{
-  margin-right: var(--zd_size12) ;
-}
-[dir=rtl] .statusType::after{
-  margin-left: var(--zd_size12) ;
-}
-
-.black.statusType::after {
-  background-color: var(--zdt_statuslistitem_black_bg);
-}
-.orange.statusType::after {
-  background-color: var(--zdt_statuslistitem_orange_bg);
-}
-.green.statusType::after {
-  background-color: var(--zdt_statuslistitem_green_bg);
-}

package/es/list/status/StatusListItem/__tests__/StatusListItem.spec.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import StatusListItem from "../StatusListItem";
-describe('StatusListItem', () => {
-  test('rendering the defult props', () => {
-    const {
-      asFragment
-    } = render( /*#__PURE__*/React.createElement(StatusListItem, null));
-    expect(asFragment()).toMatchSnapshot();
-  });
-});

package/es/list/status/StatusListItem/__tests__/__snapshots__/StatusListItem.spec.js.snap

@@ -1,47 +0,0 @@
-// Jest Snapshot v1, https://goo.gl/fbAQLP
-
-exports[`StatusListItem rendering the defult props 1`] = `
-<DocumentFragment>
-  <li
-    class="list medium default     withBorder  flex rowdir baseline"
-    data-a11y-inset-focus="true"
-    data-id="undefined"
-    data-selector-id="container"
-    data-test-id="undefined"
-    tabindex="0"
-  >
-    <div
-      class="statusType black shrinkOff"
-      data-id="boxComponent"
-      data-selector-id="box"
-      data-test-id="boxComponent"
-    />
-    <div
-      class="grow basis shrinkOn"
-      data-id="boxComponent"
-      data-selector-id="box"
-      data-test-id="boxComponent"
-    >
-      <div
-        class="flex cover rowdir vCenter"
-        data-id="containerComponent"
-        data-selector-id="container"
-        data-test-id="containerComponent"
-      >
-        <div
-          class="value shrinkOn"
-          data-id="boxComponent"
-          data-selector-id="box"
-          data-test-id="boxComponent"
-        />
-        <div
-          class="shrinkOff"
-          data-id="boxComponent"
-          data-selector-id="box"
-          data-test-id="boxComponent"
-        />
-      </div>
-    </div>
-  </li>
-</DocumentFragment>
-`;

package/es/list/status/StatusListItem/props/defaultProps.js

@@ -1,16 +0,0 @@
-export const defaultProps = {
-  active: false,
-  autoHover: false,
-  highlight: false,
-  id: '',
-  needTick: false,
-  palette: 'default',
-  size: 'medium',
-  isLink: false,
-  target: 'blank',
-  needBorder: true,
-  bulletColor: 'black',
-  a11y: {},
-  needMultiLineText: false,
-  customClass: ''
-};

package/es/list/status/StatusListItem/props/propTypes.js

@@ -1,31 +0,0 @@
-import PropTypes from 'prop-types';
-export const propTypes = {
-  active: PropTypes.bool,
-  autoHover: PropTypes.bool,
-  bulletColor: PropTypes.oneOf(['black', 'orange', 'green']),
-  disableTitle: PropTypes.string,
-  getRef: PropTypes.func,
-  highlight: PropTypes.bool,
-  href: PropTypes.string,
-  id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-  index: PropTypes.number,
-  isDisabled: PropTypes.bool,
-  isLink: PropTypes.bool,
-  needBorder: PropTypes.bool,
-  needTick: PropTypes.bool,
-  onClick: PropTypes.func,
-  onMouseEnter: PropTypes.func,
-  palette: PropTypes.oneOf(['default', 'primary', 'secondary']),
-  size: PropTypes.oneOf(['small', 'medium', 'large']),
-  target: PropTypes.oneOf(['blank', 'self']),
-  title: PropTypes.string,
-  value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
-  needMultiLineText: PropTypes.bool,
-  a11y: PropTypes.shape({
-    role: PropTypes.string,
-    ariaSelected: PropTypes.bool,
-    ariaHidden: PropTypes.bool
-  }),
-  customClass: PropTypes.string,
-  children: PropTypes.node
-};

package/es/list/status/index.js

@@ -1,2 +0,0 @@
-export { default as StatusDropdown } from "./StatusDropdown/StatusDropdown";
-export { default as StatusListItem } from "./StatusListItem/StatusListItem";

package/es/lookup/EmptyPage/EmptyPage.js

@@ -1,65 +0,0 @@
-/*** Libraries ***/
-import React, { Component } from 'react';
-import { defaultProps } from "./props/defaultProps";
-import { propTypes } from "./props/propTypes";
-import EmptySearch from '@zohodesk/svg/es/emptystate/version3/EmptySearch';
-import EmptyAccounts from '@zohodesk/svg/es/emptystate/version3/EmptyAccounts';
-import EmptyContact from '@zohodesk/svg/es/emptystate/version3/EmptyContact';
-import EmptyProducts from '@zohodesk/svg/es/emptystate/version3/EmptyProducts';
-/*** CSS ***/
-
-import style from "./LookupEmptyPage.module.css";
-export default class EmptyPage extends Component {
-  constructor(props) {
-    super(props);
-    this.renderEmptyState = this.renderEmptyState.bind();
-  }
-
-  renderEmptyState(type) {
-    switch (type) {
-      case 'search':
-        return /*#__PURE__*/React.createElement(EmptySearch, {
-          className: style.image
-        });
-
-      case 'account':
-        return /*#__PURE__*/React.createElement(EmptyAccounts, {
-          className: style.image
-        });
-
-      case 'contact':
-        return /*#__PURE__*/React.createElement(EmptyContact, {
-          className: style.image
-        });
-
-      case 'product':
-        return /*#__PURE__*/React.createElement(EmptyProducts, {
-          className: style.image
-        });
-
-      default:
-        return null;
-    }
-  }
-
-  render() {
-    let {
-      type,
-      title
-    } = this.props;
-    return /*#__PURE__*/React.createElement("div", {
-      className: style.container,
-      "data-id": `empty_${type}`,
-      "data-test-id": `empty_${type}`
-    }, this.renderEmptyState(type), /*#__PURE__*/React.createElement("div", {
-      className: style.contentDiv
-    }, title));
-  }
-
-}
-EmptyPage.propTypes = propTypes;
-EmptyPage.defaultProps = defaultProps; // if (__DOCS__) {
-//   EmptyPage.docs = {
-//     componentGroup: 'Lookup'
-//   };
-// }

package/es/lookup/EmptyPage/LookupEmptyPage.module.css

@@ -1,14 +0,0 @@
-.container {
-  text-align: center;
-}
-
-.image {
-  margin: var(--zd_size20) auto ;
-}
-
-.contentDiv {
-  font-size: var(--zd_font_size20) ;
-  font-weight: var(--zd-fw-semibold);
-  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
-  margin-top: var(--zd_size15) ;
-}

package/es/lookup/EmptyPage/__tests__/EmptyPage.spec.js

@@ -1,11 +0,0 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import EmptyPage from "../EmptyPage";
-describe('EmptyPage', () => {
-  test('rendering the defult props', () => {
-    const {
-      asFragment
-    } = render( /*#__PURE__*/React.createElement(EmptyPage, null));
-    expect(asFragment()).toMatchSnapshot();
-  });
-});