@zohodesk/dot 1.0.0-temp-200.8 → 1.0.0-temp-214

package/lib/form/fields/CurrencyField/CurrencyField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _TextBoxIcon = _interopRequireDefault(require("@zohodesk/components/lib/TextBoxIcon/TextBoxIcon"));
 
@@ -178,11 +178,10 @@ var CurrencyField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
+        isRequired: isMandatory,
+        customStyle: labelCustomClass,
         htmlFor: uniqueId,
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
       }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], _extends({

package/lib/form/fields/DateField/DateField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _DateWidget = _interopRequireDefault(require("@zohodesk/components/lib/DateTime/DateWidget"));
 
@@ -185,15 +185,12 @@ var DateField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
+        isRequired: isMandatory,
+        customStyle: labelCustomClass,
         htmlFor: getAriaId,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        onClick: isDisabled || isReadOnly ? null : this.handleLabelClick,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
-      }, LabelProps, {
-        id: labelName
-      }))), /*#__PURE__*/_react["default"].createElement("div", {
+        testId: labelName,
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
+      }, LabelProps))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
       }, isLocked && lockedValueText ? /*#__PURE__*/_react["default"].createElement("div", {
         className: _FieldsModule["default"].lockText

package/lib/form/fields/Fields.module.css

@@ -7,6 +7,9 @@
   position: relative;
   min-height: var(--zd_size25) ;
 }
+.fieldMargin_large {
+  margin-top: var(--zd_size10) ;
+}
 .fieldMargin_medium {
   margin-top: var(--zd_size5) ;
 }
@@ -15,7 +18,7 @@
 }
 .radioContainer,
 .checkbox {
-  composes: dflex alignVertical flexwrap from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex alignVertical flexwrap from '~@zohodesk/components/es/common/common.module.css';
 }
 .checkbox {
   min-height: var(--zd_size28) ;
@@ -25,7 +28,7 @@
 }
 .lineClamp_one,
 .lineClamp_two {
-  composes: clamp from '~@zohodesk/components/lib/common/common.module.css';
+  composes: clamp from '~@zohodesk/components/es/common/common.module.css';
 }
 .lineClamp_one {
   -webkit-line-clamp: 1;
@@ -34,7 +37,7 @@
   -webkit-line-clamp: 2;
 }
 .checkboxText {
-  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
+  composes: wbreak from '~@zohodesk/components/es/common/common.module.css';
   line-height: normal;
 }
 [dir=ltr] .checkboxText {
@@ -90,10 +93,10 @@
   width: var(--zd_size94) ;
 }
 .flex {
-  composes: dflex from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex from '~@zohodesk/components/es/common/common.module.css';
 }
 .periodContainer {
-  composes: dflex flexrow flexwrap from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex flexrow flexwrap from '~@zohodesk/components/es/common/common.module.css';
   width: 100% ;
   /*margin-left: var(--zd_size15);*/
 }
@@ -114,12 +117,12 @@
     color: var(--zdt_fields_newtabicon_hover_icon);
 }
 .labelContainer {
-  composes: dflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
 }
 .lockIcon,
 .infoIcon {
   color: var(--zdt_fields_lockicon_icon);
-  composes: dInflex from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dInflex from '~@zohodesk/components/es/common/common.module.css';
 }
 [dir=ltr] .lockIcon, [dir=ltr] .infoIcon {
   margin-left: var(--zd_size5) ;
@@ -172,7 +175,7 @@
 .lockText {
   font-size: var(--zd_font_size13) ;
   font-style: italic;
-  composes: wbreak from '~@zohodesk/components/lib/common/common.module.css';
+  composes: wbreak from '~@zohodesk/components/es/common/common.module.css';
 }
 .labelMandatory:after {
   content: '*';
@@ -185,7 +188,7 @@
   padding-right: var(--zd_size2) ;
 }
 .ePhiTag {
-  composes: flexshrink from '~@zohodesk/components/lib/common/common.module.css';
+  composes: flexshrink from '~@zohodesk/components/es/common/common.module.css';
   color: var(--zdt_fields_phitag_text);
   font-size: var(--zd_font_size12) ;
   height: var(--zd_size18) ;

package/lib/form/fields/MultiSelectField/MultiSelectField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _MultiSelect = _interopRequireDefault(require("@zohodesk/components/lib/MultiSelect/MultiSelect"));
 
@@ -198,13 +198,11 @@ var MultiSelectField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
-        id: id,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isDarkPalette ? 'dark' : isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette // onClick={this.handleLabelClick}
+        isRequired: isMandatory // customStyle={style.fieldLabel}
         ,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label"),
-        htmlFor: uniqueId
+        htmlFor: uniqueId,
+        testId: id,
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps))), /*#__PURE__*/_react["default"].createElement(_MultiSelect["default"], _extends({
         options: options,
         onChange: this.handleChange,

package/lib/form/fields/RadioField/RadioField.js

@@ -182,7 +182,7 @@ var RadioField = /*#__PURE__*/function (_PureComponent) {
         customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
         dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps)), /*#__PURE__*/_react["default"].createElement("div", {
-        className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(isBoxStyle ? _FieldsModule["default"].radiosWrapper : '', " ").concat(labelName ? _FieldsModule["default"].fieldMargin_medium : '', " ").concat(_FieldsModule["default"].radioContainer)
+        className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(isBoxStyle ? _FieldsModule["default"].radiosWrapper : '', " ").concat(labelName ? isBoxStyle ? _FieldsModule["default"].fieldMargin_large : _FieldsModule["default"].fieldMargin_medium : '', " ").concat(_FieldsModule["default"].radioContainer)
       }, options.map(function (option, index) {
         var text = option.text,
             value = option.value,

package/lib/form/fields/SelectField/SelectField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _Select = _interopRequireDefault(require("@zohodesk/components/lib/Select/Select"));
 
@@ -166,13 +166,11 @@ var SelectField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
-        htmlFor: uniqueId,
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
+        isRequired: isMandatory,
+        htmlFor: uniqueId
       }, LabelProps, {
-        id: uniqueId
+        testId: uniqueId,
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '', " ").concat(fieldClass ? fieldClass : '')
       }, /*#__PURE__*/_react["default"].createElement(_Select["default"], _extends({

package/lib/form/fields/TagsMultiSelect/TagsMultiSelect.module.css

@@ -70,7 +70,7 @@
 }
 .newTagLabel {
   color: var(--zdt_tagsmultiselect_labelt_text);
-  composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
+  composes: semibold from '~@zohodesk/components/es/common/common.module.css';
 }
 [dir=ltr] .newTagLabel {
   margin-right: var(--zd_size5) ;
@@ -79,7 +79,7 @@
   margin-left: var(--zd_size5) ;
 }
 .dotted {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 .dropdown {
   margin-top: var(--zd_size1) ;

package/lib/form/fields/TagsMultiSelectField/TagsMultiSelectField.js

@@ -15,7 +15,7 @@ var _propTypes = require("./props/propTypes");
 
 var _Layout = require("@zohodesk/components/lib/Layout");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _Popup = _interopRequireDefault(require("@zohodesk/components/lib/Popup/Popup"));
 
@@ -247,13 +247,10 @@ var TagsMultiSelectField = function TagsMultiSelectField(props) {
     }
   }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
     text: labelName,
-    title: labelName,
-    id: id,
-    size: labelSize,
-    palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-    customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : '', " ").concat(labelClass ? labelClass : ''),
-    dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label"),
-    htmlFor: htmlId
+    isRequired: isMandatory,
+    htmlFor: htmlId,
+    testId: id,
+    customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
   }, LabelProps)), selectedValueCount ? /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     dataId: "".concat(dataId, "_tagCount"),
     className: _TagsMultiSelectFieldModule["default"].count

package/lib/form/fields/TextBoxField/TextBoxField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _TextBoxIcon = _interopRequireDefault(require("@zohodesk/components/lib/TextBoxIcon/TextBoxIcon"));
 
@@ -156,14 +156,12 @@ var TextBoxField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
+        isRequired: isMandatory,
+        customStyle: labelCustomClass,
+        testId: labelName,
         htmlFor: uniqueId,
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
-      }, LabelProps, {
-        id: labelName
-      }))), /*#__PURE__*/_react["default"].createElement("div", {
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
+      }, LabelProps))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
       }, /*#__PURE__*/_react["default"].createElement(_TextBoxIcon["default"], _extends({
         htmlId: uniqueId,

package/lib/form/fields/TextEditorWrapper/TextEditorWrapper.js

@@ -110,8 +110,8 @@ var TextEditorWrapper = /*#__PURE__*/function (_Component) {
       onFocus && onFocus();
     }
   }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(np) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(np) {
       var _this$props2 = this.props,
           id = _this$props2.id,
           value = _this$props2.value;

package/lib/form/fields/TextareaField/TextareaField.js

@@ -13,7 +13,7 @@ var _defaultProps = require("./props/defaultProps");
 
 var _propTypes = require("./props/propTypes");
 
-var _Label = _interopRequireDefault(require("@zohodesk/components/lib/Label/Label"));
+var _Label = _interopRequireDefault(require("@zohodesk/components/es/v1/Label/Label"));
 
 var _Textarea = _interopRequireDefault(require("@zohodesk/components/lib/Textarea/Textarea"));
 
@@ -185,12 +185,11 @@ var TextareaField = /*#__PURE__*/function (_PureComponent) {
         renderProps: renderLabelProps
       }, /*#__PURE__*/_react["default"].createElement(_Label["default"], _extends({
         text: labelName,
-        id: id,
-        size: fieldSize === 'small' ? 'small' : 'medium',
-        palette: isMandatory ? 'mandatory' : isDisabled ? 'primary' : labelPalette,
-        customClass: "".concat(_FieldsModule["default"].fieldLabel, " ").concat(labelCustomClass, " ").concat(isMandatory ? _FieldsModule["default"].labelMandatory : ''),
+        isRequired: isMandatory,
+        customStyle: labelCustomClass,
+        testId: id,
         htmlFor: uniqueId,
-        dataId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
+        customId: isDisabled ? "".concat(dataId, "_label_disabled") : isMandatory ? "".concat(dataId, "_label_mandatory") : "".concat(dataId, "_label")
       }, LabelProps))), /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_FieldsModule["default"].fieldContainer, " ").concat(labelName ? _FieldsModule["default"]["fieldMargin_".concat(fieldSize)] : '')
       }, !renderRightPlaceholderNode ? textAreaContent : /*#__PURE__*/_react["default"].createElement("div", {

package/lib/form/layout/Section/ModuleFormSection.module.css

@@ -1,3 +1,3 @@
 .singleColumn {
-  composes: dflex flexrow from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex flexrow from '~@zohodesk/components/es/common/common.module.css';
 }

package/lib/layout/SetupDetailLayout/SetupDetailLayout.module.css

@@ -32,7 +32,7 @@
   line-height: 1;
   font-family: var(--zd_semibold);
   color: var(--zdt_setupdetail_backicon);
-  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
+  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }
 [dir=ltr] .title {
   padding-right: var(--zd_size12) ;
@@ -42,7 +42,7 @@
 }
 
 .rightPanel {
-  composes: justifyFend from '~@zohodesk/components/lib/common/common.module.css';
+  composes: justifyFend from '~@zohodesk/components/es/common/common.module.css';
 }
 .helpInfoCont {
   position: absolute;
@@ -106,7 +106,7 @@
   transform: translateX(0);
 }
 .close {
-  composes: disableFocus from '~@zohodesk/components/lib/common/common.module.css';
+  composes: disableFocus from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .infoHeader {
@@ -127,7 +127,7 @@
 }
 
 .infoText {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   font-size: var(--zd_font_size13) ;
 }
 

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

@@ -72,7 +72,7 @@
 }
 
 .aside {
-  composes: justifyFend from '~@zohodesk/components/lib/common/common.module.css';
+  composes: justifyFend from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .title {

package/lib/list/DotNew/DotNew.module.css

@@ -9,7 +9,7 @@
 }
 
 .container {
-  composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dInflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
   /* animation: dotAnimation 1.25s infinite cubic-bezier(0.66, 0.33, 0, 1);
   box-shadow: 0 0 0 0 var(--dot_catskillWhite),
     0 0 0 0 rgba(10, 115, 235, 0.6); */

package/lib/list/ListStencils/ListStencils.module.css

@@ -4,11 +4,11 @@
   padding: 0 var(--zd_size30) ;
 }
 .innerContainer {
-  composes: dflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
   border-bottom: 1px dotted var(--zdt_liststencils_innercontainer_border);
 }
 .detailsInnerColumn {
-  composes: dflex from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex from '~@zohodesk/components/es/common/common.module.css';
 }
 [dir=ltr] .avatar {
   margin-right: var(--zd_size25) ;
@@ -21,7 +21,7 @@
   min-width: 0 ;
 }
 .primaryRow {
-  composes: flexgrow flexshrink flexbasis from '~@zohodesk/components/lib/common/common.module.css';
+  composes: flexgrow flexshrink flexbasis from '~@zohodesk/components/es/common/common.module.css';
 }
 .classic .detailsColumn {
   flex-basis: 60% ;

package/lib/list/SecondaryText/SecondaryText.module.css

@@ -45,7 +45,7 @@ display: block
 .textStyle,
 .secondaryText,
 .phoneNumber {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   max-width: 100% ;
   display: block;
 }
@@ -83,11 +83,11 @@ display: block
 .font_semibold,
 .font_bold,
 .textBold {
-  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
+  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }
 .priorityText,
 .statusText {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .priorityText {
@@ -98,7 +98,7 @@ display: block
   font-size: var(--zd_font_size12) ;
   color: var(--zdt_secondaryText_secondaryText_text);
   max-width: 100% ;
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 /* HappinessRating Style */
 .happinessContainer {

package/lib/list/SecondryPanel/SecondryPanel.module.css

@@ -2,5 +2,5 @@
   max-width: 100% ;
 }
 .dottedStyle {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }

package/lib/list/Subject/Subject.module.css

@@ -10,7 +10,7 @@
 }
 
 .dotted {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .font_regular {
@@ -27,7 +27,7 @@
 
 .font_semibold,
 .font_bold {
-  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
+  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .cursorPointer {

package/lib/list/TagNew/TagNew.module.css

@@ -4,7 +4,7 @@
   font-size: var(--zd_font_size13) ;
   color: var(--zdt_tagnew_default_text);
   composes: inlineFlex from '../listCommon.module.css';
-  composes: alignHorizontal from '~@zohodesk/components/lib/common/common.module.css';
+  composes: alignHorizontal from '~@zohodesk/components/es/common/common.module.css';
   transition: all var(--zd_transition2) ease 0s;
   opacity: 0;
   visibility: hidden;

package/lib/list/Thread/Thread.module.css

@@ -27,7 +27,7 @@
   right: var(--zd_size8) ;
 }
 .align_right {
-  composes: dInflex alignFend from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dInflex alignFend from '~@zohodesk/components/es/common/common.module.css';
 }
 .align_right .count {
   position: relative;

package/lib/list/listCommon.module.css

@@ -4,7 +4,7 @@
 }
 
 .inlineFlex {
-  composes: dInflex alignVertical from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dInflex alignVertical from '~@zohodesk/components/es/common/common.module.css';
 }
 
 [dir=ltr] .avatarMargin {
@@ -16,14 +16,14 @@
 }
 
 .subject {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
   font-size: var(--zd_font_size16) ;
 }
 
 /* css:lineheight-validation:ignore */
 .secondaryPanel {
   line-height: var(--zd_size18);
-  composes: dflex alignVertical flexwrap from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dflex alignVertical flexwrap from '~@zohodesk/components/es/common/common.module.css';
 }
 
 .statusColumn {

package/lib/list/status/StatusDropdown/StatusDropdown.js

@@ -31,7 +31,7 @@ var _CommonEmptyState = _interopRequireDefault(require("../../../emptystate/Comm
 
 var _StatusListItem = _interopRequireDefault(require("../StatusListItem/StatusListItem"));
 
-var _commonModule = _interopRequireDefault(require("@zohodesk/components/lib/common/common.module.css"));
+var _commonModule = _interopRequireDefault(require("@zohodesk/components/es/common/common.module.css"));
 
 var _ResponsiveDropBox = _interopRequireDefault(require("@zohodesk/components/lib/ResponsiveDropBox/ResponsiveDropBox"));
 
@@ -112,8 +112,8 @@ var StatusDropdown = /*#__PURE__*/function (_React$Component) {
       togglePopup(e, boxPosition);
     }
   }, {
-    key: "componentWillReceiveProps",
-    value: function componentWillReceiveProps(nextProps) {
+    key: "UNSAFE_componentWillReceiveProps",
+    value: function UNSAFE_componentWillReceiveProps(nextProps) {
       if (nextProps.options.length != this.props.options.length) {
         this.setState({
           options: nextProps.options

package/lib/list/status/StatusDropdown/StatusDropdown.module.css

@@ -40,7 +40,7 @@
   visibility: visible;
 }
 .value {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 .search {
   padding: var(--zd_size6) var(--zd_size20) 0 ;

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

@@ -34,11 +34,11 @@
   line-height: 1.5385;
 }
 .value {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+  composes: dotted from '~@zohodesk/components/es/common/common.module.css';
 }
 .multiLineValue{
   word-break: break-word;
-  composes: clamp from '~@zohodesk/components/lib/common/common.module.css';
+  composes: clamp from '~@zohodesk/components/es/common/common.module.css';
 }
 [dir=ltr] .withBorder.active {
   border-left-color: var(--zdt_statuslistitem_default_active_border);

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

@@ -7,6 +7,6 @@
 .contentDiv {
   font-size: var(--zd_font_size20) ;
   font-family: var(--zd_semibold);
-  composes: ftsmooth from '~@zohodesk/components/lib/common/common.module.css';
+  composes: ftsmooth from '~@zohodesk/components/es/common/common.module.css';
   margin-top: var(--zd_size15) ;
 }

package/lib/lookup/Lookup/Lookup.js

@@ -110,6 +110,7 @@ var Lookup = /*#__PURE__*/function (_Component) {
           needFocusScope = _this$props.needFocusScope,
           customProps = _this$props.customProps,
           isMinHeight = _this$props.isMinHeight,
+          containerClass = _this$props.containerClass,
           lookupClass = _this$props.lookupClass;
 
       var _a11y$role = a11y.role,
@@ -150,7 +151,7 @@ var Lookup = /*#__PURE__*/function (_Component) {
       }, a11yAttributes), /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
         "data-drag-container": "true",
         isCover: false,
-        className: isMinHeight ? "".concat(_LookupModule["default"].wrapper) : "".concat(_LookupModule["default"].coverwrap)
+        className: "".concat(isMinHeight ? _LookupModule["default"].wrapper : _LookupModule["default"].coverwrap, " ").concat(_LookupModule["default"].containerWidth, " ").concat(containerClass)
       }, children));
 
       return /*#__PURE__*/_react["default"].createElement(_FreezeLayer["default"], {

package/lib/lookup/Lookup/Lookup.module.css

@@ -19,6 +19,10 @@
   margin: auto ;
 }
 
+.containerWidth {
+  width: 100% ;
+}
+
 /* Size */
 .smallSize {
   max-width: var(--zd_size470) ;
@@ -35,10 +39,11 @@
 .largeSize {
   max-width: 70% ;
 }
+
 .xlargeSize {
   max-width: 80% ;
 }
 
 .fullSize {
   max-width: 90% ;
-}
+}

package/lib/lookup/Lookup/props/propTypes.js

@@ -30,6 +30,7 @@ var propTypes = {
   onClick: _propTypes["default"].func,
   onClose: _propTypes["default"].func,
   isMinHeight: _propTypes["default"].bool,
+  containerClass: _propTypes["default"].string,
   lookupClass: _propTypes["default"].string
 };
 exports.propTypes = propTypes;

package/lib/lookup/Section/LookupSection.module.css

@@ -2,7 +2,7 @@
   /* max-height: 80%; */
   /* min-height: 390px; */
   /* height: auto; */
-  composes: flexgrow from '~@zohodesk/components/lib/common/common.module.css';
+  composes: flexgrow from '~@zohodesk/components/es/common/common.module.css';
   border-radius: 0 0 var(--zd_size10) var(--zd_size10);
   background-color: var(--zdt_lookupsection_bg);
   box-shadow: var(--zd_bs_lookupsection_shadow)