@zohodesk/dot 1.0.0-beta.27 → 1.0.0-beta.270

package/es/lookup/header/lookupHeaderCommonResponsive.module.css

@@ -5,10 +5,10 @@
   align-items: flex-start;
 }
 [dir=ltr] .extraSmall {
-  padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) 0;
+  padding: var(--zd_size12) var(--zd_size45) var(--zd_size12) 0 ;
 }
 [dir=rtl] .extraSmall {
-  padding: var(--zd_size12) 0 var(--zd_size12) var(--zd_size45);
+  padding: var(--zd_size12) 0 var(--zd_size12) var(--zd_size45) ;
 }
 
 [dir=ltr] .extraSmall .searchContainer {
@@ -19,6 +19,6 @@
   text-align: right;
 }
 .extraSmall .searchContainer input {
-  width: var(--zd_size193);
-  border-bottom: 1px solid var(--zd_border_smoke33);
+  width: var(--zd_size193) ;
+  border-bottom: 1px solid var(--zdt_lookupheader_input_border);
 }

package/es/lookup/index.js

@@ -0,0 +1,5 @@
+export { default as EmptyPage } from './EmptyPage/EmptyPage';
+export { default as Lookup } from './Lookup/Lookup';
+export { default as Section } from './Section/Section';
+import * as _Header from './header';
+export { _Header as Header };

package/es/setup/header/Button/Button.js

@@ -1,63 +1,36 @@
-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 { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
 import GenButton from '@zohodesk/components/lib/Button/Button';
 import style from './HeaderButton.module.css';
-
-var Button = function (_React$Component) {
-  _inherits(Button, _React$Component);
-
-  function Button(props) {
-    _classCallCheck(this, Button);
-
-    return _possibleConstructorReturn(this, (Button.__proto__ || _Object$getPrototypeOf(Button)).call(this, props));
+export default class Button extends React.Component {
+  constructor(props) {
+    super(props);
   }
 
-  _createClass(Button, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          palette = _props.palette,
-          text = _props.text,
-          onClick = _props.onClick,
-          id = _props.id;
-
-      return React.createElement(
-        'div',
-        { className: style.container },
-        React.createElement(GenButton, {
-          id: id,
-          onClick: onClick,
-          palette: palette,
-          size: 'medium',
-          text: text
-        })
-      );
-    }
-  }]);
-
-  return Button;
-}(React.Component);
-
-export default Button;
+  render() {
+    let {
+      palette,
+      text,
+      onClick,
+      id
+    } = this.props;
+    return /*#__PURE__*/React.createElement("div", {
+      className: style.container
+    }, /*#__PURE__*/React.createElement(GenButton, {
+      id: id,
+      onClick: onClick,
+      palette: palette,
+      size: "medium",
+      text: text
+    }));
+  }
 
-Button.defaultProps = {
-  palette: 'primaryFilled',
-  text: ''
-};
-Button.propTypes = {
-  id: PropTypes.string,
-  onClick: PropTypes.func,
-  palette: PropTypes.string,
-  text: PropTypes.string
-};
-if (false) {
-  Button.docs = {
-    componentGroup: 'Header',
-    folderName: 'Setup'
-  };
-}
+}
+Button.defaultProps = defaultProps;
+Button.propTypes = propTypes; // if (__DOCS__) {
+//   Button.docs = {
+//     componentGroup: 'Header',
+//     folderName: 'Setup'
+//   };
+// }

package/es/setup/header/Button/HeaderButton.module.css

@@ -1,5 +1,5 @@
 [dir=ltr] .container {
-  margin-right: var(--zd_size15);
+  margin-right: var(--zd_size15) ;
 }[dir=rtl] .container {
-  margin-left: var(--zd_size15);
+  margin-left: var(--zd_size15) ;
 }

package/es/setup/header/Button/props/defaultProps.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  palette: 'primaryFilled',
+  text: ''
+};

package/es/setup/header/Button/props/propTypes.js

@@ -0,0 +1,7 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  id: PropTypes.string,
+  onClick: PropTypes.func,
+  palette: PropTypes.string,
+  text: PropTypes.string
+};

package/es/setup/header/Link/HeaderLink.module.css

@@ -1,21 +1,20 @@
 .container {
-  composes: alignVertical from '~@zohodesk/components/lib/common/common.module.css';
-  composes: dInflex from '~@zohodesk/components/lib/common/common.module.css';
-  color: var(--zd_text_primary1);
-  font-size: var(--zd_size12);
+  composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+  color: var(--zdt_headerlink_text);
+  font-size: var(--zd_font_size12) ;
 }[dir=ltr] .container {
-  margin-right: var(--zd_size15);
+  margin-right: var(--zd_size15) ;
 }[dir=rtl] .container {
-  margin-left: var(--zd_size15);
+  margin-left: var(--zd_size15) ;
 }
 [dir=ltr] .icon {
-  margin-right: var(--zd_size5);
+  margin-right: var(--zd_size5) ;
 }
 [dir=rtl] .icon {
-  margin-left: var(--zd_size5);
+  margin-left: var(--zd_size5) ;
 }
 .container:hover .text {
-  border-bottom: 1px solid var(--zd_border_primary1);
+  border-bottom: 1px solid var(--zdt_headerlink_hover_text);
 }
 .text {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';

package/es/setup/header/Link/Link.js

@@ -1,75 +1,44 @@
-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 Icon from '@zohodesk/icons/lib/Icon';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
+import { Icon } from '@zohodesk/icons';
 import { Box } from '@zohodesk/components/lib/Layout';
 import ExternalLink from '../../../ExternalLink/ExternalLink';
 import style from './HeaderLink.module.css';
-
-var Link = function (_React$Component) {
-  _inherits(Link, _React$Component);
-
-  function Link(props) {
-    _classCallCheck(this, Link);
-
-    return _possibleConstructorReturn(this, (Link.__proto__ || _Object$getPrototypeOf(Link)).call(this, props));
+export default class Link extends React.Component {
+  constructor(props) {
+    super(props);
   }
 
-  _createClass(Link, [{
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          url = _props.url,
-          text = _props.text,
-          iconName = _props.iconName,
-          iconClass = _props.iconClass,
-          iconSize = _props.iconSize;
-
-      return React.createElement(
-        ExternalLink,
-        { className: style.container, href: url },
-        React.createElement(
-          Box,
-          { className: style.icon },
-          React.createElement(Icon, {
-            isBold: true,
-            name: iconName,
-            size: iconSize,
-            iconClass: iconClass ? iconClass : ''
-          })
-        ),
-        React.createElement(
-          Box,
-          { className: style.text, flexible: true },
-          text
-        )
-      );
-    }
-  }]);
-
-  return Link;
-}(React.Component);
-
-export default Link;
+  render() {
+    let {
+      url,
+      text,
+      iconName,
+      iconClass,
+      iconSize
+    } = this.props;
+    return /*#__PURE__*/React.createElement(ExternalLink, {
+      className: style.container,
+      href: url
+    }, /*#__PURE__*/React.createElement(Box, {
+      className: style.icon
+    }, /*#__PURE__*/React.createElement(Icon, {
+      isBold: true,
+      name: iconName,
+      size: iconSize,
+      iconClass: iconClass ? iconClass : ''
+    })), /*#__PURE__*/React.createElement(Box, {
+      className: style.text,
+      flexible: true
+    }, text));
+  }
 
-Link.defaultProps = {
-  iconName: 'ZD-newtab',
-  iconSize: 10
-};
-Link.propTypes = {
-  iconClass: PropTypes.string,
-  iconName: PropTypes.string,
-  iconSize: PropTypes.number,
-  text: PropTypes.string,
-  url: PropTypes.string
-};
-if (false) {
-  Link.docs = {
-    componentGroup: 'Header',
-    folderName: 'Setup'
-  };
-}
+}
+Link.defaultProps = defaultProps;
+Link.propTypes = propTypes; // if (__DOCS__) {
+//   Link.docs = {
+//     componentGroup: 'Header',
+//     folderName: 'Setup'
+//   };
+// }

package/es/setup/header/Link/props/defaultProps.js

@@ -0,0 +1,4 @@
+export const defaultProps = {
+  iconName: 'ZD-newtab',
+  iconSize: 10
+};

package/es/setup/header/Link/props/propTypes.js

@@ -0,0 +1,8 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  iconClass: PropTypes.string,
+  iconName: PropTypes.string,
+  iconSize: PropTypes.number,
+  text: PropTypes.string,
+  url: PropTypes.string
+};

package/es/setup/header/Search/Search.js

@@ -1,104 +1,81 @@
-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 Icon from '@zohodesk/icons/lib/Icon';
+import { defaultProps } from './props/defaultProps';
+import { propTypes } from './props/propTypes';
+import { Icon } from '@zohodesk/icons';
 import TextBox from '@zohodesk/components/lib/TextBox/TextBox';
 import style from './Search.module.css';
-
-var Search = function (_React$Component) {
-  _inherits(Search, _React$Component);
-
-  function Search(props) {
-    _classCallCheck(this, Search);
-
-    var _this = _possibleConstructorReturn(this, (Search.__proto__ || _Object$getPrototypeOf(Search)).call(this, props));
-
-    var value = _this.props.value;
-
-    _this.state = {
+export default class Search extends React.Component {
+  constructor(props) {
+    super(props);
+    let {
+      value
+    } = this.props;
+    this.state = {
       value: value || '',
       isFocus: false
     };
-    _this.onFocus = _this.onFocus.bind(_this);
-    _this.onBlur = _this.onBlur.bind(_this);
-    return _this;
+    this.onFocus = this.onFocus.bind(this);
+    this.onBlur = this.onBlur.bind(this);
   }
 
-  _createClass(Search, [{
-    key: 'onFocus',
-    value: function onFocus(id, name, value) {
-      var onFocus = this.props.onFocus;
-
-      this.setState({ isFocus: true });
-      onFocus && onFocus(id, name, value);
-    }
-  }, {
-    key: 'onBlur',
-    value: function onBlur(id, name, value) {
-      var onBlur = this.props.onBlur;
-
-      this.state.value == '' && this.setState({ isFocus: false });
-      onBlur && onBlur(id, name, value);
-    }
-  }, {
-    key: 'render',
-    value: function render() {
-      var _props = this.props,
-          placeHolder = _props.placeHolder,
-          maxLength = _props.maxLength,
-          value = _props.value,
-          onChange = _props.onChange,
-          onKeyPress = _props.onKeyPress;
-      var isFocus = this.state.isFocus;
-
-      return React.createElement(
-        'div',
-        { className: style.container + ' ' + (isFocus ? style.active : '') },
-        React.createElement(TextBox, {
-          placeHolder: placeHolder,
-          className: style.input,
-          maxLength: maxLength,
-          value: value,
-          onChange: onChange,
-          onKeyUp: onKeyPress,
-          onFocus: this.onFocus,
-          needAppearance: false,
-          onBlur: this.onBlur
-        }),
-        value != '' && value ? React.createElement(
-          'span',
-          { className: style.icon, onClick: this.onBlur },
-          React.createElement(Icon, { name: 'ZD-close', size: '19' })
-        ) : null
-      );
-    }
-  }]);
+  onFocus(id, name, value) {
+    let {
+      onFocus
+    } = this.props;
+    this.setState({
+      isFocus: true
+    });
+    onFocus && onFocus(id, name, value);
+  }
 
-  return Search;
-}(React.Component);
+  onBlur(id, name, value) {
+    let {
+      onBlur
+    } = this.props;
+    this.state.value == '' && this.setState({
+      isFocus: false
+    });
+    onBlur && onBlur(id, name, value);
+  }
 
-export default Search;
+  render() {
+    let {
+      placeHolder,
+      maxLength,
+      value,
+      onChange,
+      onKeyPress,
+      customClass
+    } = this.props;
+    let {
+      isFocus
+    } = this.state;
+    return /*#__PURE__*/React.createElement("div", {
+      className: `${style.container} ${isFocus ? style.active : ''} ${customClass}`
+    }, /*#__PURE__*/React.createElement(TextBox, {
+      placeHolder: placeHolder,
+      customClass: style.input,
+      maxLength: maxLength,
+      value: value,
+      onChange: onChange,
+      onKeyUp: onKeyPress,
+      onFocus: this.onFocus,
+      needAppearance: false,
+      onBlur: this.onBlur
+    }), value != '' && value ? /*#__PURE__*/React.createElement("span", {
+      className: style.icon,
+      onClick: this.onBlur
+    }, /*#__PURE__*/React.createElement(Icon, {
+      name: "ZD-close",
+      size: "19"
+    })) : null);
+  }
 
-Search.propTypes = {
-  maxLength: PropTypes.number,
-  onBlur: PropTypes.func,
-  onChange: PropTypes.func,
-  onFocus: PropTypes.func,
-  onKeyPress: PropTypes.func,
-  placeHolder: PropTypes.string,
-  value: PropTypes.string
-};
-Search.defaultProps = {
-  placeHolder: 'Search',
-  maxLength: 150
-};
-if (false) {
-  Search.docs = {
-    componentGroup: 'Header',
-    folderName: 'Setup'
-  };
-}
+}
+Search.propTypes = propTypes;
+Search.defaultProps = defaultProps; // if (__DOCS__) {
+//   Search.docs = {
+//     componentGroup: 'Header',
+//     folderName: 'Setup'
+//   };
+// }

package/es/setup/header/Search/Search.module.css

@@ -1,67 +1,68 @@
 .container {
   position: relative;
-  transition: width 0.3s;
-  width: var(--zd_size90);
+  transition: width var(--zd_transition3);
+  width: var(--zd_size90) ;
 }[dir=ltr] .container {
-  margin-right: var(--zd_size15);
+  margin-right: var(--zd_size15) ;
 }[dir=rtl] .container {
-  margin-left: var(--zd_size15);
+  margin-left: var(--zd_size15) ;
 }
 .active {
-  width: var(--zd_size180);
+  width: var(--zd_size180) ;
 }
 .active .input, .input:hover {
-  border-bottom-color: #999;
+  border-bottom-color: var(--zdt_search_input_border);
 }
 .icon {
   position: absolute;
-  top: 0;
-  bottom: 0;
-  color: #999;
+  top: 0 ;
+  bottom: 0 ;
+  color: var(--zdt_search_icon);
   line-height: var(--zd_size26);
   cursor: pointer;
 }
 [dir=ltr] .icon {
-  right: 0;
+  right: 0 ;
 }
 [dir=rtl] .icon {
-  left: 0;
+  left: 0 ;
 }
 .icon:hover {
-  color: #666;
+  color: var(--zdt_search_hover_icon);
 }
 .input {
-  height: var(--zd_size26);
-  font-size: var(--zd_size13);
-  width: 100%;
+  height: var(--zd_size26) ;
+  font-size: var(--zd_font_size13) ;
+  width: 100% ;
   letter-spacing: 0.2px;
-  transition: all 0.3s ease;
-  color: #333;
+  transition: all var(--zd_transition3) ease;
+  color: var(--zdt_search_input_text);
   font-family: var(--zd_regular);
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   border: 0;
   border-bottom: 1px solid transparent;
+  background: var(--zdt_search_input_bg);
 }
 [dir=ltr] .input {
-  padding-right: var(--zd_size20);
+  padding-right: var(--zd_size20) ;
 }
 [dir=rtl] .input {
-  padding-left: var(--zd_size20);
+  padding-left: var(--zd_size20) ;
 }
 .input::placeholder {
-  color: var(--zd_text_smoke12);
+  color: var(--zdt_search_placeholder_text);
 }
 .input::-webkit-placeholder {
-  color: var(--zd_text_smoke12);
+  color: var(--zdt_search_placeholder_text);
 }
 .input::-moz-placeholder {
-  color: var(--zd_text_smoke12);
+  color: var(--zdt_search_placeholder_text);
 }
 .input::-ms-placeholder {
-  color: var(--zd_text_smoke12);
+  color: var(--zdt_search_placeholder_text);
 }
 .input:focus, .active .input:focus {
-  border-bottom-color: #0d83dd;
+  border-bottom-color: var(--zdt_search_input_focus_border);
 }

package/es/setup/header/Search/props/defaultProps.js

@@ -0,0 +1,5 @@
+export const defaultProps = {
+  placeHolder: 'Search',
+  maxLength: 150,
+  customClass: ''
+};

package/es/setup/header/Search/props/propTypes.js

@@ -0,0 +1,11 @@
+import PropTypes from 'prop-types';
+export const propTypes = {
+  customClass: PropTypes.string,
+  maxLength: PropTypes.number,
+  onBlur: PropTypes.func,
+  onChange: PropTypes.func,
+  onFocus: PropTypes.func,
+  onKeyPress: PropTypes.func,
+  placeHolder: PropTypes.string,
+  value: PropTypes.string
+};