@ably/ui 7.10.0-dev.45e131a → 7.10.0-dev.ccd5fa3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/core/Meganav/component.js +2 -1
  2. package/core/Meganav/component.js.LICENSE.txt +7 -0
  3. package/core/Meganav.jsx +7782 -4775
  4. package/core/MeganavContentWhyAbly.jsx +1 -1
  5. package/core/MeganavControl/component.js +1 -1
  6. package/core/MeganavControlMobileDropdown/component.js +1 -1
  7. package/core/MeganavItemsMobile.jsx +50 -10
  8. package/core/MeganavItemsSignedIn.jsx +37 -8
  9. package/core/MeganavSearch.jsx +37 -8
  10. package/core/MeganavSearchAutocomplete/component.js +2 -0
  11. package/core/MeganavSearchAutocomplete/component.js.LICENSE.txt +7 -0
  12. package/core/MeganavSearchAutocomplete.jsx +117 -0
  13. package/core/MeganavSearchPanel.jsx +35 -7
  14. package/core/MeganavSearchSuggestions.jsx +5 -5
  15. package/core/scripts.js +1 -1
  16. package/package.json +2 -1
  17. package/src/core/Meganav/component.js +4 -0
  18. package/src/core/MeganavControl/component.js +37 -12
  19. package/src/core/MeganavControlMobileDropdown/component.js +16 -7
  20. package/src/core/MeganavItemsMobile/component.html.erb +19 -3
  21. package/src/core/MeganavItemsMobile/component.jsx +20 -3
  22. package/src/core/MeganavSearch/component.html.erb +2 -1
  23. package/src/core/MeganavSearch/component.jsx +2 -1
  24. package/src/core/MeganavSearchAutocomplete/component.html.erb +6 -0
  25. package/src/core/MeganavSearchAutocomplete/component.js +170 -0
  26. package/src/core/MeganavSearchAutocomplete/component.jsx +14 -0
  27. package/src/core/MeganavSearchAutocomplete/component.rb +6 -0
  28. package/src/core/MeganavSearchPanel/component.html.erb +3 -1
  29. package/src/core/MeganavSearchPanel/component.jsx +4 -1
  30. package/src/core/MeganavSearchSuggestions/component.html.erb +5 -5
  31. package/src/core/MeganavSearchSuggestions/component.jsx +5 -5
  32. package/src/core/remote-blogs-posts.js +1 -1
  33. package/src/core/remote-session-data.js +1 -1
@@ -0,0 +1,117 @@
1
+ (function webpackUniversalModuleDefinition(root, factory) {
2
+ if(typeof exports === 'object' && typeof module === 'object')
3
+ module.exports = factory(require("react"));
4
+ else if(typeof define === 'function' && define.amd)
5
+ define([], factory);
6
+ else {
7
+ var a = typeof exports === 'object' ? factory(require("react")) : factory(root[undefined]);
8
+ for(var i in a) (typeof exports === 'object' ? exports : root)[i] = a[i];
9
+ }
10
+ })(this, function(__WEBPACK_EXTERNAL_MODULE__9281__) {
11
+ return /******/ (() => { // webpackBootstrap
12
+ /******/ "use strict";
13
+ /******/ var __webpack_modules__ = ({
14
+
15
+ /***/ 9281:
16
+ /***/ ((module) => {
17
+
18
+ module.exports = __WEBPACK_EXTERNAL_MODULE__9281__;
19
+
20
+ /***/ })
21
+
22
+ /******/ });
23
+ /************************************************************************/
24
+ /******/ // The module cache
25
+ /******/ var __webpack_module_cache__ = {};
26
+ /******/
27
+ /******/ // The require function
28
+ /******/ function __webpack_require__(moduleId) {
29
+ /******/ // Check if module is in cache
30
+ /******/ var cachedModule = __webpack_module_cache__[moduleId];
31
+ /******/ if (cachedModule !== undefined) {
32
+ /******/ return cachedModule.exports;
33
+ /******/ }
34
+ /******/ // Create a new module (and put it into the cache)
35
+ /******/ var module = __webpack_module_cache__[moduleId] = {
36
+ /******/ // no module.id needed
37
+ /******/ // no module.loaded needed
38
+ /******/ exports: {}
39
+ /******/ };
40
+ /******/
41
+ /******/ // Execute the module function
42
+ /******/ __webpack_modules__[moduleId](module, module.exports, __webpack_require__);
43
+ /******/
44
+ /******/ // Return the exports of the module
45
+ /******/ return module.exports;
46
+ /******/ }
47
+ /******/
48
+ /************************************************************************/
49
+ /******/ /* webpack/runtime/compat get default export */
50
+ /******/ (() => {
51
+ /******/ // getDefaultExport function for compatibility with non-harmony modules
52
+ /******/ __webpack_require__.n = (module) => {
53
+ /******/ var getter = module && module.__esModule ?
54
+ /******/ () => (module['default']) :
55
+ /******/ () => (module);
56
+ /******/ __webpack_require__.d(getter, { a: getter });
57
+ /******/ return getter;
58
+ /******/ };
59
+ /******/ })();
60
+ /******/
61
+ /******/ /* webpack/runtime/define property getters */
62
+ /******/ (() => {
63
+ /******/ // define getter functions for harmony exports
64
+ /******/ __webpack_require__.d = (exports, definition) => {
65
+ /******/ for(var key in definition) {
66
+ /******/ if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {
67
+ /******/ Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });
68
+ /******/ }
69
+ /******/ }
70
+ /******/ };
71
+ /******/ })();
72
+ /******/
73
+ /******/ /* webpack/runtime/hasOwnProperty shorthand */
74
+ /******/ (() => {
75
+ /******/ __webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
76
+ /******/ })();
77
+ /******/
78
+ /******/ /* webpack/runtime/make namespace object */
79
+ /******/ (() => {
80
+ /******/ // define __esModule on exports
81
+ /******/ __webpack_require__.r = (exports) => {
82
+ /******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
83
+ /******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
84
+ /******/ }
85
+ /******/ Object.defineProperty(exports, '__esModule', { value: true });
86
+ /******/ };
87
+ /******/ })();
88
+ /******/
89
+ /************************************************************************/
90
+ var __webpack_exports__ = {};
91
+ // This entry need to be wrapped in an IIFE because it need to be isolated against other modules in the chunk.
92
+ (() => {
93
+ __webpack_require__.r(__webpack_exports__);
94
+ /* harmony export */ __webpack_require__.d(__webpack_exports__, {
95
+ /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
96
+ /* harmony export */ });
97
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
98
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
99
+
100
+
101
+ var MeganavSearchAutocomplete = function MeganavSearchAutocomplete() {
102
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
103
+ className: "absolute w-full mt-8 z-10 hidden shadow-container rounded-lg bg-white border border-mid-grey",
104
+ "data-id": "meganav-search-autocomplete-container"
105
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ol", {
106
+ className: "m-16",
107
+ "data-id": "meganav-search-autocomplete-list"
108
+ }));
109
+ };
110
+
111
+ /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MeganavSearchAutocomplete);
112
+ })();
113
+
114
+ /******/ return __webpack_exports__;
115
+ /******/ })()
116
+ ;
117
+ });
@@ -114,6 +114,31 @@ Icon.propTypes = {
114
114
 
115
115
  /***/ }),
116
116
 
117
+ /***/ 3833:
118
+ /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
119
+
120
+ "use strict";
121
+ /* harmony export */ __webpack_require__.d(__webpack_exports__, {
122
+ /* harmony export */ "default": () => (__WEBPACK_DEFAULT_EXPORT__)
123
+ /* harmony export */ });
124
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(9281);
125
+ /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);
126
+
127
+
128
+ var MeganavSearchAutocomplete = function MeganavSearchAutocomplete() {
129
+ return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
130
+ className: "absolute w-full mt-8 z-10 hidden shadow-container rounded-lg bg-white border border-mid-grey",
131
+ "data-id": "meganav-search-autocomplete-container"
132
+ }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ol", {
133
+ className: "m-16",
134
+ "data-id": "meganav-search-autocomplete-list"
135
+ }));
136
+ };
137
+
138
+ /* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (MeganavSearchAutocomplete);
139
+
140
+ /***/ }),
141
+
117
142
  /***/ 8926:
118
143
  /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
119
144
 
@@ -136,29 +161,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
136
161
  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", {
137
162
  className: "ui-text-overline2 text-cool-black py-12"
138
163
  }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
139
- className: "flex justify-between items-center overflow-x-scroll"
164
+ className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
140
165
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
141
166
  className: "flex"
142
167
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
143
168
  className: "py-12 pr-8 flex-shrink-0"
144
169
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
145
170
  href: absUrl("/docs/how-ably-works"),
146
- className: "ui-text-p2 ui-link"
171
+ className: "ui-text-p2"
147
172
  }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
148
173
  className: "py-12 px-8 flex-shrink-0"
149
174
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
150
175
  href: absUrl("/docs/quick-start-guide"),
151
- className: "ui-text-p2 ui-link"
176
+ className: "ui-text-p2"
152
177
  }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
153
178
  className: "py-12 px-8 flex-shrink-0"
154
179
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
155
180
  href: absUrl("/docs/core-features/pubsub"),
156
- className: "ui-text-p2 ui-link"
181
+ className: "ui-text-p2"
157
182
  }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
158
183
  className: "py-12 pl-8 flex-shrink-0"
159
184
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
160
185
  href: absUrl("/platform"),
161
- className: "ui-text-p2 ui-link"
186
+ className: "ui-text-p2"
162
187
  }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
163
188
  url: absUrl("/support"),
164
189
  textSize: "text-p2"
@@ -374,6 +399,8 @@ __webpack_require__.r(__webpack_exports__);
374
399
  /* harmony import */ var prop_types__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(prop_types__WEBPACK_IMPORTED_MODULE_1__);
375
400
  /* harmony import */ var _Icon_component_jsx__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(9008);
376
401
  /* harmony import */ var _MeganavSearchSuggestions_component_jsx__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(8926);
402
+ /* harmony import */ var _MeganavSearchAutocomplete_component_jsx__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(3833);
403
+
377
404
 
378
405
 
379
406
 
@@ -402,8 +429,9 @@ var MeganavSearchPanel = function MeganavSearchPanel(_ref) {
402
429
  type: "search",
403
430
  name: "q",
404
431
  className: "ui-input pl-48 h-48",
405
- placeholder: "Search"
406
- })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("button", {
432
+ placeholder: "Search",
433
+ "data-id": "meganav-search-input"
434
+ }), /*#__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", {
407
435
  type: "submit",
408
436
  className: "ui-btn-secondary ml-8 sm:ml-16 md:ml-24 xl:ml-32"
409
437
  }, "Search")))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
@@ -324,29 +324,29 @@ var MeganavSearchSuggestions = function MeganavSearchSuggestions(_ref) {
324
324
  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", {
325
325
  className: "ui-text-overline2 text-cool-black py-12"
326
326
  }, "Popular pages"), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("div", {
327
- className: "flex justify-between items-center overflow-x-scroll"
327
+ className: "flex justify-between items-center overflow-x-scroll md:overflow-auto"
328
328
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("ul", {
329
329
  className: "flex"
330
330
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
331
331
  className: "py-12 pr-8 flex-shrink-0"
332
332
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
333
333
  href: absUrl("/docs/how-ably-works"),
334
- className: "ui-text-p2 ui-link"
334
+ className: "ui-text-p2"
335
335
  }, "How does Ably work?")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
336
336
  className: "py-12 px-8 flex-shrink-0"
337
337
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
338
338
  href: absUrl("/docs/quick-start-guide"),
339
- className: "ui-text-p2 ui-link"
339
+ className: "ui-text-p2"
340
340
  }, "Quickstart guide")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
341
341
  className: "py-12 px-8 flex-shrink-0"
342
342
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
343
343
  href: absUrl("/docs/core-features/pubsub"),
344
- className: "ui-text-p2 ui-link"
344
+ className: "ui-text-p2"
345
345
  }, "Publish/Subscribe Messaging")), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("li", {
346
346
  className: "py-12 pl-8 flex-shrink-0"
347
347
  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement("a", {
348
348
  href: absUrl("/platform"),
349
- className: "ui-text-p2 ui-link"
349
+ className: "ui-text-p2"
350
350
  }, "Platform"))), displaySupportLink ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_FeaturedLink_component_jsx__WEBPACK_IMPORTED_MODULE_2__.default, {
351
351
  url: absUrl("/support"),
352
352
  textSize: "text-p2"
package/core/scripts.js CHANGED
@@ -1 +1 @@
1
- !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define([,],e):"object"==typeof exports?exports.AblyUi=e(require("react"),require("react-dom")):(t.AblyUi=t.AblyUi||{},t.AblyUi.Core=e(t[void 0],t[void 0]))}(this,(function(t,e){return(()=>{var r={757:(t,e,r)=>{t.exports=r(666)},666:t=>{var e=function(t){"use strict";var e,r=Object.prototype,n=r.hasOwnProperty,o="function"==typeof Symbol?Symbol:{},i=o.iterator||"@@iterator",a=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{u({},"")}catch(t){u=function(t,e,r){return t[e]=r}}function f(t,e,r,n){var o=e&&e.prototype instanceof v?e:v,i=Object.create(o.prototype),a=new A(n||[]);return i._invoke=function(t,e,r){var n=l;return function(o,i){if(n===h)throw new Error("Generator is already running");if(n===d){if("throw"===o)throw i;return k()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=P(a,r);if(c){if(c===y)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(n===l)throw n=d,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n=h;var u=s(t,e,r);if("normal"===u.type){if(n=r.done?d:p,u.arg===y)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n=d,r.method="throw",r.arg=u.arg)}}}(t,r,a),i}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=f;var l="suspendedStart",p="suspendedYield",h="executing",d="completed",y={};function v(){}function b(){}function g(){}var w={};w[i]=function(){return this};var m=Object.getPrototypeOf,O=m&&m(m(N([])));O&&O!==r&&n.call(O,i)&&(w=O);var x=g.prototype=v.prototype=Object.create(w);function E(t){["next","throw","return"].forEach((function(e){u(t,e,(function(t){return this._invoke(e,t)}))}))}function j(t,e){function r(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var f=u.arg,l=f.value;return l&&"object"==typeof l&&n.call(l,"__await")?e.resolve(l.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(l).then((function(t){f.value=t,a(f)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}var o;this._invoke=function(t,n){function i(){return new e((function(e,o){r(t,n,e,o)}))}return o=o?o.then(i,i):i()}}function P(t,r){var n=t.iterator[r.method];if(n===e){if(r.delegate=null,"throw"===r.method){if(t.iterator.return&&(r.method="return",r.arg=e,P(t,r),"throw"===r.method))return y;r.method="throw",r.arg=new TypeError("The iterator does not provide a 'throw' method")}return y}var o=s(n,t.iterator,r.arg);if("throw"===o.type)return r.method="throw",r.arg=o.arg,r.delegate=null,y;var i=o.arg;return i?i.done?(r[t.resultName]=i.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):i:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function S(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function L(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function A(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(S,this),this.reset(!0)}function N(t){if(t){var r=t[i];if(r)return r.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var o=-1,a=function r(){for(;++o<t.length;)if(n.call(t,o))return r.value=t[o],r.done=!1,r;return r.value=e,r.done=!0,r};return a.next=a}}return{next:k}}function k(){return{value:e,done:!0}}return b.prototype=x.constructor=g,g.constructor=b,b.displayName=u(g,c,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===b||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,g):(t.__proto__=g,u(t,c,"GeneratorFunction")),t.prototype=Object.create(x),t},t.awrap=function(t){return{__await:t}},E(j.prototype),j.prototype[a]=function(){return this},t.AsyncIterator=j,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new j(f(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},E(x),u(x,c,"Generator"),x[i]=function(){return this},x.toString=function(){return"[object Generator]"},t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=N,A.prototype={constructor:A,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=e,this.done=!1,this.delegate=null,this.method="next",this.arg=e,this.tryEntries.forEach(L),!t)for(var r in this)"t"===r.charAt(0)&&n.call(this,r)&&!isNaN(+r.slice(1))&&(this[r]=e)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var r=this;function o(n,o){return c.type="throw",c.arg=t,r.next=n,o&&(r.method="next",r.arg=e),!!o}for(var i=this.tryEntries.length-1;i>=0;--i){var a=this.tryEntries[i],c=a.completion;if("root"===a.tryLoc)return o("end");if(a.tryLoc<=this.prev){var u=n.call(a,"catchLoc"),f=n.call(a,"finallyLoc");if(u&&f){if(this.prev<a.catchLoc)return o(a.catchLoc,!0);if(this.prev<a.finallyLoc)return o(a.finallyLoc)}else if(u){if(this.prev<a.catchLoc)return o(a.catchLoc,!0)}else{if(!f)throw new Error("try statement without catch or finally");if(this.prev<a.finallyLoc)return o(a.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var i=o;break}}i&&("break"===t||"continue"===t)&&i.tryLoc<=e&&e<=i.finallyLoc&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,y):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),y},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),L(r),y}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;L(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:N(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}(t.exports);try{regeneratorRuntime=e}catch(t){Function("r","regeneratorRuntime = r")(e)}},281:e=>{"use strict";e.exports=t},645:t=>{"use strict";t.exports=e}},n={};function o(t){var e=n[t];if(void 0!==e)return e.exports;var i=n[t]={exports:{}};return r[t](i,i.exports,o),i.exports}o.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return o.d(e,{a:e}),e},o.d=(t,e)=>{for(var r in e)o.o(e,r)&&!o.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";o.r(i),o.d(i,{attachStoreToWindow:()=>O,connectState:()=>E,createRemoteDataStore:()=>j,fetchBlogPosts:()=>T,fetchSessionData:()=>M,getRemoteDataStore:()=>x,loadSprites:()=>u,queryId:()=>f,queryIdAll:()=>s,reactRenderer:()=>c,reducerBlogPosts:()=>D,reducerSessionData:()=>F,renderComponent:()=>a,selectRecentBlogPosts:()=>I,selectSessionData:()=>W,toggleChatWidget:()=>d}),Array.prototype.flat||Object.defineProperty(Array.prototype,"flat",{configurable:!0,value:function t(){var e=isNaN(arguments[0])?1:Number(arguments[0]);return e?Array.prototype.reduce.call(this,(function(r,n){return Array.isArray(n)?r.push.apply(r,t.call(n,e-1)):r.push(n),r}),[]):Array.prototype.slice.call(this)},writable:!0}),Array.prototype.flatMap||Object.defineProperty(Array.prototype,"flatMap",{configurable:!0,value:function(t){return Array.prototype.map.apply(this,arguments).flat()},writable:!0});var t=o(281),e=o.n(t),r=o(645),n=o.n(r),a=function(t,r,o){return n().render(e().createElement(t,r),o)};function c(t){var r=document.querySelectorAll("[data-react]");Array.from(r).forEach((function(r){var o=r.getAttribute("data-react"),i=t[o];if(i){var a=r.getAttribute("data-react-props"),c=a&&JSON.parse(a||{});n().render(e().createElement(i,c),r),r.removeAttribute("data-react"),r.removeAttribute("data-react-props")}}))}const u=function(t){fetch(t).then((function(t){return t.text()})).then((function(t){var e=document.createElement("div");e.style.display="none",e.innerHTML=t,document.body.appendChild(e)})).catch((function(t){return console.error(t)}))};var f=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return e.querySelector("[data-id=".concat(t,"]"))},s=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return e.querySelectorAll("[data-id=".concat(t,"]"))};function l(t,e){t.disabled=!1,t.innerText=e}function p(t,e){t.disabled=!0,t.innerText=e}var h=30;function d(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.dataId,r=f(e),n=f("open-chat-widget",r),o=n.dataset.enabledLabel,i=n.dataset.disabledLabel;if(e&&r){var a,c=f("open-chat-widget",r),u=function t(e){var r,n,i=null===(r=window)||void 0===r||null===(n=r.HubSpotConversations)||void 0===n?void 0:n.widget,u=document.querySelector("#hubspot-messages-iframe-container");a=function(t){t.preventDefault(),i.open()},i&&u?(c.addEventListener("click",a),l(c,o)):--h&&setTimeout((function(){return t(100)}),e)};return p(c,i),u(0),function(){p(c,i),c.removeEventListener("click",a)}}}function y(t){return"Minified Redux error #"+t+"; visit https://redux.js.org/Errors?code="+t+" for the full message or use the non-minified dev environment for full errors. "}var v="function"==typeof Symbol&&Symbol.observable||"@@observable",b=function(){return Math.random().toString(36).substring(7).split("").join(".")},g={INIT:"@@redux/INIT"+b(),REPLACE:"@@redux/REPLACE"+b(),PROBE_UNKNOWN_ACTION:function(){return"@@redux/PROBE_UNKNOWN_ACTION"+b()}};function w(t){if("object"!=typeof t||null===t)return!1;for(var e=t;null!==Object.getPrototypeOf(e);)e=Object.getPrototypeOf(e);return Object.getPrototypeOf(t)===e}function m(t,e,r){var n;if("function"==typeof e&&"function"==typeof r||"function"==typeof r&&"function"==typeof arguments[3])throw new Error(y(0));if("function"==typeof e&&void 0===r&&(r=e,e=void 0),void 0!==r){if("function"!=typeof r)throw new Error(y(1));return r(m)(t,e)}if("function"!=typeof t)throw new Error(y(2));var o=t,i=e,a=[],c=a,u=!1;function f(){c===a&&(c=a.slice())}function s(){if(u)throw new Error(y(3));return i}function l(t){if("function"!=typeof t)throw new Error(y(4));if(u)throw new Error(y(5));var e=!0;return f(),c.push(t),function(){if(e){if(u)throw new Error(y(6));e=!1,f();var r=c.indexOf(t);c.splice(r,1),a=null}}}function p(t){if(!w(t))throw new Error(y(7));if(void 0===t.type)throw new Error(y(8));if(u)throw new Error(y(9));try{u=!0,i=o(i,t)}finally{u=!1}for(var e=a=c,r=0;r<e.length;r++)(0,e[r])();return t}function h(t){if("function"!=typeof t)throw new Error(y(10));o=t,p({type:g.REPLACE})}function d(){var t,e=l;return(t={subscribe:function(t){if("object"!=typeof t||null===t)throw new Error(y(11));function r(){t.next&&t.next(s())}return r(),{unsubscribe:e(r)}}})[v]=function(){return this},t}return p({type:g.INIT}),(n={dispatch:p,subscribe:l,getState:s,replaceReducer:h})[v]=d,n}var O=function(t){window.AblyUi=window.AblyUi||{},window.AblyUi.RemoteDataStore=t},x=function(){if(!window.AblyUi.RemoteDataStore)throw new Error("Remote store was called before one was created");return window.AblyUi.RemoteDataStore},E=function(t,e){var r=x(),n=t(r);r.subscribe((function(){var o=t(r);o!==n&&(n=o,e(o))}))},j=function(t){return m(function(t){for(var e=Object.keys(t),r={},n=0;n<e.length;n++){var o=e[n];"function"==typeof t[o]&&(r[o]=t[o])}var i,a=Object.keys(r);try{!function(t){Object.keys(t).forEach((function(e){var r=t[e];if(void 0===r(void 0,{type:g.INIT}))throw new Error(y(12));if(void 0===r(void 0,{type:g.PROBE_UNKNOWN_ACTION()}))throw new Error(y(13))}))}(r)}catch(t){i=t}return function(t,e){if(void 0===t&&(t={}),i)throw i;for(var n=!1,o={},c=0;c<a.length;c++){var u=a[c],f=r[u],s=t[u],l=f(s,e);if(void 0===l)throw e&&e.type,new Error(y(14));o[u]=l,n=n||l!==s}return(n=n||a.length!==Object.keys(t).length)?o:t}}(t))},P=o(757),S=o.n(P),L=function(t){return t&&t.includes("application/json")};function A(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function N(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?A(Object(r),!0).forEach((function(e){k(t,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):A(Object(r)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))}))}return t}function k(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function _(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}var T=function(){var t,e=(t=S().mark((function t(e,r){var n,o;return S().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(t.prev=0,r){t.next=4;break}return console.warn('Skipping fetching blog posts, invalid blogUrl: "'.concat(r,'"')),t.abrupt("return");case 4:return t.next=6,fetch(r);case 6:if(n=t.sent,!L(n.headers.get("content-type"))){t.next=14;break}return t.next=10,n.json();case 10:o=t.sent,e.dispatch({type:"blog/loaded",payload:o}),t.next=15;break;case 14:throw new Error("Blog posts url is not serving json");case 15:t.next=20;break;case 17:t.prev=17,t.t0=t.catch(0),console.warn("Could not fetch blog posts due to error:",t.t0);case 20:case"end":return t.stop()}}),t,null,[[0,17]])})),function(){var e=this,r=arguments;return new Promise((function(n,o){var i=t.apply(e,r);function a(t){_(i,n,o,a,c,"next",t)}function c(t){_(i,n,o,a,c,"throw",t)}a(void 0)}))});return function(t,r){return e.apply(this,arguments)}}(),R={recent:null},D=k({},"blogPosts",(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:R,e=arguments.length>1?arguments[1]:void 0;switch(e.type){case"blog/loaded":return N(N({},t),{},{recent:e.payload});default:return t}})),I=function(t){var e;return null===(e=t.getState().blogPosts)||void 0===e?void 0:e.recent};function U(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function C(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?U(Object(r),!0).forEach((function(e){q(t,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):U(Object(r)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))}))}return t}function q(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function G(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}var M=function(){var t,e=(t=S().mark((function t(e,r){var n,o,i;return S().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(n=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return e.dispatch({type:"session/loaded",payload:t})},t.prev=1,r){t.next=6;break}return console.warn('Skipping fetching session, invalid sessionUrl: "'.concat(r,'"')),n(),t.abrupt("return");case 6:return t.next=8,fetch(r,{cache:"no-cache"});case 8:if(o=t.sent,L(o.headers.get("content-type"))){t.next=12;break}throw new Error("Session endpoint is not serving json");case 12:return t.next=14,o.json();case 14:"not-found"===(i=t.sent).error?n():n(i),t.next=22;break;case 18:t.prev=18,t.t0=t.catch(1),n(),console.warn("Could not fetch session data due to error:",t.t0);case 22:case"end":return t.stop()}}),t,null,[[1,18]])})),function(){var e=this,r=arguments;return new Promise((function(n,o){var i=t.apply(e,r);function a(t){G(i,n,o,a,c,"next",t)}function c(t){G(i,n,o,a,c,"throw",t)}a(void 0)}))});return function(t,r){return e.apply(this,arguments)}}(),B={data:null},F=q({},"session",(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:B,e=arguments.length>1?arguments[1]:void 0;switch(e.type){case"session/loaded":return C(C({},t),{},{data:e.payload});default:return t}})),W=function(t){var e;return null===(e=t.getState().session)||void 0===e?void 0:e.data}})(),i})()}));
1
+ !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e(require("react"),require("react-dom")):"function"==typeof define&&define.amd?define([,],e):"object"==typeof exports?exports.AblyUi=e(require("react"),require("react-dom")):(t.AblyUi=t.AblyUi||{},t.AblyUi.Core=e(t[void 0],t[void 0]))}(this,(function(t,e){return(()=>{var r={757:(t,e,r)=>{t.exports=r(666)},666:t=>{var e=function(t){"use strict";var e,r=Object.prototype,n=r.hasOwnProperty,o="function"==typeof Symbol?Symbol:{},i=o.iterator||"@@iterator",a=o.asyncIterator||"@@asyncIterator",c=o.toStringTag||"@@toStringTag";function u(t,e,r){return Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}),t[e]}try{u({},"")}catch(t){u=function(t,e,r){return t[e]=r}}function f(t,e,r,n){var o=e&&e.prototype instanceof v?e:v,i=Object.create(o.prototype),a=new A(n||[]);return i._invoke=function(t,e,r){var n=l;return function(o,i){if(n===h)throw new Error("Generator is already running");if(n===d){if("throw"===o)throw i;return k()}for(r.method=o,r.arg=i;;){var a=r.delegate;if(a){var c=P(a,r);if(c){if(c===y)continue;return c}}if("next"===r.method)r.sent=r._sent=r.arg;else if("throw"===r.method){if(n===l)throw n=d,r.arg;r.dispatchException(r.arg)}else"return"===r.method&&r.abrupt("return",r.arg);n=h;var u=s(t,e,r);if("normal"===u.type){if(n=r.done?d:p,u.arg===y)continue;return{value:u.arg,done:r.done}}"throw"===u.type&&(n=d,r.method="throw",r.arg=u.arg)}}}(t,r,a),i}function s(t,e,r){try{return{type:"normal",arg:t.call(e,r)}}catch(t){return{type:"throw",arg:t}}}t.wrap=f;var l="suspendedStart",p="suspendedYield",h="executing",d="completed",y={};function v(){}function b(){}function g(){}var w={};w[i]=function(){return this};var m=Object.getPrototypeOf,O=m&&m(m(N([])));O&&O!==r&&n.call(O,i)&&(w=O);var x=g.prototype=v.prototype=Object.create(w);function E(t){["next","throw","return"].forEach((function(e){u(t,e,(function(t){return this._invoke(e,t)}))}))}function j(t,e){function r(o,i,a,c){var u=s(t[o],t,i);if("throw"!==u.type){var f=u.arg,l=f.value;return l&&"object"==typeof l&&n.call(l,"__await")?e.resolve(l.__await).then((function(t){r("next",t,a,c)}),(function(t){r("throw",t,a,c)})):e.resolve(l).then((function(t){f.value=t,a(f)}),(function(t){return r("throw",t,a,c)}))}c(u.arg)}var o;this._invoke=function(t,n){function i(){return new e((function(e,o){r(t,n,e,o)}))}return o=o?o.then(i,i):i()}}function P(t,r){var n=t.iterator[r.method];if(n===e){if(r.delegate=null,"throw"===r.method){if(t.iterator.return&&(r.method="return",r.arg=e,P(t,r),"throw"===r.method))return y;r.method="throw",r.arg=new TypeError("The iterator does not provide a 'throw' method")}return y}var o=s(n,t.iterator,r.arg);if("throw"===o.type)return r.method="throw",r.arg=o.arg,r.delegate=null,y;var i=o.arg;return i?i.done?(r[t.resultName]=i.value,r.next=t.nextLoc,"return"!==r.method&&(r.method="next",r.arg=e),r.delegate=null,y):i:(r.method="throw",r.arg=new TypeError("iterator result is not an object"),r.delegate=null,y)}function S(t){var e={tryLoc:t[0]};1 in t&&(e.catchLoc=t[1]),2 in t&&(e.finallyLoc=t[2],e.afterLoc=t[3]),this.tryEntries.push(e)}function L(t){var e=t.completion||{};e.type="normal",delete e.arg,t.completion=e}function A(t){this.tryEntries=[{tryLoc:"root"}],t.forEach(S,this),this.reset(!0)}function N(t){if(t){var r=t[i];if(r)return r.call(t);if("function"==typeof t.next)return t;if(!isNaN(t.length)){var o=-1,a=function r(){for(;++o<t.length;)if(n.call(t,o))return r.value=t[o],r.done=!1,r;return r.value=e,r.done=!0,r};return a.next=a}}return{next:k}}function k(){return{value:e,done:!0}}return b.prototype=x.constructor=g,g.constructor=b,b.displayName=u(g,c,"GeneratorFunction"),t.isGeneratorFunction=function(t){var e="function"==typeof t&&t.constructor;return!!e&&(e===b||"GeneratorFunction"===(e.displayName||e.name))},t.mark=function(t){return Object.setPrototypeOf?Object.setPrototypeOf(t,g):(t.__proto__=g,u(t,c,"GeneratorFunction")),t.prototype=Object.create(x),t},t.awrap=function(t){return{__await:t}},E(j.prototype),j.prototype[a]=function(){return this},t.AsyncIterator=j,t.async=function(e,r,n,o,i){void 0===i&&(i=Promise);var a=new j(f(e,r,n,o),i);return t.isGeneratorFunction(r)?a:a.next().then((function(t){return t.done?t.value:a.next()}))},E(x),u(x,c,"Generator"),x[i]=function(){return this},x.toString=function(){return"[object Generator]"},t.keys=function(t){var e=[];for(var r in t)e.push(r);return e.reverse(),function r(){for(;e.length;){var n=e.pop();if(n in t)return r.value=n,r.done=!1,r}return r.done=!0,r}},t.values=N,A.prototype={constructor:A,reset:function(t){if(this.prev=0,this.next=0,this.sent=this._sent=e,this.done=!1,this.delegate=null,this.method="next",this.arg=e,this.tryEntries.forEach(L),!t)for(var r in this)"t"===r.charAt(0)&&n.call(this,r)&&!isNaN(+r.slice(1))&&(this[r]=e)},stop:function(){this.done=!0;var t=this.tryEntries[0].completion;if("throw"===t.type)throw t.arg;return this.rval},dispatchException:function(t){if(this.done)throw t;var r=this;function o(n,o){return c.type="throw",c.arg=t,r.next=n,o&&(r.method="next",r.arg=e),!!o}for(var i=this.tryEntries.length-1;i>=0;--i){var a=this.tryEntries[i],c=a.completion;if("root"===a.tryLoc)return o("end");if(a.tryLoc<=this.prev){var u=n.call(a,"catchLoc"),f=n.call(a,"finallyLoc");if(u&&f){if(this.prev<a.catchLoc)return o(a.catchLoc,!0);if(this.prev<a.finallyLoc)return o(a.finallyLoc)}else if(u){if(this.prev<a.catchLoc)return o(a.catchLoc,!0)}else{if(!f)throw new Error("try statement without catch or finally");if(this.prev<a.finallyLoc)return o(a.finallyLoc)}}}},abrupt:function(t,e){for(var r=this.tryEntries.length-1;r>=0;--r){var o=this.tryEntries[r];if(o.tryLoc<=this.prev&&n.call(o,"finallyLoc")&&this.prev<o.finallyLoc){var i=o;break}}i&&("break"===t||"continue"===t)&&i.tryLoc<=e&&e<=i.finallyLoc&&(i=null);var a=i?i.completion:{};return a.type=t,a.arg=e,i?(this.method="next",this.next=i.finallyLoc,y):this.complete(a)},complete:function(t,e){if("throw"===t.type)throw t.arg;return"break"===t.type||"continue"===t.type?this.next=t.arg:"return"===t.type?(this.rval=this.arg=t.arg,this.method="return",this.next="end"):"normal"===t.type&&e&&(this.next=e),y},finish:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.finallyLoc===t)return this.complete(r.completion,r.afterLoc),L(r),y}},catch:function(t){for(var e=this.tryEntries.length-1;e>=0;--e){var r=this.tryEntries[e];if(r.tryLoc===t){var n=r.completion;if("throw"===n.type){var o=n.arg;L(r)}return o}}throw new Error("illegal catch attempt")},delegateYield:function(t,r,n){return this.delegate={iterator:N(t),resultName:r,nextLoc:n},"next"===this.method&&(this.arg=e),y}},t}(t.exports);try{regeneratorRuntime=e}catch(t){Function("r","regeneratorRuntime = r")(e)}},281:e=>{"use strict";e.exports=t},645:t=>{"use strict";t.exports=e}},n={};function o(t){var e=n[t];if(void 0!==e)return e.exports;var i=n[t]={exports:{}};return r[t](i,i.exports,o),i.exports}o.n=t=>{var e=t&&t.__esModule?()=>t.default:()=>t;return o.d(e,{a:e}),e},o.d=(t,e)=>{for(var r in e)o.o(e,r)&&!o.o(t,r)&&Object.defineProperty(t,r,{enumerable:!0,get:e[r]})},o.o=(t,e)=>Object.prototype.hasOwnProperty.call(t,e),o.r=t=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})};var i={};return(()=>{"use strict";o.r(i),o.d(i,{attachStoreToWindow:()=>O,connectState:()=>E,createRemoteDataStore:()=>j,fetchBlogPosts:()=>T,fetchSessionData:()=>M,getRemoteDataStore:()=>x,loadSprites:()=>u,queryId:()=>f,queryIdAll:()=>s,reactRenderer:()=>c,reducerBlogPosts:()=>D,reducerSessionData:()=>F,renderComponent:()=>a,selectRecentBlogPosts:()=>I,selectSessionData:()=>W,toggleChatWidget:()=>d}),Array.prototype.flat||Object.defineProperty(Array.prototype,"flat",{configurable:!0,value:function t(){var e=isNaN(arguments[0])?1:Number(arguments[0]);return e?Array.prototype.reduce.call(this,(function(r,n){return Array.isArray(n)?r.push.apply(r,t.call(n,e-1)):r.push(n),r}),[]):Array.prototype.slice.call(this)},writable:!0}),Array.prototype.flatMap||Object.defineProperty(Array.prototype,"flatMap",{configurable:!0,value:function(t){return Array.prototype.map.apply(this,arguments).flat()},writable:!0});var t=o(281),e=o.n(t),r=o(645),n=o.n(r),a=function(t,r,o){return n().render(e().createElement(t,r),o)};function c(t){var r=document.querySelectorAll("[data-react]");Array.from(r).forEach((function(r){var o=r.getAttribute("data-react"),i=t[o];if(i){var a=r.getAttribute("data-react-props"),c=a&&JSON.parse(a||{});n().render(e().createElement(i,c),r),r.removeAttribute("data-react"),r.removeAttribute("data-react-props")}}))}const u=function(t){fetch(t).then((function(t){return t.text()})).then((function(t){var e=document.createElement("div");e.style.display="none",e.innerHTML=t,document.body.appendChild(e)})).catch((function(t){return console.error(t)}))};var f=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return e.querySelector("[data-id=".concat(t,"]"))},s=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:document;return e.querySelectorAll("[data-id=".concat(t,"]"))};function l(t,e){t.disabled=!1,t.innerText=e}function p(t,e){t.disabled=!0,t.innerText=e}var h=30;function d(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},e=t.dataId,r=f(e),n=f("open-chat-widget",r),o=n.dataset.enabledLabel,i=n.dataset.disabledLabel;if(e&&r){var a,c=f("open-chat-widget",r),u=function t(e){var r,n,i=null===(r=window)||void 0===r||null===(n=r.HubSpotConversations)||void 0===n?void 0:n.widget,u=document.querySelector("#hubspot-messages-iframe-container");a=function(t){t.preventDefault(),i.open()},i&&u?(c.addEventListener("click",a),l(c,o)):--h&&setTimeout((function(){return t(100)}),e)};return p(c,i),u(0),function(){p(c,i),c.removeEventListener("click",a)}}}function y(t){return"Minified Redux error #"+t+"; visit https://redux.js.org/Errors?code="+t+" for the full message or use the non-minified dev environment for full errors. "}var v="function"==typeof Symbol&&Symbol.observable||"@@observable",b=function(){return Math.random().toString(36).substring(7).split("").join(".")},g={INIT:"@@redux/INIT"+b(),REPLACE:"@@redux/REPLACE"+b(),PROBE_UNKNOWN_ACTION:function(){return"@@redux/PROBE_UNKNOWN_ACTION"+b()}};function w(t){if("object"!=typeof t||null===t)return!1;for(var e=t;null!==Object.getPrototypeOf(e);)e=Object.getPrototypeOf(e);return Object.getPrototypeOf(t)===e}function m(t,e,r){var n;if("function"==typeof e&&"function"==typeof r||"function"==typeof r&&"function"==typeof arguments[3])throw new Error(y(0));if("function"==typeof e&&void 0===r&&(r=e,e=void 0),void 0!==r){if("function"!=typeof r)throw new Error(y(1));return r(m)(t,e)}if("function"!=typeof t)throw new Error(y(2));var o=t,i=e,a=[],c=a,u=!1;function f(){c===a&&(c=a.slice())}function s(){if(u)throw new Error(y(3));return i}function l(t){if("function"!=typeof t)throw new Error(y(4));if(u)throw new Error(y(5));var e=!0;return f(),c.push(t),function(){if(e){if(u)throw new Error(y(6));e=!1,f();var r=c.indexOf(t);c.splice(r,1),a=null}}}function p(t){if(!w(t))throw new Error(y(7));if(void 0===t.type)throw new Error(y(8));if(u)throw new Error(y(9));try{u=!0,i=o(i,t)}finally{u=!1}for(var e=a=c,r=0;r<e.length;r++)(0,e[r])();return t}function h(t){if("function"!=typeof t)throw new Error(y(10));o=t,p({type:g.REPLACE})}function d(){var t,e=l;return(t={subscribe:function(t){if("object"!=typeof t||null===t)throw new Error(y(11));function r(){t.next&&t.next(s())}return r(),{unsubscribe:e(r)}}})[v]=function(){return this},t}return p({type:g.INIT}),(n={dispatch:p,subscribe:l,getState:s,replaceReducer:h})[v]=d,n}var O=function(t){window.AblyUi=window.AblyUi||{},window.AblyUi.RemoteDataStore=t},x=function(){if(!window.AblyUi.RemoteDataStore)throw new Error("Remote store was called before one was created");return window.AblyUi.RemoteDataStore},E=function(t,e){var r=x(),n=t(r);r.subscribe((function(){var o=t(r);o!==n&&(n=o,e(o))}))},j=function(t){return m(function(t){for(var e=Object.keys(t),r={},n=0;n<e.length;n++){var o=e[n];"function"==typeof t[o]&&(r[o]=t[o])}var i,a=Object.keys(r);try{!function(t){Object.keys(t).forEach((function(e){var r=t[e];if(void 0===r(void 0,{type:g.INIT}))throw new Error(y(12));if(void 0===r(void 0,{type:g.PROBE_UNKNOWN_ACTION()}))throw new Error(y(13))}))}(r)}catch(t){i=t}return function(t,e){if(void 0===t&&(t={}),i)throw i;for(var n=!1,o={},c=0;c<a.length;c++){var u=a[c],f=r[u],s=t[u],l=f(s,e);if(void 0===l)throw e&&e.type,new Error(y(14));o[u]=l,n=n||l!==s}return(n=n||a.length!==Object.keys(t).length)?o:t}}(t))},P=o(757),S=o.n(P),L=function(t){return t&&t.includes("application/json")};function A(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function N(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?A(Object(r),!0).forEach((function(e){k(t,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):A(Object(r)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))}))}return t}function k(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function _(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}var T=function(){var t,e=(t=S().mark((function t(e,r){var n,o;return S().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(t.prev=0,r){t.next=4;break}return console.log('Skipping fetching blog posts, invalid blogUrl: "'.concat(r,'"')),t.abrupt("return");case 4:return t.next=6,fetch(r);case 6:if(n=t.sent,!L(n.headers.get("content-type"))){t.next=14;break}return t.next=10,n.json();case 10:o=t.sent,e.dispatch({type:"blog/loaded",payload:o}),t.next=15;break;case 14:throw new Error("Blog posts url is not serving json");case 15:t.next=20;break;case 17:t.prev=17,t.t0=t.catch(0),console.warn("Could not fetch blog posts due to error:",t.t0);case 20:case"end":return t.stop()}}),t,null,[[0,17]])})),function(){var e=this,r=arguments;return new Promise((function(n,o){var i=t.apply(e,r);function a(t){_(i,n,o,a,c,"next",t)}function c(t){_(i,n,o,a,c,"throw",t)}a(void 0)}))});return function(t,r){return e.apply(this,arguments)}}(),R={recent:null},D=k({},"blogPosts",(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:R,e=arguments.length>1?arguments[1]:void 0;switch(e.type){case"blog/loaded":return N(N({},t),{},{recent:e.payload});default:return t}})),I=function(t){var e;return null===(e=t.getState().blogPosts)||void 0===e?void 0:e.recent};function U(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),r.push.apply(r,n)}return r}function C(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?U(Object(r),!0).forEach((function(e){q(t,e,r[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):U(Object(r)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))}))}return t}function q(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function G(t,e,r,n,o,i,a){try{var c=t[i](a),u=c.value}catch(t){return void r(t)}c.done?e(u):Promise.resolve(u).then(n,o)}var M=function(){var t,e=(t=S().mark((function t(e,r){var n,o,i;return S().wrap((function(t){for(;;)switch(t.prev=t.next){case 0:if(n=function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{};return e.dispatch({type:"session/loaded",payload:t})},t.prev=1,r){t.next=6;break}return console.log('Skipping fetching session, invalid sessionUrl: "'.concat(r,'"')),n(),t.abrupt("return");case 6:return t.next=8,fetch(r,{cache:"no-cache"});case 8:if(o=t.sent,L(o.headers.get("content-type"))){t.next=12;break}throw new Error("Session endpoint is not serving json");case 12:return t.next=14,o.json();case 14:"not-found"===(i=t.sent).error?n():n(i),t.next=22;break;case 18:t.prev=18,t.t0=t.catch(1),n(),console.warn("Could not fetch session data due to error:",t.t0);case 22:case"end":return t.stop()}}),t,null,[[1,18]])})),function(){var e=this,r=arguments;return new Promise((function(n,o){var i=t.apply(e,r);function a(t){G(i,n,o,a,c,"next",t)}function c(t){G(i,n,o,a,c,"throw",t)}a(void 0)}))});return function(t,r){return e.apply(this,arguments)}}(),B={data:null},F=q({},"session",(function(){var t=arguments.length>0&&void 0!==arguments[0]?arguments[0]:B,e=arguments.length>1?arguments[1]:void 0;switch(e.type){case"session/loaded":return C(C({},t),{},{data:e.payload});default:return t}})),W=function(t){var e;return null===(e=t.getState().session)||void 0===e?void 0:e.data}})(),i})()}));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ably/ui",
3
- "version": "7.10.0-dev.45e131a",
3
+ "version": "7.10.0-dev.ccd5fa3",
4
4
  "description": "Home of the Ably design system library ([design.ably.com](https://design.ably.com)). It provides a showcase, development/test environment and a publishing pipeline for different distributables.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -65,6 +65,7 @@
65
65
  "release": "./scripts/release.sh"
66
66
  },
67
67
  "dependencies": {
68
+ "addsearch-js-client": "^0.6.7",
68
69
  "array-flat-polyfill": "^1.0.1",
69
70
  "deepmerge": "^4.2.2",
70
71
  "dompurify": "^2.2.9",
@@ -17,6 +17,7 @@ import MeganavControl from "../MeganavControl/component";
17
17
  import MeganavControlMobileDropdown from "../MeganavControlMobileDropdown/component";
18
18
  import MobilePanelOpenClick from "../MeganavControlMobilePanelOpen/component";
19
19
  import MobilePanelCloseClick from "../MeganavControlMobilePanelClose/component";
20
+ import MeganavSearchAutocomplete from "../MeganavSearchAutocomplete/component";
20
21
 
21
22
  // Close menu when user clicks outside of viewport
22
23
  const windowOnBlur = (closeAll) => {
@@ -115,6 +116,7 @@ export default function Meganav({ themeName } = { themeName: null }) {
115
116
  const controls = MeganavControl();
116
117
  const panelOpenControls = MobilePanelOpenClick();
117
118
  const panelCloseControls = MobilePanelCloseClick();
119
+ const search = MeganavSearchAutocomplete();
118
120
 
119
121
  const mobileDropdownControl = MeganavControlMobileDropdown({
120
122
  clearPanels: () =>
@@ -127,6 +129,7 @@ export default function Meganav({ themeName } = { themeName: null }) {
127
129
  ...panelOpenControls,
128
130
  ...panelCloseControls,
129
131
  ...controls,
132
+ ...search,
130
133
  ].forEach((i) => i.clear());
131
134
 
132
135
  const teardowns = [
@@ -137,6 +140,7 @@ export default function Meganav({ themeName } = { themeName: null }) {
137
140
  ...controls,
138
141
  ...panelOpenControls,
139
142
  ...panelCloseControls,
143
+ ...search,
140
144
  ].map((i) => i.teardown);
141
145
 
142
146
  return () => teardowns.forEach((teardown) => teardown());
@@ -1,4 +1,4 @@
1
- import { queryIdAll } from "../dom-query";
1
+ import { queryId, queryIdAll } from "../dom-query";
2
2
 
3
3
  const MeganavControl = () => {
4
4
  const controls = Array.from(queryIdAll("meganav-control"));
@@ -12,11 +12,21 @@ const MeganavControl = () => {
12
12
  `(hover: hover) and (pointer: fine) and (min-width: ${mdBreakpoint})`
13
13
  ).matches;
14
14
 
15
+ const isSearchControl = (node) => node.dataset.control === "search";
16
+
17
+ const isSearchPanelOpen = () => {
18
+ const searchPanel = document.querySelector(
19
+ '[data-id="meganav-panel"]#panel-search'
20
+ );
21
+ if (!searchPanel) return;
22
+ return !searchPanel.classList.contains("invisible");
23
+ };
24
+
15
25
  const controlsHaveFocus = () =>
16
26
  controls.some((control) => control === document.activeElement);
17
27
 
18
28
  const hover = (control, panel, open) => {
19
- if (hoverEnabled() && !controlsHaveFocus()) {
29
+ if (hoverEnabled() && !controlsHaveFocus() && !isSearchPanelOpen()) {
20
30
  const classes = ["invisible", "visible"];
21
31
  panel.classList.replace(...(open ? classes : classes.reverse()));
22
32
  control.setAttribute("aria-expanded", open);
@@ -40,12 +50,20 @@ const MeganavControl = () => {
40
50
 
41
51
  const ariaExpanded = control.getAttribute("aria-expanded");
42
52
 
43
- if (ariaExpanded) {
53
+ if (ariaExpanded === "true") {
54
+ control.setAttribute("aria-expanded", false);
55
+ panel.classList.replace("visible", "invisible");
56
+ } else {
44
57
  control.setAttribute("aria-expanded", true);
45
58
  panel.classList.replace("invisible", "visible");
59
+ }
60
+
61
+ if (isSearchControl(control)) {
62
+ const searchInput = queryId("meganav-search-input", panel);
63
+ if (!searchInput) return;
64
+ searchInput.focus();
46
65
  } else {
47
- control.setAttribute("aria-expanded", false);
48
- panel.classList.replace("visible", "invisible");
66
+ control.focus();
49
67
  }
50
68
  };
51
69
 
@@ -56,18 +74,25 @@ const MeganavControl = () => {
56
74
  `#${control.getAttribute("aria-controls")}`
57
75
  );
58
76
  const click = clickHandler(control, panel);
59
- const mouseenter = mouseenterHandler(control, panel);
60
- const mouseleave = mouseleaveHandler(control, panel);
61
-
62
- item.addEventListener("mouseenter", mouseenter);
63
- item.addEventListener("mouseleave", mouseleave);
64
77
  control.addEventListener("click", click);
78
+ let mouseenter, mouseleave;
79
+
80
+ if (!isSearchControl(control)) {
81
+ mouseenter = mouseenterHandler(control, panel);
82
+ mouseleave = mouseleaveHandler(control, panel);
83
+
84
+ item.addEventListener("mouseenter", mouseenter);
85
+ item.addEventListener("mouseleave", mouseleave);
86
+ }
65
87
 
66
88
  return [
67
89
  {
68
90
  teardown: () => {
69
- item.removeEventListener("mouseenter", mouseenter);
70
- item.removeEventListener("mouseleave", mouseleave);
91
+ if (mouseenter && mouseleave) {
92
+ item.removeEventListener("mouseenter", mouseenter);
93
+ item.removeEventListener("mouseleave", mouseleave);
94
+ }
95
+
71
96
  control.removeEventListener("click", click);
72
97
  },
73
98
  clear: () => {
@@ -7,8 +7,8 @@ const MeganavControlMobileDropdown = ({ clearPanels }) => {
7
7
  const dropdown = queryId("meganav-mobile-dropdown");
8
8
  const menuIcon = queryId("meganav-control-mobile-dropdown-menu");
9
9
  const closeIcon = queryId("meganav-control-mobile-dropdown-close");
10
- const MeganavSearchSuggestionsToggle = queryId("meganav-mobile-search-input");
11
- const MeganavSearchSuggestions = queryId("meganav-mobile-search-suggestions");
10
+ const meganavSearchSuggestionsToggle = queryId("meganav-mobile-search-input");
11
+ const meganavSearchSuggestions = queryId("meganav-mobile-search-suggestions");
12
12
 
13
13
  const clickHandler = () => {
14
14
  const ariaExpanded = control.getAttribute("aria-expanded");
@@ -29,23 +29,23 @@ const MeganavControlMobileDropdown = ({ clearPanels }) => {
29
29
  };
30
30
 
31
31
  const focusSuggestionsHandler = () => {
32
- MeganavSearchSuggestions.classList.add("max-h-96");
32
+ meganavSearchSuggestions.classList.add("max-h-96");
33
33
  };
34
34
  const blurSuggestionsHandler = (event) => {
35
35
  if (
36
- event.relatedTarget === MeganavSearchSuggestions.querySelectorAll("a")[0]
36
+ event.relatedTarget === meganavSearchSuggestions.querySelectorAll("a")[0]
37
37
  ) {
38
38
  return;
39
39
  }
40
- MeganavSearchSuggestions.classList.remove("max-h-96");
40
+ meganavSearchSuggestions.classList.remove("max-h-96");
41
41
  };
42
42
 
43
43
  control.addEventListener("click", clickHandler);
44
- MeganavSearchSuggestionsToggle.addEventListener(
44
+ meganavSearchSuggestionsToggle.addEventListener(
45
45
  "focus",
46
46
  focusSuggestionsHandler
47
47
  );
48
- MeganavSearchSuggestionsToggle.addEventListener(
48
+ meganavSearchSuggestionsToggle.addEventListener(
49
49
  "blur",
50
50
  blurSuggestionsHandler
51
51
  );
@@ -54,6 +54,14 @@ const MeganavControlMobileDropdown = ({ clearPanels }) => {
54
54
  teardown: () => {
55
55
  control.removeEventListener("click", clickHandler);
56
56
  scrollLock.enablePageScroll();
57
+ meganavSearchSuggestionsToggle.removeEventListener(
58
+ "focus",
59
+ focusSuggestionsHandler
60
+ );
61
+ meganavSearchSuggestionsToggle.removeEventListener(
62
+ "blur",
63
+ blurSuggestionsHandler
64
+ );
57
65
  },
58
66
  clear: () => {
59
67
  dropdown.classList.replace("visible", "invisible");
@@ -61,6 +69,7 @@ const MeganavControlMobileDropdown = ({ clearPanels }) => {
61
69
  menuIcon.classList.remove("hidden");
62
70
  closeIcon.classList.add("hidden");
63
71
  scrollLock.enablePageScroll();
72
+ meganavSearchSuggestions.classList.remove("max-h-96");
64
73
  },
65
74
  };
66
75
  };
@@ -14,8 +14,24 @@
14
14
  <div class="pt-24 pb-16 ui-grid-px bg-white">
15
15
  <%= tag.form class: "mb-16", action: abs_url("/search"), method: "get" do %>
16
16
  <div class="relative w-full">
17
- <%= render(AblyUi::Core::Icon.new(name: "icon-gui-search", size: "1.5rem", color: "text-cool-black", additional_css: "absolute top-12 left-16")) %>
18
- <input type="search" name="q" class="ui-input pl-48 h-48" placeholder="Search" data-id="meganav-mobile-search-input" />
17
+ <%= render(AblyUi::Core::Icon.new(name: "icon-gui-search", size: "1.5rem", color: "text-cool-black", additional_css: "absolute top-12 left-16 hover:text-gui-hover")) %>
18
+ <button
19
+ type="button"
20
+ class="absolute top-12 right-16 p-0 focus:outline-gui-focus m-0 md:hidden invisible"
21
+ data-id="meganav-search-input-clear"
22
+ >
23
+ <%= render(AblyUi::Core::Icon.new(name: "icon-gui-cross-circled-fill", size: "1.5rem", color: "text-dark-grey")) %>
24
+ </button>
25
+ <input
26
+ type="search"
27
+ name="q"
28
+ class="ui-input px-48 h-48"
29
+ style={{ maxWidth: "none" }}
30
+ placeholder="Search"
31
+ data-id="meganav-mobile-search-input"
32
+ />
33
+
34
+ <%= render(AblyUi::Core::MeganavSearchAutocomplete.new) %>
19
35
  </div>
20
36
  <% end %>
21
37
 
@@ -23,7 +39,7 @@
23
39
  <%= render(AblyUi::Core::MeganavSearchSuggestions.new(url_base: url_base, display_support_link: false)) %>
24
40
  </div>
25
41
 
26
- <ul class="mb-16">
42
+ <ul class="mb-16" data-id="meganav-mobile-panel-controls">
27
43
  <% panels.each do |panel| %>
28
44
  <li class="ui-meganav-mobile-item">
29
45
  <%= render(AblyUi::Core::MeganavControlMobilePanelOpen.new(aria_controls: "#{panel[:id]}-mobile")) do %>
@@ -9,6 +9,7 @@ import MeganavData from "../Meganav/component.json";
9
9
  import MeganavControlMobileDropdown from "../MeganavControlMobileDropdown/component.jsx";
10
10
  import MeganavControlMobilePanelClose from "../MeganavControlMobilePanelClose/component.jsx";
11
11
  import MeganavControlMobilePanelOpen from "../MeganavControlMobilePanelOpen/component.jsx";
12
+ import MeganavSearchAutocomplete from "../MeganavSearchAutocomplete/component.jsx";
12
13
 
13
14
  const MeganavItemsMobile = ({ panels, paths, sessionState, theme, loginLink, absUrl }) => {
14
15
  const classNames = `ui-meganav-link ${theme.textColor}`;
@@ -38,8 +39,24 @@ const MeganavItemsMobile = ({ panels, paths, sessionState, theme, loginLink, abs
38
39
  <div className="pt-24 pb-16 ui-grid-px bg-white">
39
40
  <form className="mb-16" action={absUrl("/search")} method="get">
40
41
  <div className="relative w-full">
41
- <Icon name="icon-gui-search" color="text-cool-black" size="1.5rem" additionalCSS="absolute top-12 left-16" />
42
- <input type="search" name="q" className="ui-input pl-48 h-48" placeholder="Search" data-id="meganav-mobile-search-input" />
42
+ <Icon name="icon-gui-search" color="text-cool-black" size="1.5rem" additionalCSS="absolute top-12 left-16 hover:text-gui-hover" />
43
+ <button
44
+ type="button"
45
+ className="absolute top-12 right-16 p-0 focus:outline-gui-focus m-0 md:hidden invisible"
46
+ data-id="meganav-search-input-clear"
47
+ >
48
+ <Icon name="icon-gui-cross-circled-fill" color="text-dark-grey" size="1.5rem" additionalCSS="" />
49
+ </button>
50
+ <input
51
+ type="search"
52
+ name="q"
53
+ className="ui-input px-48 h-48"
54
+ style={{ maxWidth: "none" }}
55
+ placeholder="Search"
56
+ data-id="meganav-mobile-search-input"
57
+ />
58
+
59
+ <MeganavSearchAutocomplete />
43
60
  </div>
44
61
  </form>
45
62
 
@@ -47,7 +64,7 @@ const MeganavItemsMobile = ({ panels, paths, sessionState, theme, loginLink, abs
47
64
  <MeganavSearchSuggestions absUrl={absUrl} displaySupportLink={false} />
48
65
  </div>
49
66
 
50
- <ul className="mb-16">
67
+ <ul className="mb-16" data-id="meganav-mobile-panel-controls">
51
68
  {MeganavData.panels.map((panel) => {
52
69
  const PanelComponent = panels[panel.component];
53
70
 
@@ -1,12 +1,13 @@
1
1
  <button
2
2
  type="button"
3
3
  data-id="meganav-control"
4
+ data-control="search"
4
5
  class="h-64 w-24 px-24 pr-48 py-20"
5
6
  aria-expanded="false"
6
7
  aria-controls="panel-search"
7
8
  aria-label="Show Search Panel"
8
9
  >
9
- <%= render(AblyUi::Core::Icon.new(name: "icon-gui-search", size: "1.5rem", color: "text-cool-black")) %>
10
+ <%= render(AblyUi::Core::Icon.new(name: "icon-gui-search", size: "1.5rem", color: "text-cool-black", additional_css: "hover:text-gui-hover")) %>
10
11
  </button>
11
12
 
12
13
  <div class="ui-meganav-panel invisible" id="panel-search" data-id="meganav-panel">
@@ -10,12 +10,13 @@ const MeganavSearch = ({ absUrl }) => {
10
10
  <button
11
11
  type="button"
12
12
  data-id="meganav-control"
13
+ data-control="search"
13
14
  className="h-64 w-24 px-24 pr-48 py-20"
14
15
  aria-expanded="false"
15
16
  aria-controls="panel-search"
16
17
  aria-label={`Show Search Panel`}
17
18
  >
18
- <Icon name="icon-gui-search" color="text-cool-black" size="1.5rem" additionalCSS="" />
19
+ <Icon name="icon-gui-search" color="text-cool-black" size="1.5rem" additionalCSS="hover:text-gui-hover" />
19
20
  </button>
20
21
 
21
22
  <div className="ui-meganav-panel invisible" id="panel-search" data-id="meganav-panel">