@coras-io/embed 0.1.0

package/dist/containers/navbar/navbar.component.js

@@ -0,0 +1,727 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { html, LitElement, nothing } from "lit";
+import { property, state } from "lit/decorators.js";
+import { when } from "lit/directives/when.js";
+import { localized, msg } from "@lit/localize";
+import { consume, ContextConsumer } from "@lit/context";
+import "../../components/button/button.js";
+import "../../components/icon/icon.js";
+import "../../components/input-field/input-field.js";
+import "../../components/flag-icon/flag-icon.js";
+import "../../components/drawer/drawer.js";
+import "../../components/dropdown/dropdown.js";
+import "../../components/basket-mobile/basket-mobile.js";
+import "../../components/currencies-list/currencies-list.js";
+import "../../components/locales-list/locales-list.js";
+import "../../components/select-list/select-list.js";
+import "../../components/select-list/select-option/select-option.js";
+import "../../components/mobile-menu-item/mobile-menu-item.js";
+import "../../components/search-button/search-button.js";
+import "../../containers/basket/basket.js";
+import { currencySymbol } from "../../core/currency/constants.js";
+import { renderCurrenciesOption } from "../../components/currencies-list/currencies-list.js";
+import { renderLocalesOption } from "../../components/locales-list/locales-list.js";
+import { renderSearchResultsOption } from "../../components/search-results-item/search-results-item.js";
+import { SearchMixin } from "../../mixins/search-mixin/search-mixin.js";
+import { addRecentlySelectedSearches, DrawerSubmenu, getLocaleLabel, getRecentlySelectedSearches, searchResultTypeToLocationPageMap, } from "./navbar.utils.js";
+import styles from "./navbar.styles.js";
+import { pageDispatchContext, } from "../../contexts/events.context.js";
+import { assetsURLContext, currenciesContext, currencyContext, distributorIdContext, localeContext, localesContext, } from "../../contexts/properties.context.js";
+import { SignalWatcher } from "@lit-labs/signals";
+import { isBasketDropdownOpen, isBasketMobileOpen, } from "../../core/signals.js";
+import { currentPageContext } from "../../contexts/current-page.context.js";
+import { clientContext } from "../../contexts/client.context.js";
+import { basketContext } from "../../contexts/basket/basket.context.js";
+let CorasNavBar = class CorasNavBar extends SearchMixin(SignalWatcher(LitElement)) {
+    constructor() {
+        super(...arguments);
+        this.searchOnly = false;
+        this.showLanguageSelector = true;
+        this.showCurrencySelector = true;
+        this.showBasket = true;
+        this.showSearch = true;
+        this.searchValue = "";
+        this.isCurrenciesDropdownOpen = false;
+        this.isLocalesDropdownOpen = false;
+        this.isSearchDropdownOpen = false;
+        this.currentMobileSubmenu = null;
+        this.isMobileDrawerOpen = false;
+        this._wasMobile = undefined;
+        this.handleResize = () => {
+            const mobile = this.isMobile();
+            if (!mobile && isBasketMobileOpen.get()) {
+                isBasketMobileOpen.set(false);
+            }
+            if (this._wasMobile !== undefined && this._wasMobile !== mobile) {
+                this.requestUpdate();
+            }
+            this._wasMobile = mobile;
+        };
+        this.handleCurrenciesOptionClicked = (selectedCurrency) => {
+            this.dispatchPageUpdate({
+                currency: selectedCurrency,
+            });
+            if (this.isMobileDrawerOpen) {
+                this.setCurrentMobileSubmenu(null);
+            }
+            else {
+                this.isCurrenciesDropdownOpen = false;
+            }
+        };
+        this.handleLocalesOptionClicked = (selectedLocale) => {
+            this.dispatchPageUpdate({
+                locale: selectedLocale,
+            });
+            if (this.isMobileDrawerOpen) {
+                this.setCurrentMobileSubmenu(null);
+            }
+            else {
+                this.isLocalesDropdownOpen = false;
+            }
+        };
+        this.handleSearchInputChange = (event) => {
+            event.stopPropagation();
+            this.searchValue = event.detail.value;
+            this.throttledSearch(event);
+        };
+    }
+    static { this.styles = styles; }
+    get shouldRenderMobileMenu() {
+        return (this.showLanguageSelector || this.showCurrencySelector || this.showSearch);
+    }
+    async connectedCallback() {
+        super.connectedCallback?.();
+        await this.updateComplete;
+        this.basket = new ContextConsumer(this, {
+            context: basketContext,
+            subscribe: true,
+        });
+        window.addEventListener("resize", this.handleResize);
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        isBasketDropdownOpen.set(false);
+        window.removeEventListener("resize", this.handleResize);
+    }
+    toggleCurrenciesDropdown(event) {
+        event.stopPropagation();
+        this.isCurrenciesDropdownOpen = !this.isCurrenciesDropdownOpen;
+    }
+    handleCurrenciesDropdownClose(event) {
+        event.stopPropagation();
+        this.isCurrenciesDropdownOpen = false;
+    }
+    toggleLocalesDropdown(event) {
+        event.stopPropagation();
+        this.isLocalesDropdownOpen = !this.isLocalesDropdownOpen;
+    }
+    handleLocalesDropdownClose(event) {
+        event.stopPropagation();
+        this.isLocalesDropdownOpen = false;
+    }
+    handleCheckout(event) {
+        event.stopPropagation();
+        this.dispatchPageUpdate({
+            locale: this.locale,
+            currency: this.currency,
+            page: "payment",
+        });
+        isBasketDropdownOpen.set(false);
+        isBasketMobileOpen.set(false);
+    }
+    isMobile() {
+        return window.innerWidth <= 530;
+    }
+    toggleBasketDropdown(event) {
+        event.stopPropagation();
+        if (this.isMobile()) {
+            isBasketMobileOpen.set(!isBasketMobileOpen.get());
+        }
+        else {
+            isBasketDropdownOpen.set(!isBasketDropdownOpen.get());
+        }
+    }
+    handleBasketDropdownClose(event) {
+        event.stopPropagation();
+        isBasketDropdownOpen.set(false);
+    }
+    toggleSearchDropdown(event) {
+        event.stopPropagation();
+        if (!this.isSearchDropdownOpen) {
+            this.isSearchDropdownOpen = true;
+            const recentlySelectedSearches = getRecentlySelectedSearches();
+            if (recentlySelectedSearches.length === 0) {
+                if ((this.searchValue && this.searchValue.length >= 3) ||
+                    !this.searchTask.value) {
+                    this.searchTask.run();
+                }
+            }
+        }
+    }
+    handleSearchDropdownClose(event) {
+        event.stopPropagation();
+        this.isSearchDropdownOpen = false;
+    }
+    handleSearchOptionClicked(item) {
+        addRecentlySelectedSearches(item);
+        this.dispatchPageUpdate({
+            locale: this.locale,
+            currency: this.currency,
+            page: searchResultTypeToLocationPageMap[item.type],
+            date: "",
+            ...(item.type === "city" ? { country: "", city: item.value } : {}),
+            ...(item.type === "country" ? { country: item.value, city: "" } : {}),
+            ...(item.type === "attraction" ? { id: item.value } : {}),
+        });
+        if (this.isMobileDrawerOpen) {
+            this.isMobileDrawerOpen = false;
+        }
+        else {
+            this.isSearchDropdownOpen = false;
+        }
+    }
+    handleSearchMoreOptionClicked(search) {
+        this.dispatchPageUpdate({
+            locale: this.locale,
+            currency: this.currency,
+            page: "search",
+            ...{ search: search },
+        });
+        if (this.isMobileDrawerOpen) {
+            this.isMobileDrawerOpen = false;
+        }
+        else {
+            this.isSearchDropdownOpen = false;
+        }
+    }
+    setCurrentMobileSubmenu(selectedSubmenu) {
+        this.currentMobileSubmenu = selectedSubmenu;
+        if (selectedSubmenu === DrawerSubmenu.SEARCH) {
+            this.isSearchDropdownOpen = true;
+            const recentlySelectedSearches = getRecentlySelectedSearches();
+            if (recentlySelectedSearches.length === 0) {
+                if ((this.searchValue && this.searchValue.length >= 3) ||
+                    !this.searchTask.value) {
+                    this.searchTask.run();
+                }
+            }
+        }
+        else {
+            this.isSearchDropdownOpen = false;
+        }
+    }
+    handleSubmenuClose(event) {
+        event.stopPropagation();
+        this.setCurrentMobileSubmenu(null);
+    }
+    handleMobileDrawerClosed() {
+        this.isMobileDrawerOpen = false;
+        this.currentMobileSubmenu = null;
+        this.isSearchDropdownOpen = false;
+    }
+    toggleMobileDrawer() {
+        if (isBasketMobileOpen.get()) {
+            isBasketMobileOpen.set(false);
+            this.isMobileDrawerOpen = true;
+            return;
+        }
+        this.isMobileDrawerOpen = !this.isMobileDrawerOpen;
+    }
+    getSearchTerm() {
+        return this.searchValue;
+    }
+    renderCurrenciesOptions() {
+        return html `${this.currencies?.map((currency) => renderCurrenciesOption({
+            currency: currency,
+            selected: this.currency === currency,
+            onSelect: this.handleCurrenciesOptionClicked,
+        }))}`;
+    }
+    renderCurrenciesDropdown() {
+        return html `<coras-dropdown
+      class="currencies"
+      ?open=${this.isCurrenciesDropdownOpen}
+      ?arrow=${true}
+      @dropdown-close-request=${this.handleCurrenciesDropdownClose}
+    >
+      <div
+        slot="trigger"
+        data-testid="currencies-trigger"
+        @click=${this.toggleCurrenciesDropdown}
+      >
+        <span>
+          <span class="currency-symbol">${currencySymbol[this.currency]}</span>
+          <span class="currency-name">${this.currency}</span>
+        </span>
+      </div>
+      <coras-currencies-list>
+        ${this.renderCurrenciesOptions()}
+      </coras-currencies-list>
+    </coras-dropdown>`;
+    }
+    renderLocalesOptions() {
+        return html `${this.locales.map((locale) => renderLocalesOption({
+            iconBaseURL: this.assetsURL,
+            locale: locale,
+            selected: this.locale === locale,
+            onSelect: this.handleLocalesOptionClicked,
+        }))}`;
+    }
+    renderLocalesDropdown() {
+        return html `
+      <coras-dropdown
+        class="locales"
+        ?open=${this.isLocalesDropdownOpen}
+        ?arrow=${true}
+        @dropdown-close-request=${this.handleLocalesDropdownClose}
+      >
+        <div
+          slot="trigger"
+          data-testid="locales-trigger"
+          @click=${this.toggleLocalesDropdown}
+        >
+          <coras-flag-icon
+            icon-base-url="${this.assetsURL}/flags"
+            icon="${this.locale}"
+            label="${this.locale}"
+          ></coras-flag-icon>
+          <span class="locale">${getLocaleLabel(this.locale)}</span>
+        </div>
+        <coras-locales-list>${this.renderLocalesOptions()}</coras-locales-list>
+      </coras-dropdown>
+    `;
+    }
+    renderBasketTrigger() {
+        return html `
+      <div data-testid="basket-trigger" @click=${this.toggleBasketDropdown}>
+        <coras-icon
+          icon="shopping-basket"
+          assets-url="${this.assetsURL}"
+        ></coras-icon>
+        <span class="basket-items-quantity"
+          >(${this.basket?.value?.quantity || 0})</span
+        >
+      </div>
+    `;
+    }
+    renderBasketDropdown() {
+        return html `
+      <coras-dropdown
+        class="basket"
+        ?open=${isBasketDropdownOpen.get()}
+        ?arrow=${true}
+        @dropdown-close-request=${this.handleBasketDropdownClose}
+        unstyled-content
+      >
+        <div slot="trigger">${this.renderBasketTrigger()}</div>
+        <coras-basket
+          ?checkout=${true}
+          @checkout-requested="${this.handleCheckout}"
+        ></coras-basket>
+      </coras-dropdown>
+    `;
+    }
+    renderBasket() {
+        if (this.isMobile()) {
+            return this.renderBasketTrigger();
+        }
+        else {
+            return this.renderBasketDropdown();
+        }
+    }
+    renderBasketModal() {
+        return html `
+      <coras-basket-mobile
+        ?open=${isBasketMobileOpen.get()}
+        title=${msg("Your basket")}
+      >
+        <coras-basket
+          ?checkout=${true}
+          @checkout-requested="${this.handleCheckout}"
+          expanded
+        ></coras-basket>
+      </coras-basket-mobile>
+    `;
+    }
+    renderSearchInput() {
+        return html `
+      <coras-field
+        data-testid="search-input"
+        assets-url="${this.assetsURL}"
+        slot="trigger"
+        type="search"
+        placeholder=${msg("Search events")}
+        value=${this.searchValue}
+        ?rounded=${true}
+        ?compact=${true}
+        @click=${this.toggleSearchDropdown}
+        @value-changed=${this.handleSearchInputChange}
+      >
+        <coras-icon
+          slot="prefix"
+          icon="search"
+          assets-url="${this.assetsURL}"
+        ></coras-icon>
+      </coras-field>
+    `;
+    }
+    renderRecentlySearchedItems() {
+        const recentlySelectedSearches = getRecentlySelectedSearches();
+        if (recentlySelectedSearches.length === 0) {
+            return this.searchTask.render({
+                complete: (response) => {
+                    if (response?.popular && response.popular.length > 0) {
+                        return html `
+              <div class="popular">${msg("Popular")}</div>
+              ${response.popular.map((item) => renderSearchResultsOption({
+                            item,
+                            onSelect: () => this.handleSearchOptionClicked(item),
+                            assetsURL: this.assetsURL,
+                        }))}
+            `;
+                    }
+                    if (response?.results && response.results.length > 0) {
+                        return html `
+              ${response.results.map((item) => renderSearchResultsOption({
+                            item,
+                            onSelect: () => this.handleSearchOptionClicked(item),
+                            assetsURL: this.assetsURL,
+                        }))}
+            `;
+                    }
+                    return html `<div class="no-results">${msg("No results.")}</div>`;
+                },
+            });
+        }
+        return html `
+      <div class="recently-viewed">${msg("Recently viewed")}</div>
+      ${recentlySelectedSearches.map((item) => renderSearchResultsOption({
+            item,
+            onSelect: () => this.handleSearchOptionClicked(item),
+            assetsURL: this.assetsURL,
+        }))}
+    `;
+    }
+    renderSearchItems() {
+        if (!this.searchValue || this.searchValue.length < 3) {
+            return this.renderRecentlySearchedItems();
+        }
+        return this.searchTask.render({
+            complete: (response) => {
+                if (!response?.results || response?.results.length < 1) {
+                    return html `<div class="no-results">${msg("No results.")}</div>`;
+                }
+                const searchResults = [...response.results];
+                return html `
+          ${searchResults.map((item) => renderSearchResultsOption({
+                    item,
+                    onSelect: () => this.handleSearchOptionClicked(item),
+                    assetsURL: this.assetsURL,
+                }))}
+          ${response.has_more
+                    ? html `
+                <coras-select-option
+                  key=${this.searchValue}
+                  @click=${() => this.handleSearchMoreOptionClicked(this.searchValue)}
+                >
+                  <coras-icon
+                    assets-url="${this.assetsURL}"
+                    icon="search"
+                    size="base"
+                  ></coras-icon>
+                  <span>
+                    ${msg("Show all results for")}
+                    <strong>'${this.searchValue}'</strong>
+                  </span>
+                </coras-select-option>
+              `
+                    : ""}
+        `;
+            },
+        });
+    }
+    renderSearchResults() {
+        return html `
+      <coras-select-list ?spacious=${true}>
+        ${this.renderSearchItems()}
+      </coras-select-list>
+    `;
+    }
+    renderSearch() {
+        return html `
+      <coras-dropdown
+        class="search"
+        ?open=${this.isSearchDropdownOpen}
+        @dropdown-close-request=${this.handleSearchDropdownClose}
+      >
+        ${this.renderSearchInput()} ${this.renderSearchResults()}
+      </coras-dropdown>
+    `;
+    }
+    renderLocalesList() {
+        return html `
+      <coras-locales-list spacious>
+        ${this.renderLocalesOptions()}
+      </coras-locales-list>
+    `;
+    }
+    renderCurrencyList() {
+        return html `
+      <coras-currencies-list spacious>
+        ${this.renderCurrenciesOptions()}
+      </coras-currencies-list>
+    `;
+    }
+    renderMobileSearchInput() {
+        return html `
+      <div class="input-wrapper-mobile">${this.renderSearchInput()}</div>
+    `;
+    }
+    renderMobileSearchResults() {
+        return html `
+      <coras-select-list data-testid="mobile-search-list" ?spacious=${true}>
+        ${this.renderSearchItems()}
+      </coras-select-list>
+    `;
+    }
+    renderMobileSearch() {
+        return html `
+      ${this.renderMobileSearchInput()} ${this.renderMobileSearchResults()}
+    `;
+    }
+    get hasBasketItems() {
+        return (this.basket?.value?.quantity ?? 0) > 0;
+    }
+    renderMenu() {
+        return html `
+      <div class="mobile-menu">
+        ${when(this.showLanguageSelector, () => html `
+            <coras-mobile-menu-item
+              data-testid="language-submenu"
+              label="${getLocaleLabel(this.locale)} ${msg("Language")}"
+              @click=${() => this.setCurrentMobileSubmenu(DrawerSubmenu.LANGUAGE)}
+            >
+              <coras-flag-icon
+                slot="icon"
+                icon-base-url="${this.assetsURL}/flags"
+                icon=${this.locale}
+                label=${this.locale}
+              ></coras-flag-icon>
+            </coras-mobile-menu-item>
+          `)}
+        ${when(this.showCurrencySelector && !this.hasBasketItems, () => html `
+            <coras-mobile-menu-item
+              data-testid="currency-submenu"
+              label="${this.currency} ${msg("Currency")}"
+              @click=${() => this.setCurrentMobileSubmenu(DrawerSubmenu.CURRENCY)}
+            >
+              <div slot="icon">${currencySymbol[this.currency]}</div>
+            </coras-mobile-menu-item>
+          `)}
+        ${when(this.showSearch, () => html `
+            <coras-mobile-menu-item
+              data-testid="search-submenu"
+              label=${msg("Search event")}
+              @click=${() => this.setCurrentMobileSubmenu(DrawerSubmenu.SEARCH)}
+            >
+              <coras-icon
+                slot="icon"
+                label="Search icon"
+                icon="search"
+                assets-url="${this.assetsURL}"
+              ></coras-icon>
+            </coras-mobile-menu-item>
+          `)}
+      </div>
+    `;
+    }
+    renderMobileMenu() {
+        if (this.currentMobileSubmenu === DrawerSubmenu.LANGUAGE) {
+            return this.renderLocalesList();
+        }
+        else if (this.currentMobileSubmenu === DrawerSubmenu.CURRENCY &&
+            !this.hasBasketItems) {
+            return this.renderCurrencyList();
+        }
+        else if (this.currentMobileSubmenu === DrawerSubmenu.SEARCH) {
+            return this.renderMobileSearch();
+        }
+        return this.renderMenu();
+    }
+    renderMobileMenuIcon() {
+        return html `
+      <coras-icon
+        data-testid="mobile-menu-trigger"
+        icon="menu"
+        assets-url="${this.assetsURL}"
+        @click=${this.toggleMobileDrawer}
+      ></coras-icon>
+    `;
+    }
+    renderReturnButton() {
+        return html `
+      <coras-button
+        data-testid="drawer-return-button"
+        variant="text"
+        circle
+        @click=${this.handleSubmenuClose}
+      >
+        <coras-icon
+          assets-url="${this.assetsURL}"
+          icon="chevron-left"
+        ></coras-icon>
+      </coras-button>
+    `;
+    }
+    renderMobileMenuDrawer() {
+        if (!this.shouldRenderMobileMenu) {
+            return null;
+        }
+        return html `
+      <coras-drawer
+        label="Menu"
+        ?open=${this.isMobileDrawerOpen}
+        assets-url="${this.assetsURL}"
+        @modal-closed=${this.handleMobileDrawerClosed}
+      >
+        <span slot="header">
+          ${when(this.currentMobileSubmenu, () => this.renderReturnButton())}
+        </span>
+        ${when(this.searchOnly, () => this.renderMobileSearch(), () => this.renderMobileMenu())}
+      </coras-drawer>
+    `;
+    }
+    // The host's `brand` slot wins; the default logo is slot fallback content
+    // shown only when nothing is slotted and `config.theme.logo` is set.
+    renderBrand() {
+        return html `
+      <slot name="brand">
+        ${this.logo
+            ? html `<img
+              class="brand-logo"
+              part="brand-logo"
+              src=${this.logo}
+              alt=""
+            />`
+            : nothing}
+      </slot>
+    `;
+    }
+    renderSearchOnlyHeader() {
+        return html `
+      <header class="search-only">
+        <div class="container">
+          <div class="logo-container">${this.renderBrand()}</div>
+          <div class="search-only-controls">
+            <div>${this.renderSearch()}</div>
+            <coras-search-button
+              @click=${this.toggleMobileDrawer}
+            ></coras-search-button>
+          </div>
+        </div>
+      </header>
+    `;
+    }
+    renderFullHeader() {
+        return html `
+      <header>
+        <div class="container">
+          <div class="logo-container">${this.renderBrand()}</div>
+          <nav class="navigation-container">
+            <slot name="nav"></slot>
+            ${when(this.showLanguageSelector, () => this.renderLocalesDropdown())}
+            ${when(this.showCurrencySelector && !this.hasBasketItems, () => this.renderCurrenciesDropdown())}
+            <slot name="actions-start"></slot>
+            ${when(this.showBasket && this.currentPage !== "payment", () => this.renderBasket())}
+            <slot name="actions-end"></slot>
+            ${this.showSearch
+            ? this.renderSearch()
+            : html `<slot name="search"></slot>`}
+            ${when(this.shouldRenderMobileMenu, () => this.renderMobileMenuIcon())}
+          </nav>
+        </div>
+      </header>
+    `;
+    }
+    render() {
+        return html `
+      ${this.searchOnly
+            ? this.renderSearchOnlyHeader()
+            : this.renderFullHeader()}
+      ${when(this.shouldRenderMobileMenu, () => this.renderMobileMenuDrawer())}
+      ${this.renderBasketModal()}
+    `;
+    }
+};
+__decorate([
+    consume({ context: assetsURLContext, subscribe: true })
+], CorasNavBar.prototype, "assetsURL", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "search-only" })
+], CorasNavBar.prototype, "searchOnly", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "show-language-selector" })
+], CorasNavBar.prototype, "showLanguageSelector", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "show-currency-selector" })
+], CorasNavBar.prototype, "showCurrencySelector", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "show-basket" })
+], CorasNavBar.prototype, "showBasket", void 0);
+__decorate([
+    property({ type: Boolean, attribute: "show-search" })
+], CorasNavBar.prototype, "showSearch", void 0);
+__decorate([
+    property({ type: String })
+], CorasNavBar.prototype, "logo", void 0);
+__decorate([
+    consume({ context: localeContext, subscribe: true })
+], CorasNavBar.prototype, "locale", void 0);
+__decorate([
+    consume({ context: localesContext, subscribe: true })
+], CorasNavBar.prototype, "locales", void 0);
+__decorate([
+    consume({ context: currencyContext, subscribe: true })
+], CorasNavBar.prototype, "currency", void 0);
+__decorate([
+    consume({ context: currenciesContext, subscribe: true })
+], CorasNavBar.prototype, "currencies", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "searchValue", void 0);
+__decorate([
+    consume({ context: distributorIdContext, subscribe: true })
+], CorasNavBar.prototype, "distributorID", void 0);
+__decorate([
+    consume({ context: clientContext, subscribe: true })
+], CorasNavBar.prototype, "client", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "isCurrenciesDropdownOpen", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "isLocalesDropdownOpen", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "isSearchDropdownOpen", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "currentMobileSubmenu", void 0);
+__decorate([
+    state()
+], CorasNavBar.prototype, "isMobileDrawerOpen", void 0);
+__decorate([
+    consume({ context: currentPageContext })
+], CorasNavBar.prototype, "currentPage", void 0);
+__decorate([
+    consume({ context: pageDispatchContext })
+], CorasNavBar.prototype, "dispatchPageUpdate", void 0);
+CorasNavBar = __decorate([
+    localized()
+], CorasNavBar);
+export { CorasNavBar };