@zohodesk/dot 1.5.4 → 1.6.0

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

@@ -77,20 +77,20 @@
   background-color: transparent;
 }
 
-.small :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
-.small :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel,
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel,
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel,
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel {
+.small :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover,
+.small :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel,
+.medium :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover,
+.medium :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel,
+.large :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover,
+.large :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel,
+.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover,
+.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel,
+.default :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover,
+.default :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel {
   color: var(--zdt_texteditor_default_text);
 }
 
-.small :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .small :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .medium :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .medium :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .large :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .large :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li:hover, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li.KB_Editor_sel {
+.small :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover, .small :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel, .medium :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover, .medium :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel, .large :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover, .large :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover, .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel, .default :global .KB_Editor_menus .KB_Editor_MultiTools>li:hover, .default :global .KB_Editor_menus .KB_Editor_MultiTools>li.KB_Editor_sel {
   background-color: var(--zdt_texteditor_menu_li_bg);
 }
 
@@ -101,10 +101,10 @@
 /* large type editor - ticket add form editor */
 .large :global .KB_Editor,
 .large :global .KB_Editor_menus .KB_Editor_MultiTools,
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li,
+.large :global .KB_Editor_menus .KB_Editor_MultiTools>li,
 .default :global .KB_Editor,
 .default :global .KB_Editor_menus .KB_Editor_MultiTools,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -160,24 +160,24 @@
   min-height: inherit ;
 }
 
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li,
-.default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.large :global .KB_Editor_menus .KB_Editor_MultiTools>li,
+.default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
 }
 
-.large :global .KB_Editor_menus .KB_Editor_MultiTools > li, .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.large :global .KB_Editor_menus .KB_Editor_MultiTools>li, .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   padding: 0 ;
   float: unset;
 }
 
-[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-right: 0 ;
 }
 
-[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-left: 0 ;
 }
 
@@ -190,14 +190,14 @@
   float: unset !important;
 }
 
-.large :global .KB_Editor_menus > ul > li > span > svg,
-.default :global .KB_Editor_menus > ul > li > span > svg {
+.large :global .KB_Editor_menus>ul>li>span>svg,
+.default :global .KB_Editor_menus>ul>li>span>svg {
   width: var(--zd_size28) ;
   height: var(--zd_size28) ;
 }
 
-.large :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg,
-.default :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+.large :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg,
+.default :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
   width: var(--zd_size8) ;
   height: var(--zd_size8) ;
 }
@@ -241,18 +241,18 @@
   left: 0 ;
 }
 
-[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=ltr] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=ltr] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-right: var(--zd_size2) ;
 }
 
-[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools > li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=rtl] .large :global .KB_Editor_menus .KB_Editor_MultiTools>li, [dir=rtl] .default :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-left: var(--zd_size2) ;
 }
 
 /* xlarge type editor - reply area, blue print cases - full height hover style */
 .xlarge :global .KB_Editor,
 .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools,
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -293,7 +293,7 @@
   min-height: inherit ;
 }
 
-.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -302,11 +302,11 @@
   float: unset;
 }
 
-[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=ltr] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-right: 0 ;
 }
 
-[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+[dir=rtl] .xlarge :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   margin-left: 0 ;
 }
 
@@ -324,12 +324,12 @@
   padding: var(--zd_size6) ;
 }
 
-.xlarge :global .KB_Editor_menus > ul > li > span > svg {
+.xlarge :global .KB_Editor_menus>ul>li>span>svg {
   width: var(--zd_size22) ;
   height: var(--zd_size22) ;
 }
 
-.xlarge :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+.xlarge :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
   width: var(--zd_size8) ;
   height: var(--zd_size8) ;
 }
@@ -354,13 +354,13 @@
   left: 0 ;
 }
 
-.xlarge :global .KB_Editor_menus > ul > li > span.SnippetIcon svg {
+.xlarge :global .KB_Editor_menus>ul>li>span.SnippetIcon svg {
   width: var(--zd_size17) ;
   height: var(--zd_size21) ;
   padding: 0 var(--zd_size7) ;
 }
 
-.xlarge :global .KB_Editor_menus > ul > li > span.TemplateIcon svg {
+.xlarge :global .KB_Editor_menus>ul>li>span.TemplateIcon svg {
   width: var(--zd_size16) ;
   height: var(--zd_size16) ;
   padding: 0 var(--zd_size9) ;
@@ -393,31 +393,16 @@
   padding: 0 var(--zd_size7) ;
 }
 
-.xlarge :global .KB_Editor_MultiTools li .Kbeditor_more_icon > svg {
+.xlarge :global .KB_Editor_MultiTools li .Kbeditor_more_icon>svg {
   width: var(--zd_size12) ;
   height: var(--zd_size12) ;
 }
 
-.xlarge
-  :global
-  .KB_Editor_menus
-  > ul
-  > li
-  > span:not(.KB_Editor_Bdr_div):not(.KBEditortools-Block-down-arrow):not(.Kbeditor_more_icon):not(.SnippetIcon):not(
-    .TemplateIcon
-  ):not(.KB_Editor_Richtext):not(.KB_Editor_PlainText) {
+.xlarge :global .KB_Editor_menus>ul>li>span:not(.KB_Editor_Bdr_div):not(.KBEditortools-Block-down-arrow):not(.Kbeditor_more_icon):not(.SnippetIcon):not(.TemplateIcon):not(.KB_Editor_Richtext):not(.KB_Editor_PlainText) {
   height: var(--zd_size21) ;
 }
 
-.xlarge
-  :global
-  .KB_Editor_menus
-  > ul
-  > li
-  > span:not(.KB_Editor_Bdr_div):not(.KBEditortools-Block-down-arrow):not(.Kbeditor_more_icon):not(.SnippetIcon):not(
-    .TemplateIcon
-  )
-  > svg {
+.xlarge :global .KB_Editor_menus>ul>li>span:not(.KB_Editor_Bdr_div):not(.KBEditortools-Block-down-arrow):not(.Kbeditor_more_icon):not(.SnippetIcon):not(.TemplateIcon)>svg {
   width: var(--zd_size21) ;
   height: var(--zd_size21) ;
   padding: 0 var(--zd_size4) ;
@@ -442,7 +427,7 @@
 /* medium type editor - snippet, bug tracker cases */
 .medium :global .KB_Editor,
 .medium :global .KB_Editor_menus .KB_Editor_MultiTools,
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.medium :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
@@ -483,7 +468,7 @@
   min-height: inherit ;
 }
 
-.medium :global .KB_Editor_menus .KB_Editor_MultiTools > li {
+.medium :global .KB_Editor_menus .KB_Editor_MultiTools>li {
   height: unset;
   -webkit-box-align: center;
   -ms-flex-align: center;
@@ -496,21 +481,21 @@
   line-height: 0;
 }
 
-.medium :global .KB_Editor_menus > ul > li > span > svg {
+.medium :global .KB_Editor_menus>ul>li>span>svg {
   width: var(--zd_size22) ;
   height: var(--zd_size22) ;
 }
 
-.medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+.medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
   width: var(--zd_size8) ;
   height: var(--zd_size8) ;
 }
 
-[dir=ltr] .medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+[dir=ltr] .medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
   padding: 0 0 0 var(--zd_size2) ;
 }
 
-[dir=rtl] .medium :global .KB_Editor_menus > ul > li > span.KB_Editor_Bdr_div > svg {
+[dir=rtl] .medium :global .KB_Editor_menus>ul>li>span.KB_Editor_Bdr_div>svg {
   padding: 0 var(--zd_size2) 0 0 ;
 }
 
@@ -547,7 +532,7 @@
   padding: 0 var(--zd_size3) ;
 }
 
-.medium :global .KB_Editor_MultiTools li .Kbeditor_more_icon > svg {
+.medium :global .KB_Editor_MultiTools li .Kbeditor_more_icon>svg {
   width: var(--zd_size12) ;
   height: var(--zd_size12) ;
 }
@@ -627,13 +612,13 @@
   line-height: 0;
 }
 
-.small :global .KB_Editor_menus > ul > li > span > svg,
-.mini :global .KB_Editor_menus > ul > li > span > svg {
+.small :global .KB_Editor_menus>ul>li>span>svg,
+.mini :global .KB_Editor_menus>ul>li>span>svg {
   width: var(--zd_size25) ;
   height: var(--zd_size25) ;
 }
 
-.small :global .KB_Editor_menus > ul > li > span > svg, .mini :global .KB_Editor_menus > ul > li > span > svg {
+.small :global .KB_Editor_menus>ul>li>span>svg, .mini :global .KB_Editor_menus>ul>li>span>svg {
   padding: 0 var(--zd_size6) ;
 }
 
@@ -745,8 +730,12 @@
   order: 100;
 }
 
+.disable,
 .readOnly {
   position: relative;
+}
+
+.disable, .readOnly {
   cursor: not-allowed;
 }
 
@@ -770,6 +759,29 @@
   display: none !important;
 }
 
+.disable :global .KB_Editor_menus {
+  position: relative;
+}
+
+.disable :global .KB_Editor_menus::after {
+  content: '';
+  position: absolute;
+  top: 0 ;
+  bottom: 0 ;
+  z-index: 1;
+  cursor: not-allowed;
+}
+
+[dir=ltr] .disable :global .KB_Editor_menus::after {
+  left: 0 ;
+  right: 0 ;
+}
+
+[dir=rtl] .disable :global .KB_Editor_menus::after {
+  right: 0 ;
+  left: 0 ;
+}
+
 .editorHide :global .KB_Editor {
   position: absolute !important;
   top: 0 ;
@@ -784,4 +796,4 @@
 
 [dir=rtl] .editorHide :global .KB_Editor {
   right: 0 ;
-}
+}

package/lib/form/fields/TextEditor/__tests__/__snapshots__/TextEditor.spec.js.snap

@@ -4,7 +4,7 @@ exports[`TextEditor rendering the defult props 1`] = `
 <DocumentFragment>
   <div
     class="textEditor large borderTop
-        light  editorHide flex cover coldir"
+        light   editorHide flex cover coldir"
     data-id="containerComponent"
     data-iseditor="true"
     data-selector-id="textEditor"

package/lib/form/fields/TextEditor/props/defaultProps.js

@@ -15,6 +15,9 @@ var defaultProps = {
   needInlineAttachment: false,
   isNightMode: false,
   isReadOnly: false,
-  dataSelectorId: 'textEditor'
+  dataSelectorId: 'textEditor',
+  customCSS: '',
+  isDisabled: false,
+  inlineImageProps: {}
 };
 exports.defaultProps = defaultProps;

package/lib/form/fields/TextEditor/props/propTypes.js

@@ -22,7 +22,6 @@ var propTypes = {
   fontSize: _propTypes["default"].string,
   getRef: _propTypes["default"].func,
   handleAlertMessage: _propTypes["default"].func,
-  handleDropUpload: _propTypes["default"].func,
   i18nKeys: _propTypes["default"].shape({
     fileUploadError: _propTypes["default"].string,
     fileNotSupported: _propTypes["default"].string,
@@ -31,7 +30,7 @@ var propTypes = {
     fileSizeLimitExceed: _propTypes["default"].string
   }),
   id: _propTypes["default"].string,
-  initCallback: _propTypes["default"].func.isRequired,
+  initCallback: _propTypes["default"].func,
   isCustomScroll: _propTypes["default"].bool,
   loadingComponent: _propTypes["default"].node,
   mode: _propTypes["default"].string,
@@ -52,6 +51,14 @@ var propTypes = {
   getCSRFCookie: _propTypes["default"].string,
   isEditorDefaultOpen: _propTypes["default"].bool,
   toggleEdit: _propTypes["default"].func,
-  dataSelectorId: _propTypes["default"].string
+  dataSelectorId: _propTypes["default"].string,
+  customInitOption: _propTypes["default"].object,
+  customCSS: _propTypes["default"].string,
+  isDisabled: _propTypes["default"].bool,
+  inlineImageProps: _propTypes["default"].shape({
+    allowedFileExtensions: _propTypes["default"].array,
+    fileNameMaxCharacters: _propTypes["default"].number,
+    fileSizeMaxBytes: _propTypes["default"].number
+  })
 };
 exports.propTypes = propTypes;

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

@@ -240,6 +240,10 @@ var StatusDropdown = /*#__PURE__*/function (_React$Component) {
           needMultiLineText = _this$props4.needMultiLineText,
           isFetchingOptions = _this$props4.isFetchingOptions,
           getNextOptions = _this$props4.getNextOptions,
+          isAbsolutePositioningNeeded = _this$props4.isAbsolutePositioningNeeded,
+          isRestrictScroll = _this$props4.isRestrictScroll,
+          positionsOffset = _this$props4.positionsOffset,
+          targetOffset = _this$props4.targetOffset,
           _this$props4$a11y = _this$props4.a11y,
           a11y = _this$props4$a11y === void 0 ? {} : _this$props4$a11y;
       var _a11y$tabIndex = a11y.tabIndex,
@@ -307,6 +311,10 @@ var StatusDropdown = /*#__PURE__*/function (_React$Component) {
           needFocusScope: true,
           onClose: _this2.handleTogglePopup,
           dataId: "".concat(dataId, "_dropbox"),
+          isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+          isRestrictScroll: isRestrictScroll,
+          positionsOffset: positionsOffset,
+          targetOffset: targetOffset,
           customProps: {
             focusScopeProps: {
               loadNextOptions: getNextOptions,

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

@@ -22,6 +22,8 @@ var defaultProps = {
   needExternalPopupState: false,
   statusColor: 'statusColor',
   needMultiLineText: false,
-  isFetchingOptions: false
+  isFetchingOptions: false,
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false
 };
 exports.defaultProps = defaultProps;

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

@@ -30,5 +30,5 @@ var propTypes = (_propTypes = {
   idName: _propTypes2["default"].string,
   isArrow: _propTypes2["default"].bool,
   isDataLoaded: _propTypes2["default"].bool
-}, _defineProperty(_propTypes, "isDataLoaded", _propTypes2["default"].bool), _defineProperty(_propTypes, "isDisabled", _propTypes2["default"].bool), _defineProperty(_propTypes, "isEditable", _propTypes2["default"].bool), _defineProperty(_propTypes, "isFetchingOptions", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupActive", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupOpen", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupReady", _propTypes2["default"].bool), _defineProperty(_propTypes, "isReadOnly", _propTypes2["default"].bool), _defineProperty(_propTypes, "isSearch", _propTypes2["default"].bool), _defineProperty(_propTypes, "keyName", _propTypes2["default"].string), _defineProperty(_propTypes, "left", _propTypes2["default"].number), _defineProperty(_propTypes, "needExternalPopupState", _propTypes2["default"].bool), _defineProperty(_propTypes, "needResponsive", _propTypes2["default"].bool), _defineProperty(_propTypes, "needTick", _propTypes2["default"].bool), _defineProperty(_propTypes, "onClick", _propTypes2["default"].func), _defineProperty(_propTypes, "onTogglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "options", _propTypes2["default"].array.isRequired), _defineProperty(_propTypes, "placeHolderText", _propTypes2["default"].string), _defineProperty(_propTypes, "position", _propTypes2["default"].string), _defineProperty(_propTypes, "removeClose", _propTypes2["default"].func), _defineProperty(_propTypes, "right", _propTypes2["default"].number), _defineProperty(_propTypes, "searchBoxSize", _propTypes2["default"].oneOf(['small', 'medium', 'xmedium'])), _defineProperty(_propTypes, "searchEmptyHint", _propTypes2["default"].string), _defineProperty(_propTypes, "searchErrorText", _propTypes2["default"].string), _defineProperty(_propTypes, "showIconOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "showOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "statusColor", _propTypes2["default"].string), _defineProperty(_propTypes, "targetAlign", _propTypes2["default"].oneOf(['vertical', 'horizontal', 'both', 'top', 'right', 'bottom', 'left', 'between', 'around'])), _defineProperty(_propTypes, "title", _propTypes2["default"].string), _defineProperty(_propTypes, "togglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "value", _propTypes2["default"].node), _defineProperty(_propTypes, "needMultiLineText", _propTypes2["default"].bool), _defineProperty(_propTypes, "onSelectLabel", _propTypes2["default"].func), _defineProperty(_propTypes, "top", _propTypes2["default"].number), _defineProperty(_propTypes, "a11y", _propTypes2["default"].object), _propTypes);
+}, _defineProperty(_propTypes, "isDataLoaded", _propTypes2["default"].bool), _defineProperty(_propTypes, "isDisabled", _propTypes2["default"].bool), _defineProperty(_propTypes, "isEditable", _propTypes2["default"].bool), _defineProperty(_propTypes, "isFetchingOptions", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupActive", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupOpen", _propTypes2["default"].bool), _defineProperty(_propTypes, "isPopupReady", _propTypes2["default"].bool), _defineProperty(_propTypes, "isReadOnly", _propTypes2["default"].bool), _defineProperty(_propTypes, "isSearch", _propTypes2["default"].bool), _defineProperty(_propTypes, "keyName", _propTypes2["default"].string), _defineProperty(_propTypes, "left", _propTypes2["default"].number), _defineProperty(_propTypes, "needExternalPopupState", _propTypes2["default"].bool), _defineProperty(_propTypes, "needResponsive", _propTypes2["default"].bool), _defineProperty(_propTypes, "needTick", _propTypes2["default"].bool), _defineProperty(_propTypes, "onClick", _propTypes2["default"].func), _defineProperty(_propTypes, "onTogglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "options", _propTypes2["default"].array.isRequired), _defineProperty(_propTypes, "placeHolderText", _propTypes2["default"].string), _defineProperty(_propTypes, "position", _propTypes2["default"].string), _defineProperty(_propTypes, "removeClose", _propTypes2["default"].func), _defineProperty(_propTypes, "right", _propTypes2["default"].number), _defineProperty(_propTypes, "searchBoxSize", _propTypes2["default"].oneOf(['small', 'medium', 'xmedium'])), _defineProperty(_propTypes, "searchEmptyHint", _propTypes2["default"].string), _defineProperty(_propTypes, "searchErrorText", _propTypes2["default"].string), _defineProperty(_propTypes, "showIconOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "showOnHover", _propTypes2["default"].bool), _defineProperty(_propTypes, "statusColor", _propTypes2["default"].string), _defineProperty(_propTypes, "targetAlign", _propTypes2["default"].oneOf(['vertical', 'horizontal', 'both', 'top', 'right', 'bottom', 'left', 'between', 'around'])), _defineProperty(_propTypes, "title", _propTypes2["default"].string), _defineProperty(_propTypes, "togglePopup", _propTypes2["default"].func), _defineProperty(_propTypes, "value", _propTypes2["default"].node), _defineProperty(_propTypes, "needMultiLineText", _propTypes2["default"].bool), _defineProperty(_propTypes, "onSelectLabel", _propTypes2["default"].func), _defineProperty(_propTypes, "top", _propTypes2["default"].number), _defineProperty(_propTypes, "a11y", _propTypes2["default"].object), _defineProperty(_propTypes, "isAbsolutePositioningNeeded", _propTypes2["default"].bool), _defineProperty(_propTypes, "isRestrictScroll", _propTypes2["default"].bool), _defineProperty(_propTypes, "positionsOffset", _propTypes2["default"].object), _defineProperty(_propTypes, "targetOffset", _propTypes2["default"].object), _propTypes);
 exports.propTypes = propTypes;

package/lib/lookup/header/ViewDropDown/ViewDropDown.js

@@ -118,7 +118,11 @@ var DropDown = /*#__PURE__*/function (_SelectComponent) {
           searchBoxVariant = _this$props.searchBoxVariant,
           searchBoxPlaceHolder = _this$props.searchBoxPlaceHolder,
           maxLength = _this$props.maxLength,
-          dataId = _this$props.dataId;
+          dataId = _this$props.dataId,
+          isAbsolutePositioningNeeded = _this$props.isAbsolutePositioningNeeded,
+          isRestrictScroll = _this$props.isRestrictScroll,
+          positionsOffset = _this$props.positionsOffset,
+          targetOffset = _this$props.targetOffset;
       var _this$state = this.state,
           hoverIndex = _this$state.hoverIndex,
           selected = _this$state.selected,
@@ -161,7 +165,11 @@ var DropDown = /*#__PURE__*/function (_SelectComponent) {
           size: "large",
           alignBox: "row",
           isResponsivePadding: true,
-          dataId: "".concat(dataId, "_dropbox")
+          dataId: "".concat(dataId, "_dropbox"),
+          isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+          isRestrictScroll: isRestrictScroll,
+          positionsOffset: positionsOffset,
+          targetOffset: targetOffset
         }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
           flexible: true
         }, /*#__PURE__*/_react["default"].createElement(_Card.Card, null, needSearch ? /*#__PURE__*/_react["default"].createElement(_Card.CardHeader, null, /*#__PURE__*/_react["default"].createElement(_DropDownSearch["default"], {

package/lib/lookup/header/ViewDropDown/props/defaultProps.js

@@ -10,6 +10,8 @@ var defaultProps = {
   needSearch: true,
   textField: 'text',
   valueField: 'id',
-  dataId: 'ViewDropDown'
+  dataId: 'ViewDropDown',
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false
 };
 exports.defaultProps = defaultProps;

package/lib/lookup/header/ViewDropDown/props/propTypes.js

@@ -29,6 +29,10 @@ var propTypes = {
   animationStyle: _propTypes["default"].string,
   searchBoxSize: _propTypes["default"].string,
   searchBoxVariant: _propTypes["default"].string,
-  maxLength: _propTypes["default"].string
+  maxLength: _propTypes["default"].string,
+  isAbsolutePositioningNeeded: _propTypes["default"].bool,
+  isRestrictScroll: _propTypes["default"].bool,
+  positionsOffset: _propTypes["default"].object,
+  targetOffset: _propTypes["default"].object
 };
 exports.propTypes = propTypes;

package/lib/utils/editorUtils.js

@@ -15,8 +15,8 @@ exports.isImageFormat = isImageFormat;
 exports.loadResource = loadResource;
 exports.triggerKeyup = triggerKeyup;
 exports.validateEditorContentOnInsertHtml = validateEditorContentOnInsertHtml;
-var ATTACHMENT_FILE_NAME_SIZE_LIMIT = 200; // editorUtils
 
+// editorUtils
 function editorContentValidate(editorObj) {
   var content = editorObj && editorObj.getContent && editorObj.getContent() || '';
 
@@ -67,13 +67,14 @@ function encodeForHtml(str) {
 } // attachment
 
 
-function isFileNameSizeInvalid(fileName) {
-  return fileName.length > ATTACHMENT_FILE_NAME_SIZE_LIMIT;
+function isFileNameSizeInvalid(fileName, fileNameMaxCharacters) {
+  return fileName.length > fileNameMaxCharacters;
 }
 
-function isImageFormat(fileName) {
+function isImageFormat(fileName, allowedFileExtensions) {
   var extension = getExtensionFromFileName(fileName);
-  return /jpeg|jpg|png|gif|bmp|ico/i.test(extension);
+  var isValidExtension = allowedFileExtensions.includes(extension);
+  return isValidExtension;
 }
 
 function getExtensionFromFileName(fileName) {

package/lib/v1/ActionButton/ActionButton.js

@@ -59,7 +59,11 @@ function ActionButton(props) {
       popupGroup = props.popupGroup,
       togglePopup = props.togglePopup,
       defaultPosition = props.defaultPosition,
-      openPopupOnly = props.openPopupOnly;
+      openPopupOnly = props.openPopupOnly,
+      isAbsolutePositioningNeeded = props.isAbsolutePositioningNeeded,
+      isRestrictScroll = props.isRestrictScroll,
+      positionsOffset = props.positionsOffset,
+      targetOffset = props.targetOffset;
 
   var handleTogglePopup = function handleTogglePopup(e) {
     togglePopup(e, defaultPosition);
@@ -145,7 +149,11 @@ function ActionButton(props) {
     popupGroup: popupGroup,
     needFocusScope: true,
     onClose: handleTogglePopup,
-    dataId: "".concat(dataId, "_dropbox")
+    dataId: "".concat(dataId, "_dropbox"),
+    isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+    isRestrictScroll: isRestrictScroll,
+    positionsOffset: positionsOffset,
+    targetOffset: targetOffset
   }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
     flexible: true,
     shrink: true,

package/lib/v1/ActionButton/props/defaultProps.js

@@ -19,6 +19,8 @@ var defaultProps = {
   isBoxPaddingNeed: true,
   palette: 'primaryFilled',
   removeChildrenTooltip: false,
-  innerClassName: ''
+  innerClassName: '',
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false
 };
 exports.defaultProps = defaultProps;

package/lib/v1/ActionButton/props/propTypes.js

@@ -39,6 +39,10 @@ var propTypes = {
   innerClassName: _propTypes["default"].string,
   popupGroup: _propTypes["default"].string,
   togglePopup: _propTypes["default"].func,
-  openPopupOnly: _propTypes["default"].func
+  openPopupOnly: _propTypes["default"].func,
+  isAbsolutePositioningNeeded: _propTypes["default"].bool,
+  isRestrictScroll: _propTypes["default"].bool,
+  positionsOffset: _propTypes["default"].object,
+  targetOffset: _propTypes["default"].object
 };
 exports.propTypes = propTypes;

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

@@ -208,6 +208,10 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
           handleSelectAll = _this$props3.handleSelectAll,
           selectAllText = _this$props3.selectAllText,
           needSelectAll = _this$props3.needSelectAll,
+          isAbsolutePositioningNeeded = _this$props3.isAbsolutePositioningNeeded,
+          isRestrictScroll = _this$props3.isRestrictScroll,
+          positionsOffset = _this$props3.positionsOffset,
+          targetOffset = _this$props3.targetOffset,
           customClass = _this$props3.customClass,
           customProps = _this$props3.customProps;
       var showAll = this.state.showAll;
@@ -304,7 +308,11 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
           },
           dataId: "".concat(dataId, "_dropbox"),
           isResponsivePadding: true,
-          alignBox: "row"
+          alignBox: "row",
+          isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+          isRestrictScroll: isRestrictScroll,
+          positionsOffset: positionsOffset,
+          targetOffset: targetOffset
         }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {
           flexible: true
         }, needSelectAll ? /*#__PURE__*/_react["default"].createElement(_MultiSelectHeader["default"], {

package/lib/v1/form/fields/TagsMultiSelect/props/defaultProps.js

@@ -15,6 +15,8 @@ var defaultProps = {
   clickableTag: false,
   dataSelectorId: 'tagsMultiSelectField',
   needSelectAll: false,
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false,
   customClass: {},
   customProps: {}
 };

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

@@ -54,6 +54,10 @@ var propTypes = {
   handleSelectAll: _propTypes["default"].func,
   selectAllText: _propTypes["default"].string,
   needSelectAll: _propTypes["default"].bool,
+  isAbsolutePositioningNeeded: _propTypes["default"].bool,
+  isRestrictScroll: _propTypes["default"].bool,
+  positionsOffset: _propTypes["default"].object,
+  targetOffset: _propTypes["default"].object,
   customClass: _propTypes["default"].object,
   customProps: _propTypes["default"].shape({
     TextBoxIconProps: _propTypes["default"].object,

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

@@ -89,7 +89,11 @@ var TagsMultiSelectField = function TagsMultiSelectField(props) {
       ePhiData = props.ePhiData,
       customProps = props.customProps,
       clickableTag = props.clickableTag,
-      dataSelectorId = props.dataSelectorId;
+      dataSelectorId = props.dataSelectorId,
+      isAbsolutePositioningNeeded = props.isAbsolutePositioningNeeded,
+      isRestrictScroll = props.isRestrictScroll,
+      positionsOffset = props.positionsOffset,
+      targetOffset = props.targetOffset;
   var _customProps$LabelPro = customProps.LabelProps,
       LabelProps = _customProps$LabelPro === void 0 ? {} : _customProps$LabelPro,
       _customProps$TagsMult = customProps.TagsMultiSelectProps,
@@ -283,7 +287,11 @@ var TagsMultiSelectField = function TagsMultiSelectField(props) {
     borderColor: borderColor,
     htmlId: htmlId,
     getTextBoxChildren: getTextBoxChildren,
-    className: containerClass
+    className: containerClass,
+    isAbsolutePositioningNeeded: isAbsolutePositioningNeeded,
+    isRestrictScroll: isRestrictScroll,
+    positionsOffset: positionsOffset,
+    targetOffset: targetOffset
   }, TagsMultiSelectProps, {
     clickableTag: clickableTag
   })), validationMessage && /*#__PURE__*/_react["default"].createElement(_ValidationMessage["default"], _extends({

package/lib/v1/form/fields/TagsMultiSelectField/props/defaultProps.js

@@ -30,7 +30,9 @@ var defaultProps = _objectSpread({
   i18nKeys: {},
   numberOfDisplayedValues: '5',
   customProps: {},
-  dataSelectorId: 'tagsMultiSelectField'
+  dataSelectorId: 'tagsMultiSelectField',
+  isAbsolutePositioningNeeded: true,
+  isRestrictScroll: false
 }, (0, _FieldCommonDefaultProps.FieldCommonDefaultProps)());
 
 exports.defaultProps = defaultProps;