@zohodesk/dot 1.0.0-test.239 → 1.1.0

package/es/form/layout/Section/Section.js

@@ -5,6 +5,7 @@ export default class Section extends Component {
   constructor(props) {
     super(props);
   }
+
   render() {
     let {
       title,
@@ -17,18 +18,20 @@ export default class Section extends Component {
     } = this.props;
     return /*#__PURE__*/React.createElement("div", {
       "data-id": dataId,
+      "data-test-id": dataId,
       className: containerClass ? containerClass : ''
     }, title && /*#__PURE__*/React.createElement("div", {
       className: titleClass ? titleClass : ''
     }, title), /*#__PURE__*/React.createElement("div", {
       className: `${className ? className : ''} ${column == 'single' ? style.singleColumn : ''}`,
-      "data-id": formName && formName
+      "data-id": formName && formName,
+      "data-test-id": formName && formName
     }, this.props.children));
   }
+
 }
-Section.propTypes = propTypes;
-if (false) {
-  Section.docs = {
-    componentGroup: 'ModuleAddForm'
-  };
-}
+Section.propTypes = propTypes; // if (__DOCS__) {
+//   Section.docs = {
+//     componentGroup: 'ModuleAddForm'
+//   };
+// }

package/es/form/layout/index.js

@@ -0,0 +1,2 @@
+export { default as Field } from './Field/Field';
+export { default as Section } from './Section/Section';

package/es/index.js

@@ -1,7 +1,51 @@
-// export { default as React } from 'react';
-// export { default as ReactDOM } from 'react-dom';
-// export { renderToStaticMarkup } from 'react-dom/server';
-export * from './docs/generalDocs.js';
-export * from './docs/lookupDocs.js';
-export * from './docs/setupDocs.js';
-export * from './docs/formDocs.js';
+export { default as ActionButton } from './ActionButton/ActionButton';
+export { default as AutoClose } from './actions/AutoClose';
+export * from './alert';
+export { default as AlphabeticList } from './AlphabeticList/AlphabeticList';
+export { default as Attachment } from './Attachment/Attachment';
+export { default as AttachmentViewer } from './AttachmentViewer/AttachmentViewer';
+export * from './avatar';
+export { default as ChannelIcon } from './ChannelIcon/ChannelIcon';
+import * as _Drawer from './Drawer/Drawer';
+export { _Drawer as Drawer };
+export { default as ToggleDropDown } from './dropdown/ToggleDropDown/ToggleDropDown';
+export { default as CommonEmptyState } from './emptystate/CommonEmptyState/CommonEmptyState';
+export { default as EditionPage } from './emptystate/EditionPage/EditionPage';
+import * as _errorstate from './errorstate';
+export { _errorstate as errorstate };
+export { default as ExternalLink } from './ExternalLink/ExternalLink';
+export { default as FlipCard } from './FlipCard/FlipCard';
+import * as _fields from './form/fields';
+export { _fields as fields };
+import * as _fields_layout from './form/layout/';
+export { _fields_layout as fields_layout };
+export { default as FormAction } from './FormAction/FormAction';
+export { default as FreezeLayer } from './FreezeLayer/FreezeLayer';
+export { default as IconButton } from './IconButton/IconButton';
+export { default as Image } from './Image/Image';
+export { default as ImportantNotes } from './ImportantNotes/ImportantNotes';
+import * as _SetupDetailLayout from './layout/SetupDetailLayout';
+export { _SetupDetailLayout as SetupDetailLayout };
+import * as _SubtabLayout from './layout/SubtabLayout';
+export { _SubtabLayout as SubtabLayout };
+export { default as Link } from './Link/Link';
+import * as _list from './list';
+export { _list as list };
+export { default as Loader } from './Loader/Loader';
+export { default as Message, MessageUI, MessageNew } from './Message/Message';
+export { default as MessageBanner } from './MessageBanner/MessageBanner';
+export { default as NewStar } from './NewStar/NewStar';
+export { default as PlusIcon } from './PlusIcon/PlusIcon';
+import * as _Provider from './Provider/Config';
+export { _Provider as Provider };
+import * as _lookup from './lookup';
+export { _lookup as lookup };
+export { default as Separator } from './Separator/Separator';
+import * as _setup from './setup';
+export { _setup as setup };
+import * as _svg from './svg';
+export { _svg as svg };
+export { default as ToastMessage } from './ToastMessage/ToastMessage';
+export { default as Upload } from './Upload/Upload';
+import * as _version from './version2';
+export { _version as version2 };

package/es/layout/SetupDetailLayout/SetupDetailLayout.js

@@ -2,7 +2,7 @@ import React, { Component } from 'react';
 import { SetupDetailLayout_defaultProps, SetupHeader_defaultProps, SetupContent_defaultProps, SetupFooter_defaultProps } from './props/defaultProps';
 import { SetupDetailLayout_propTypes, SetupHeader_propTypes, SetupContent_propTypes, SetupFooter_propTypes } from './props/propTypes';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import Icon from '@zohodesk/icons/lib/Icon';
+import { Icon } from '@zohodesk/icons';
 import style from './SetupDetailLayout.module.css';
 export default class SetupDetailLayout extends React.Component {
   constructor(props) {
@@ -12,6 +12,7 @@ export default class SetupDetailLayout extends React.Component {
     };
     this.toggleHelpInfo = this.toggleHelpInfo.bind(this);
   }
+
   toggleHelpInfo() {
     let {
       isHelpInfoOpen
@@ -20,6 +21,7 @@ export default class SetupDetailLayout extends React.Component {
       isHelpInfoOpen: !isHelpInfoOpen
     });
   }
+
   render() {
     let {
       isHelpInfoOpen
@@ -29,8 +31,12 @@ export default class SetupDetailLayout extends React.Component {
       needHelpInfo,
       getHelpInfo,
       helpInfoTitle,
-      dataId
+      dataId,
+      i18nKeys
     } = this.props;
+    const {
+      closeText = 'Close'
+    } = i18nKeys;
     return /*#__PURE__*/React.createElement(Container, {
       isScrollAttribute: true,
       dataId: dataId
@@ -41,6 +47,7 @@ export default class SetupDetailLayout extends React.Component {
           needHelpInfo: needHelpInfo
         });
       }
+
       return child;
     }), getHelpInfo ? /*#__PURE__*/React.createElement(Box, {
       className: `${style.popup} ${isHelpInfoOpen ? style.open : style.close}`,
@@ -59,7 +66,9 @@ export default class SetupDetailLayout extends React.Component {
     }, helpInfoTitle), /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement("span", {
       onClick: this.toggleHelpInfo,
       className: style.infoClose,
-      "data-id": `${dataId}_close`
+      "data-title": closeText,
+      "data-id": `${dataId}_close`,
+      "data-test-id": `${dataId}_close`
     }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-close"
     }))))), /*#__PURE__*/React.createElement(Box, {
@@ -68,18 +77,20 @@ export default class SetupDetailLayout extends React.Component {
       className: style.infoFooter
     }, getHelpInfo()))) : null);
   }
+
 }
 SetupDetailLayout.propTypes = SetupDetailLayout_propTypes;
-SetupDetailLayout.defaultProps = SetupDetailLayout_defaultProps;
-if (false) {
-  SetupDetailLayout.docs = {
-    componentGroup: 'Template'
-  };
-}
+SetupDetailLayout.defaultProps = SetupDetailLayout_defaultProps; // if (__DOCS__) {
+//   SetupDetailLayout.docs = {
+//     componentGroup: 'Template'
+//   };
+// }
+
 export class SetupHeader extends Component {
   constructor(props) {
     super(props);
   }
+
   render() {
     let {
       title,
@@ -94,8 +105,13 @@ export class SetupHeader extends Component {
       rightClassName,
       isCustomizedHeader,
       headerCustomStyle,
-      dataId
+      dataId,
+      i18nKeys
     } = this.props;
+    const {
+      infoText = 'Help',
+      backText = 'Back'
+    } = i18nKeys;
     return /*#__PURE__*/React.createElement(Box, {
       className: isCustomizedHeader === true ? headerCustomStyle : style.header,
       dataId: dataId
@@ -107,7 +123,9 @@ export class SetupHeader extends Component {
     }, needBack ? /*#__PURE__*/React.createElement("span", {
       className: style.backIcon,
       onClick: onBackClick,
-      "data-id": `${dataId}_back`
+      "data-title": backText,
+      "data-id": `${dataId}_back`,
+      "data-test-id": `${dataId}_back`
     }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-back"
     })) : null), /*#__PURE__*/React.createElement(Box, {
@@ -136,17 +154,22 @@ export class SetupHeader extends Component {
     }, /*#__PURE__*/React.createElement("span", {
       className: style.helpInfo,
       onClick: openHelpInfo,
-      "data-id": `${dataId}_info`
+      "data-title": infoText,
+      "data-id": `${dataId}_info`,
+      "data-test-id": `${dataId}_info`
     }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-info31"
     }))) : /*#__PURE__*/React.createElement("span", {
       className: `${style.helpInfo} ${style.mr15}`,
       onClick: openHelpInfo,
-      "data-id": `${dataId}_info`
+      "data-title": infoText,
+      "data-id": `${dataId}_info`,
+      "data-test-id": `${dataId}_info`
     }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-info31"
     }))) : null));
   }
+
 }
 SetupHeader.propTypes = SetupHeader_propTypes;
 SetupHeader.defaultProps = SetupHeader_defaultProps;
@@ -154,6 +177,7 @@ export class SetupContent extends Component {
   constructor(props) {
     super(props);
   }
+
   render() {
     let {
       children,
@@ -169,6 +193,7 @@ export class SetupContent extends Component {
       dataId: dataId
     }, children);
   }
+
 }
 SetupContent.propTypes = SetupContent_propTypes;
 SetupContent.defaultProps = SetupContent_defaultProps;
@@ -176,6 +201,7 @@ export class SetupFooter extends Component {
   constructor(props) {
     super(props);
   }
+
   render() {
     let {
       children,
@@ -185,6 +211,7 @@ export class SetupFooter extends Component {
       dataId: dataId
     }, children);
   }
+
 }
 SetupFooter.propTypes = SetupFooter_propTypes;
 SetupFooter.defaultProps = SetupFooter_defaultProps;

package/es/layout/SetupDetailLayout/SetupDetailLayout.module.css

@@ -1,152 +1,152 @@
-.header {
-  height: var(--zd_size50);
-  z-index: 2;
-  border-bottom: 1px solid var(--zdt_setupdetail_header_border);
-}
-.back {
-  width: var(--zd_size60);
-}
-.backIcon {
-  height: var(--zd_size30);
-  width: var(--zd_size30);
-  font-size: var(--zd_font_size12);
-  display: inline-block;
-  color: var(--zdt_setupdetail_backicon);
-  line-height: var(--zd_size30);
-  text-align: center;
-  border-radius: 50%;
-  cursor: pointer;
-}
-[dir=ltr] .backIcon {
-  margin-left: var(--zd_size19);
-}
-[dir=rtl] .backIcon {
-  margin-right: var(--zd_size19);
-}
-
-.backIcon:hover {
-  background-color: var(--zdt_setupdetail_hover_backicon_bg);
-}
-.title {
-  font-size: var(--zd_font_size16);
-  line-height: var(--zd_size16);
-  font-family: var(--zd_semibold);
-  color: var(--zdt_setupdetail_backicon);
-  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
-}
-[dir=ltr] .title {
-  padding-right: var(--zd_size12);
-}
-[dir=rtl] .title {
-  padding-left: var(--zd_size12);
-}
-
-.rightPanel {
-  composes: justifyFend from '~@zohodesk/components/lib/common/common.module.css';
-}
-.helpInfoCont {
-  position: absolute;
-  z-index: 10;
-}
-[dir=ltr] .helpInfoCont {
-  right: 0;
-  padding: var(--zd_size12) var(--zd_size15) 0 0;
-}
-[dir=rtl] .helpInfoCont {
-  left: 0;
-  padding: var(--zd_size12) 0 0 var(--zd_size15);
-}
-.helpInfo {
-  line-height: var(--zd_size26);
-  height: var(--zd_size28);
-  width: var(--zd_size28);
-  color: var(--zdt_setupdetail_helpinfo_text);
-  font-size: var(--zd_font_size11);
-  display: inline-block;
-  border: 1px solid var(--zdt_setupdetail_helpinfo);
-  border-radius: 2px;
-  text-align: center;
-  cursor: pointer;
-}
-[dir=ltr] .mr15 {
-  margin-right: var(--zd_size15);
-}
-[dir=rtl] .mr15 {
-  margin-left: var(--zd_size15);
-}
-
-.content {
-  z-index: 1;
-}
-[dir=ltr] .padding {
-  padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size60);
-}
-[dir=rtl] .padding {
-  padding: var(--zd_size10) var(--zd_size60) var(--zd_size10) var(--zd_size25);
-}
-.popup {
-  z-index: 3;
-  position: absolute;
-  top: 0;
-  bottom: 0;
-  width: var(--zd_size330);
-  transition: transform var(--zd_transition3);
-  border: 1px solid var(--zdt_setupdetail_popup_border);
-  background-color: var(--zdt_setupdetail_popup_bg);
-}
-[dir=ltr] .popup {
-  right: 0;
-  transform: translateX(100%);
-}
-[dir=rtl] .popup {
-  left: 0;
-  transform: translateX(-100%);
-}
-.popup.open {
-  transform: translateX(0);
-}
-.close {
-  composes: disableFocus from '~@zohodesk/components/lib/common/common.module.css';
-}
-
-.infoHeader {
-  color: var(--zdt_setupdetail_infoheader_text);
-  padding: var(--zd_size10) var(--zd_size20) var(--zd_size11);
-  border-bottom: 1px solid var(--zdt_setupdetail_popup_border);
-  background-color: var(--zdt_setupdetail_infoheader_bg);
-}
-
-.infoIcon {
-  height: var(--zd_size26);
-  width: var(--zd_size26);
-  font-size: var(--zd_font_size12);
-  line-height: var(--zd_size24);
-  text-align: center;
-  border: 1px solid var(--zdt_setupdetail_infoicon_border);
-  border-radius: 2px;
-}
-
-.infoText {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
-  font-size: var(--zd_font_size13);
-}
-
-[dir=ltr] .infoText {
-  margin-left: var(--zd_size8);
-  margin-right: var(--zd_size8);
-}
-
-[dir=rtl] .infoText {
-  margin-right: var(--zd_size8);
-  margin-left: var(--zd_size8);
-}
-
-.infoClose {
-  font-size: var(--zd_font_size28);
-  color: var(--zdt_setupdetail_infoclose);
-  cursor: pointer;
-}
-
-.infoFooter {
-  padding: var(--zd_size10) var(--zd_size20);
-}
+.header {
+  height: var(--zd_size50) ;
+  z-index: 2;
+  border-bottom: 1px solid var(--zdt_setupdetail_header_border);
+}
+.back {
+  width: var(--zd_size60) ;
+}
+.backIcon {
+  height: var(--zd_size30) ;
+  width: var(--zd_size30) ;
+  font-size: var(--zd_font_size12) ;
+  display: inline-block;
+  color: var(--zdt_setupdetail_backicon);
+  line-height: var(--zd_size30);
+  text-align: center;
+  border-radius: 50%;
+  cursor: pointer;
+}
+[dir=ltr] .backIcon {
+  margin-left: var(--zd_size19) ;
+}
+[dir=rtl] .backIcon {
+  margin-right: var(--zd_size19) ;
+}
+
+.backIcon:hover {
+  background-color: var(--zdt_setupdetail_hover_backicon_bg);
+}
+.title {
+  font-size: var(--zd_font_size16) ;
+  line-height: var(--zd_size16);
+  font-family: var(--zd_semibold);
+  color: var(--zdt_setupdetail_backicon);
+  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
+}
+[dir=ltr] .title {
+  padding-right: var(--zd_size12) ;
+}
+[dir=rtl] .title {
+  padding-left: var(--zd_size12) ;
+}
+
+.rightPanel {
+  composes: justifyFend from '~@zohodesk/components/lib/common/common.module.css';
+}
+.helpInfoCont {
+  position: absolute;
+  z-index: 10;
+}
+[dir=ltr] .helpInfoCont {
+  right: 0 ;
+  padding: var(--zd_size12) var(--zd_size15) 0 0 ;
+}
+[dir=rtl] .helpInfoCont {
+  left: 0 ;
+  padding: var(--zd_size12) 0 0 var(--zd_size15) ;
+}
+.helpInfo {
+  line-height: var(--zd_size26);
+  height: var(--zd_size28) ;
+  width: var(--zd_size28) ;
+  color: var(--zdt_setupdetail_helpinfo_text);
+  font-size: var(--zd_font_size11) ;
+  display: inline-block;
+  border: 1px solid var(--zdt_setupdetail_helpinfo);
+  border-radius: 2px;
+  text-align: center;
+  cursor: pointer;
+}
+[dir=ltr] .mr15 {
+  margin-right: var(--zd_size15) ;
+}
+[dir=rtl] .mr15 {
+  margin-left: var(--zd_size15) ;
+}
+
+.content {
+  z-index: 1;
+}
+[dir=ltr] .padding {
+  padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size60) ;
+}
+[dir=rtl] .padding {
+  padding: var(--zd_size10) var(--zd_size60) var(--zd_size10) var(--zd_size25) ;
+}
+.popup {
+  z-index: 3;
+  position: absolute;
+  top: 0 ;
+  bottom: 0 ;
+  width: var(--zd_size330) ;
+  transition: transform var(--zd_transition3);
+  border: 1px solid var(--zdt_setupdetail_popup_border);
+  background-color: var(--zdt_setupdetail_popup_bg);
+}
+[dir=ltr] .popup {
+  right: 0 ;
+  transform: translateX(100%);
+}
+[dir=rtl] .popup {
+  left: 0 ;
+  transform: translateX(-100%);
+}
+.popup.open {
+  transform: translateX(0);
+}
+.close {
+  composes: disableFocus from '~@zohodesk/components/lib/common/common.module.css';
+}
+
+.infoHeader {
+  color: var(--zdt_setupdetail_infoheader_text);
+  padding: var(--zd_size10) var(--zd_size20) var(--zd_size11) ;
+  border-bottom: 1px solid var(--zdt_setupdetail_popup_border);
+  background-color: var(--zdt_setupdetail_infoheader_bg);
+}
+
+.infoIcon {
+  height: var(--zd_size26) ;
+  width: var(--zd_size26) ;
+  font-size: var(--zd_font_size12) ;
+  line-height: var(--zd_size24);
+  text-align: center;
+  border: 1px solid var(--zdt_setupdetail_infoicon_border);
+  border-radius: 2px;
+}
+
+.infoText {
+  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  font-size: var(--zd_font_size13) ;
+}
+
+[dir=ltr] .infoText {
+  margin-left: var(--zd_size8) ;
+  margin-right: var(--zd_size8) ;
+}
+
+[dir=rtl] .infoText {
+  margin-right: var(--zd_size8) ;
+  margin-left: var(--zd_size8) ;
+}
+
+.infoClose {
+  font-size: var(--zd_font_size28) ;
+  color: var(--zdt_setupdetail_infoclose);
+  cursor: pointer;
+}
+
+.infoFooter {
+  padding: var(--zd_size10) var(--zd_size20) ;
+}

package/es/layout/SetupDetailLayout/props/defaultProps.js

@@ -1,13 +1,15 @@
 export const SetupDetailLayout_defaultProps = {
   helpInfoTitle: 'Page Tips',
   needHelpInfo: false,
-  dataId: 'SetupDetailLayout'
+  dataId: 'SetupDetailLayout',
+  i18nKeys: {}
 };
 export const SetupHeader_defaultProps = {
   needBack: false,
   needHelpInfo: false,
   needHelpInfoWrapper: false,
-  dataId: 'SetupHeader'
+  dataId: 'SetupHeader',
+  i18nKeys: {}
 };
 export const SetupContent_defaultProps = {
   needPadding: true,

package/es/layout/SetupDetailLayout/props/propTypes.js

@@ -4,7 +4,10 @@ export const SetupDetailLayout_propTypes = {
   dataId: PropTypes.string,
   getHelpInfo: PropTypes.func,
   helpInfoTitle: PropTypes.string,
-  needHelpInfo: PropTypes.bool
+  needHelpInfo: PropTypes.bool,
+  i18nKeys: PropTypes.shape({
+    closeText: PropTypes.string
+  })
 };
 export const SetupHeader_propTypes = {
   dataId: PropTypes.string,
@@ -19,7 +22,11 @@ export const SetupHeader_propTypes = {
   onBackClick: PropTypes.func,
   openHelpInfo: PropTypes.func,
   rightClassName: PropTypes.string,
-  title: PropTypes.string
+  title: PropTypes.string,
+  i18nKeys: PropTypes.shape({
+    infoText: PropTypes.string,
+    backText: PropTypes.string
+  })
 };
 export const SetupContent_propTypes = {
   children: PropTypes.element,

package/es/layout/SubtabLayout/SubtabLayout.js

@@ -1,4 +1,5 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : 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 from 'react';
 import { SubtabHeader_propTypes, SubtabFooter_propTypes, SubtabContent_propTypes, SubtabLayout_propTypes } from './props/propTypes';
 import { SubtabHeader_defaultProps, SubtabFooter_defaultProps, SubtabContent_defaultProps, SubtabLayout_defaultProps } from './props/defaultProps';
@@ -57,6 +58,7 @@ export class SubtabHeader extends React.Component {
       className: style.aside
     }, getRightPlaceHolder))));
   }
+
 }
 SubtabHeader.propTypes = SubtabHeader_propTypes;
 SubtabHeader.defaultProps = SubtabHeader_defaultProps;
@@ -89,6 +91,7 @@ export class SubtabFooter extends React.Component {
       className: rightClassName
     }, getRightFooterPlaceHolder) : null);
   }
+
 }
 SubtabFooter.propTypes = SubtabFooter_propTypes;
 SubtabFooter.defaultProps = SubtabFooter_defaultProps;
@@ -111,6 +114,7 @@ export class SubtabContent extends React.Component {
       dataId: dataId
     }, children);
   }
+
 }
 SubtabContent.propTypes = SubtabContent_propTypes;
 SubtabContent.defaultProps = SubtabContent_defaultProps;
@@ -130,11 +134,11 @@ export default class SubtabLayout extends React.Component {
       }
     }), children);
   }
+
 }
 SubtabLayout.defaultProps = SubtabLayout_defaultProps;
-SubtabLayout.propTypes = SubtabLayout_propTypes;
-if (false) {
-  SubtabLayout.docs = {
-    componentGroup: 'Template'
-  };
-}
+SubtabLayout.propTypes = SubtabLayout_propTypes; // if (__DOCS__) {
+//   SubtabLayout.docs = {
+//     componentGroup: 'Template'
+//   };
+// }