@newskit-render/standalone-components 0.0.0-e16014a0

package/dist/cjs/help-chat/tests/mocks.js

@@ -0,0 +1,47 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mockChatHelpOverrides = void 0;
+var react_1 = __importDefault(require("react"));
+var newskit_1 = require("newskit");
+var Info_1 = require("@emotion-icons/material/Info");
+var IconFilledInfo = (0, newskit_1.toNewsKitIcon)(Info_1.Info);
+exports.mockChatHelpOverrides = {
+    icon: (react_1.default.createElement(IconFilledInfo, { overrides: {
+            size: 'iconSize030',
+            stylePreset: 'chatIconStylePreset',
+        } })),
+    buttonOverrides: {
+        text: 'Speak',
+        size: 'small',
+        stylePreset: 'buttonOutlinedSecondary',
+        minWidth: { xs: '100%', sm: 'sizing100' },
+        onClick: undefined,
+    },
+    helpHeadline: {
+        text: 'Need to speak?',
+        overrides: {
+            typographyPreset: 'utilityHeading030',
+        },
+    },
+    helpSubheadline: {
+        text: 'Get a quick response from our team members',
+        overrides: {
+            typographyPreset: 'utilityBody030',
+            stylePreset: 'inkBase',
+            paddingInline: 'space050',
+        },
+    },
+    gridLayoutOverrides: {
+        rowGap: 'space050',
+        justifyItems: 'center',
+        alignContent: 'start',
+        overrides: {
+            paddingBlock: 'space050',
+            paddingInline: 'space050',
+        },
+    },
+};
+//# sourceMappingURL=mocks.js.map

package/dist/cjs/help-chat/tests/mocks.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"mocks.js","sourceRoot":"","sources":["../../../../src/help-chat/tests/mocks.tsx"],"names":[],"mappings":";;;;;;AAAA,gDAAyB;AACzB,mCAAuC;AACvC,qDAAiE;AAEjE,IAAM,cAAc,GAAG,IAAA,uBAAa,EAAC,WAAU,CAAC,CAAA;AAEnC,QAAA,qBAAqB,GAAsB;IACtD,IAAI,EAAE,CACJ,8BAAC,cAAc,IACb,SAAS,EAAE;YACT,IAAI,EAAE,aAAa;YACnB,WAAW,EAAE,qBAAqB;SACnC,GACD,CACH;IACD,eAAe,EAAE;QACf,IAAI,EAAE,OAAO;QACb,IAAI,EAAE,OAAO;QACb,WAAW,EAAE,yBAAyB;QACtC,QAAQ,EAAE,EAAE,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,WAAW,EAAE;QACzC,OAAO,EAAE,SAAS;KACnB;IACD,YAAY,EAAE;QACZ,IAAI,EAAE,gBAAgB;QACtB,SAAS,EAAE;YACT,gBAAgB,EAAE,mBAAmB;SACtC;KACF;IACD,eAAe,EAAE;QACf,IAAI,EAAE,4CAA4C;QAClD,SAAS,EAAE;YACT,gBAAgB,EAAE,gBAAgB;YAClC,WAAW,EAAE,SAAS;YACtB,aAAa,EAAE,UAAU;SAC1B;KACF;IACD,mBAAmB,EAAE;QACnB,MAAM,EAAE,UAAU;QAClB,YAAY,EAAE,QAAQ;QACtB,YAAY,EAAE,OAAO;QACrB,SAAS,EAAE;YACT,YAAY,EAAE,UAAU;YACxB,aAAa,EAAE,UAAU;SAC1B;KACF;CACF,CAAA"}

package/dist/cjs/help-chat/types.d.ts

@@ -0,0 +1,31 @@
+import { MQ, ButtonSize, TextBlockProps } from 'newskit';
+import { ReactNode } from 'react';
+export type ChatHelpOverrides = {
+    icon?: ReactNode;
+    buttonOverrides?: {
+        size?: ButtonSize;
+        minWidth?: MQ<string>;
+        stylePreset?: MQ<string>;
+        text: string;
+        onClick?: () => void;
+    };
+    helpHeadline?: {
+        text: string;
+        overrides?: {
+            typographyPreset?: MQ<string>;
+        };
+    };
+    helpSubheadline?: {
+        text: string;
+        overrides?: TextBlockProps;
+    };
+    gridLayoutOverrides?: {
+        rowGap?: MQ<string>;
+        justifyItems?: MQ<string>;
+        alignContent?: MQ<string>;
+        overrides?: {
+            paddingBlock?: MQ<string>;
+            paddingInline?: MQ<string>;
+        };
+    };
+};

package/dist/cjs/help-chat/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/cjs/help-chat/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/help-chat/types.ts"],"names":[],"mappings":""}

package/dist/cjs/help-hub/components/SearchBar/SearchBar.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { SearchBarProps } from './types';
+export declare const SearchBar: React.FC<SearchBarProps>;
+export default SearchBar;

package/dist/cjs/help-hub/components/SearchBar/SearchBar.js

@@ -0,0 +1,26 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SearchBar = void 0;
+var react_1 = __importDefault(require("react"));
+var newskit_1 = require("newskit");
+var Autocomplete_1 = require("./components/Autocomplete");
+var AlgoliaTheme_1 = require("./components/AlgoliaTheme");
+var StyledBlock = (0, newskit_1.styled)(newskit_1.Block)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  margin: 0 auto;\n  position: relative;\n  width: 100%;\n  & .aa-Panel {\n    width: 100%;\n    z-index: 2;\n  }\n  & .aa-Form {\n    z-index: 2;\n  }\n"], ["\n  margin: 0 auto;\n  position: relative;\n  width: 100%;\n  & .aa-Panel {\n    width: 100%;\n    z-index: 2;\n  }\n  & .aa-Form {\n    z-index: 2;\n  }\n"])));
+var SearchBar = function (_a) {
+    var _b = _a.placeholder, placeholder = _b === void 0 ? 'Search' : _b, _c = _a.baseUrl, baseUrl = _c === void 0 ? '' : _c, overrides = _a.overrides;
+    var theme = (0, newskit_1.useTheme)();
+    return (react_1.default.createElement(StyledBlock, null,
+        react_1.default.createElement(newskit_1.Global, { styles: (0, AlgoliaTheme_1.getAlgoliaStyling)(overrides, theme) }),
+        react_1.default.createElement(Autocomplete_1.Autocomplete, { placeholder: placeholder, openOnFocus: true, debug: false, baseUrl: baseUrl })));
+};
+exports.SearchBar = SearchBar;
+exports.default = exports.SearchBar;
+var templateObject_1;
+//# sourceMappingURL=SearchBar.js.map

package/dist/cjs/help-hub/components/SearchBar/SearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SearchBar.js","sourceRoot":"","sources":["../../../../../src/help-hub/components/SearchBar/SearchBar.tsx"],"names":[],"mappings":";;;;;;;;;;AAAA,gDAAyB;AACzB,mCAAyD;AACzD,0DAAwD;AACxD,0DAA6D;AAG7D,IAAM,WAAW,GAAG,IAAA,gBAAM,EAAC,eAAK,CAAC,gOAAA,6JAWhC,IAAA,CAAA;AAEM,IAAM,SAAS,GAA6B,UAAC,EAInD;QAHC,mBAAsB,EAAtB,WAAW,mBAAG,QAAQ,KAAA,EACtB,eAAY,EAAZ,OAAO,mBAAG,EAAE,KAAA,EACZ,SAAS,eAAA;IAET,IAAM,KAAK,GAAG,IAAA,kBAAQ,GAAE,CAAA;IAExB,OAAO,CACL,8BAAC,WAAW;QACV,8BAAC,gBAAM,IAAC,MAAM,EAAE,IAAA,gCAAiB,EAAC,SAAS,EAAE,KAAK,CAAC,GAAI;QACvD,8BAAC,2BAAY,IACX,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,IAAI,EACjB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,OAAO,GAChB,CACU,CACf,CAAA;AACH,CAAC,CAAA;AAlBY,QAAA,SAAS,aAkBrB;AAED,kBAAe,iBAAS,CAAA"}

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.d.ts

@@ -0,0 +1,3 @@
+import { Theme } from 'newskit';
+import { SearchBarOverrides } from '../types';
+export declare const getAlgoliaStyling: (overrides: SearchBarOverrides, theme: Theme) => import("newskit").SerializedStyles;

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.js

@@ -0,0 +1,16 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getAlgoliaStyling = void 0;
+var newskit_1 = require("newskit");
+var getAlgoliaStyling = function (overrides, theme) {
+    return (0, newskit_1.css)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n    /* ---------------- */\n    /* 1.  CSS Variables */\n    /* 2.  Dark Mode */\n    /* 3.  Autocomplete */\n    /* 4.  Panel */\n    /* 5.  Sources */\n    /* 6.  Hit Layout */\n    /* 7.  Panel Header */\n    /* 8.  Panel Footer */\n    /* 9.  Detached Mode */\n    /* 10. Gradients */\n    /* 11. Utilities */\n    /* ---------------- */\n    /* Note: */\n    /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n    /* We use the SASS  function to keep specificity low. */\n    /* ---------------- */\n    /* 1. CSS Variables */\n    /* ---------------- */\n    :root {\n      /* Newskit */\n      --aa-newskit-input-border-color: 204, 204, 204;\n      --aa-newskit-placeholder-color: 106, 106, 106;\n      /* Input */\n      --aa-search-input-height: 44px;\n      --aa-input-icon-size: 20px;\n      /* Size and spacing */\n      --aa-base-unit: 16;\n      --aa-spacing-factor: 1;\n      --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n      --aa-spacing-half: calc(var(--aa-spacing) / 2);\n      --aa-panel-max-height: 650px;\n      /* Z-index */\n      --aa-base-z-index: 9999;\n      /* Font */\n      --aa-font-size: calc(var(--aa-base-unit) * 1px);\n      --aa-font-family: inherit;\n      --aa-font-weight-medium: 500;\n      --aa-font-weight-semibold: 600;\n      --aa-font-weight-bold: 700;\n      /* Icons */\n      --aa-icon-size: 20px;\n      --aa-icon-stroke-width: 1.6;\n      --aa-icon-color-rgb: 119, 119, 163;\n      --aa-icon-color-alpha: 1;\n      --aa-action-icon-size: 20px;\n      /* Text colors */\n      --aa-text-color-rgb: 38, 38, 39;\n      --aa-text-color-alpha: 1;\n      --aa-primary-color-rgb: 62, 52, 211;\n      --aa-primary-color-alpha: 0.2;\n      --aa-muted-color-rgb: 128, 126, 163;\n      --aa-muted-color-alpha: 0.6;\n      /* Border colors */\n      --aa-panel-border-color-rgb: 128, 126, 163;\n      --aa-panel-border-color-alpha: 0.3;\n      --aa-input-border-color-rgb: 145, 145, 145;\n      --aa-input-border-color-alpha: 0.8;\n      /* Background colors */\n      --aa-background-color-rgb: 255, 255, 255;\n      --aa-background-color-alpha: 1;\n      --aa-input-background-color-rgb: 255, 255, 255;\n      --aa-input-background-color-alpha: 1;\n      --aa-selected-color-rgb: 179, 173, 214;\n      --aa-selected-color-alpha: 0.205;\n      --aa-description-highlight-background-color-rgb: 245, 223, 77;\n      --aa-description-highlight-background-color-alpha: 0.5;\n      /* Detached mode */\n      --aa-detached-media-query: (max-width: 680px);\n      --aa-detached-modal-media-query: (min-width: 680px);\n      --aa-detached-modal-max-width: 680px;\n      --aa-detached-modal-max-height: 500px;\n      --aa-overlay-color-rgb: 115, 114, 129;\n      --aa-overlay-color-alpha: 0.4;\n      /* Shadows */\n      --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      /* Scrollbar */\n      --aa-scrollbar-width: 13px;\n      --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n      --aa-scrollbar-track-background-color-alpha: 1;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n      --aa-scrollbar-thumb-background-color-alpha: 1;\n      /* Touch screens */\n    }\n    @media (hover: none) and (pointer: coarse) {\n      :root {\n        --aa-spacing-factor: 1.2;\n        --aa-action-icon-size: 22px;\n      }\n    }\n    /* ---------------- */\n    /* 2. Dark Mode */\n    /* ---------------- */\n    body {\n      /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n      /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n    }\n    body[data-theme='dark'],\n    body.dark {\n      /* Text colors */\n      --aa-text-color-rgb: 183, 192, 199;\n      --aa-primary-color-rgb: 146, 138, 255;\n      --aa-muted-color-rgb: 146, 138, 255;\n      /* Background colors */\n      --aa-input-background-color-rgb: 0, 3, 9;\n      --aa-background-color-rgb: 21, 24, 42;\n      --aa-selected-color-rgb: 146, 138, 255;\n      --aa-selected-color-alpha: 0.25;\n      --aa-description-highlight-background-color-rgb: 0 255 255;\n      --aa-description-highlight-background-color-alpha: 0.25;\n      /* Icons */\n      --aa-icon-color-rgb: 119, 119, 163;\n      /* Shadows */\n      --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n        0 3px 8px 0 rgb(0, 3, 9);\n      /* Scrollbar */\n      --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    }\n    /* Reset for  */\n    .aa-Panel *,\n    .aa-Autocomplete *,\n    .aa-DetachedFormContainer * {\n      box-sizing: border-box;\n    }\n    /* Init for  */\n    .aa-Panel,\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      font-weight: normal;\n      line-height: 1em;\n      margin: 0;\n      padding: 0;\n      text-align: left;\n    }\n    /* ---------------- */\n    /* 3. Autocomplete */\n    /* ---------------- */\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      /* Search box */\n    }\n    .aa-Form {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: ", ";\n      ", ";\n      border-radius: 8px;\n      display: flex;\n      flex-direction: ", ";\n      line-height: 1em;\n      margin: 0;\n      position: relative;\n      width: 100%;\n    }\n    .aa-Form[focus-within] {\n      ", ";\n      ", ";\n      ", ";\n      ", ";\n    }\n    .aa-Form:focus-within {\n      ", ";\n      ", ";\n      ", ";\n      ", ";\n    }\n    .aa-InputWrapperPrefix {\n      align-items: center;\n      display: flex;\n      flex-shrink: 0;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 3;\n      /* Container for search and loading icons */\n    }\n    .aa-Label,\n    .aa-LoadingIndicator {\n      cursor: auto;\n      cursor: initial;\n      flex-shrink: 0;\n      height: 100%;\n      padding: 0;\n      text-align: left;\n    }\n    .aa-Label svg,\n    .aa-LoadingIndicator svg {\n      ", "\n      ", "\n    position: relative;\n      top: 1px;\n      height: auto;\n      max-height: 20px;\n      max-height: var(--aa-input-icon-size);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-input-icon-size);\n    }\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      height: 100%;\n      padding-left: 11px;\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n      padding-right: 8px;\n      padding-right: var(--aa-spacing-half);\n      width: 47px;\n      width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-SubmitButton,\n      .aa-LoadingIndicator {\n        padding-left: 3px;\n        padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n        width: 39px;\n        width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n      }\n    }\n    .aa-SubmitButton {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n    }\n    .aa-SubmitButton svg {\n      cursor: pointer;\n    }\n    .aa-SubmitButton:disabled svg {\n      cursor: not-allowed;\n    }\n\n    .aa-LoadingIndicator {\n      align-items: center;\n      display: flex;\n      justify-content: center;\n    }\n    .aa-LoadingIndicator[hidden] {\n      display: none;\n    }\n    .aa-InputWrapper {\n      order: 1;\n      position: relative;\n      width: 100%;\n      /* Search box input (with placeholder and query) */\n    }\n    .aa-Input {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      ", "\n      font: inherit;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      padding: 0;\n      width: 100%;\n      /* Focus is set and styled on the parent, it isn't necessary here */\n      /* Remove native appearence */\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    }\n    .aa-Input::-moz-placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:-ms-input-placeholder {\n      color: rgba(106, 106, 106, 1);\n      color: rgba(\n        var(--aa-newskit-placeholder-color),\n        var(--aa-text-color-alpha)\n      );\n      opacity: 1;\n    }\n    .aa-Input::placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:focus {\n      border-color: none;\n      box-shadow: none;\n      outline: none;\n    }\n    .aa-Input::-webkit-search-decoration,\n    .aa-Input::-webkit-search-cancel-button,\n    .aa-Input::-webkit-search-results-button,\n    .aa-Input::-webkit-search-results-decoration {\n      -webkit-appearance: none;\n      appearance: none;\n    }\n    .aa-InputWrapperSuffix {\n      align-items: center;\n      display: flex;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 2;\n      /* Accelerator to clear the query */\n    }\n    .aa-ClearButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-ClearButton:hover,\n    .aa-ClearButton:focus {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    .aa-ClearButton[hidden] {\n      display: none;\n    }\n    .aa-ClearButton svg {\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    /* ---------------- */\n    /* 4. Panel */\n    /* ---------------- */\n    .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 4px;\n      border-radius: calc(var(--aa-spacing) / 4);\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      margin: 8px 0 0;\n      overflow: hidden;\n      position: absolute;\n      transition: opacity 200ms ease-in, filter 200ms ease-in;\n      /* When a request isn't resolved yet */\n    }\n    @media screen and (prefers-reduced-motion) {\n      .aa-Panel {\n        transition: none;\n      }\n    }\n    .aa-Panel button {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-PanelLayout {\n      height: 100%;\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-y: auto;\n      padding: 0;\n      position: relative;\n      text-align: left;\n    }\n    .aa-PanelLayoutColumns--twoGolden {\n      display: grid;\n      grid-template-columns: 39.2% auto;\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--two {\n      display: grid;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--three {\n      display: grid;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-Panel--stalled .aa-Source {\n      filter: grayscale(1);\n      opacity: 0.8;\n    }\n    .aa-Panel--scrollable {\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-x: hidden;\n      overflow-y: auto;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n      scrollbar-color: white #eaeaea;\n      scrollbar-color: rgba(\n          var(--aa-scrollbar-thumb-background-color-rgb),\n          var(--aa-scrollbar-thumb-background-color-alpha)\n        )\n        rgba(\n          var(--aa-scrollbar-track-background-color-rgb),\n          var(--aa-scrollbar-track-background-color-alpha)\n        );\n      scrollbar-width: thin;\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar {\n      width: 13px;\n      width: var(--aa-scrollbar-width);\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-track {\n      background-color: #eaeaea;\n      background-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      );\n      border-color: #eaeaea;\n      border-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n      border-radius: 9999px;\n      border-style: solid;\n      border-width: 3px 2px 3px 3px;\n    }\n    /* ---------------- */\n    /* 5. Sources */\n    /* Each source can be styled independently */\n    /* ---------------- */\n    .aa-Source {\n      margin: 0;\n      padding: 0;\n      position: relative;\n      width: 100%;\n      /* List of results inside the source */\n      /* Source title */\n      /* See all button */\n    }\n    .aa-Source:empty {\n      /* Hide empty section */\n      display: none;\n    }\n    .aa-SourceNoResults {\n      font-size: 1em;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n    }\n    .aa-List {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-SourceHeader {\n      margin: 8px 0.5em 8px 0;\n      margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n      padding: 0;\n      position: relative;\n      /* Hide empty header */\n      /* Title typography */\n      /* Line separator */\n    }\n    .aa-SourceHeader:empty {\n      display: none;\n    }\n    .aa-SourceHeaderTitle {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      display: inline-block;\n      font-size: 0.8em;\n      font-weight: 600;\n      font-weight: var(--aa-font-weight-semibold);\n      margin: 0;\n      padding: 0 8px 0 0;\n      padding: 0 var(--aa-spacing-half) 0 0;\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-SourceHeaderLine {\n      border-bottom: solid 1px #3e34d3;\n      border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n      display: block;\n      height: 2px;\n      left: 0;\n      margin: 0;\n      opacity: 0.3;\n      padding: 0;\n      position: absolute;\n      right: 0;\n      top: 8px;\n      top: var(--aa-spacing-half);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    .aa-SourceFooterSeeAll {\n      background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n      background: linear-gradient(\n        180deg,\n        rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n        rgba(128, 126, 163, 0.14)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.6);\n      border: 1px solid\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      border-radius: 5px;\n      box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n      color: inherit;\n      font-size: 0.95em;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n      padding: 0.475em 1em 0.6em;\n      text-decoration: none;\n    }\n    .aa-SourceFooterSeeAll:focus,\n    .aa-SourceFooterSeeAll:hover {\n      border: 1px solid #3e34d3;\n      border: 1px solid #cccccc;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n    }\n    /* ---------------- */\n    /* 6. Hit Layout */\n    /* ---------------- */\n    .aa-Item {\n      align-items: center;\n      border-radius: 3px;\n      cursor: pointer;\n      display: grid;\n      min-height: 40px;\n      min-height: calc(var(--aa-spacing) * 2.5);\n      padding: 4px;\n      padding: calc(var(--aa-spacing-half) / 2);\n      /* When the result is active */\n      /* The result type icon inlined SVG or image */\n      /* wrap hit with url but we don't need to see it */\n      /* Secondary click actions */\n    }\n    .aa-Item[aria-selected='true'] {\n      background-color: rgba(179, 173, 214, 0.205);\n      background-color: rgba(\n        var(--aa-selected-color-rgb),\n        var(--aa-selected-color-alpha)\n      );\n    }\n    .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n    .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n      visibility: visible;\n    }\n    .aa-ItemIcon {\n      align-items: center;\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 3px;\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      color: #7777a3;\n      color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n      display: flex;\n      flex-shrink: 0;\n      font-size: 0.7em;\n      height: 28px;\n      height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n      justify-content: center;\n      overflow: hidden;\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      text-align: center;\n      width: 28px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    }\n    .aa-ItemIcon img {\n      height: auto;\n      max-height: 20px;\n      max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      max-width: 20px;\n      max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      width: auto;\n    }\n    .aa-ItemIcon svg {\n      height: 20px;\n      height: var(--aa-icon-size);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    .aa-ItemIcon--alignTop {\n      align-self: flex-start;\n    }\n    .aa-ItemIcon--noBorder {\n      background: none;\n      box-shadow: none;\n    }\n    .aa-ItemIcon--picture {\n      height: 96px;\n      width: 96px;\n    }\n    .aa-ItemIcon--picture img {\n      max-height: 100%;\n      max-width: 100%;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-ItemContent {\n      align-items: center;\n      cursor: pointer;\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      line-height: 1.25em;\n      overflow: hidden;\n    }\n    .aa-ItemContent:empty {\n      display: none;\n    }\n    .aa-ItemContent mark {\n      background: none;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 700;\n      font-weight: var(--aa-font-weight-bold);\n    }\n    .aa-ItemContent--dual {\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      text-align: left;\n    }\n    .aa-ItemContent--dual .aa-ItemContentTitle,\n    .aa-ItemContent--dual .aa-ItemContentSubtitle {\n      display: block;\n    }\n    .aa-ItemContent--indented {\n      padding-left: 36px;\n      padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-ItemContentBody {\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n    }\n    .aa-ItemContentTitle {\n      ", "\n      display: inline-block;\n      margin: 0 0.5em 0 0;\n      max-width: 100%;\n      overflow: hidden;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .aa-ItemContentSubtitle {\n      font-size: 0.92em;\n    }\n    .aa-ItemContentSubtitleIcon::before {\n      border-color: rgba(128, 126, 163, 0.64);\n      border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n      border-style: solid;\n      content: '';\n      display: inline-block;\n      left: 1px;\n      position: relative;\n      top: -3px;\n    }\n    .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n      border-width: 0 0 1.5px;\n      margin-left: 8px;\n      margin-left: var(--aa-spacing-half);\n      margin-right: 4px;\n      margin-right: calc(var(--aa-spacing-half) / 2);\n      width: 10px;\n      width: calc(var(--aa-spacing-half) + 2px);\n    }\n    .aa-ItemContentSubtitle--standalone {\n      align-items: center;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      justify-content: start;\n    }\n    .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n      border-radius: 0 0 0 3px;\n      border-width: 0 0 1.5px 1.5px;\n      height: 8px;\n      height: var(--aa-spacing-half);\n      width: 8px;\n      width: var(--aa-spacing-half);\n    }\n    .aa-ItemContentSubtitleCategory {\n      color: #807ea3;\n      color: rgba(var(--aa-muted-color-rgb), 1);\n      font-weight: 500;\n    }\n    .aa-ItemContentDescription {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 0.85em;\n      max-width: 100%;\n      overflow-x: hidden;\n      text-overflow: ellipsis;\n    }\n    .aa-ItemContentDescription:empty {\n      display: none;\n    }\n    .aa-ItemContentDescription mark {\n      background: rgba(245, 223, 77, 0.5);\n      background: rgba(\n        var(--aa-description-highlight-background-color-rgb),\n        var(--aa-description-highlight-background-color-alpha)\n      );\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n    }\n    .aa-ItemContentDash {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      display: none;\n      opacity: 0.4;\n    }\n    .aa-ItemContentTag {\n      background-color: rgba(62, 52, 211, 0.2);\n      background-color: rgba(\n        var(--aa-primary-color-rgb),\n        var(--aa-primary-color-alpha)\n      );\n      border-radius: 3px;\n      margin: 0 0.4em 0 0;\n      padding: 0.08em 0.3em;\n    }\n    .aa-ItemWrapper,\n    .aa-ItemLink {\n      align-items: center;\n      color: inherit;\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n      grid-auto-flow: column;\n      justify-content: space-between;\n      width: 100%;\n    }\n    .aa-ItemLink {\n      color: inherit;\n      text-decoration: none;\n    }\n    .aa-ItemActions {\n      display: grid;\n      grid-auto-flow: column;\n      height: 100%;\n      justify-self: end;\n      margin: 0 -5.3333333333px;\n      margin: 0 calc(var(--aa-spacing) / -3);\n      padding: 0 2px 0 0;\n    }\n    .aa-ItemActionButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      flex-shrink: 0;\n      padding: 0;\n    }\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-ItemActionButton:hover svg,\n      .aa-ItemActionButton:focus svg {\n        color: inherit;\n      }\n    }\n    .aa-ItemActionButton svg {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      margin: 0;\n      margin: 5.3333333333px;\n      margin: calc(var(--aa-spacing) / 3);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-action-icon-size);\n    }\n    .aa-ActiveOnly {\n      visibility: hidden;\n    }\n    /*---------------- */\n    /* 7. Panel Header */\n    /*---------------- */\n    .aa-PanelHeader {\n      align-items: center;\n      background: #3e34d3;\n      background: rgba(var(--aa-primary-color-rgb), 1);\n      color: #fff;\n      display: grid;\n      height: var(--aa-modal-header-height);\n      margin: 0;\n      padding: 8px 16px;\n      padding: var(--aa-spacing-half) var(--aa-spacing);\n      position: relative;\n    }\n    .aa-PanelHeader::after {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      bottom: -8px;\n      bottom: calc(var(--aa-spacing-half) * -1);\n      content: '';\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    /*---------------- */\n    /* 8. Panel Footer */\n    /*---------------- */\n    .aa-PanelFooter {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 1px 0\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      justify-content: space-between;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-PanelFooter::after {\n      background-image: linear-gradient(\n        rgba(255, 255, 255, 0),\n        rgba(128, 126, 163, 0.6)\n      );\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n      );\n      content: '';\n      height: 16px;\n      height: var(--aa-spacing);\n      left: 0;\n      opacity: 0.12;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      top: -16px;\n      top: calc(var(--aa-spacing) * -1);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 9. Detached Mode */\n    /*---------------- */\n    .aa-DetachedContainer {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      bottom: 0;\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      display: flex;\n      flex-direction: column;\n      left: 0;\n      margin: 0;\n      overflow: hidden;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-DetachedContainer::after {\n      height: 32px;\n    }\n    .aa-DetachedContainer .aa-SourceHeader {\n      margin: 8px 0 8px 2px;\n      margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n    }\n    .aa-DetachedContainer .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 0;\n      box-shadow: none;\n      flex-grow: 1;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-DetachedContainer .aa-PanelLayout {\n      bottom: 0;\n      box-shadow: none;\n      left: 0;\n      margin: 0;\n      max-height: none;\n      overflow-y: auto;\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 100%;\n    }\n    .aa-DetachedFormContainer {\n      border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n      border-bottom: solid 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n      margin: 0;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton {\n      background: none;\n      border: 0;\n      border-radius: 3px;\n      color: inherit;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      cursor: pointer;\n      font: inherit;\n      margin: 0 0 0 8px;\n      margin: 0 0 0 var(--aa-spacing-half);\n      padding: 0 8px;\n      padding: 0 var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton:hover,\n    .aa-DetachedCancelButton:focus {\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n    }\n    .aa-DetachedContainer--modal {\n      border-radius: 6px;\n      bottom: inherit;\n      height: auto;\n      margin: 0 auto;\n      max-width: 680px;\n      max-width: var(--aa-detached-modal-max-width);\n      position: absolute;\n      top: 3%;\n    }\n    .aa-DetachedContainer--modal .aa-PanelLayout {\n      max-height: 500px;\n      max-height: var(--aa-detached-modal-max-height);\n      padding-bottom: 8px;\n      padding-bottom: var(--aa-spacing-half);\n      position: static;\n    }\n    /* Search Button */\n    .aa-DetachedSearchButton {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.8);\n      border: 1px solid\n        rgba(\n          var(--aa-input-border-color-rgb),\n          var(--aa-input-border-color-alpha)\n        );\n      border-radius: 3px;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      font: inherit;\n      font-family: inherit;\n      font-family: var(--aa-font-family);\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      height: 44px;\n      height: var(--aa-search-input-height);\n      margin: 0;\n      padding: 0 5.5px;\n      padding: 0 calc(var(--aa-search-input-height) / 8);\n      position: relative;\n      text-align: left;\n      width: 100%;\n    }\n    .aa-DetachedSearchButton:focus {\n      border-color: #3e34d3;\n      border-color: rgba(var(--aa-primary-color-rgb), 1);\n      box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n        inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n      box-shadow: rgba(\n            var(--aa-primary-color-rgb),\n            var(--aa-primary-color-alpha)\n          )\n          0 0 0 3px,\n        inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0\n          0 0 2px;\n      outline: currentColor none medium;\n    }\n    .aa-DetachedSearchButtonIcon {\n      align-items: center;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      cursor: auto;\n      cursor: initial;\n      display: flex;\n      height: 100%;\n      justify-content: center;\n      width: 36px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-Detached {\n      height: 100vh;\n      overflow: hidden;\n    }\n    .aa-DetachedOverlay {\n      background-color: rgba(115, 114, 129, 0.4);\n      background-color: rgba(\n        var(--aa-overlay-color-rgb),\n        var(--aa-overlay-color-alpha)\n      );\n      height: 100vh;\n      left: 0;\n      margin: 0;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 10. Gradients */\n    /*---------------- */\n    .aa-GradientTop,\n    .aa-GradientBottom {\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-GradientTop {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      top: 0;\n    }\n    .aa-GradientBottom {\n      background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-background-color-rgb), 1)\n      );\n      border-bottom-left-radius: 4px;\n      border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n      border-bottom-right-radius: 4px;\n      border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n      bottom: 0;\n    }\n    /*---------------- */\n    /* 11. Utilities */\n    /*---------------- */\n    @media (hover: none) and (pointer: coarse) {\n      .aa-DesktopOnly {\n        display: none;\n      }\n    }\n    @media (hover: hover) {\n      .aa-TouchOnly {\n        display: none;\n      }\n    }\n  "], ["\n    /*! @algolia/autocomplete-theme-classic 1.6.3 | MIT License | \u00A9 Algolia, Inc. and contributors | https://github.com/algolia/autocomplete */\n    /* ---------------- */\n    /* 1.  CSS Variables */\n    /* 2.  Dark Mode */\n    /* 3.  Autocomplete */\n    /* 4.  Panel */\n    /* 5.  Sources */\n    /* 6.  Hit Layout */\n    /* 7.  Panel Header */\n    /* 8.  Panel Footer */\n    /* 9.  Detached Mode */\n    /* 10. Gradients */\n    /* 11. Utilities */\n    /* ---------------- */\n    /* Note: */\n    /* This theme reflects the markup structure of autocomplete with SCSS indentation. */\n    /* We use the SASS  function to keep specificity low. */\n    /* ---------------- */\n    /* 1. CSS Variables */\n    /* ---------------- */\n    :root {\n      /* Newskit */\n      --aa-newskit-input-border-color: 204, 204, 204;\n      --aa-newskit-placeholder-color: 106, 106, 106;\n      /* Input */\n      --aa-search-input-height: 44px;\n      --aa-input-icon-size: 20px;\n      /* Size and spacing */\n      --aa-base-unit: 16;\n      --aa-spacing-factor: 1;\n      --aa-spacing: calc(var(--aa-base-unit) * var(--aa-spacing-factor) * 1px);\n      --aa-spacing-half: calc(var(--aa-spacing) / 2);\n      --aa-panel-max-height: 650px;\n      /* Z-index */\n      --aa-base-z-index: 9999;\n      /* Font */\n      --aa-font-size: calc(var(--aa-base-unit) * 1px);\n      --aa-font-family: inherit;\n      --aa-font-weight-medium: 500;\n      --aa-font-weight-semibold: 600;\n      --aa-font-weight-bold: 700;\n      /* Icons */\n      --aa-icon-size: 20px;\n      --aa-icon-stroke-width: 1.6;\n      --aa-icon-color-rgb: 119, 119, 163;\n      --aa-icon-color-alpha: 1;\n      --aa-action-icon-size: 20px;\n      /* Text colors */\n      --aa-text-color-rgb: 38, 38, 39;\n      --aa-text-color-alpha: 1;\n      --aa-primary-color-rgb: 62, 52, 211;\n      --aa-primary-color-alpha: 0.2;\n      --aa-muted-color-rgb: 128, 126, 163;\n      --aa-muted-color-alpha: 0.6;\n      /* Border colors */\n      --aa-panel-border-color-rgb: 128, 126, 163;\n      --aa-panel-border-color-alpha: 0.3;\n      --aa-input-border-color-rgb: 145, 145, 145;\n      --aa-input-border-color-alpha: 0.8;\n      /* Background colors */\n      --aa-background-color-rgb: 255, 255, 255;\n      --aa-background-color-alpha: 1;\n      --aa-input-background-color-rgb: 255, 255, 255;\n      --aa-input-background-color-alpha: 1;\n      --aa-selected-color-rgb: 179, 173, 214;\n      --aa-selected-color-alpha: 0.205;\n      --aa-description-highlight-background-color-rgb: 245, 223, 77;\n      --aa-description-highlight-background-color-alpha: 0.5;\n      /* Detached mode */\n      --aa-detached-media-query: (max-width: 680px);\n      --aa-detached-modal-media-query: (min-width: 680px);\n      --aa-detached-modal-max-width: 680px;\n      --aa-detached-modal-max-height: 500px;\n      --aa-overlay-color-rgb: 115, 114, 129;\n      --aa-overlay-color-alpha: 0.4;\n      /* Shadows */\n      --aa-panel-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      /* Scrollbar */\n      --aa-scrollbar-width: 13px;\n      --aa-scrollbar-track-background-color-rgb: 234, 234, 234;\n      --aa-scrollbar-track-background-color-alpha: 1;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n      --aa-scrollbar-thumb-background-color-alpha: 1;\n      /* Touch screens */\n    }\n    @media (hover: none) and (pointer: coarse) {\n      :root {\n        --aa-spacing-factor: 1.2;\n        --aa-action-icon-size: 22px;\n      }\n    }\n    /* ---------------- */\n    /* 2. Dark Mode */\n    /* ---------------- */\n    body {\n      /* stylelint-disable selector-no-qualifying-type, selector-class-pattern */\n      /* stylelint-enable selector-no-qualifying-type, selector-class-pattern */\n    }\n    body[data-theme='dark'],\n    body.dark {\n      /* Text colors */\n      --aa-text-color-rgb: 183, 192, 199;\n      --aa-primary-color-rgb: 146, 138, 255;\n      --aa-muted-color-rgb: 146, 138, 255;\n      /* Background colors */\n      --aa-input-background-color-rgb: 0, 3, 9;\n      --aa-background-color-rgb: 21, 24, 42;\n      --aa-selected-color-rgb: 146, 138, 255;\n      --aa-selected-color-alpha: 0.25;\n      --aa-description-highlight-background-color-rgb: 0 255 255;\n      --aa-description-highlight-background-color-alpha: 0.25;\n      /* Icons */\n      --aa-icon-color-rgb: 119, 119, 163;\n      /* Shadows */\n      --aa-panel-shadow: inset 1px 1px 0 0 rgb(44, 46, 64),\n        0 3px 8px 0 rgb(0, 3, 9);\n      /* Scrollbar */\n      --aa-scrollbar-track-background-color-rgb: 44, 46, 64;\n      --aa-scrollbar-thumb-background-color-rgb: var(--aa-background-color-rgb);\n    }\n    /* Reset for  */\n    .aa-Panel *,\n    .aa-Autocomplete *,\n    .aa-DetachedFormContainer * {\n      box-sizing: border-box;\n    }\n    /* Init for  */\n    .aa-Panel,\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      font-weight: normal;\n      line-height: 1em;\n      margin: 0;\n      padding: 0;\n      text-align: left;\n    }\n    /* ---------------- */\n    /* 3. Autocomplete */\n    /* ---------------- */\n    .aa-Autocomplete,\n    .aa-DetachedFormContainer {\n      /* Search box */\n    }\n    .aa-Form {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: ", ";\n      ", ";\n      border-radius: 8px;\n      display: flex;\n      flex-direction: ", ";\n      line-height: 1em;\n      margin: 0;\n      position: relative;\n      width: 100%;\n    }\n    .aa-Form[focus-within] {\n      ", ";\n      ", ";\n      ", ";\n      ", ";\n    }\n    .aa-Form:focus-within {\n      ", ";\n      ", ";\n      ", ";\n      ", ";\n    }\n    .aa-InputWrapperPrefix {\n      align-items: center;\n      display: flex;\n      flex-shrink: 0;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 3;\n      /* Container for search and loading icons */\n    }\n    .aa-Label,\n    .aa-LoadingIndicator {\n      cursor: auto;\n      cursor: initial;\n      flex-shrink: 0;\n      height: 100%;\n      padding: 0;\n      text-align: left;\n    }\n    .aa-Label svg,\n    .aa-LoadingIndicator svg {\n      ", "\n      ", "\n    position: relative;\n      top: 1px;\n      height: auto;\n      max-height: 20px;\n      max-height: var(--aa-input-icon-size);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-input-icon-size);\n    }\n    .aa-SubmitButton,\n    .aa-LoadingIndicator {\n      height: 100%;\n      padding-left: 11px;\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n      padding-right: 8px;\n      padding-right: var(--aa-spacing-half);\n      width: 47px;\n      width: calc(var(--aa-spacing) * 1.75 + var(--aa-icon-size) - 1px);\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-SubmitButton,\n      .aa-LoadingIndicator {\n        padding-left: 3px;\n        padding-left: calc(var(--aa-spacing-half) / 2 - 1px);\n        width: 39px;\n        width: calc(var(--aa-icon-size) + var(--aa-spacing) * 1.25 - 1px);\n      }\n    }\n    .aa-SubmitButton {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n    }\n    .aa-SubmitButton svg {\n      cursor: pointer;\n    }\n    .aa-SubmitButton:disabled svg {\n      cursor: not-allowed;\n    }\n\n    .aa-LoadingIndicator {\n      align-items: center;\n      display: flex;\n      justify-content: center;\n    }\n    .aa-LoadingIndicator[hidden] {\n      display: none;\n    }\n    .aa-InputWrapper {\n      order: 1;\n      position: relative;\n      width: 100%;\n      /* Search box input (with placeholder and query) */\n    }\n    .aa-Input {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      ", "\n      font: inherit;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      padding: 0;\n      width: 100%;\n      /* Focus is set and styled on the parent, it isn't necessary here */\n      /* Remove native appearence */\n      padding-left: calc(var(--aa-spacing) * 0.75 - 1px);\n    }\n    .aa-Input::-moz-placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:-ms-input-placeholder {\n      color: rgba(106, 106, 106, 1);\n      color: rgba(\n        var(--aa-newskit-placeholder-color),\n        var(--aa-text-color-alpha)\n      );\n      opacity: 1;\n    }\n    .aa-Input::placeholder {\n      ", "\n      opacity: 1;\n    }\n    .aa-Input:focus {\n      border-color: none;\n      box-shadow: none;\n      outline: none;\n    }\n    .aa-Input::-webkit-search-decoration,\n    .aa-Input::-webkit-search-cancel-button,\n    .aa-Input::-webkit-search-results-button,\n    .aa-Input::-webkit-search-results-decoration {\n      -webkit-appearance: none;\n      appearance: none;\n    }\n    .aa-InputWrapperSuffix {\n      align-items: center;\n      display: flex;\n      height: 44px;\n      height: var(--aa-search-input-height);\n      order: 2;\n      /* Accelerator to clear the query */\n    }\n    .aa-ClearButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      height: 100%;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-ClearButton:hover,\n    .aa-ClearButton:focus {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    .aa-ClearButton[hidden] {\n      display: none;\n    }\n    .aa-ClearButton svg {\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    /* ---------------- */\n    /* 4. Panel */\n    /* ---------------- */\n    .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 4px;\n      border-radius: calc(var(--aa-spacing) / 4);\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      margin: 8px 0 0;\n      overflow: hidden;\n      position: absolute;\n      transition: opacity 200ms ease-in, filter 200ms ease-in;\n      /* When a request isn't resolved yet */\n    }\n    @media screen and (prefers-reduced-motion) {\n      .aa-Panel {\n        transition: none;\n      }\n    }\n    .aa-Panel button {\n      -webkit-appearance: none;\n      -moz-appearance: none;\n      appearance: none;\n      background: none;\n      border: 0;\n      margin: 0;\n      padding: 0;\n    }\n    .aa-PanelLayout {\n      height: 100%;\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-y: auto;\n      padding: 0;\n      position: relative;\n      text-align: left;\n    }\n    .aa-PanelLayoutColumns--twoGolden {\n      display: grid;\n      grid-template-columns: 39.2% auto;\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--two {\n      display: grid;\n      grid-template-columns: repeat(2, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-PanelLayoutColumns--three {\n      display: grid;\n      grid-template-columns: repeat(3, minmax(0, 1fr));\n      overflow: hidden;\n      padding: 0;\n    }\n    .aa-Panel--stalled .aa-Source {\n      filter: grayscale(1);\n      opacity: 0.8;\n    }\n    .aa-Panel--scrollable {\n      margin: 0;\n      max-height: 650px;\n      max-height: var(--aa-panel-max-height);\n      overflow-x: hidden;\n      overflow-y: auto;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n      scrollbar-color: white #eaeaea;\n      scrollbar-color: rgba(\n          var(--aa-scrollbar-thumb-background-color-rgb),\n          var(--aa-scrollbar-thumb-background-color-alpha)\n        )\n        rgba(\n          var(--aa-scrollbar-track-background-color-rgb),\n          var(--aa-scrollbar-track-background-color-alpha)\n        );\n      scrollbar-width: thin;\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar {\n      width: 13px;\n      width: var(--aa-scrollbar-width);\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-track {\n      background-color: #eaeaea;\n      background-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n    }\n    .aa-Panel--scrollable::-webkit-scrollbar-thumb {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-scrollbar-thumb-background-color-rgb),\n        var(--aa-scrollbar-thumb-background-color-alpha)\n      );\n      border-color: #eaeaea;\n      border-color: rgba(\n        var(--aa-scrollbar-track-background-color-rgb),\n        var(--aa-scrollbar-track-background-color-alpha)\n      );\n      border-radius: 9999px;\n      border-style: solid;\n      border-width: 3px 2px 3px 3px;\n    }\n    /* ---------------- */\n    /* 5. Sources */\n    /* Each source can be styled independently */\n    /* ---------------- */\n    .aa-Source {\n      margin: 0;\n      padding: 0;\n      position: relative;\n      width: 100%;\n      /* List of results inside the source */\n      /* Source title */\n      /* See all button */\n    }\n    .aa-Source:empty {\n      /* Hide empty section */\n      display: none;\n    }\n    .aa-SourceNoResults {\n      font-size: 1em;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n    }\n    .aa-List {\n      list-style: none;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-SourceHeader {\n      margin: 8px 0.5em 8px 0;\n      margin: var(--aa-spacing-half) 0.5em var(--aa-spacing-half) 0;\n      padding: 0;\n      position: relative;\n      /* Hide empty header */\n      /* Title typography */\n      /* Line separator */\n    }\n    .aa-SourceHeader:empty {\n      display: none;\n    }\n    .aa-SourceHeaderTitle {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      display: inline-block;\n      font-size: 0.8em;\n      font-weight: 600;\n      font-weight: var(--aa-font-weight-semibold);\n      margin: 0;\n      padding: 0 8px 0 0;\n      padding: 0 var(--aa-spacing-half) 0 0;\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-SourceHeaderLine {\n      border-bottom: solid 1px #3e34d3;\n      border-bottom: solid 1px rgba(var(--aa-primary-color-rgb), 1);\n      display: block;\n      height: 2px;\n      left: 0;\n      margin: 0;\n      opacity: 0.3;\n      padding: 0;\n      position: absolute;\n      right: 0;\n      top: 8px;\n      top: var(--aa-spacing-half);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    .aa-SourceFooterSeeAll {\n      background: linear-gradient(180deg, white, rgba(128, 126, 163, 0.14));\n      background: linear-gradient(\n        180deg,\n        rgba(var(--aa-background-color-rgb), var(--aa-background-color-alpha)),\n        rgba(128, 126, 163, 0.14)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.6);\n      border: 1px solid\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      border-radius: 5px;\n      box-shadow: inset 0 0 2px #fff, 0 2px 2px -1px rgba(76, 69, 88, 0.15);\n      color: inherit;\n      font-size: 0.95em;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n      padding: 0.475em 1em 0.6em;\n      text-decoration: none;\n    }\n    .aa-SourceFooterSeeAll:focus,\n    .aa-SourceFooterSeeAll:hover {\n      border: 1px solid #3e34d3;\n      border: 1px solid #cccccc;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n    }\n    /* ---------------- */\n    /* 6. Hit Layout */\n    /* ---------------- */\n    .aa-Item {\n      align-items: center;\n      border-radius: 3px;\n      cursor: pointer;\n      display: grid;\n      min-height: 40px;\n      min-height: calc(var(--aa-spacing) * 2.5);\n      padding: 4px;\n      padding: calc(var(--aa-spacing-half) / 2);\n      /* When the result is active */\n      /* The result type icon inlined SVG or image */\n      /* wrap hit with url but we don't need to see it */\n      /* Secondary click actions */\n    }\n    .aa-Item[aria-selected='true'] {\n      background-color: rgba(179, 173, 214, 0.205);\n      background-color: rgba(\n        var(--aa-selected-color-rgb),\n        var(--aa-selected-color-alpha)\n      );\n    }\n    .aa-Item[aria-selected='true'] .aa-ItemActionButton,\n    .aa-Item[aria-selected='true'] .aa-ActiveOnly {\n      visibility: visible;\n    }\n    .aa-ItemIcon {\n      align-items: center;\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 3px;\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      color: #7777a3;\n      color: rgba(var(--aa-icon-color-rgb), var(--aa-icon-color-alpha));\n      display: flex;\n      flex-shrink: 0;\n      font-size: 0.7em;\n      height: 28px;\n      height: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n      justify-content: center;\n      overflow: hidden;\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      text-align: center;\n      width: 28px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing-half));\n    }\n    .aa-ItemIcon img {\n      height: auto;\n      max-height: 20px;\n      max-height: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      max-width: 20px;\n      max-width: calc(var(--aa-icon-size) + var(--aa-spacing-half) - 8px);\n      width: auto;\n    }\n    .aa-ItemIcon svg {\n      height: 20px;\n      height: var(--aa-icon-size);\n      width: 20px;\n      width: var(--aa-icon-size);\n    }\n    .aa-ItemIcon--alignTop {\n      align-self: flex-start;\n    }\n    .aa-ItemIcon--noBorder {\n      background: none;\n      box-shadow: none;\n    }\n    .aa-ItemIcon--picture {\n      height: 96px;\n      width: 96px;\n    }\n    .aa-ItemIcon--picture img {\n      max-height: 100%;\n      max-width: 100%;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-ItemContent {\n      align-items: center;\n      cursor: pointer;\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      line-height: 1.25em;\n      overflow: hidden;\n    }\n    .aa-ItemContent:empty {\n      display: none;\n    }\n    .aa-ItemContent mark {\n      background: none;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 700;\n      font-weight: var(--aa-font-weight-bold);\n    }\n    .aa-ItemContent--dual {\n      display: flex;\n      flex-direction: column;\n      justify-content: space-between;\n      text-align: left;\n    }\n    .aa-ItemContent--dual .aa-ItemContentTitle,\n    .aa-ItemContent--dual .aa-ItemContentSubtitle {\n      display: block;\n    }\n    .aa-ItemContent--indented {\n      padding-left: 36px;\n      padding-left: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-ItemContentBody {\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n    }\n    .aa-ItemContentTitle {\n      ", "\n      display: inline-block;\n      margin: 0 0.5em 0 0;\n      max-width: 100%;\n      overflow: hidden;\n      padding: 0;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n    .aa-ItemContentSubtitle {\n      font-size: 0.92em;\n    }\n    .aa-ItemContentSubtitleIcon::before {\n      border-color: rgba(128, 126, 163, 0.64);\n      border-color: rgba(var(--aa-muted-color-rgb), 0.64);\n      border-style: solid;\n      content: '';\n      display: inline-block;\n      left: 1px;\n      position: relative;\n      top: -3px;\n    }\n    .aa-ItemContentSubtitle--inline .aa-ItemContentSubtitleIcon::before {\n      border-width: 0 0 1.5px;\n      margin-left: 8px;\n      margin-left: var(--aa-spacing-half);\n      margin-right: 4px;\n      margin-right: calc(var(--aa-spacing-half) / 2);\n      width: 10px;\n      width: calc(var(--aa-spacing-half) + 2px);\n    }\n    .aa-ItemContentSubtitle--standalone {\n      align-items: center;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      display: grid;\n      grid-gap: 8px;\n      gap: 8px;\n      grid-gap: var(--aa-spacing-half);\n      gap: var(--aa-spacing-half);\n      grid-auto-flow: column;\n      justify-content: start;\n    }\n    .aa-ItemContentSubtitle--standalone .aa-ItemContentSubtitleIcon::before {\n      border-radius: 0 0 0 3px;\n      border-width: 0 0 1.5px 1.5px;\n      height: 8px;\n      height: var(--aa-spacing-half);\n      width: 8px;\n      width: var(--aa-spacing-half);\n    }\n    .aa-ItemContentSubtitleCategory {\n      color: #807ea3;\n      color: rgba(var(--aa-muted-color-rgb), 1);\n      font-weight: 500;\n    }\n    .aa-ItemContentDescription {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-size: 0.85em;\n      max-width: 100%;\n      overflow-x: hidden;\n      text-overflow: ellipsis;\n    }\n    .aa-ItemContentDescription:empty {\n      display: none;\n    }\n    .aa-ItemContentDescription mark {\n      background: rgba(245, 223, 77, 0.5);\n      background: rgba(\n        var(--aa-description-highlight-background-color-rgb),\n        var(--aa-description-highlight-background-color-alpha)\n      );\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      font-style: normal;\n      font-weight: 500;\n      font-weight: var(--aa-font-weight-medium);\n    }\n    .aa-ItemContentDash {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      display: none;\n      opacity: 0.4;\n    }\n    .aa-ItemContentTag {\n      background-color: rgba(62, 52, 211, 0.2);\n      background-color: rgba(\n        var(--aa-primary-color-rgb),\n        var(--aa-primary-color-alpha)\n      );\n      border-radius: 3px;\n      margin: 0 0.4em 0 0;\n      padding: 0.08em 0.3em;\n    }\n    .aa-ItemWrapper,\n    .aa-ItemLink {\n      align-items: center;\n      color: inherit;\n      display: grid;\n      grid-gap: 4px;\n      gap: 4px;\n      grid-gap: calc(var(--aa-spacing-half) / 2);\n      gap: calc(var(--aa-spacing-half) / 2);\n      grid-auto-flow: column;\n      justify-content: space-between;\n      width: 100%;\n    }\n    .aa-ItemLink {\n      color: inherit;\n      text-decoration: none;\n    }\n    .aa-ItemActions {\n      display: grid;\n      grid-auto-flow: column;\n      height: 100%;\n      justify-self: end;\n      margin: 0 -5.3333333333px;\n      margin: 0 calc(var(--aa-spacing) / -3);\n      padding: 0 2px 0 0;\n    }\n    .aa-ItemActionButton {\n      align-items: center;\n      background: none;\n      border: 0;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      flex-shrink: 0;\n      padding: 0;\n    }\n    .aa-ItemActionButton:hover svg,\n    .aa-ItemActionButton:focus svg {\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n    }\n    @media (hover: none) and (pointer: coarse) {\n      .aa-ItemActionButton:hover svg,\n      .aa-ItemActionButton:focus svg {\n        color: inherit;\n      }\n    }\n    .aa-ItemActionButton svg {\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      margin: 0;\n      margin: 5.3333333333px;\n      margin: calc(var(--aa-spacing) / 3);\n      stroke-width: 1.6;\n      stroke-width: var(--aa-icon-stroke-width);\n      width: 20px;\n      width: var(--aa-action-icon-size);\n    }\n    .aa-ActiveOnly {\n      visibility: hidden;\n    }\n    /*---------------- */\n    /* 7. Panel Header */\n    /*---------------- */\n    .aa-PanelHeader {\n      align-items: center;\n      background: #3e34d3;\n      background: rgba(var(--aa-primary-color-rgb), 1);\n      color: #fff;\n      display: grid;\n      height: var(--aa-modal-header-height);\n      margin: 0;\n      padding: 8px 16px;\n      padding: var(--aa-spacing-half) var(--aa-spacing);\n      position: relative;\n    }\n    .aa-PanelHeader::after {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      bottom: -8px;\n      bottom: calc(var(--aa-spacing-half) * -1);\n      content: '';\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    /*---------------- */\n    /* 8. Panel Footer */\n    /*---------------- */\n    .aa-PanelFooter {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      box-shadow: inset 0 1px 0 rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 1px 0\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      justify-content: space-between;\n      margin: 0;\n      padding: 16px;\n      padding: var(--aa-spacing);\n      position: relative;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-PanelFooter::after {\n      background-image: linear-gradient(\n        rgba(255, 255, 255, 0),\n        rgba(128, 126, 163, 0.6)\n      );\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha))\n      );\n      content: '';\n      height: 16px;\n      height: var(--aa-spacing);\n      left: 0;\n      opacity: 0.12;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      top: -16px;\n      top: calc(var(--aa-spacing) * -1);\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 9. Detached Mode */\n    /*---------------- */\n    .aa-DetachedContainer {\n      background: white;\n      background: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      bottom: 0;\n      box-shadow: 0 0 0 1px rgba(35, 38, 59, 0.1),\n        0 6px 16px -4px rgba(35, 38, 59, 0.15);\n      box-shadow: var(--aa-panel-shadow);\n      display: flex;\n      flex-direction: column;\n      left: 0;\n      margin: 0;\n      overflow: hidden;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-DetachedContainer::after {\n      height: 32px;\n    }\n    .aa-DetachedContainer .aa-SourceHeader {\n      margin: 8px 0 8px 2px;\n      margin: var(--aa-spacing-half) 0 var(--aa-spacing-half) 2px;\n    }\n    .aa-DetachedContainer .aa-Panel {\n      background-color: white;\n      background-color: rgba(\n        var(--aa-background-color-rgb),\n        var(--aa-background-color-alpha)\n      );\n      border-radius: 0;\n      box-shadow: none;\n      flex-grow: 1;\n      margin: 0;\n      padding: 0;\n      position: relative;\n    }\n    .aa-DetachedContainer .aa-PanelLayout {\n      bottom: 0;\n      box-shadow: none;\n      left: 0;\n      margin: 0;\n      max-height: none;\n      overflow-y: auto;\n      position: absolute;\n      right: 0;\n      top: 0;\n      width: 100%;\n    }\n    .aa-DetachedFormContainer {\n      border-bottom: solid 1px rgba(128, 126, 163, 0.3);\n      border-bottom: solid 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n      display: flex;\n      flex-direction: row;\n      justify-content: space-between;\n      margin: 0;\n      padding: 8px;\n      padding: var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton {\n      background: none;\n      border: 0;\n      border-radius: 3px;\n      color: inherit;\n      color: #262627;\n      color: rgba(var(--aa-text-color-rgb), var(--aa-text-color-alpha));\n      cursor: pointer;\n      font: inherit;\n      margin: 0 0 0 8px;\n      margin: 0 0 0 var(--aa-spacing-half);\n      padding: 0 8px;\n      padding: 0 var(--aa-spacing-half);\n    }\n    .aa-DetachedCancelButton:hover,\n    .aa-DetachedCancelButton:focus {\n      box-shadow: inset 0 0 0 1px rgba(128, 126, 163, 0.3);\n      box-shadow: inset 0 0 0 1px\n        rgba(\n          var(--aa-panel-border-color-rgb),\n          var(--aa-panel-border-color-alpha)\n        );\n    }\n    .aa-DetachedContainer--modal {\n      border-radius: 6px;\n      bottom: inherit;\n      height: auto;\n      margin: 0 auto;\n      max-width: 680px;\n      max-width: var(--aa-detached-modal-max-width);\n      position: absolute;\n      top: 3%;\n    }\n    .aa-DetachedContainer--modal .aa-PanelLayout {\n      max-height: 500px;\n      max-height: var(--aa-detached-modal-max-height);\n      padding-bottom: 8px;\n      padding-bottom: var(--aa-spacing-half);\n      position: static;\n    }\n    /* Search Button */\n    .aa-DetachedSearchButton {\n      align-items: center;\n      background-color: white;\n      background-color: rgba(\n        var(--aa-input-background-color-rgb),\n        var(--aa-input-background-color-alpha)\n      );\n      border: 1px solid rgba(128, 126, 163, 0.8);\n      border: 1px solid\n        rgba(\n          var(--aa-input-border-color-rgb),\n          var(--aa-input-border-color-alpha)\n        );\n      border-radius: 3px;\n      color: rgba(128, 126, 163, 0.6);\n      color: rgba(var(--aa-muted-color-rgb), var(--aa-muted-color-alpha));\n      cursor: pointer;\n      display: flex;\n      font: inherit;\n      font-family: inherit;\n      font-family: var(--aa-font-family);\n      font-size: 16px;\n      font-size: var(--aa-font-size);\n      height: 44px;\n      height: var(--aa-search-input-height);\n      margin: 0;\n      padding: 0 5.5px;\n      padding: 0 calc(var(--aa-search-input-height) / 8);\n      position: relative;\n      text-align: left;\n      width: 100%;\n    }\n    .aa-DetachedSearchButton:focus {\n      border-color: #3e34d3;\n      border-color: rgba(var(--aa-primary-color-rgb), 1);\n      box-shadow: rgba(62, 52, 211, 0.2) 0 0 0 3px,\n        inset rgba(62, 52, 211, 0.2) 0 0 0 2px;\n      box-shadow: rgba(\n            var(--aa-primary-color-rgb),\n            var(--aa-primary-color-alpha)\n          )\n          0 0 0 3px,\n        inset rgba(var(--aa-primary-color-rgb), var(--aa-primary-color-alpha)) 0\n          0 0 2px;\n      outline: currentColor none medium;\n    }\n    .aa-DetachedSearchButtonIcon {\n      align-items: center;\n      color: #3e34d3;\n      color: rgba(var(--aa-primary-color-rgb), 1);\n      cursor: auto;\n      cursor: initial;\n      display: flex;\n      height: 100%;\n      justify-content: center;\n      width: 36px;\n      width: calc(var(--aa-icon-size) + var(--aa-spacing));\n    }\n    .aa-Detached {\n      height: 100vh;\n      overflow: hidden;\n    }\n    .aa-DetachedOverlay {\n      background-color: rgba(115, 114, 129, 0.4);\n      background-color: rgba(\n        var(--aa-overlay-color-rgb),\n        var(--aa-overlay-color-alpha)\n      );\n      height: 100vh;\n      left: 0;\n      margin: 0;\n      padding: 0;\n      position: fixed;\n      right: 0;\n      top: 0;\n      z-index: 9998;\n      z-index: calc(var(--aa-base-z-index) - 1);\n    }\n    /*---------------- */\n    /* 10. Gradients */\n    /*---------------- */\n    .aa-GradientTop,\n    .aa-GradientBottom {\n      height: 8px;\n      height: var(--aa-spacing-half);\n      left: 0;\n      pointer-events: none;\n      position: absolute;\n      right: 0;\n      z-index: 9999;\n      z-index: var(--aa-base-z-index);\n    }\n    .aa-GradientTop {\n      background-image: linear-gradient(white, rgba(255, 255, 255, 0));\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 1),\n        rgba(var(--aa-background-color-rgb), 0)\n      );\n      top: 0;\n    }\n    .aa-GradientBottom {\n      background-image: linear-gradient(rgba(255, 255, 255, 0), white);\n      background-image: linear-gradient(\n        rgba(var(--aa-background-color-rgb), 0),\n        rgba(var(--aa-background-color-rgb), 1)\n      );\n      border-bottom-left-radius: 4px;\n      border-bottom-left-radius: calc(var(--aa-spacing) / 4);\n      border-bottom-right-radius: 4px;\n      border-bottom-right-radius: calc(var(--aa-spacing) / 4);\n      bottom: 0;\n    }\n    /*---------------- */\n    /* 11. Utilities */\n    /*---------------- */\n    @media (hover: none) and (pointer: coarse) {\n      .aa-DesktopOnly {\n        display: none;\n      }\n    }\n    @media (hover: hover) {\n      .aa-TouchOnly {\n        display: none;\n      }\n    }\n  "])), overrides.border.style, (0, newskit_1.getColorCssFromTheme)('borderColor', overrides.border.color)({ theme: theme }), overrides.icon.position === 'left'
+        ? 'row-reverse'
+        : 'row', (0, newskit_1.getColorCssFromTheme)('borderColor', overrides.border.color)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineStyle', overrides.outline.style)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineWidth', overrides.outline.width)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineColor', overrides.outline.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('borderColor', overrides.border.color)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineStyle', overrides.outline.style)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineWidth', overrides.outline.width)({ theme: theme }), (0, newskit_1.getOutlineCssFromTheme)('outlineColor', overrides.outline.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.icon.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('fill', overrides.icon.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.placeholder.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.placeholder.color)({ theme: theme }), (0, newskit_1.getColorCssFromTheme)('color', overrides.autocomplete.color)({ theme: theme }));
+};
+exports.getAlgoliaStyling = getAlgoliaStyling;
+var templateObject_1;
+//# sourceMappingURL=AlgoliaTheme.js.map

package/dist/cjs/help-hub/components/SearchBar/components/AlgoliaTheme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"AlgoliaTheme.js","sourceRoot":"","sources":["../../../../../../src/help-hub/components/SearchBar/components/AlgoliaTheme.tsx"],"names":[],"mappings":";;;;;;;AAAA,mCAKgB;AAGT,IAAM,iBAAiB,GAAG,UAC/B,SAA6B,EAC7B,KAAY;IAEZ,WAAO,aAAG,mkjCAAA,shLA4JI,EAAsB,WAC9B,EAAsE,4EAGtD,EAET,0IAOP,EAAsE,WACtE,EAGU,WACV,EAGU,WACV,EAGU,+CAGV,EAAsE,WACtE,EAGU,WACV,EAGU,WACV,EAGU,ofAsBV,EAA8D,UAC9D,EAA6D,+rDAiE7D,EAAyD,iWAWzD,EAAqE,yRAYrE,EAAqE,ktWA2YrE,EAAsE,4mbAyd3E,KA3/Ba,SAAS,CAAC,MAAM,CAAC,KAAK,EAC9B,IAAA,8BAAoB,EAAC,aAAa,EAAE,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAGtD,SAAS,CAAC,IAAI,CAAC,QAAQ,KAAK,MAAM;QAClD,CAAC,CAAC,aAAa;QACf,CAAC,CAAC,KAAK,EAOP,IAAA,8BAAoB,EAAC,aAAa,EAAE,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACtE,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACV,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACV,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAGV,IAAA,8BAAoB,EAAC,aAAa,EAAE,SAAS,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACtE,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACV,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EACV,IAAA,gCAAsB,EACtB,cAAc,EACd,SAAS,CAAC,OAAO,CAAC,KAAK,CACxB,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAsBV,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAC9D,IAAA,8BAAoB,EAAC,MAAM,EAAE,SAAS,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAiE7D,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAWzD,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAYrE,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EA2YrE,IAAA,8BAAoB,EAAC,OAAO,EAAE,SAAS,CAAC,YAAY,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,OAAA,EAAE,CAAC,EAyd3E;AACH,CAAC,CAAA;AA5pCY,QAAA,iBAAiB,qBA4pC7B"}

package/dist/cjs/help-hub/components/SearchBar/components/Autocomplete.d.ts

@@ -0,0 +1,6 @@
+import { AutocompleteOptions } from '@algolia/autocomplete-core';
+import { Hit } from 'help-hub/types';
+import React from 'react';
+export declare const Autocomplete: React.FC<Partial<AutocompleteOptions<Hit>> & {
+    baseUrl: string;
+}>;

package/dist/cjs/help-hub/components/SearchBar/components/Autocomplete.js

@@ -0,0 +1,209 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Autocomplete = void 0;
+/* eslint-disable @typescript-eslint/no-unused-vars */
+/* istanbul ignore file */
+var autocomplete_core_1 = require("@algolia/autocomplete-core");
+var autocomplete_preset_algolia_1 = require("@algolia/autocomplete-preset-algolia");
+var lite_1 = __importDefault(require("algoliasearch/lite"));
+var context_1 = require("../../../context");
+var newskit_1 = require("newskit");
+var react_1 = __importStar(require("react"));
+var Highlight_1 = require("./Highlight");
+var shared_components_1 = require("@newskit-render/shared-components");
+var router_1 = require("next/router");
+var Clear_1 = require("@emotion-icons/material/Clear");
+var Search_1 = require("@emotion-icons/material/Search");
+var xss_1 = __importDefault(require("xss"));
+var IconFilledClear = (0, newskit_1.toNewsKitIcon)(Clear_1.Clear);
+var IconFilledSearch = (0, newskit_1.toNewsKitIcon)(Search_1.Search);
+var FadedBlock = (0, newskit_1.styled)(newskit_1.Block)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n  background-color: rgba(0, 0, 0, 0.5);\n  z-index: 1;\n"], ["\n  position: fixed;\n  width: 100%;\n  height: 100%;\n  inset: 0px;\n  background-color: rgba(0, 0, 0, 0.5);\n  z-index: 1;\n"])));
+var Autocomplete = function (props) {
+    var baseUrl = props.baseUrl;
+    var _a = (0, context_1.useCredentialsContext)(), appId = _a.appId, apiKey = _a.apiKey, indexName = _a.indexName;
+    var router = (0, router_1.useRouter)();
+    var searchClient = (0, lite_1.default)(appId, apiKey);
+    var _b = react_1.default.useState({
+        collections: [],
+        completion: null,
+        context: {},
+        isOpen: false,
+        query: '',
+        activeItemId: null,
+        status: 'idle',
+    }), autocompleteState = _b[0], setAutocompleteState = _b[1];
+    var autocomplete = react_1.default.useMemo(function () {
+        return (0, autocomplete_core_1.createAutocomplete)(__assign({ onStateChange: function (_a) {
+                var state = _a.state;
+                setAutocompleteState(state);
+            }, getSources: function () {
+                return [
+                    {
+                        sourceId: '',
+                        getItems: function (_a) {
+                            var query = _a.query;
+                            return (0, autocomplete_preset_algolia_1.getAlgoliaResults)({
+                                searchClient: searchClient,
+                                queries: [
+                                    {
+                                        indexName: indexName,
+                                        query: query,
+                                        params: {
+                                            hitsPerPage: 5,
+                                        },
+                                    },
+                                ],
+                            });
+                        },
+                    },
+                ];
+            } }, props));
+    }, [props]);
+    var inputRef = react_1.default.useRef(null);
+    var formRef = react_1.default.useRef(null);
+    var panelRef = react_1.default.useRef(null);
+    var getEnvironmentProps = autocomplete.getEnvironmentProps;
+    react_1.default.useEffect(function () {
+        if (!formRef.current || !panelRef.current || !inputRef.current) {
+            return undefined;
+        }
+        var _a = getEnvironmentProps({
+            formElement: formRef.current,
+            inputElement: inputRef.current,
+            panelElement: panelRef.current,
+        }), onTouchStart = _a.onTouchStart, onTouchMove = _a.onTouchMove;
+        window.addEventListener('touchstart', onTouchStart);
+        window.addEventListener('touchmove', onTouchMove);
+        return function () {
+            window.removeEventListener('touchstart', onTouchStart);
+            window.removeEventListener('touchmove', onTouchMove);
+        };
+    }, [getEnvironmentProps, formRef, inputRef, panelRef]);
+    var _c = (0, react_1.useState)(false), toggleBackground = _c[0], setToggleBackground = _c[1];
+    var clearFocus = function (options) {
+        var _a, _b;
+        if (options === void 0) { options = { resetSearchTerm: true }; }
+        if (options.resetSearchTerm) {
+            (_a = formRef === null || formRef === void 0 ? void 0 : formRef.current) === null || _a === void 0 ? void 0 : _a.reset();
+        }
+        (_b = inputRef === null || inputRef === void 0 ? void 0 : inputRef.current) === null || _b === void 0 ? void 0 : _b.blur();
+        setAutocompleteState(__assign(__assign({}, autocompleteState), { isOpen: false }));
+        setToggleBackground(!toggleBackground);
+    };
+    var handleInputClick = function () {
+        setToggleBackground(!toggleBackground);
+    };
+    var handleKeyUp = function (e) {
+        if (e.key === 'Escape' || e.key === 'Esc' || e.key === 'Enter') {
+            clearFocus();
+        }
+    };
+    var handleBackgorundClick = function () {
+        clearFocus({ resetSearchTerm: false });
+    };
+    var sanitizedQuery = (0, xss_1.default)(autocompleteState.query);
+    var hasQueryValue = sanitizedQuery.length !== 0;
+    var fireEvent = (0, newskit_1.useInstrumentation)().fireEvent;
+    return (react_1.default.createElement("div", __assign({ className: "aa-Autocomplete" }, autocomplete.getRootProps({})),
+        toggleBackground && react_1.default.createElement(FadedBlock, { onClick: handleBackgorundClick }),
+        react_1.default.createElement("form", __assign({ ref: formRef, className: "aa-Form" }, autocomplete.getFormProps({ inputElement: inputRef.current }), { onSubmit: function (e) {
+                e.preventDefault();
+                router.push("".concat(baseUrl, "/results?q=").concat(sanitizedQuery));
+            } }),
+            react_1.default.createElement("div", { className: "aa-InputWrapperPrefix" },
+                react_1.default.createElement("label", __assign({ className: "aa-Label" }, autocomplete.getLabelProps({})),
+                    react_1.default.createElement("button", { "data-testid": "search-button", className: "aa-SubmitButton", type: "submit", title: "Submit", disabled: !hasQueryValue, onClick: function () {
+                            fireEvent((0, shared_components_1.createClickEvent)('search button', 'search:success'));
+                            clearFocus();
+                        } },
+                        react_1.default.createElement(IconFilledSearch, null)))),
+            react_1.default.createElement("div", { className: "aa-InputWrapper" },
+                react_1.default.createElement("input", __assign({ "data-testid": "autocomplete-input", className: "aa-Input", ref: inputRef }, autocomplete.getInputProps({
+                    inputElement: inputRef.current,
+                }), { onClick: handleInputClick, onKeyUp: handleKeyUp }))),
+            hasQueryValue && (react_1.default.createElement("div", { className: "aa-InputWrapperSuffix" },
+                react_1.default.createElement("button", { "data-testid": "clear-button", className: "aa-ClearButton", title: "Clear", type: "reset" },
+                    react_1.default.createElement(IconFilledClear, null))))),
+        toggleBackground && (react_1.default.createElement("div", __assign({ ref: panelRef, "data-testid": "autocomplete-panel", className: [
+                'aa-Panel',
+                'aa-Panel--desktop',
+                autocompleteState.status === 'stalled' && 'aa-Panel--stalled',
+            ]
+                .filter(Boolean)
+                .join(' ') }, autocomplete.getPanelProps({})),
+            react_1.default.createElement("div", { className: "aa-PanelLayout aa-Panel--scrollable" }, autocompleteState.collections.map(function (collection, index) {
+                var items = collection.items, source = collection.source;
+                return (react_1.default.createElement("section", { key: "source-".concat(index), className: "aa-Source" }, items.length > 0 && (react_1.default.createElement("ul", __assign({ className: "aa-List" }, autocomplete.getListProps(), { "aria-label": "submenu", role: "menu" }), items.map(function (item) {
+                    var _a = autocomplete.getItemProps({
+                        item: item,
+                        source: source,
+                    }), role = _a.role, ariaSelected = _a["aria-selected"], restItemProps = __rest(_a, ["role", 'aria-selected']);
+                    return (react_1.default.createElement("li", __assign({ key: item.objectID, className: "aa-Item" }, restItemProps, { role: "menuitem" }),
+                        react_1.default.createElement(newskit_1.TextBlock, { as: "div", typographyPreset: {
+                                xs: 'utilityBody020',
+                                sm: 'utilityBody030',
+                            } },
+                            react_1.default.createElement(shared_components_1.NextLink, { type: "standalone", href: "".concat(baseUrl, "/article/").concat(item.objectID), onClick: function () { return clearFocus(); } },
+                                react_1.default.createElement("div", { className: "aa-ItemWrapper" },
+                                    react_1.default.createElement("div", { className: "aa-ItemContent" },
+                                        react_1.default.createElement("div", { className: "aa-ItemContentBody" },
+                                            react_1.default.createElement("div", { className: "aa-ItemContentTitle" },
+                                                react_1.default.createElement(Highlight_1.Highlight, { hit: item, attribute: "title" })))))))));
+                })))));
+            }))))));
+};
+exports.Autocomplete = Autocomplete;
+var templateObject_1;
+//# sourceMappingURL=Autocomplete.js.map

package/dist/cjs/help-hub/components/SearchBar/components/Autocomplete.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Autocomplete.js","sourceRoot":"","sources":["../../../../../../src/help-hub/components/SearchBar/components/Autocomplete.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/help-hub/components/SearchBar/components/Highlight.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+type HighlightHitParams<THit> = {
+    /**
+     * The Algolia hit whose attribute to retrieve the highlighted parts from.
+     */
+    hit: THit;
+    /**
+     * The attribute to retrieve the highlighted parts from.
+     *
+     * You can use the array syntax to reference nested attributes.
+     */
+    attribute: keyof THit | string[];
+    /**
+     * The tag name to use for highlighted parts.
+     *
+     * @default "mark"
+     */
+    tagName?: string;
+};
+export declare function Highlight<THit extends {
+    _highlightResult?: {} | undefined;
+}>({ hit, attribute, tagName, }: HighlightHitParams<THit>): JSX.Element;
+export {};

package/dist/cjs/help-hub/components/SearchBar/components/Highlight.js

@@ -0,0 +1,19 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Highlight = void 0;
+/* istanbul ignore file */
+var autocomplete_preset_algolia_1 = require("@algolia/autocomplete-preset-algolia");
+var react_1 = require("react");
+// eslint-disable-next-line @typescript-eslint/ban-types
+function Highlight(_a) {
+    var hit = _a.hit, attribute = _a.attribute, _b = _a.tagName, tagName = _b === void 0 ? 'mark' : _b;
+    return (0, react_1.createElement)(react_1.Fragment, {}, (0, autocomplete_preset_algolia_1.parseAlgoliaHitHighlight)({ hit: hit, attribute: attribute }).map(function (_a, index) {
+        var value = _a.value, isHighlighted = _a.isHighlighted;
+        if (isHighlighted) {
+            return (0, react_1.createElement)(tagName, { key: index }, value);
+        }
+        return value;
+    }));
+}
+exports.Highlight = Highlight;
+//# sourceMappingURL=Highlight.js.map

package/dist/cjs/help-hub/components/SearchBar/components/Highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Highlight.js","sourceRoot":"","sources":["../../../../../../src/help-hub/components/SearchBar/components/Highlight.tsx"],"names":[],"mappings":";;;AAAA,0BAA0B;AAC1B,oFAA+E;AAC/E,+BAA+C;AAqB/C,wDAAwD;AACxD,SAAgB,SAAS,CAAqD,EAInD;QAHzB,GAAG,SAAA,EACH,SAAS,eAAA,EACT,eAAgB,EAAhB,OAAO,mBAAG,MAAM,KAAA;IAEhB,OAAO,IAAA,qBAAa,EAClB,gBAAQ,EACR,EAAE,EACF,IAAA,sDAAwB,EAAO,EAAE,GAAG,KAAA,EAAE,SAAS,WAAA,EAAE,CAAC,CAAC,GAAG,CACpD,UAAC,EAAwB,EAAE,KAAK;YAA7B,KAAK,WAAA,EAAE,aAAa,mBAAA;QACrB,IAAI,aAAa,EAAE;YACjB,OAAO,IAAA,qBAAa,EAAC,OAAO,EAAE,EAAE,GAAG,EAAE,KAAK,EAAE,EAAE,KAAK,CAAC,CAAA;SACrD;QAED,OAAO,KAAK,CAAA;IACd,CAAC,CACF,CACF,CAAA;AACH,CAAC;AAlBD,8BAkBC"}

package/dist/cjs/help-hub/components/SearchBar/defaults.d.ts

@@ -0,0 +1,17 @@
+export declare const searchBarDefaults: {
+    color: string;
+    placeholder: {
+        color: string;
+        typographyPreset: string;
+    };
+    icon: {
+        color: string;
+        position: "right";
+    };
+    autocomplete: {
+        color: string;
+    };
+    border: {
+        color: string;
+    };
+};