@nice-digital/global-nav 4.1.734 → 4.1.735-GN-169-Dropdown-open

package/README.md

@@ -42,6 +42,8 @@
 					- [Header.skipLinkId](#headerskiplinkid)
 					- [Header.onNavigating](#headeronnavigating)
 					- [Header.onResize](#headeronresize)
+					- [Header.onDropdownOpen](#headerondropdownopen)
+					- [Header.onDropdownClose](#headerondropdownclose)
 					- [Header.additionalSubMenuItems](#headeradditionalsubmenuitems)
 					- [Header.search](#headersearch)
 					- [Header.search.url](#headersearchurl)
@@ -408,6 +410,49 @@ var global_nav_config = {
 };
 ```
 
+###### Header.onDropdownOpen
+
+- Type: `String`, `Function`
+- Default: `null`
+
+Pass an `onDropdownOpen` property to enable callback when dropdown is open.
+Pass either a function, or the name of a function defined on `window`. E.g.:
+
+```js
+window.onDropdownOpenHandler = function () {
+  // Define your implementation here e.g.:
+  document.querySelector("body").classList.add("global-nav__dropdown--open");
+};
+
+var global_nav_config = {
+  header: {
+      onDropdownOpen: 'onDropdownOpenHandler',
+  },
+};
+```
+
+###### Header.onDropdownClose
+
+- Type: `String`, `Function`
+- Default: `null`
+
+Pass an `onDropdownClose` property to enable callback when dropdown is closed.
+Pass either a function, or the name of a function defined on `window`. E.g.:
+
+```js
+window.onDropdownCloseHandler = function (e) {
+  // Define your implementation here e.g.:
+ document.querySelector("body").classList.remove("global-nav__dropdown--open")
+
+};
+
+var global_nav_config = {
+  header: {
+      onDropdownClose: 'onDropdownCloseHandler',
+  },
+};
+```
+
 ###### Header.additionalSubMenuItems
 
 - Type: `null | Array`

package/lib/Header/Header.js

@@ -103,12 +103,38 @@ var Header = /*#__PURE__*/function (_Component) {
     }
   };
 
+  _proto.checkForFunctionOrFunctionName = function checkForFunctionOrFunctionName(funcParam) {
+    return typeof funcParam === "function" ? funcParam : window[funcParam];
+  };
+
+  _proto.dropdownToggleHandler = function dropdownToggleHandler(idOfOpenDropdown) {
+    // If we've got an onDropdownOpen or onDropdownClose prop call the onDropdownOpen or onDropdownClose callback based on idOfOpenDropdown.
+    var _this$props = this.props,
+        onDropdownOpen = _this$props.onDropdownOpen,
+        onDropdownClose = _this$props.onDropdownClose;
+
+    if (onDropdownOpen && idOfOpenDropdown !== null) {
+      if (typeof this.checkForFunctionOrFunctionName(onDropdownOpen) === "function") {
+        onDropdownOpen();
+        return true;
+      }
+    }
+
+    if (onDropdownClose && idOfOpenDropdown == null) {
+      if (typeof this.checkForFunctionOrFunctionName(onDropdownClose) === "function") {
+        onDropdownClose();
+        return true;
+      }
+    }
+  };
+
   _proto.render = function render() {
     var _this3 = this;
 
     return this.props.enabled !== false && /*#__PURE__*/_react["default"].createElement(_HeaderContext.HeaderContextProvider, null, /*#__PURE__*/_react["default"].createElement(_HeaderContext.HeaderContext.Consumer, null, function (_ref) {
       (0, _newArrowCheck2["default"])(this, _this3);
       var idOfOpenDropdown = _ref.idOfOpenDropdown;
+      this.dropdownToggleHandler(idOfOpenDropdown);
       return /*#__PURE__*/_react["default"].createElement("span", {
         id: "scrim",
         className: idOfOpenDropdown !== null ? _HeaderModule["default"].scrim : undefined,
@@ -184,6 +210,8 @@ Header.propTypes = {
   auth: _propTypes["default"].oneOfType([_propTypes["default"].bool, _propTypes["default"].object]),
   onNavigating: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].string]),
   onResize: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].string]),
+  onDropdownOpen: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].string]),
+  onDropdownClose: _propTypes["default"].oneOfType([_propTypes["default"].func, _propTypes["default"].string]),
   additionalSubMenuItems: _propTypes["default"].arrayOf(_propTypes["default"].object)
 };
 Header.defaultProps = {

package/lib/Header/Search/Autocomplete/Autocomplete.js

@@ -70,7 +70,7 @@ var debounce = function debounce(func, execAsap, threshold, scope) {
 var maxResults = 5;
 /** Delay in millieconds before loading results */
 
-var rateLimitWait = 100;
+var rateLimitWait = 300;
 exports.rateLimitWait = rateLimitWait;
 
 var inputValueTemplate = function inputValueTemplate(suggestion) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nice-digital/global-nav",
-  "version": "4.1.734",
+  "version": "4.1.735-GN-169-Dropdown-open",
   "description": "Global header and footer components for NICE digital services",
   "main": "lib/index.js",
   "types": "./types.d.ts",

package/types.d.ts

@@ -72,6 +72,8 @@ declare module "@nice-digital/global-nav" {
 		skipLinkId?: string;
 		search?: false | SearchProps;
 		auth?: NiceAccountsProviderProps | IdamProviderProps | false;
+		onDropdownOpen?: string | OnDropdownOpenCallback;
+		onDropdownClose?: string | OnDropdownCloseCallback;
 		onNavigating?: string | OnNavigatingCallback;
 		additionalSubMenuItems?: Array<AdditionalSubMenuItem>;
 	};