@zohodesk/dot 1.0.0-temp-199 → 1.0.0-temp-187.2

package/README.md

@@ -2,6 +2,10 @@
 
 In this Library, we Provide Some Basic Components to Build Your Application
 
+# 1.7.1
+
+- **Drawer** - The customDrawerClass prop is now supported to customize the drawer size.
+
 # 1.7.0
 
 - **DotProvider** - Introduced `DotProvider` component.

package/es/Drawer/Drawer.js

@@ -149,7 +149,8 @@ export default class Drawer extends React.Component {
       onClose,
       needFocusScope,
       customProps,
-      a11y
+      a11y,
+      customDrawerClass
     } = this.props;
     const {
       focusScopeProps = {}
@@ -174,7 +175,7 @@ export default class Drawer extends React.Component {
       return child;
     });
     let content = /*#__PURE__*/React.createElement(Box, {
-      className: `${style.container} ${style.columns} ${style.drawerModal} ${uptoTablet ? style.mbleSize : style[size]}`,
+      className: `${style.container} ${style.columns} ${style.drawerModal} ${uptoTablet ? style.mbleSize : style[size]} ${customDrawerClass}`,
       "data-a11y-need-focus-style": "false",
       tabindex: -1,
       eleRef: this.createRef,
@@ -281,8 +282,4 @@ export default class Drawer extends React.Component {
 
 }
 Drawer.propTypes = Drawer_propTypes;
-Drawer.defaultProps = Drawer_defaultProps; // if (__DOCS__) {
-//   Drawer.docs = {
-//     componentGroup: 'Template'
-//   };
-// }
+Drawer.defaultProps = Drawer_defaultProps;

package/es/Drawer/__tests__/__snapshots__/Drawer.spec.js.snap

@@ -12,7 +12,7 @@ exports[`Drawer rendering the isActive true 1`] = `
     style="z-index: 4;"
   >
     <div
-      class="container columns drawerModal small shrinkOff"
+      class="container columns drawerModal small  shrinkOff"
       data-a11y-need-focus-style="false"
       data-id="boxComponent"
       data-selector-id="box"

package/es/Drawer/props/defaultProps.js

@@ -15,6 +15,7 @@ export const Drawer_defaultProps = {
   subDrawerActive: false,
   subDrawerClass: '',
   customClass: '',
+  customDrawerClass: '',
   needAutoZindex: true,
   onBodyClick: () => {},
   needFocusScope: false,

package/es/Drawer/props/propTypes.js

@@ -32,6 +32,7 @@ export const Footer_propTypes = {
 export const Drawer_propTypes = {
   children: PropTypes.node,
   customClass: PropTypes.string,
+  customDrawerClass: PropTypes.string,
   forwardRef: PropTypes.object,
   isActive: PropTypes.bool,
   needAutoZindex: PropTypes.bool,

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

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

package/es/list/DepartmentDropDown/DepartmentDropDown.js

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

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

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

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

@@ -20,5 +20,6 @@ export const propTypes = {
     searchEmptyText: PropTypes.string,
     searchErrorText: PropTypes.string,
     placeholder: PropTypes.string
-  })
+  }),
+  customProps: PropTypes.string
 };

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

@@ -6,43 +6,58 @@
   min-height: var(--zd_size35) ;
   cursor: pointer;
 }
+
 [dir=ltr] .withBorder {
   border-left: 1px solid var(--zdt_statuslistitem_default_border);
 }
+
 [dir=rtl] .withBorder {
   border-right: 1px solid var(--zdt_statuslistitem_default_border);
 }
+
 [dir=ltr] .small {
   padding: var(--zd_size7) var(--zd_size3) var(--zd_size7) var(--zd_size5) ;
 }
+
 [dir=rtl] .small {
   padding: var(--zd_size7) var(--zd_size5) var(--zd_size7) var(--zd_size3) ;
 }
+
 .medium {
   padding: var(--zd_size7) var(--zd_size20) ;
 }
+
 .large {
   height: var(--zd_size48) ;
 }
+
 [dir=ltr] .large {
   padding: var(--zd_size10) var(--zd_size3) var(--zd_size10) var(--zd_size25) ;
 }
+
 [dir=rtl] .large {
   padding: var(--zd_size10) var(--zd_size25) var(--zd_size10) var(--zd_size3) ;
 }
-.value,.multiLineValue {
+
+.value,
+.multiLineValue {
   line-height: 1.5385;
 }
+
 .value {
   composes: dotted from '~@zohodesk/components/lib/common/common.module.css';
 }
-.multiLineValue{
+
+.multiLineValue {
   word-break: break-word;
+  -webkit-line-clamp: 2;
   composes: clamp from '~@zohodesk/components/lib/common/common.module.css';
 }
+
 [dir=ltr] .withBorder.active {
   border-left-color: var(--zdt_statuslistitem_default_active_border);
 }
+
 [dir=rtl] .withBorder.active {
   border-right-color: var(--zdt_statuslistitem_default_active_border);
 }
@@ -50,44 +65,56 @@
 .default.hover, .default.effect:hover {
   background-color: var(--zdt_statuslistitem_default_effect_bg);
 }
+
 .primary.hover, .primary.effect:hover, .selected {
   background-color: var(--zdt_statuslistitem_primary_efffect_bg);
 }
+
 .secondary.hover, .secondary.effect:hover {
   background-color: var(--zdt_statuslistitem_secondary_effect_bg);
 }
+
 .list.active.default, .list.active.primary {
   background-color: var(--zdt_statuslistitem_primary_efffect_bg);
 }
+
 .list.active.secondary {
   background-color: var(--zdt_statuslistitem_secondary_effect_bg);
 }
+
 .secondary.hover,
 .secondary.effect:hover,
 .list.active.secondary {
   color: var(--zdt_statuslistitem_secondary_effect_text);
 }
+
 .tickIcon {
   color: var(--zdt_statuslistitem_tickicon);
   position: absolute;
-  top:50% ;
+  top: 50% ;
   transform: translateY(-50%);
 }
+
 [dir=ltr] .tickIcon {
   right: var(--zd_size20) ;
 }
+
 [dir=rtl] .tickIcon {
   left: var(--zd_size20) ;
 }
-.tickIcon > i {
+
+.tickIcon>i {
   display: block;
 }
+
 [dir=ltr] .active.withTick {
   padding-right: var(--zd_size39) ;
 }
+
 [dir=rtl] .active.withTick {
   padding-left: var(--zd_size39) ;
 }
+
 /* Status Type */
 .statusType {
   width: var(--zd_size8) ;
@@ -100,12 +127,15 @@
 [dir=rtl] .statusType {
   margin-left: var(--zd_size13) ;
 }
+
 .black {
   background-color: var(--zdt_statuslistitem_black_bg);
 }
+
 .orange {
   background-color: var(--zdt_statuslistitem_orange_bg);
 }
+
 .green {
   background-color: var(--zdt_statuslistitem_green_bg);
-}
+}

package/es/lookup/header/Search/LookupSearch.module.css

@@ -1,25 +1,20 @@
-.wrapper {
+.searchStyle,
+.boxStyle {
   transition: var(--zd_transition1);
-  width: var(--zd_size160) ;
+  width: var(--zd_size96) ;
   height: var(--zd_size28) ;
   position: relative;
+}.searchStyle, .boxStyle {
+  background: none;
 }
-.boxType {
-  border: 1px solid transparent;
+.boxStyle {
+  width: var(--zd_size160) ;
   border-radius: 4px;
+  border: 1px solid var(--zdt_lookupsearch_boxstyle_border);
 }
-.borderType {
-  border-bottom: 1px solid transparent;
-}
-.boxType, .borderType {
-  border-color: var(--zdt_lookupsearch_boxstyle_border);
-}
-.boxType:hover, .borderType:hover {
+.searchStyle:hover, .boxStyle:hover {
   border-color: var(--zdt_lookupsearch_boxstyle_hover_border);
 }
-.boxType.active, .borderType.active {
-  border-color: var(--zdt_lookupsearch_boxstyle_activer_border);
-}
 .focusWidth {
   width: var(--zd_size220) ;
 }
@@ -27,31 +22,36 @@
   position: relative;
   height: var(--zd_size28) ;
   cursor: pointer;
-  padding: 0 var(--zd_size9) ;
 }
 .drpSearchBox::after {
   content: '';
   position: absolute;
-  top: var(--zd_size4) ;
-  bottom: var(--zd_size4) ;
+  top: var(--zd_size8) ;
+  bottom: var(--zd_size8) ;
 }
 [dir=ltr] .drpSearchBox::after {
-  right: var(--zd_size6) ;
+  right: calc( var(--zd_size1) * -1 ) ;
   border-right: 1px solid var(--zdt_lookupsearch_boxstyle_border);
 }
 [dir=rtl] .drpSearchBox::after {
-  left: var(--zd_size6) ;
+  left: calc( var(--zd_size1) * -1 ) ;
   border-left: 1px solid var(--zdt_lookupsearch_boxstyle_border);
 }
-[dir=ltr] .searchIcon {
-  padding-right: var(--zd_size8) ;
+.inputBox, .drpSearchBox {
+  padding: 0 var(--zd_size9) ;
+}
+[dir=ltr] .searchIconBox {
+  padding: var(--zd_size4) 0 var(--zd_size4) var(--zd_size9) ;
 }
-[dir=rtl] .searchIcon {
-  padding-left: var(--zd_size8) ;
+[dir=rtl] .searchIconBox {
+  padding: var(--zd_size4) var(--zd_size9) var(--zd_size4) 0 ;
 }
 .active, .boxStyle.active, .lineActive.drpSearchBox::after {
   border-color: var(--zdt_lookupsearch_boxstyle_activer_border);
 }
-.iconArrow {
-  margin: 0 var(--zd_size6) ;
-}
+[dir=ltr] .iconArrow {
+  margin-left: var(--zd_size5) ;
+}
+[dir=rtl] .iconArrow {
+  margin-right: var(--zd_size5) ;
+}

package/es/lookup/header/Search/Search.js

@@ -8,7 +8,6 @@ import { Search_propTypes, SearchUI_propTypes } from "./props/propTypes";
 
 import TextBoxIcon from '@zohodesk/components/lib/TextBoxIcon/TextBoxIcon';
 import { Container, Box } from '@zohodesk/components/lib/Layout';
-import { mergeStyle } from '@zohodesk/utils';
 import { Icon } from '@zohodesk/icons';
 import ToggleDropDown from "../../../dropdown/ToggleDropDown/ToggleDropDown";
 /** * Methods ** */
@@ -17,19 +16,33 @@ import { debounce } from '@zohodesk/components/lib/utils/debounce';
 import { cancelBubblingEffect } from '@zohodesk/components/es/utils/Common';
 /** * CSS ** */
 
-import defaultStyle from "./LookupSearch.module.css";
+import style from "./LookupSearch.module.css";
 export default class Search extends Component {
   constructor(props) {
     super(props);
+    this.handleDropDownOpen = this.handleDropDownOpen.bind(this);
+    this.handleDropDownClose = this.handleDropDownClose.bind(this);
     this.handleTextBoxFocus = this.handleTextBoxFocus.bind(this);
     this.handleTextBoxBlur = this.handleTextBoxBlur.bind(this);
     this.handleGetTextBoxRef = this.handleGetTextBoxRef.bind(this);
-    this.handleRenderChildren = this.handleRenderChildren.bind(this);
     this.state = {
-      isFocus: false
+      isFocus: false,
+      isDropDownOpen: false
     };
   }
 
+  handleDropDownOpen() {
+    this.setState({
+      isDropDownOpen: true
+    });
+  }
+
+  handleDropDownClose() {
+    this.setState({
+      isDropDownOpen: false
+    });
+  }
+
   handleTextBoxFocus(e) {
     const {
       onFocus
@@ -58,45 +71,22 @@ export default class Search extends Component {
     getRef && getRef(el);
   }
 
-  handleRenderChildren(_ref) {
-    let {
-      isActive
-    } = _ref;
-    const {
-      value,
-      selectedId,
-      renderChildren
-    } = this.props;
-
-    if (renderChildren) {
-      return renderChildren({
-        isActive,
-        value,
-        selectedId
-      });
-    }
-
-    return null;
-  }
-
   render() {
     const {
       options,
       onSelect,
       value,
-      selectedId,
-      renderChildren
+      selectedId
     } = this.props;
     const {
-      isFocus
+      isFocus,
+      isDropDownOpen
     } = this.state;
     const searchUIExtraProps = {
-      isFocus: isFocus,
+      isFocus: isFocus || isDropDownOpen,
       onFocus: this.handleTextBoxFocus,
       onBlur: this.handleTextBoxBlur,
-      getRef: this.handleGetTextBoxRef,
-      value: value,
-      renderChildren: renderChildren ? this.handleRenderChildren : null
+      getRef: this.handleGetTextBoxRef
     };
     return options ? /*#__PURE__*/React.createElement(ToggleDropDown, {
       value: value,
@@ -105,7 +95,9 @@ export default class Search extends Component {
       needTick: true,
       isArrow: false,
       isToggleStateNeeded: true,
-      selectedId: selectedId
+      selectedId: selectedId,
+      onDropDownOpen: this.handleDropDownOpen,
+      onDropDownClose: this.handleDropDownClose
     }, /*#__PURE__*/React.createElement(SearchUI, { ...this.props,
       ...searchUIExtraProps
     })) : /*#__PURE__*/React.createElement(SearchUI, { ...this.props,
@@ -179,27 +171,15 @@ class SearchUI extends Component {
       activeClass,
       isFocus,
       onFocus,
-      onBlur,
-      renderChildren,
-      isActive,
-      customStyle
+      onBlur
     } = this.props;
-    const isInActiveState = isFocus || isActive;
-    const isFocusWidth = isFocus || searchStr || isActive;
-    const style = mergeStyle(defaultStyle, customStyle);
     return /*#__PURE__*/React.createElement(Container, {
       isCover: false,
       alignBox: "row",
       align: "vertical",
-      className: `
-          ${style.wrapper} ${isBoxed ? style.boxType : style.borderType} 
-          ${isInActiveState ? `${style.active} ${activeClass || ''}` : ''}
-          ${isFocusWidth ? style.focusWidth : ''}
-        `
-    }, renderChildren && options ? renderChildren({
-      isActive
-    }) : options ? /*#__PURE__*/React.createElement(Container, {
-      className: `${style.drpSearchBox} ${isInActiveState ? style.lineActive : ''}`,
+      className: `${style.searchStyle} ${isBoxed ? style.boxStyle : ''} ${isFocus ? `${style.active} ${activeClass ? activeClass : ''} ` : ''} ${searchStr || isFocus ? style.focusWidth : ''}`
+    }, options && /*#__PURE__*/React.createElement(Container, {
+      className: `${style.drpSearchBox} ${isFocus ? style.lineActive : ''}`,
       isCover: false,
       align: "vertical",
       alignBox: "row",
@@ -211,13 +191,17 @@ class SearchUI extends Component {
       name: "ZD-down",
       size: "7",
       iconClass: style.iconArrow
-    })) : isSearchIconNeed ? /*#__PURE__*/React.createElement(Icon, {
+    })), isSearchIconNeed && /*#__PURE__*/React.createElement(Box, {
+      className: style.searchIconBox
+    }, /*#__PURE__*/React.createElement(Icon, {
       name: "ZD-search",
-      size: "11",
-      iconClass: style.searchIcon
-    }) : null, /*#__PURE__*/React.createElement(Box, {
+      size: "11"
+    })), /*#__PURE__*/React.createElement(Box, {
       flexible: true
     }, /*#__PURE__*/React.createElement(TextBoxIcon, {
+      customClass: {
+        customTextBox: `${isBoxed ? style.inputBox : ''}`
+      },
       customProps: {
         TextBoxProps: {
           'data-a11y-autofocus': true
@@ -235,8 +219,7 @@ class SearchUI extends Component {
       size: "small",
       inputRef: getRef,
       onClear: this.handleClear,
-      onClearMouseDown: cancelBubblingEffect,
-      needBorder: false
+      onClearMouseDown: cancelBubblingEffect
     })));
   }
 

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

@@ -1,6 +1,5 @@
 export const SearchUI_defaultProps = {
   activeClass: '',
   isBoxed: false,
-  isSearchIconNeed: false,
-  isActive: false
+  isSearchIconNeed: false
 };

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

@@ -24,9 +24,5 @@ export const SearchUI_propTypes = {
   options: PropTypes.array,
   placeHolder: PropTypes.string,
   searchStr: PropTypes.string,
-  title: PropTypes.string,
-  renderChildren: PropTypes.func,
-  isActive: PropTypes.bool,
-  renderChildren: PropTypes.func,
-  customStyle: PropTypes.object
+  title: PropTypes.string
 };

package/lib/Drawer/Drawer.js

@@ -256,7 +256,8 @@ var Drawer = /*#__PURE__*/function (_React$Component4) {
           onClose = _this$props4.onClose,
           needFocusScope = _this$props4.needFocusScope,
           customProps = _this$props4.customProps,
-          a11y = _this$props4.a11y;
+          a11y = _this$props4.a11y,
+          customDrawerClass = _this$props4.customDrawerClass;
       var _customProps$focusSco = customProps.focusScopeProps,
           focusScopeProps = _customProps$focusSco === void 0 ? {} : _customProps$focusSco;
       var _focusScopeProps$need = focusScopeProps.needAutoFocus,
@@ -284,7 +285,7 @@ var Drawer = /*#__PURE__*/function (_React$Component4) {
       });
 
       var content = /*#__PURE__*/_react["default"].createElement(_Layout.Box, _extends({
-        className: "".concat(_DrawerModule["default"].container, " ").concat(_DrawerModule["default"].columns, " ").concat(_DrawerModule["default"].drawerModal, " ").concat(uptoTablet ? _DrawerModule["default"].mbleSize : _DrawerModule["default"][size]),
+        className: "".concat(_DrawerModule["default"].container, " ").concat(_DrawerModule["default"].columns, " ").concat(_DrawerModule["default"].drawerModal, " ").concat(uptoTablet ? _DrawerModule["default"].mbleSize : _DrawerModule["default"][size], " ").concat(customDrawerClass),
         "data-a11y-need-focus-style": "false",
         tabindex: -1,
         eleRef: this.createRef
@@ -394,8 +395,4 @@ var Drawer = /*#__PURE__*/function (_React$Component4) {
 
 exports["default"] = Drawer;
 Drawer.propTypes = _propTypes.Drawer_propTypes;
-Drawer.defaultProps = _defaultProps.Drawer_defaultProps; // if (__DOCS__) {
-//   Drawer.docs = {
-//     componentGroup: 'Template'
-//   };
-// }
+Drawer.defaultProps = _defaultProps.Drawer_defaultProps;

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

@@ -12,7 +12,7 @@ exports[`Drawer rendering the isActive true 1`] = `
     style="z-index: 4;"
   >
     <div
-      class="container columns drawerModal small shrinkOff"
+      class="container columns drawerModal small  shrinkOff"
       data-a11y-need-focus-style="false"
       data-id="boxComponent"
       data-selector-id="box"

package/lib/Drawer/props/defaultProps.js

@@ -23,6 +23,7 @@ var Drawer_defaultProps = {
   subDrawerActive: false,
   subDrawerClass: '',
   customClass: '',
+  customDrawerClass: '',
   needAutoZindex: true,
   onBodyClick: function onBodyClick() {},
   needFocusScope: false,

package/lib/Drawer/props/propTypes.js

@@ -45,6 +45,7 @@ exports.Footer_propTypes = Footer_propTypes;
 var Drawer_propTypes = {
   children: _propTypes["default"].node,
   customClass: _propTypes["default"].string,
+  customDrawerClass: _propTypes["default"].string,
   forwardRef: _propTypes["default"].object,
   isActive: _propTypes["default"].bool,
   needAutoZindex: _propTypes["default"].bool,

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

@@ -227,7 +227,9 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
           _customProps$TagWrapp = customProps.TagWrapperProps,
           TagWrapperProps = _customProps$TagWrapp === void 0 ? {} : _customProps$TagWrapp,
           _customProps$TagProps = customProps.TagProps,
-          TagProps = _customProps$TagProps === void 0 ? {} : _customProps$TagProps;
+          TagProps = _customProps$TagProps === void 0 ? {} : _customProps$TagProps,
+          _customProps$listProp = customProps.listProps,
+          listProps = _customProps$listProp === void 0 ? {} : _customProps$listProp;
       return /*#__PURE__*/_react["default"].createElement("div", {
         className: "".concat(_TagsMultiSelectModule["default"].container, " ").concat(!isReadOnly ? " ".concat(needBorder ? _TagsMultiSelectModule["default"].hasBorder : '', "\n              ").concat(needBorder ? _TagsMultiSelectModule["default"]["borderColor_".concat(borderColor)] : _TagsMultiSelectModule["default"].borderColor_transparent, " ").concat(isPopupReady && needBorder ? _TagsMultiSelectModule["default"].active : '') : '', " ").concat(className),
         onClick: _General.stopBubbling,
@@ -336,7 +338,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
           var name = item.name,
               isNew = item.isNew,
               listItemProps = item.listItemProps;
-          return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, searchList.length > 1 && isNew ? /*#__PURE__*/_react["default"].createElement(_DropDownSeparator["default"], null) : null, /*#__PURE__*/_react["default"].createElement(_ListItem["default"], {
+          return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, searchList.length > 1 && isNew ? /*#__PURE__*/_react["default"].createElement(_DropDownSeparator["default"], null) : null, /*#__PURE__*/_react["default"].createElement(_ListItem["default"], _extends({
             key: index,
             index: index,
             autoHover: true,
@@ -349,7 +351,7 @@ var TagsMultiSelect = /*#__PURE__*/function (_React$Component) {
             isDisabled: listDisabled,
             customProps: listItemProps,
             customClass: listItemClass
-          }, isNew ? /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
+          }, listProps), isNew ? /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
             alignBox: "row",
             align: "vertical"
           }, /*#__PURE__*/_react["default"].createElement(_Layout.Box, {

package/lib/list/DepartmentDropDown/DepartmentDropDown.js

@@ -25,6 +25,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+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); }
+
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
@@ -100,7 +102,10 @@ var DepartmentDropDown = /*#__PURE__*/function (_Component) {
           onSearch = _this$props3.onSearch,
           needSearchFetching = _this$props3.needSearchFetching,
           searchStr = _this$props3.searchStr,
-          i18nKeys = _this$props3.i18nKeys;
+          i18nKeys = _this$props3.i18nKeys,
+          customProps = _this$props3.customProps;
+      var _customProps$toggleDr = customProps.toggleDropDownProps,
+          toggleDropDownProps = _customProps$toggleDr === void 0 ? {} : _customProps$toggleDr;
       var _i18nKeys$title = i18nKeys.title,
           title = _i18nKeys$title === void 0 ? 'Move Department' : _i18nKeys$title,
           _i18nKeys$searchEmpty = i18nKeys.searchEmptyText,
@@ -109,7 +114,7 @@ var DepartmentDropDown = /*#__PURE__*/function (_Component) {
           searchErrorText = _i18nKeys$searchError === void 0 ? 'No results' : _i18nKeys$searchError,
           _i18nKeys$placeholder = i18nKeys.placeholder,
           placeholder = _i18nKeys$placeholder === void 0 ? 'Search Department' : _i18nKeys$placeholder;
-      return /*#__PURE__*/_react["default"].createElement(_ToggleDropDown["default"], {
+      return /*#__PURE__*/_react["default"].createElement(_ToggleDropDown["default"], _extends({
         title: title,
         options: departmentList,
         value: /*#__PURE__*/_react["default"].createElement(_SecondaryText.DepartmentText, {
@@ -138,7 +143,7 @@ var DepartmentDropDown = /*#__PURE__*/function (_Component) {
         isNextOptions: isNextOptions,
         onSearch: onSearch,
         needSearchFetching: needSearchFetching
-      });
+      }, toggleDropDownProps));
     }
   }]);