@zohodesk/dot 1.0.0-temp-187.10 → 1.0.0-temp-208.1

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

@@ -1,116 +1,116 @@
-.container {
-  position: relative;
-}
-.tag {
-  max-width: 100% ;
-}
-[dir=ltr] .moreLess, [dir=ltr] .tag {
-  margin: 0 var(--zd_size6) var(--zd_size6) 0 ;
-}
-[dir=rtl] .moreLess, [dir=rtl] .tag {
-  margin: 0 0 var(--zd_size6) var(--zd_size6) ;
-}
-.input {
-  height: var(--zd_size20) ;
-  width: 100% ;
-  margin-bottom: var(--zd_size4) ;
-}
-.viewpopNew {
-  max-height: var(--zd_size250) ;
-}
-.tagDiv {
-  max-height: var(--zd_size160) ;
-  margin-top: var(--zd_size5) ;
-}
-.hasBorder {
-  transition: border var(--zd_transition2) linear 0s;
-  border-bottom-style: solid;
-  border-bottom-width: 1px;
-}
-.borderColor_transparent {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_border);
-}
-.borderColor_transparent:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_hover_border);
-}
-.borderColor_transparent.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_transparent_active_border);
-}
-.borderColor_default {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_border);
-}
-.borderColor_default:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_hover_border);
-}
-.borderColor_default.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_default_active_border);
-}
-.borderColor_dark {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_border);
-}
-.borderColor_dark:hover {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_hover_border);
-}
-.borderColor_dark.active {
-  border-bottom-color: var(--zdt_tagsmultiselect_dark_active_border);
-}
-.moreLess {
-  color: var(--zdt_tagsmultiselect_more_text);
-  font-size: var(--zd_font_size13) ;
-  cursor: pointer;
-}
-.moreLess:hover {
-  color: var(--zdt_tagsmultiselect_more_hover_text);
-}
-.inputWrapper {
-  position: relative;
-  max-width: 100% ;
-  min-width: var(--zd_size5) ;
-  font-size: 0 ;
-}
-.newTagLabel {
-  color: var(--zdt_tagsmultiselect_labelt_text);
-  composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
-}
-[dir=ltr] .newTagLabel {
-  margin-right: var(--zd_size5) ;
-}
-[dir=rtl] .newTagLabel {
-  margin-left: var(--zd_size5) ;
-}
-.dotted {
-  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
-}
-.dropdown {
-  margin-top: var(--zd_size1) ;
-}
-.custmSpan {
-  height: var(--zd_size25) ;
-  display: inline-block;
-  vertical-align: middle;
-  opacity: 0;
-  overflow: hidden;
-  white-space: nowrap;
-  max-width: 100% ;
-  visibility: hidden;
-}
-[dir=ltr] .custmSpan {
-  padding-right: var(--zd_size28) ;
-}
-[dir=rtl] .custmSpan {
-  padding-left: var(--zd_size28) ;
-}
-.custmInp {
-  position: absolute;
-  top: 0 ;
-  width: 100% ;
-}
-[dir=ltr] .custmInp {
-  left: 0 ;
-}
-[dir=rtl] .custmInp {
-  right: 0 ;
-}
-.newTagText {
-  color: var(--zdt_tagsmultiselect_more_text);
-}
+.container {
+  position: relative;
+}
+.tag {
+  max-width: 100% ;
+}
+[dir=ltr] .moreLess, [dir=ltr] .tag {
+  margin: 0 var(--zd_size6) var(--zd_size6) 0 ;
+}
+[dir=rtl] .moreLess, [dir=rtl] .tag {
+  margin: 0 0 var(--zd_size6) var(--zd_size6) ;
+}
+.input {
+  height: var(--zd_size20) ;
+  width: 100% ;
+  margin-bottom: var(--zd_size4) ;
+}
+.viewpopNew {
+  max-height: var(--zd_size250) ;
+}
+.tagDiv {
+  max-height: var(--zd_size160) ;
+  margin-top: var(--zd_size5) ;
+}
+.hasBorder {
+  transition: border var(--zd_transition2) linear 0s;
+  border-bottom-style: solid;
+  border-bottom-width: 1px;
+}
+.borderColor_transparent {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_border);
+}
+.borderColor_transparent:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_hover_border);
+}
+.borderColor_transparent.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_transparent_active_border);
+}
+.borderColor_default {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_border);
+}
+.borderColor_default:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_hover_border);
+}
+.borderColor_default.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_default_active_border);
+}
+.borderColor_dark {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_border);
+}
+.borderColor_dark:hover {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_hover_border);
+}
+.borderColor_dark.active {
+  border-bottom-color: var(--zdt_tagsmultiselect_dark_active_border);
+}
+.moreLess {
+  color: var(--zdt_tagsmultiselect_more_text);
+  font-size: var(--zd_font_size13) ;
+  cursor: pointer;
+}
+.moreLess:hover {
+  color: var(--zdt_tagsmultiselect_more_hover_text);
+}
+.inputWrapper {
+  position: relative;
+  max-width: 100% ;
+  min-width: var(--zd_size5) ;
+  font-size: 0 ;
+}
+.newTagLabel {
+  color: var(--zdt_tagsmultiselect_labelt_text);
+  composes: semibold from '~@zohodesk/components/lib/common/common.module.css';
+}
+[dir=ltr] .newTagLabel {
+  margin-right: var(--zd_size5) ;
+}
+[dir=rtl] .newTagLabel {
+  margin-left: var(--zd_size5) ;
+}
+.dotted {
+  composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
+}
+.dropdown {
+  margin-top: var(--zd_size1) ;
+}
+.custmSpan {
+  height: var(--zd_size25) ;
+  display: inline-block;
+  vertical-align: middle;
+  opacity: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  max-width: 100% ;
+  visibility: hidden;
+}
+[dir=ltr] .custmSpan {
+  padding-right: var(--zd_size28) ;
+}
+[dir=rtl] .custmSpan {
+  padding-left: var(--zd_size28) ;
+}
+.custmInp {
+  position: absolute;
+  top: 0 ;
+  width: 100% ;
+}
+[dir=ltr] .custmInp {
+  left: 0 ;
+}
+[dir=rtl] .custmInp {
+  right: 0 ;
+}
+.newTagText {
+  color: var(--zdt_tagsmultiselect_more_text);
+}

package/es/form/fields/TagsMultiSelect/props/propTypes.js

@@ -52,8 +52,7 @@ export const propTypes = {
   customProps: PropTypes.shape({
     TextBoxIconProps: PropTypes.object,
     TagWrapperProps: PropTypes.object,
-    TagProps: PropTypes.object,
-    ListItemProps: PropTypes.object
+    TagProps: PropTypes.object
   }),
   isFocus: PropTypes.bool
 };

package/es/form/fields/TextEditorField/__tests__/__snapshots__/TextEditorField.spec.js.snap

@@ -14,7 +14,7 @@ exports[`TextEditorField rendering the defult props 1`] = `
         data-selector-id="textEditorWrapper"
       >
         <textarea
-          class="textBox  container xsmall primary needBorder noresize     effect  borderColor_default"
+          class="textBox  container xsmall  defaultWidth primary needBorder noresize     effect  borderColor_default"
           data-id="TextareaComp"
           data-selector-id="textarea"
           data-test-id="TextareaComp"

package/es/form/fields/TextEditorWrapper/__tests__/__snapshots__/TextEditorWrapper.spec.js.snap

@@ -7,7 +7,7 @@ exports[`TextEditorWrapper rendering the defult props 1`] = `
     data-selector-id="textEditorWrapper"
   >
     <textarea
-      class="textBox  container small primary needBorder noresize  smallanimated   effect  borderColor_default"
+      class="textBox  container small  defaultWidth primary needBorder noresize  smallanimated   effect  borderColor_default"
       data-id="TextareaComp"
       data-selector-id="textarea"
       data-test-id="TextareaComp"

package/es/form/fields/TextareaField/__tests__/__snapshots__/TextareaField.spec.js.snap

@@ -10,7 +10,7 @@ exports[`TextareaField rendering the defult props 1`] = `
       class="fieldContainer "
     >
       <textarea
-        class="  container xsmall primary needBorder resizeY  xsmallanimated   effect  borderColor_default"
+        class="  container xsmall  defaultWidth primary needBorder resizeY  xsmallanimated   effect  borderColor_default"
         data-id="property(undefined)"
         data-selector-id="textarea"
         data-test-id="property(undefined)"

package/es/index.js

@@ -35,6 +35,7 @@ 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 Onboarding } from "./Onboarding/Onboarding";
 export { default as PlusIcon } from "./PlusIcon/PlusIcon";
 import * as _Provider from "./Provider/Config";
 export { _Provider as Provider };

package/es/list/DepartmentDropDown/DepartmentDropDown.js

@@ -48,12 +48,8 @@ class DepartmentDropDown extends Component {
       onSearch,
       needSearchFetching,
       searchStr,
-      i18nKeys,
-      customProps
+      i18nKeys
     } = this.props;
-    const {
-      ToggleDropDownProps = {}
-    } = customProps;
     let {
       title = 'Move Department',
       searchEmptyText = 'No results found',
@@ -88,8 +84,7 @@ class DepartmentDropDown extends Component {
       getNextOptions: getNextOptions,
       isNextOptions: isNextOptions,
       onSearch: onSearch,
-      needSearchFetching: needSearchFetching,
-      ...ToggleDropDownProps
+      needSearchFetching: needSearchFetching
     });
   }
 

package/es/list/DepartmentDropDown/props/defaultProps.js

@@ -3,6 +3,5 @@ export const defaultProps = {
   isPopupActive: true,
   isNextOptions: false,
   searchStr: '',
-  i18nKeys: {},
-  customProps: {}
+  i18nKeys: {}
 };

package/es/list/DepartmentDropDown/props/propTypes.js

@@ -20,8 +20,5 @@ export const propTypes = {
     searchEmptyText: PropTypes.string,
     searchErrorText: PropTypes.string,
     placeholder: PropTypes.string
-  }),
-  customProps: PropTypes.shape({
-    ToggleDropDownProps: PropTypes.object
   })
 };

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

@@ -36,8 +36,9 @@
 .value {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
 }
-.multiLineValue {
-  composes: lineClamp from '~@zohodesk/components/lib/common/common.module.css';
+.multiLineValue{
+  word-break: break-word;
+  composes: clamp from '~@zohodesk/components/lib/common/common.module.css';
 }
 [dir=ltr] .withBorder.active {
   border-left-color: var(--zdt_statuslistitem_default_active_border);
@@ -45,6 +46,7 @@
 [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);
 }

package/es/lookup/header/Close/__tests__/__snapshots__/Close.spec.js.snap

@@ -4,7 +4,7 @@ exports[`AlphabeticList rendering the defult props 1`] = `
 <DocumentFragment>
   <button
     aria-pressed="false"
-    class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+    class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
     data-id="closeButton"
     data-ishtml="false"
     data-selector-id="iconButton"

package/es/lookup/header/TicketHeader/__tests__/__snapshots__/TicketHeader.spec.js.snap

@@ -38,7 +38,7 @@ exports[`TicketHeader rendering the defult props 1`] = `
     >
       <button
         aria-pressed="false"
-        class="buttonReset wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
+        class="buttonReset large wrapper  undefined effect default border defaultHover  hoverEffect  inflex coldir both"
         data-id="close"
         data-ishtml="false"
         data-selector-id="iconButton"

package/es/utils/General.js

@@ -42,4 +42,5 @@ export function formatPhoneUrl(phone) {
   }
 
   return phone;
-}
+}
+export const DUMMY_OBJECT = Object.freeze({});

package/es/v1/form/fields/TagsMultiSelect/TagsMultiSelect.js

@@ -164,8 +164,7 @@ export default class TagsMultiSelect extends React.Component {
     const {
       TextBoxIconProps = {},
       TagWrapperProps = {},
-      TagProps = {},
-      listProps = {}
+      TagProps = {}
     } = customProps;
     return /*#__PURE__*/React.createElement("div", {
       className: `${style.container} ${!isReadOnly ? ` ${needBorder ? style.hasBorder : ''}
@@ -299,8 +298,7 @@ export default class TagsMultiSelect extends React.Component {
           getRef: this.getSelectedItemRef,
           isDisabled: listDisabled,
           customProps: listItemProps,
-          customClass: listItemClass,
-          ...listProps
+          customClass: listItemClass
         }, isNew ? /*#__PURE__*/React.createElement(Container, {
           alignBox: "row",
           align: "vertical"

package/es/v1/form/fields/TagsMultiSelect/props/propTypes.js

@@ -52,7 +52,6 @@ export const propTypes = {
   customProps: PropTypes.shape({
     TextBoxIconProps: PropTypes.object,
     TagWrapperProps: PropTypes.object,
-    TagProps: PropTypes.object,
-    ListItemProps: PropTypes.object
+    TagProps: PropTypes.object
   })
 };

package/es/v1/list/DepartmentDropDown/DepartmentDropDown.js

@@ -21,12 +21,8 @@ function DepartmentDropDown(props) {
     searchStr,
     i18nKeys,
     onMoveDepartment,
-    getDepartment,
-    customProps
+    getDepartment
   } = props;
-  const {
-    toggleDropDownProps = {}
-  } = customProps;
   let {
     title = 'Move Department',
     searchEmptyText = 'No results found',
@@ -75,8 +71,7 @@ function DepartmentDropDown(props) {
     getNextOptions: getNextOptions,
     isNextOptions: isNextOptions,
     onSearch: onSearch,
-    needSearchFetching: needSearchFetching,
-    ...toggleDropDownProps
+    needSearchFetching: needSearchFetching
   });
 }
 

package/es/v1/list/DepartmentDropDown/props/defaultProps.js

@@ -3,6 +3,5 @@ export const defaultProps = {
   isPopupActive: true,
   isNextOptions: false,
   searchStr: '',
-  i18nKeys: {},
-  customProps: {}
+  i18nKeys: {}
 };

package/es/v1/list/DepartmentDropDown/props/propTypes.js

@@ -20,8 +20,5 @@ export const propTypes = {
     searchEmptyText: PropTypes.string,
     searchErrorText: PropTypes.string,
     placeholder: PropTypes.string
-  }),
-  customProps: PropTypes.shape({
-    toggleDropDownProps: PropTypes.object
   })
 };

package/lib/AttachmentViewer/__tests__/__snapshots__/AttachmentViewer.spec.js.snap

@@ -79,7 +79,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                   >
                     <div
                       aria-pressed="false"
-                      class="false wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
+                      class="large wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
                       data-id="iconContainer"
                       data-ishtml="false"
                       data-selector-id="iconButton"
@@ -103,7 +103,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
                 >
                   <button
                     aria-pressed="false"
-                    class="buttonReset wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
+                    class="buttonReset large wrapper menuIcon undefined effect default border borderHover  hoverEffect  inflex coldir both"
                     data-id="iconContainer"
                     data-ishtml="false"
                     data-selector-id="iconButton"
@@ -361,7 +361,7 @@ exports[`AttachmentViewer rendering the when isActive is true  1`] = `
         </div>
         <button
           aria-pressed="false"
-          class="buttonReset wrapper button undefined effect default border borderHover  hoverEffect  inflex coldir both"
+          class="buttonReset large wrapper button undefined effect default border borderHover  hoverEffect  inflex coldir both"
           data-id="attachToggle"
           data-ishtml="false"
           data-selector-id="iconButton"

package/lib/DotProvider/libraryChunks/appearance/component/Dark_Component.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("@zohodesk/components/assets/Appearance/dark/mode/Component_DarkMode.module.css");
+
+require("@zohodesk/components/assets/Appearance/dark/mode/Component_v2_DarkMode.module.css");

package/lib/DotProvider/libraryChunks/appearance/component/Light_Component.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("@zohodesk/components/assets/Appearance/light/mode/Component_LightMode.module.css");
+
+require("@zohodesk/components/assets/Appearance/light/mode/Component_v2_LightMode.module.css");

package/lib/DotProvider/libraryChunks/appearance/component/PureDark_Component.js

@@ -0,0 +1,5 @@
+"use strict";
+
+require("@zohodesk/components/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css");
+
+require("@zohodesk/components/assets/Appearance/pureDark/mode/Component_v2_PureDarkMode.module.css");

package/lib/DotProvider/utils/themeAppearanceAssetsConfig.js

@@ -20,17 +20,17 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var themeAppearanceImports = {
   Lib_LightMode_Component: function Lib_LightMode_Component() {
     return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('@zohodesk/components/assets/Appearance/light/mode/Component_LightMode.module.css'));
+      return _interopRequireWildcard(require("../libraryChunks/appearance/component/Light_Component"));
     });
   },
   Lib_DarkMode_Component: function Lib_DarkMode_Component() {
     return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('@zohodesk/components/assets/Appearance/dark/mode/Component_DarkMode.module.css'));
+      return _interopRequireWildcard(require("../libraryChunks/appearance/component/Dark_Component"));
     });
   },
   Lib_PureDarkMode_Component: function Lib_PureDarkMode_Component() {
     return Promise.resolve().then(function () {
-      return _interopRequireWildcard(require('@zohodesk/components/assets/Appearance/pureDark/mode/Component_PureDarkMode.module.css'));
+      return _interopRequireWildcard(require("../libraryChunks/appearance/component/PureDark_Component"));
     });
   },
   Lib_LightMode_Dot: function Lib_LightMode_Dot() {

package/lib/IconButton/IconButton.js

@@ -122,6 +122,7 @@ var IconButton = /*#__PURE__*/function (_React$Component) {
       var _this$props4 = this.props,
           palette = _this$props4.palette,
           iconSize = _this$props4.iconSize,
+          size = _this$props4.size,
           iconName = _this$props4.iconName,
           className = _this$props4.className,
           iconClass = _this$props4.iconClass,
@@ -163,7 +164,7 @@ var IconButton = /*#__PURE__*/function (_React$Component) {
         tourId: tourId,
         align: "both",
         isCover: false,
-        className: "".concat(needButtonTag && _semanticButtonModule["default"].buttonReset, " ").concat(_IconButtonModule["default"].wrapper, " ").concat(className ? className : '', " ").concat(isActive ? _IconButtonModule["default"]["".concat(palette, "_active")] : _IconButtonModule["default"][palette]),
+        className: "".concat(needButtonTag ? _semanticButtonModule["default"].buttonReset : '', " ").concat(_IconButtonModule["default"][size], " ").concat(_IconButtonModule["default"].wrapper, " ").concat(className || '', " ").concat(isActive ? _IconButtonModule["default"]["".concat(palette, "_active")] : _IconButtonModule["default"][palette]),
         dataId: dataId,
         dataSelectorId: dataSelectorId,
         onClick: this.triggerClick,

package/lib/IconButton/IconButton.module.css

@@ -1,22 +1,49 @@
 .varClass {
   --iconColor: var(--zdt_iconButton_icon_black);
 }
+
 .wrapper {
-  height: var(--zd_size28) ;
-  width: var(--zd_size28) ;
   composes: offSelection from '~@zohodesk/components/lib/common/common.module.css';
   composes: varClass;
   color: var(--iconColor);
   cursor: pointer;
 }
+
+.xsmall {
+  width: var(--zd_size16) ;
+  height: var(--zd_size16) ;
+}
+
+.small {
+  width: var(--zd_size20) ;
+  height: var(--zd_size20) ;
+}
+
+.medium {
+  width: var(--zd_size24) ;
+  height: var(--zd_size24) ;
+}
+
+.large {
+  width: var(--zd_size28) ;
+  height: var(--zd_size28) ;
+}
+
+.xlarge {
+  width: var(--zd_size32) ;
+  height: var(--zd_size32) ;
+}
+
 .primary {
   --iconColor: var(--zdt_iconButton_icon_primary);
 }
+
 .primary:hover {
   --iconColor: var(--zdt_iconButton_icon_primaryHover);
 }
+
 .primary_active,
 .primaryFilled,
 .primaryFilled_active {
   --iconColor: var(--zdt_iconButton_icon_primaryActive);
-}
+}