@ably/ui 7.10.0-dev.e980a00 → 8.0.1

package/core/Meganav.jsx

@@ -2542,6 +2542,7 @@ var MeganavItemsMobile = function MeganavItemsMobile(_ref) {
       maxWidth: "none"
     },
     placeholder: "Search",
+    autoComplete: "off",
     "data-id": "meganav-mobile-search-input"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_9__.default, null))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "max-h-0 overflow-hidden transition-all",
@@ -2742,7 +2743,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     type: "button",
     "data-id": "meganav-control",
     "data-control": "search",
-    className: "h-64 w-24 px-24 pr-48 py-20",
+    className: "h-64 w-24 px-24 pr-48 py-20 group focus:outline-none",
     "aria-expanded": "false",
     "aria-controls": "panel-search",
     "aria-label": "Show Search Panel"
@@ -2750,7 +2751,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     name: "icon-gui-search",
     color: "text-cool-black",
     size: "1.5rem",
-    additionalCSS: "hover:text-gui-hover"
+    additionalCSS: "group-hover:text-gui-hover group-focus:text-gui-focus"
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "ui-meganav-panel invisible",
     id: "panel-search",
@@ -2836,6 +2837,7 @@ var MeganavSearchPanel = function MeganavSearchPanel(_ref) {
     name: "q",
     className: "ui-input pl-48 h-48",
     placeholder: "Search",
+    autoComplete: "off",
     "data-id": "meganav-search-input"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_4__.default, null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
     type: "submit",
@@ -2877,29 +2879,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-text-overline2 text-cool-black py-12"
   }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-    className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
+    className: "flex justify-between items-center overflow-hidden"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
-    className: "flex"
+    className: "flex transition-transform"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pr-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/how-ably-works"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/quick-start-guide"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/core-features/pubsub"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pl-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/platform"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
     url: absUrl("/support"),
     textSize: "text-p2"
@@ -9142,8 +9144,6 @@ var MeganavControlMobileDropdown = function MeganavControlMobileDropdown(_ref) {
   var dropdown = (0,dom_query/* queryId */.A)("meganav-mobile-dropdown");
   var menuIcon = (0,dom_query/* queryId */.A)("meganav-control-mobile-dropdown-menu");
   var closeIcon = (0,dom_query/* queryId */.A)("meganav-control-mobile-dropdown-close");
-  var meganavSearchSuggestionsToggle = (0,dom_query/* queryId */.A)("meganav-mobile-search-input");
-  var meganavSearchSuggestions = (0,dom_query/* queryId */.A)("meganav-mobile-search-suggestions");
 
   var clickHandler = function clickHandler() {
     var ariaExpanded = control.getAttribute("aria-expanded");
@@ -9163,27 +9163,11 @@ var MeganavControlMobileDropdown = function MeganavControlMobileDropdown(_ref) {
     closeIcon.classList.toggle("hidden");
   };
 
-  var focusSuggestionsHandler = function focusSuggestionsHandler() {
-    meganavSearchSuggestions.classList.add("max-h-96");
-  };
-
-  var blurSuggestionsHandler = function blurSuggestionsHandler(event) {
-    if (event.relatedTarget === meganavSearchSuggestions.querySelectorAll("a")[0]) {
-      return;
-    }
-
-    meganavSearchSuggestions.classList.remove("max-h-96");
-  };
-
   control.addEventListener("click", clickHandler);
-  meganavSearchSuggestionsToggle.addEventListener("focus", focusSuggestionsHandler);
-  meganavSearchSuggestionsToggle.addEventListener("blur", blurSuggestionsHandler);
   return {
     teardown: function teardown() {
       control.removeEventListener("click", clickHandler);
       scroll_lock_default().enablePageScroll();
-      meganavSearchSuggestionsToggle.removeEventListener("focus", focusSuggestionsHandler);
-      meganavSearchSuggestionsToggle.removeEventListener("blur", blurSuggestionsHandler);
     },
     clear: function clear() {
       dropdown.classList.replace("visible", "invisible");
@@ -9191,7 +9175,6 @@ var MeganavControlMobileDropdown = function MeganavControlMobileDropdown(_ref) {
       menuIcon.classList.remove("hidden");
       closeIcon.classList.add("hidden");
       scroll_lock_default().enablePageScroll();
-      meganavSearchSuggestions.classList.remove("max-h-96");
     }
   };
 };
@@ -9305,8 +9288,8 @@ var init = function init(_ref) {
     }
   };
 
-  var markQueryInSuggestion = function markQueryInSuggestion(suggestion, query) {
-    return suggestion.value.replace(query.toLowerCase(), "<span class=\"font-light\">".concat(query, "</span>"));
+  var markQueryInSuggestion = function markQueryInSuggestion(suggestionValue, query) {
+    return suggestionValue.replace(query.toLowerCase(), "<span class=\"font-light\">".concat(query, "</span>"));
   };
 
   var navigateToUrl = function navigateToUrl(q) {
@@ -9341,23 +9324,24 @@ var init = function init(_ref) {
       var items = results.suggestions.map(function (suggestion, index) {
         var li = document.createElement("li");
         var button = document.createElement("button");
+        button.type = "button";
         button.classList.add("ui-text-menu2", "font-medium", "p-8", "w-full", "text-left", "rounded", "hover:text-gui-hover", "focus:outline-gui-focus", "hover:bg-light-grey");
-        button.innerHTML = markQueryInSuggestion(suggestion, query);
+        button.innerHTML = markQueryInSuggestion(suggestion.value, query);
         button.dataset.suggestionIndex = index;
         button.addEventListener("click", function () {
-          navigateToUrl(suggestion);
+          navigateToUrl(suggestion.value);
         });
         button.addEventListener("keydown", function (e) {
           var key = e.key;
 
           if (key === "ArrowDown") {
-            focusNext();
+            focusNext(index);
           } else if (key === "ArrowUp" && index - 1 < 0) {
             input.focus();
           } else if (key === "ArrowUp" && index - 1 >= 0) {
-            focusPrevious();
+            focusPrevious(index);
           } else if (key === "Enter" || key === "Space") {
-            navigateToUrl(suggestion);
+            navigateToUrl(suggestion.value);
           }
         });
         li.appendChild(button);
@@ -9437,6 +9421,142 @@ var init = function init(_ref) {
     });
   });
 });
+;// CONCATENATED MODULE: ./src/core/MeganavSearchSuggestions/component.js
+
+var DRAG_BUFFER = 5;
+
+var getTranslateX = function getTranslateX(node) {
+  return new DOMMatrix(window.getComputedStyle(node).transform).e;
+};
+
+var updateTranslateX = function updateTranslateX(node, value) {
+  return node.style.transform = "translateX(".concat(value, "px)");
+};
+
+var dragLeftBoundary = function dragLeftBoundary(translateX, threshold) {
+  return translateX >= threshold;
+};
+
+var dragRightBoundary = function dragRightBoundary(translateX, itemsWidth, windowWidth, threshold) {
+  return Math.abs(translateX - windowWidth + threshold) > itemsWidth;
+};
+
+var getDistance = function getDistance(e, touchStartX) {
+  var _e$changedTouches$;
+
+  return ((_e$changedTouches$ = e.changedTouches[0]) === null || _e$changedTouches$ === void 0 ? void 0 : _e$changedTouches$.clientX) - touchStartX;
+};
+
+var withinBuffer = function withinBuffer(distance) {
+  return Math.abs(distance) < DRAG_BUFFER;
+};
+
+var MeganavSearchSuggestions = function MeganavSearchSuggestions() {
+  var suggestionsToggle = (0,dom_query/* queryId */.A)("meganav-mobile-search-input");
+  var suggestions = (0,dom_query/* queryId */.A)("meganav-mobile-search-suggestions");
+  var list = suggestions.querySelector("ul");
+  var listItems = list.querySelectorAll("li");
+  var itemsTotalWidth = Array.from(listItems).map(function (item) {
+    return item.getBoundingClientRect().width;
+  }).reduce(function (acc, val) {
+    return acc + val;
+  }, 0);
+
+  var dragLeft = function dragLeft(distance, threshold) {
+    var currentTranslateX = getTranslateX(list);
+    var translateX = Math.round(currentTranslateX + distance);
+    if (dragLeftBoundary(translateX, threshold)) return;
+    updateTranslateX(list, translateX);
+  };
+
+  var dragLeftEnd = function dragLeftEnd(distance, threshold) {
+    var currentTranslateX = getTranslateX(list);
+    var translateX = Math.round(currentTranslateX + distance);
+
+    if (dragLeftBoundary(translateX, threshold)) {
+      translateX = 0;
+    }
+
+    updateTranslateX(list, translateX);
+  };
+
+  var dragRight = function dragRight(distance, threshold) {
+    var listWidth = list.getBoundingClientRect().width;
+    var currentTranslateX = getTranslateX(list);
+    var translateX = Math.round(currentTranslateX + distance);
+
+    if (dragRightBoundary(translateX, itemsTotalWidth, listWidth, threshold)) {
+      return;
+    }
+
+    updateTranslateX(list, translateX);
+  };
+
+  var dragRightEnd = function dragRightEnd(distance, threshold) {
+    var listWidth = list.getBoundingClientRect().width;
+    var currentTranslateX = getTranslateX(list);
+    var translateX = Math.round(currentTranslateX + distance);
+
+    if (dragRightBoundary(translateX, itemsTotalWidth, listWidth, threshold)) {
+      translateX = -(itemsTotalWidth - listWidth + threshold);
+    }
+
+    updateTranslateX(list, translateX);
+  };
+
+  var touchStartX;
+
+  var touchstartHandler = function touchstartHandler(e) {
+    var _e$touches$;
+
+    touchStartX = (_e$touches$ = e.touches[0]) === null || _e$touches$ === void 0 ? void 0 : _e$touches$.clientX;
+  };
+
+  var touchmoveHandler = function touchmoveHandler(e) {
+    var distance = getDistance(e, touchStartX);
+    if (withinBuffer(distance)) return;
+    distance > 0 ? dragLeft(distance, 24) : dragRight(distance, 96);
+  };
+
+  var touchendHandler = function touchendHandler(e) {
+    var distance = getDistance(e, touchStartX);
+    if (withinBuffer(distance)) return;
+    distance > 0 ? dragLeftEnd(distance, 24) : dragRightEnd(distance, 48);
+  };
+
+  var focusSuggestionsHandler = function focusSuggestionsHandler() {
+    suggestions.classList.add("max-h-96");
+  };
+
+  var blurSuggestionsHandler = function blurSuggestionsHandler(e) {
+    if (e.relatedTarget === suggestions.querySelectorAll("a")[0]) {
+      return;
+    }
+
+    suggestions.classList.remove("max-h-96");
+  };
+
+  suggestionsToggle.addEventListener("focus", focusSuggestionsHandler);
+  suggestionsToggle.addEventListener("blur", blurSuggestionsHandler);
+  suggestions.addEventListener("touchstart", touchstartHandler);
+  suggestions.addEventListener("touchmove", touchmoveHandler);
+  suggestions.addEventListener("touchend", touchendHandler);
+  return {
+    teardown: function teardown() {
+      suggestionsToggle.removeEventListener("focus", focusSuggestionsHandler);
+      suggestionsToggle.removeEventListener("blur", blurSuggestionsHandler);
+      suggestions.removeEventListener("touchstart", touchstartHandler);
+      suggestions.removeEventListener("touchmove", touchmoveHandler);
+      suggestions.removeEventListener("touchend", touchendHandler);
+    },
+    clear: function clear() {
+      suggestions.classList.remove("max-h-96");
+      list.style.transform = "translateX(0px)";
+    }
+  };
+};
+
+/* harmony default export */ const MeganavSearchSuggestions_component = (MeganavSearchSuggestions);
 ;// CONCATENATED MODULE: ./src/core/Meganav/component.js
 function component_toConsumableArray(arr) { return component_arrayWithoutHoles(arr) || component_iterableToArray(arr) || component_unsupportedIterableToArray(arr) || component_nonIterableSpread(); }
 
@@ -9464,6 +9584,7 @@ function component_arrayLikeToArray(arr, len) { if (len == null || len > arr.len
 
 
 
+
  // Close menu when user clicks outside of viewport
 
 var windowOnBlur = function windowOnBlur(closeAll) {
@@ -9570,6 +9691,7 @@ function Meganav() {
   var panelOpenControls = MeganavControlMobilePanelOpen_component();
   var panelCloseControls = MeganavControlMobilePanelClose_component();
   var search = MeganavSearchAutocomplete_component();
+  var searchSuggestions = MeganavSearchSuggestions_component();
   var mobileDropdownControl = MeganavControlMobileDropdown_component({
     clearPanels: function clearPanels() {
       return [].concat(component_toConsumableArray(panelOpenControls), component_toConsumableArray(panelCloseControls)).forEach(function (i) {
@@ -9579,12 +9701,12 @@ function Meganav() {
   });
 
   var closeAll = function closeAll() {
-    return [mobileDropdownControl].concat(component_toConsumableArray(panelOpenControls), component_toConsumableArray(panelCloseControls), component_toConsumableArray(controls), component_toConsumableArray(search)).forEach(function (i) {
+    return [mobileDropdownControl, searchSuggestions].concat(component_toConsumableArray(panelOpenControls), component_toConsumableArray(panelCloseControls), component_toConsumableArray(controls), component_toConsumableArray(search)).forEach(function (i) {
       return i.clear();
     });
   };
 
-  var teardowns = [documentScroll(themeName), documentClick(closeAll), windowOnBlur(closeAll), mobileDropdownControl].concat(component_toConsumableArray(controls), component_toConsumableArray(panelOpenControls), component_toConsumableArray(panelCloseControls), component_toConsumableArray(search)).map(function (i) {
+  var teardowns = [documentScroll(themeName), documentClick(closeAll), windowOnBlur(closeAll), mobileDropdownControl, searchSuggestions].concat(component_toConsumableArray(controls), component_toConsumableArray(panelOpenControls), component_toConsumableArray(panelCloseControls), component_toConsumableArray(search)).map(function (i) {
     return i.teardown;
   });
   return function () {

package/core/MeganavControlMobileDropdown/component.js

@@ -1 +1 @@
-!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.MeganavControlMobileDropdown=t())}(this,(function(){return(()=>{var e={9581:(e,t,r)=>{"use strict";r.d(t,{A:()=>l});var l=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return t.querySelector("[data-id=".concat(e,"]"))}},6265:function(e){var t;t=function(){return function(e){var t={};function r(l){if(t[l])return t[l].exports;var o=t[l]={i:l,l:!1,exports:{}};return e[l].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,l){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:l})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var l=Object.create(null);if(r.r(l),Object.defineProperty(l,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(l,o,function(t){return e[t]}.bind(null,o));return l},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";r.r(t);var l=function(e){return Array.isArray(e)?e:[e]},o=function(e){return e instanceof Node},n=function(e,t){if(e&&t){e=function(e){return e instanceof NodeList}(e)?e:[e];for(var r=0;r<e.length&&!0!==t(e[r],r,e.length);r++);}},c=function(e){return console.error("[scroll-lock] ".concat(e))},a=function(e){if(Array.isArray(e))return e.join(", ")},i=function(e){var t=[];return n(e,(function(e){return t.push(e)})),t},u=function(e,t){var r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],l=arguments.length>3&&void 0!==arguments[3]?arguments[3]:document;if(r&&-1!==i(l.querySelectorAll(t)).indexOf(e))return e;for(;(e=e.parentElement)&&-1===i(l.querySelectorAll(t)).indexOf(e););return e},d=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:document,l=-1!==i(r.querySelectorAll(t)).indexOf(e);return l},s=function(e){if(e)return"hidden"===getComputedStyle(e).overflow},f=function(e){if(e)return!!s(e)||e.scrollTop<=0},p=function(e){if(e){if(s(e))return!0;var t=e.scrollTop,r=e.scrollHeight;return t+e.offsetHeight>=r}},g=function(e){if(e)return!!s(e)||e.scrollLeft<=0},b=function(e){if(e){if(s(e))return!0;var t=e.scrollLeft,r=e.scrollWidth;return t+e.offsetWidth>=r}},v=function(e){return d(e,'textarea, [contenteditable="true"]')},h=function(e){return d(e,'input[type="range"]')};function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}r.d(t,"disablePageScroll",(function(){return k})),r.d(t,"enablePageScroll",(function(){return w})),r.d(t,"getScrollState",(function(){return A})),r.d(t,"clearQueueScrollLocks",(function(){return L})),r.d(t,"getTargetScrollBarWidth",(function(){return x})),r.d(t,"getCurrentTargetScrollBarWidth",(function(){return T})),r.d(t,"getPageScrollBarWidth",(function(){return G})),r.d(t,"getCurrentPageScrollBarWidth",(function(){return P})),r.d(t,"addScrollableTarget",(function(){return W})),r.d(t,"removeScrollableTarget",(function(){return E})),r.d(t,"addScrollableSelector",(function(){return F})),r.d(t,"removeScrollableSelector",(function(){return O})),r.d(t,"addLockableTarget",(function(){return Y})),r.d(t,"addLockableSelector",(function(){return j})),r.d(t,"setFillGapMethod",(function(){return q})),r.d(t,"addFillGapTarget",(function(){return M})),r.d(t,"removeFillGapTarget",(function(){return U})),r.d(t,"addFillGapSelector",(function(){return C})),r.d(t,"removeFillGapSelector",(function(){return N})),r.d(t,"refillGaps",(function(){return B}));var y=["padding","margin","width","max-width","none"],S={scroll:!0,queue:0,scrollableSelectors:["[data-scroll-lock-scrollable]"],lockableSelectors:["body","[data-scroll-lock-lockable]"],fillGapSelectors:["body","[data-scroll-lock-fill-gap]","[data-scroll-lock-lockable]"],fillGapMethod:y[0],startTouchY:0,startTouchX:0},k=function(e){S.queue<=0&&(S.scroll=!1,K(),H()),W(e),S.queue++},w=function(e){S.queue>0&&S.queue--,S.queue<=0&&(S.scroll=!0,R(),z()),E(e)},A=function(){return S.scroll},L=function(){S.queue=0},x=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(o(e)){var r=e.style.overflowY;t?A()||(e.style.overflowY=e.getAttribute("data-scroll-lock-saved-overflow-y-property")):e.style.overflowY="scroll";var l=T(e);return e.style.overflowY=r,l}return 0},T=function(e){if(o(e)){if(e===document.body){var t=document.documentElement.clientWidth;return window.innerWidth-t}var r=e.style.borderLeftWidth,l=e.style.borderRightWidth;e.style.borderLeftWidth="0px",e.style.borderRightWidth="0px";var n=e.offsetWidth-e.clientWidth;return e.style.borderLeftWidth=r,e.style.borderRightWidth=l,n}return 0},G=function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return x(document.body,e)},P=function(){return T(document.body)},W=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?e.setAttribute("data-scroll-lock-scrollable",""):c('"'.concat(e,'" is not a Element.'))}))}))},E=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?e.removeAttribute("data-scroll-lock-scrollable"):c('"'.concat(e,'" is not a Element.'))}))}))},F=function(e){e&&l(e).map((function(e){S.scrollableSelectors.push(e)}))},O=function(e){e&&l(e).map((function(e){S.scrollableSelectors=S.scrollableSelectors.filter((function(t){return t!==e}))}))},Y=function(e){e&&(l(e).map((function(e){n(e,(function(e){o(e)?e.setAttribute("data-scroll-lock-lockable",""):c('"'.concat(e,'" is not a Element.'))}))})),A()||K())},j=function(e){e&&(l(e).map((function(e){S.lockableSelectors.push(e)})),A()||K(),C(e))},q=function(e){if(e)if(-1!==y.indexOf(e))S.fillGapMethod=e,B();else{var t=y.join(", ");c('"'.concat(e,'" method is not available!\nAvailable fill gap methods: ').concat(t,"."))}},M=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?(e.setAttribute("data-scroll-lock-fill-gap",""),S.scroll||J(e)):c('"'.concat(e,'" is not a Element.'))}))}))},U=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?(e.removeAttribute("data-scroll-lock-fill-gap"),S.scroll||Z(e)):c('"'.concat(e,'" is not a Element.'))}))}))},C=function(e){e&&l(e).map((function(e){-1===S.fillGapSelectors.indexOf(e)&&(S.fillGapSelectors.push(e),S.scroll||I(e))}))},N=function(e){e&&l(e).map((function(e){S.fillGapSelectors=S.fillGapSelectors.filter((function(t){return t!==e})),S.scroll||V(e)}))},B=function(){S.scroll||H()},K=function(){var e=a(S.lockableSelectors);_(e)},R=function(){var e=a(S.lockableSelectors);X(e)},_=function(e){var t=document.querySelectorAll(e);n(t,(function(e){D(e)}))},X=function(e){var t=document.querySelectorAll(e);n(t,(function(e){Q(e)}))},D=function(e){if(o(e)&&"true"!==e.getAttribute("data-scroll-lock-locked")){var t=window.getComputedStyle(e);e.setAttribute("data-scroll-lock-saved-overflow-y-property",t.overflowY),e.setAttribute("data-scroll-lock-saved-inline-overflow-property",e.style.overflow),e.setAttribute("data-scroll-lock-saved-inline-overflow-y-property",e.style.overflowY),e.style.overflow="hidden",e.setAttribute("data-scroll-lock-locked","true")}},Q=function(e){o(e)&&"true"===e.getAttribute("data-scroll-lock-locked")&&(e.style.overflow=e.getAttribute("data-scroll-lock-saved-inline-overflow-property"),e.style.overflowY=e.getAttribute("data-scroll-lock-saved-inline-overflow-y-property"),e.removeAttribute("data-scroll-lock-saved-overflow-property"),e.removeAttribute("data-scroll-lock-saved-inline-overflow-property"),e.removeAttribute("data-scroll-lock-saved-inline-overflow-y-property"),e.removeAttribute("data-scroll-lock-locked"))},H=function(){S.fillGapSelectors.map((function(e){I(e)}))},z=function(){S.fillGapSelectors.map((function(e){V(e)}))},I=function(e){var t=document.querySelectorAll(e),r=-1!==S.lockableSelectors.indexOf(e);n(t,(function(e){J(e,r)}))},J=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(o(e)){var r;if(""===e.getAttribute("data-scroll-lock-lockable")||t)r=x(e,!0);else{var l=u(e,a(S.lockableSelectors));r=x(l,!0)}"true"===e.getAttribute("data-scroll-lock-filled-gap")&&Z(e);var n=window.getComputedStyle(e);if(e.setAttribute("data-scroll-lock-filled-gap","true"),e.setAttribute("data-scroll-lock-current-fill-gap-method",S.fillGapMethod),"margin"===S.fillGapMethod){var c=parseFloat(n.marginRight);e.style.marginRight="".concat(c+r,"px")}else if("width"===S.fillGapMethod)e.style.width="calc(100% - ".concat(r,"px)");else if("max-width"===S.fillGapMethod)e.style.maxWidth="calc(100% - ".concat(r,"px)");else if("padding"===S.fillGapMethod){var i=parseFloat(n.paddingRight);e.style.paddingRight="".concat(i+r,"px")}}},V=function(e){var t=document.querySelectorAll(e);n(t,(function(e){Z(e)}))},Z=function(e){if(o(e)&&"true"===e.getAttribute("data-scroll-lock-filled-gap")){var t=e.getAttribute("data-scroll-lock-current-fill-gap-method");e.removeAttribute("data-scroll-lock-filled-gap"),e.removeAttribute("data-scroll-lock-current-fill-gap-method"),"margin"===t?e.style.marginRight="":"width"===t?e.style.width="":"max-width"===t?e.style.maxWidth="":"padding"===t&&(e.style.paddingRight="")}};"undefined"!=typeof window&&window.addEventListener("resize",(function(e){B()})),"undefined"!=typeof document&&(document.addEventListener("touchstart",(function(e){S.scroll||(S.startTouchY=e.touches[0].clientY,S.startTouchX=e.touches[0].clientX)})),document.addEventListener("touchmove",(function(e){if(!S.scroll){var t=S.startTouchY,r=S.startTouchX,l=e.touches[0].clientY,o=e.touches[0].clientX;if(e.touches.length<2){var n=a(S.scrollableSelectors),c={up:t<l,down:t>l,left:r<o,right:r>o},i={up:t+3<l,down:t-3>l,left:r+3<o,right:r-3>o};!function t(r){var l=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(r){var o=u(r,n,!1);if(h(r))return!1;if(l||v(r)&&u(r,n)||d(r,n)){var a=!1;g(r)&&b(r)?(c.up&&f(r)||c.down&&p(r))&&(a=!0):f(r)&&p(r)?(c.left&&g(r)||c.right&&b(r))&&(a=!0):(i.up&&f(r)||i.down&&p(r)||i.left&&g(r)||i.right&&b(r))&&(a=!0),a&&(o?t(o,!0):e.cancelable&&e.preventDefault())}else t(o)}else e.cancelable&&e.preventDefault()}(e.target)}}}),{passive:!1}),document.addEventListener("touchend",(function(e){S.scroll||(S.startTouchY=0,S.startTouchX=0)})));var $={hide:function(e){c('"hide" is deprecated! Use "disablePageScroll" instead. \n https://github.com/FL3NKEY/scroll-lock#disablepagescrollscrollabletarget'),k(e)},show:function(e){c('"show" is deprecated! Use "enablePageScroll" instead. \n https://github.com/FL3NKEY/scroll-lock#enablepagescrollscrollabletarget'),w(e)},toggle:function(e){c('"toggle" is deprecated! Do not use it.'),A()?k():w(e)},getState:function(){return c('"getState" is deprecated! Use "getScrollState" instead. \n https://github.com/FL3NKEY/scroll-lock#getscrollstate'),A()},getWidth:function(){return c('"getWidth" is deprecated! Use "getPageScrollBarWidth" instead. \n https://github.com/FL3NKEY/scroll-lock#getpagescrollbarwidth'),G()},getCurrentWidth:function(){return c('"getCurrentWidth" is deprecated! Use "getCurrentPageScrollBarWidth" instead. \n https://github.com/FL3NKEY/scroll-lock#getcurrentpagescrollbarwidth'),P()},setScrollableTargets:function(e){c('"setScrollableTargets" is deprecated! Use "addScrollableTarget" instead. \n https://github.com/FL3NKEY/scroll-lock#addscrollabletargetscrollabletarget'),W(e)},setFillGapSelectors:function(e){c('"setFillGapSelectors" is deprecated! Use "addFillGapSelector" instead. \n https://github.com/FL3NKEY/scroll-lock#addfillgapselectorfillgapselector'),C(e)},setFillGapTargets:function(e){c('"setFillGapTargets" is deprecated! Use "addFillGapTarget" instead. \n https://github.com/FL3NKEY/scroll-lock#addfillgaptargetfillgaptarget'),M(e)},clearQueue:function(){c('"clearQueue" is deprecated! Use "clearQueueScrollLocks" instead. \n https://github.com/FL3NKEY/scroll-lock#clearqueuescrolllocks'),L()}},ee=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},l=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(l=l.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),l.forEach((function(t){m(e,t,r[t])}))}return e}({disablePageScroll:k,enablePageScroll:w,getScrollState:A,clearQueueScrollLocks:L,getTargetScrollBarWidth:x,getCurrentTargetScrollBarWidth:T,getPageScrollBarWidth:G,getCurrentPageScrollBarWidth:P,addScrollableSelector:F,removeScrollableSelector:O,addScrollableTarget:W,removeScrollableTarget:E,addLockableSelector:j,addLockableTarget:Y,addFillGapSelector:C,removeFillGapSelector:N,addFillGapTarget:M,removeFillGapTarget:U,setFillGapMethod:q,refillGaps:B,_state:S},$);t.default=ee}]).default},e.exports=t()}},t={};function r(l){var o=t[l];if(void 0!==o)return o.exports;var n=t[l]={exports:{}};return e[l].call(n.exports,n,n.exports,r),n.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var l in t)r.o(t,l)&&!r.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:t[l]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var l={};return(()=>{"use strict";r.d(l,{default:()=>n});var e=r(6265),t=r.n(e),o=r(9581);const n=function(e){var r=e.clearPanels,l=(0,o.A)("meganav-control-mobile-dropdown"),n=(0,o.A)("meganav-mobile-dropdown"),c=(0,o.A)("meganav-control-mobile-dropdown-menu"),a=(0,o.A)("meganav-control-mobile-dropdown-close"),i=(0,o.A)("meganav-mobile-search-input"),u=(0,o.A)("meganav-mobile-search-suggestions"),d=function(){"false"===l.getAttribute("aria-expanded")?(n.classList.replace("invisible","visible"),l.setAttribute("aria-expanded",!0),t().disablePageScroll()):(n.classList.replace("visible","invisible"),l.setAttribute("aria-expanded",!1),t().enablePageScroll(),r()),c.classList.toggle("hidden"),a.classList.toggle("hidden")},s=function(){u.classList.add("max-h-96")},f=function(e){e.relatedTarget!==u.querySelectorAll("a")[0]&&u.classList.remove("max-h-96")};return l.addEventListener("click",d),i.addEventListener("focus",s),i.addEventListener("blur",f),{teardown:function(){l.removeEventListener("click",d),t().enablePageScroll(),i.removeEventListener("focus",s),i.removeEventListener("blur",f)},clear:function(){n.classList.replace("visible","invisible"),l.setAttribute("aria-expanded",!1),c.classList.remove("hidden"),a.classList.add("hidden"),t().enablePageScroll(),u.classList.remove("max-h-96")}}}})(),l.default})()}));
+!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.MeganavControlMobileDropdown=t())}(this,(function(){return(()=>{var e={9581:(e,t,r)=>{"use strict";r.d(t,{A:()=>l});var l=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return t.querySelector("[data-id=".concat(e,"]"))}},6265:function(e){var t;t=function(){return function(e){var t={};function r(l){if(t[l])return t[l].exports;var o=t[l]={i:l,l:!1,exports:{}};return e[l].call(o.exports,o,o.exports,r),o.l=!0,o.exports}return r.m=e,r.c=t,r.d=function(e,t,l){r.o(e,t)||Object.defineProperty(e,t,{enumerable:!0,get:l})},r.r=function(e){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},r.t=function(e,t){if(1&t&&(e=r(e)),8&t)return e;if(4&t&&"object"==typeof e&&e&&e.__esModule)return e;var l=Object.create(null);if(r.r(l),Object.defineProperty(l,"default",{enumerable:!0,value:e}),2&t&&"string"!=typeof e)for(var o in e)r.d(l,o,function(t){return e[t]}.bind(null,o));return l},r.n=function(e){var t=e&&e.__esModule?function(){return e.default}:function(){return e};return r.d(t,"a",t),t},r.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},r.p="",r(r.s=0)}([function(e,t,r){"use strict";r.r(t);var l=function(e){return Array.isArray(e)?e:[e]},o=function(e){return e instanceof Node},n=function(e,t){if(e&&t){e=function(e){return e instanceof NodeList}(e)?e:[e];for(var r=0;r<e.length&&!0!==t(e[r],r,e.length);r++);}},c=function(e){return console.error("[scroll-lock] ".concat(e))},a=function(e){if(Array.isArray(e))return e.join(", ")},i=function(e){var t=[];return n(e,(function(e){return t.push(e)})),t},u=function(e,t){var r=!(arguments.length>2&&void 0!==arguments[2])||arguments[2],l=arguments.length>3&&void 0!==arguments[3]?arguments[3]:document;if(r&&-1!==i(l.querySelectorAll(t)).indexOf(e))return e;for(;(e=e.parentElement)&&-1===i(l.querySelectorAll(t)).indexOf(e););return e},d=function(e,t){var r=arguments.length>2&&void 0!==arguments[2]?arguments[2]:document,l=-1!==i(r.querySelectorAll(t)).indexOf(e);return l},s=function(e){if(e)return"hidden"===getComputedStyle(e).overflow},f=function(e){if(e)return!!s(e)||e.scrollTop<=0},p=function(e){if(e){if(s(e))return!0;var t=e.scrollTop,r=e.scrollHeight;return t+e.offsetHeight>=r}},g=function(e){if(e)return!!s(e)||e.scrollLeft<=0},b=function(e){if(e){if(s(e))return!0;var t=e.scrollLeft,r=e.scrollWidth;return t+e.offsetWidth>=r}},v=function(e){return d(e,'textarea, [contenteditable="true"]')},h=function(e){return d(e,'input[type="range"]')};function m(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}r.d(t,"disablePageScroll",(function(){return k})),r.d(t,"enablePageScroll",(function(){return w})),r.d(t,"getScrollState",(function(){return A})),r.d(t,"clearQueueScrollLocks",(function(){return x})),r.d(t,"getTargetScrollBarWidth",(function(){return L})),r.d(t,"getCurrentTargetScrollBarWidth",(function(){return G})),r.d(t,"getPageScrollBarWidth",(function(){return T})),r.d(t,"getCurrentPageScrollBarWidth",(function(){return P})),r.d(t,"addScrollableTarget",(function(){return W})),r.d(t,"removeScrollableTarget",(function(){return F})),r.d(t,"addScrollableSelector",(function(){return O})),r.d(t,"removeScrollableSelector",(function(){return E})),r.d(t,"addLockableTarget",(function(){return Y})),r.d(t,"addLockableSelector",(function(){return j})),r.d(t,"setFillGapMethod",(function(){return q})),r.d(t,"addFillGapTarget",(function(){return M})),r.d(t,"removeFillGapTarget",(function(){return U})),r.d(t,"addFillGapSelector",(function(){return C})),r.d(t,"removeFillGapSelector",(function(){return N})),r.d(t,"refillGaps",(function(){return B}));var y=["padding","margin","width","max-width","none"],S={scroll:!0,queue:0,scrollableSelectors:["[data-scroll-lock-scrollable]"],lockableSelectors:["body","[data-scroll-lock-lockable]"],fillGapSelectors:["body","[data-scroll-lock-fill-gap]","[data-scroll-lock-lockable]"],fillGapMethod:y[0],startTouchY:0,startTouchX:0},k=function(e){S.queue<=0&&(S.scroll=!1,K(),H()),W(e),S.queue++},w=function(e){S.queue>0&&S.queue--,S.queue<=0&&(S.scroll=!0,R(),z()),F(e)},A=function(){return S.scroll},x=function(){S.queue=0},L=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(o(e)){var r=e.style.overflowY;t?A()||(e.style.overflowY=e.getAttribute("data-scroll-lock-saved-overflow-y-property")):e.style.overflowY="scroll";var l=G(e);return e.style.overflowY=r,l}return 0},G=function(e){if(o(e)){if(e===document.body){var t=document.documentElement.clientWidth;return window.innerWidth-t}var r=e.style.borderLeftWidth,l=e.style.borderRightWidth;e.style.borderLeftWidth="0px",e.style.borderRightWidth="0px";var n=e.offsetWidth-e.clientWidth;return e.style.borderLeftWidth=r,e.style.borderRightWidth=l,n}return 0},T=function(){var e=arguments.length>0&&void 0!==arguments[0]&&arguments[0];return L(document.body,e)},P=function(){return G(document.body)},W=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?e.setAttribute("data-scroll-lock-scrollable",""):c('"'.concat(e,'" is not a Element.'))}))}))},F=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?e.removeAttribute("data-scroll-lock-scrollable"):c('"'.concat(e,'" is not a Element.'))}))}))},O=function(e){e&&l(e).map((function(e){S.scrollableSelectors.push(e)}))},E=function(e){e&&l(e).map((function(e){S.scrollableSelectors=S.scrollableSelectors.filter((function(t){return t!==e}))}))},Y=function(e){e&&(l(e).map((function(e){n(e,(function(e){o(e)?e.setAttribute("data-scroll-lock-lockable",""):c('"'.concat(e,'" is not a Element.'))}))})),A()||K())},j=function(e){e&&(l(e).map((function(e){S.lockableSelectors.push(e)})),A()||K(),C(e))},q=function(e){if(e)if(-1!==y.indexOf(e))S.fillGapMethod=e,B();else{var t=y.join(", ");c('"'.concat(e,'" method is not available!\nAvailable fill gap methods: ').concat(t,"."))}},M=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?(e.setAttribute("data-scroll-lock-fill-gap",""),S.scroll||J(e)):c('"'.concat(e,'" is not a Element.'))}))}))},U=function(e){e&&l(e).map((function(e){n(e,(function(e){o(e)?(e.removeAttribute("data-scroll-lock-fill-gap"),S.scroll||Z(e)):c('"'.concat(e,'" is not a Element.'))}))}))},C=function(e){e&&l(e).map((function(e){-1===S.fillGapSelectors.indexOf(e)&&(S.fillGapSelectors.push(e),S.scroll||I(e))}))},N=function(e){e&&l(e).map((function(e){S.fillGapSelectors=S.fillGapSelectors.filter((function(t){return t!==e})),S.scroll||V(e)}))},B=function(){S.scroll||H()},K=function(){var e=a(S.lockableSelectors);_(e)},R=function(){var e=a(S.lockableSelectors);X(e)},_=function(e){var t=document.querySelectorAll(e);n(t,(function(e){D(e)}))},X=function(e){var t=document.querySelectorAll(e);n(t,(function(e){Q(e)}))},D=function(e){if(o(e)&&"true"!==e.getAttribute("data-scroll-lock-locked")){var t=window.getComputedStyle(e);e.setAttribute("data-scroll-lock-saved-overflow-y-property",t.overflowY),e.setAttribute("data-scroll-lock-saved-inline-overflow-property",e.style.overflow),e.setAttribute("data-scroll-lock-saved-inline-overflow-y-property",e.style.overflowY),e.style.overflow="hidden",e.setAttribute("data-scroll-lock-locked","true")}},Q=function(e){o(e)&&"true"===e.getAttribute("data-scroll-lock-locked")&&(e.style.overflow=e.getAttribute("data-scroll-lock-saved-inline-overflow-property"),e.style.overflowY=e.getAttribute("data-scroll-lock-saved-inline-overflow-y-property"),e.removeAttribute("data-scroll-lock-saved-overflow-property"),e.removeAttribute("data-scroll-lock-saved-inline-overflow-property"),e.removeAttribute("data-scroll-lock-saved-inline-overflow-y-property"),e.removeAttribute("data-scroll-lock-locked"))},H=function(){S.fillGapSelectors.map((function(e){I(e)}))},z=function(){S.fillGapSelectors.map((function(e){V(e)}))},I=function(e){var t=document.querySelectorAll(e),r=-1!==S.lockableSelectors.indexOf(e);n(t,(function(e){J(e,r)}))},J=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(o(e)){var r;if(""===e.getAttribute("data-scroll-lock-lockable")||t)r=L(e,!0);else{var l=u(e,a(S.lockableSelectors));r=L(l,!0)}"true"===e.getAttribute("data-scroll-lock-filled-gap")&&Z(e);var n=window.getComputedStyle(e);if(e.setAttribute("data-scroll-lock-filled-gap","true"),e.setAttribute("data-scroll-lock-current-fill-gap-method",S.fillGapMethod),"margin"===S.fillGapMethod){var c=parseFloat(n.marginRight);e.style.marginRight="".concat(c+r,"px")}else if("width"===S.fillGapMethod)e.style.width="calc(100% - ".concat(r,"px)");else if("max-width"===S.fillGapMethod)e.style.maxWidth="calc(100% - ".concat(r,"px)");else if("padding"===S.fillGapMethod){var i=parseFloat(n.paddingRight);e.style.paddingRight="".concat(i+r,"px")}}},V=function(e){var t=document.querySelectorAll(e);n(t,(function(e){Z(e)}))},Z=function(e){if(o(e)&&"true"===e.getAttribute("data-scroll-lock-filled-gap")){var t=e.getAttribute("data-scroll-lock-current-fill-gap-method");e.removeAttribute("data-scroll-lock-filled-gap"),e.removeAttribute("data-scroll-lock-current-fill-gap-method"),"margin"===t?e.style.marginRight="":"width"===t?e.style.width="":"max-width"===t?e.style.maxWidth="":"padding"===t&&(e.style.paddingRight="")}};"undefined"!=typeof window&&window.addEventListener("resize",(function(e){B()})),"undefined"!=typeof document&&(document.addEventListener("touchstart",(function(e){S.scroll||(S.startTouchY=e.touches[0].clientY,S.startTouchX=e.touches[0].clientX)})),document.addEventListener("touchmove",(function(e){if(!S.scroll){var t=S.startTouchY,r=S.startTouchX,l=e.touches[0].clientY,o=e.touches[0].clientX;if(e.touches.length<2){var n=a(S.scrollableSelectors),c={up:t<l,down:t>l,left:r<o,right:r>o},i={up:t+3<l,down:t-3>l,left:r+3<o,right:r-3>o};!function t(r){var l=arguments.length>1&&void 0!==arguments[1]&&arguments[1];if(r){var o=u(r,n,!1);if(h(r))return!1;if(l||v(r)&&u(r,n)||d(r,n)){var a=!1;g(r)&&b(r)?(c.up&&f(r)||c.down&&p(r))&&(a=!0):f(r)&&p(r)?(c.left&&g(r)||c.right&&b(r))&&(a=!0):(i.up&&f(r)||i.down&&p(r)||i.left&&g(r)||i.right&&b(r))&&(a=!0),a&&(o?t(o,!0):e.cancelable&&e.preventDefault())}else t(o)}else e.cancelable&&e.preventDefault()}(e.target)}}}),{passive:!1}),document.addEventListener("touchend",(function(e){S.scroll||(S.startTouchY=0,S.startTouchX=0)})));var $={hide:function(e){c('"hide" is deprecated! Use "disablePageScroll" instead. \n https://github.com/FL3NKEY/scroll-lock#disablepagescrollscrollabletarget'),k(e)},show:function(e){c('"show" is deprecated! Use "enablePageScroll" instead. \n https://github.com/FL3NKEY/scroll-lock#enablepagescrollscrollabletarget'),w(e)},toggle:function(e){c('"toggle" is deprecated! Do not use it.'),A()?k():w(e)},getState:function(){return c('"getState" is deprecated! Use "getScrollState" instead. \n https://github.com/FL3NKEY/scroll-lock#getscrollstate'),A()},getWidth:function(){return c('"getWidth" is deprecated! Use "getPageScrollBarWidth" instead. \n https://github.com/FL3NKEY/scroll-lock#getpagescrollbarwidth'),T()},getCurrentWidth:function(){return c('"getCurrentWidth" is deprecated! Use "getCurrentPageScrollBarWidth" instead. \n https://github.com/FL3NKEY/scroll-lock#getcurrentpagescrollbarwidth'),P()},setScrollableTargets:function(e){c('"setScrollableTargets" is deprecated! Use "addScrollableTarget" instead. \n https://github.com/FL3NKEY/scroll-lock#addscrollabletargetscrollabletarget'),W(e)},setFillGapSelectors:function(e){c('"setFillGapSelectors" is deprecated! Use "addFillGapSelector" instead. \n https://github.com/FL3NKEY/scroll-lock#addfillgapselectorfillgapselector'),C(e)},setFillGapTargets:function(e){c('"setFillGapTargets" is deprecated! Use "addFillGapTarget" instead. \n https://github.com/FL3NKEY/scroll-lock#addfillgaptargetfillgaptarget'),M(e)},clearQueue:function(){c('"clearQueue" is deprecated! Use "clearQueueScrollLocks" instead. \n https://github.com/FL3NKEY/scroll-lock#clearqueuescrolllocks'),x()}},ee=function(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{},l=Object.keys(r);"function"==typeof Object.getOwnPropertySymbols&&(l=l.concat(Object.getOwnPropertySymbols(r).filter((function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable})))),l.forEach((function(t){m(e,t,r[t])}))}return e}({disablePageScroll:k,enablePageScroll:w,getScrollState:A,clearQueueScrollLocks:x,getTargetScrollBarWidth:L,getCurrentTargetScrollBarWidth:G,getPageScrollBarWidth:T,getCurrentPageScrollBarWidth:P,addScrollableSelector:O,removeScrollableSelector:E,addScrollableTarget:W,removeScrollableTarget:F,addLockableSelector:j,addLockableTarget:Y,addFillGapSelector:C,removeFillGapSelector:N,addFillGapTarget:M,removeFillGapTarget:U,setFillGapMethod:q,refillGaps:B,_state:S},$);t.default=ee}]).default},e.exports=t()}},t={};function r(l){var o=t[l];if(void 0!==o)return o.exports;var n=t[l]={exports:{}};return e[l].call(n.exports,n,n.exports,r),n.exports}r.n=e=>{var t=e&&e.__esModule?()=>e.default:()=>e;return r.d(t,{a:t}),t},r.d=(e,t)=>{for(var l in t)r.o(t,l)&&!r.o(e,l)&&Object.defineProperty(e,l,{enumerable:!0,get:t[l]})},r.o=(e,t)=>Object.prototype.hasOwnProperty.call(e,t);var l={};return(()=>{"use strict";r.d(l,{default:()=>n});var e=r(6265),t=r.n(e),o=r(9581);const n=function(e){var r=e.clearPanels,l=(0,o.A)("meganav-control-mobile-dropdown"),n=(0,o.A)("meganav-mobile-dropdown"),c=(0,o.A)("meganav-control-mobile-dropdown-menu"),a=(0,o.A)("meganav-control-mobile-dropdown-close"),i=function(){"false"===l.getAttribute("aria-expanded")?(n.classList.replace("invisible","visible"),l.setAttribute("aria-expanded",!0),t().disablePageScroll()):(n.classList.replace("visible","invisible"),l.setAttribute("aria-expanded",!1),t().enablePageScroll(),r()),c.classList.toggle("hidden"),a.classList.toggle("hidden")};return l.addEventListener("click",i),{teardown:function(){l.removeEventListener("click",i),t().enablePageScroll()},clear:function(){n.classList.replace("visible","invisible"),l.setAttribute("aria-expanded",!1),c.classList.remove("hidden"),a.classList.add("hidden"),t().enablePageScroll()}}}})(),l.default})()}));

package/core/MeganavItemsMobile.jsx

@@ -293,29 +293,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-text-overline2 text-cool-black py-12"
   }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-    className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
+    className: "flex justify-between items-center overflow-hidden"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
-    className: "flex"
+    className: "flex transition-transform"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pr-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/how-ably-works"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/quick-start-guide"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/core-features/pubsub"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pl-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/platform"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
     url: absUrl("/support"),
     textSize: "text-p2"
@@ -681,6 +681,7 @@ var MeganavItemsMobile = function MeganavItemsMobile(_ref) {
       maxWidth: "none"
     },
     placeholder: "Search",
+    autoComplete: "off",
     "data-id": "meganav-mobile-search-input"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_9__.default, null))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "max-h-0 overflow-hidden transition-all",

package/core/MeganavItemsSignedIn.jsx

@@ -184,7 +184,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     type: "button",
     "data-id": "meganav-control",
     "data-control": "search",
-    className: "h-64 w-24 px-24 pr-48 py-20",
+    className: "h-64 w-24 px-24 pr-48 py-20 group focus:outline-none",
     "aria-expanded": "false",
     "aria-controls": "panel-search",
     "aria-label": "Show Search Panel"
@@ -192,7 +192,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     name: "icon-gui-search",
     color: "text-cool-black",
     size: "1.5rem",
-    additionalCSS: "hover:text-gui-hover"
+    additionalCSS: "group-hover:text-gui-hover group-focus:text-gui-focus"
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "ui-meganav-panel invisible",
     id: "panel-search",
@@ -278,6 +278,7 @@ var MeganavSearchPanel = function MeganavSearchPanel(_ref) {
     name: "q",
     className: "ui-input pl-48 h-48",
     placeholder: "Search",
+    autoComplete: "off",
     "data-id": "meganav-search-input"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_4__.default, null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
     type: "submit",
@@ -319,29 +320,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-text-overline2 text-cool-black py-12"
   }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-    className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
+    className: "flex justify-between items-center overflow-hidden"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
-    className: "flex"
+    className: "flex transition-transform"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pr-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/how-ably-works"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/quick-start-guide"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/core-features/pubsub"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pl-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/platform"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
     url: absUrl("/support"),
     textSize: "text-p2"

package/core/MeganavSearch.jsx

@@ -183,6 +183,7 @@ var MeganavSearchPanel = function MeganavSearchPanel(_ref) {
     name: "q",
     className: "ui-input pl-48 h-48",
     placeholder: "Search",
+    autoComplete: "off",
     "data-id": "meganav-search-input"
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_4__.default, null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
     type: "submit",
@@ -224,29 +225,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
   return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("p", {
     className: "ui-text-overline2 text-cool-black py-12"
   }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
-    className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
+    className: "flex justify-between items-center overflow-hidden"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
-    className: "flex"
+    className: "flex transition-transform"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pr-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/how-ably-works"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/quick-start-guide"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 px-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/docs/core-features/pubsub"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
     className: "py-12 pl-8 flex-shrink-0"
   }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
     href: absUrl("/platform"),
-    className: "ui-text-p2"
+    className: "ui-text-p2 hover:text-gui-hover active:text-gui-active focus:text-gui-focus"
   }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
     url: absUrl("/support"),
     textSize: "text-p2"
@@ -473,7 +474,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     type: "button",
     "data-id": "meganav-control",
     "data-control": "search",
-    className: "h-64 w-24 px-24 pr-48 py-20",
+    className: "h-64 w-24 px-24 pr-48 py-20 group focus:outline-none",
     "aria-expanded": "false",
     "aria-controls": "panel-search",
     "aria-label": "Show Search Panel"
@@ -481,7 +482,7 @@ var MeganavSearch = function MeganavSearch(_ref) {
     name: "icon-gui-search",
     color: "text-cool-black",
     size: "1.5rem",
-    additionalCSS: "hover:text-gui-hover"
+    additionalCSS: "group-hover:text-gui-hover group-focus:text-gui-focus"
   })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
     className: "ui-meganav-panel invisible",
     id: "panel-search",