@internetarchive/ia-topnav 1.3.9 → 1.3.10-webdev-7394.1

package/dist/src/media-subnav.js

@@ -0,0 +1,126 @@
+var MediaSubnav_1;
+import { __decorate } from "tslib";
+import { html } from 'lit';
+import { ifDefined } from 'lit/directives/if-defined.js';
+import TrackedElement from './tracked-element';
+import './wayback-slider';
+import './more-slider';
+import mediaSubnavCSS from './styles/media-subnav';
+import toSentenceCase from './lib/toSentenceCase';
+import formatUrl from './lib/formatUrl';
+import { customElement, property } from 'lit/decorators.js';
+import { defaultTopNavConfig } from './data/menus';
+let MediaSubnav = MediaSubnav_1 = class MediaSubnav extends TrackedElement {
+    constructor() {
+        super(...arguments);
+        this.baseHost = '';
+        this.config = defaultTopNavConfig;
+        this.menu = '';
+        this.menuItems = MediaSubnav_1.defaultLinks;
+        this.links = MediaSubnav_1.defaultLinks;
+    }
+    static get styles() {
+        return mediaSubnavCSS;
+    }
+    shouldUpdate() {
+        if (this.menuItems) {
+            this.links = this.menuItems;
+        }
+        return true;
+    }
+    static get defaultLinks() {
+        return {
+            heading: '',
+            iconLinks: [],
+            featuredLinks: [],
+            links: [],
+            mobileAppsLinks: [],
+            browserExtensionsLinks: [],
+            archiveItLinks: [],
+        };
+    }
+    analyticsEvent(title) {
+        var _a;
+        return `${(_a = this.config) === null || _a === void 0 ? void 0 : _a.eventCategory}|${toSentenceCase(title)}${toSentenceCase(this.menu)}`;
+    }
+    get iconLinks() {
+        return this.links.iconLinks.map((link) => html `
+        <a
+          .href="${formatUrl(link.url, this.baseHost)}"
+          @click=${this.trackClick}
+          data-event-click-tracking="${this.analyticsEvent(link.title)}"
+          ><img src="${ifDefined(link.icon)}" loading="lazy" />${link.title}</a
+        >
+      `);
+    }
+    renderLinks(links) {
+        return links.map((link) => html `
+        <li>
+          <a
+            .href="${formatUrl(link.url, this.baseHost)}"
+            @click=${this.trackClick}
+            data-event-click-tracking="${this.analyticsEvent(link.title)}"
+            >${link.title}</a
+          >
+        </li>
+      `);
+    }
+    render() {
+        if (!this.menu) {
+            return html ``;
+        }
+        if (this.menuItems) {
+            this.links = this.menuItems;
+        }
+        if (this.menu === 'web') {
+            return html ` <wayback-slider
+        .baseHost=${this.baseHost}
+        .config=${this.config}
+        .archiveItLinks=${this.menuItems.archiveItLinks}
+        .browserExtensionsLinks=${this.menuItems.browserExtensionsLinks}
+        .mobileAppsLinks=${this.menuItems.mobileAppsLinks}
+      ></wayback-slider>`;
+        }
+        // if (this.menu === 'more') {
+        //   return html` <more-slider
+        //     .baseHost=${this.baseHost}
+        //     .config=${this.config}
+        //     .menuItems=${this.menuItems}
+        //   >
+        //   </more-slider>`;
+        // }
+        return html `
+      <h3>${this.links.heading}</h3>
+      <div class="icon-links">${this.iconLinks}</div>
+      <div class="links featured">
+        <h4>Featured</h4>
+        <ul>
+          ${this.renderLinks(this.links.featuredLinks)}
+        </ul>
+      </div>
+      <div class="links top">
+        <h4>Top</h4>
+        <ul>
+          ${this.renderLinks(this.links.links)}
+        </ul>
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: String })
+], MediaSubnav.prototype, "baseHost", void 0);
+__decorate([
+    property({ type: Object })
+], MediaSubnav.prototype, "config", void 0);
+__decorate([
+    property({ type: String })
+], MediaSubnav.prototype, "menu", void 0);
+__decorate([
+    property({ type: Object })
+], MediaSubnav.prototype, "menuItems", void 0);
+MediaSubnav = MediaSubnav_1 = __decorate([
+    customElement('media-subnav')
+], MediaSubnav);
+export { MediaSubnav };
+//# sourceMappingURL=media-subnav.js.map

package/dist/src/media-subnav.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"media-subnav.js","sourceRoot":"","sources":["../../src/media-subnav.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport TrackedElement from './tracked-element';\nimport './wayback-slider';\nimport './more-slider';\nimport mediaSubnavCSS from './styles/media-subnav';\nimport toSentenceCase from './lib/toSentenceCase';\nimport formatUrl from './lib/formatUrl';\nimport { customElement, property } from 'lit/decorators.js';\nimport { IATopNavConfig, IATopNavLink, IATopNavMediaMenu } from './models';\nimport { defaultTopNavConfig } from './data/menus';\n\n@customElement('media-subnav')\nexport class MediaSubnav extends TrackedElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: String }) menu:\n    | ''\n    | 'web'\n    | 'more'\n    | 'audio'\n    | 'images'\n    | 'software'\n    | 'texts'\n    | 'video' = '';\n  @property({ type: Object }) menuItems: IATopNavMediaMenu =\n    MediaSubnav.defaultLinks;\n\n  private links: IATopNavMediaMenu = MediaSubnav.defaultLinks;\n\n  static get styles() {\n    return mediaSubnavCSS;\n  }\n\n  shouldUpdate() {\n    if (this.menuItems) {\n      this.links = this.menuItems;\n    }\n    return true;\n  }\n\n  static get defaultLinks(): IATopNavMediaMenu {\n    return {\n      heading: '',\n      iconLinks: [],\n      featuredLinks: [],\n      links: [],\n      mobileAppsLinks: [],\n      browserExtensionsLinks: [],\n      archiveItLinks: [],\n    };\n  }\n\n  analyticsEvent(title: string) {\n    return `${this.config?.eventCategory}|${toSentenceCase(title)}${toSentenceCase(this.menu)}`;\n  }\n\n  get iconLinks() {\n    return this.links.iconLinks.map(\n      (link) => html`\n        <a\n          .href=\"${formatUrl(link.url, this.baseHost)}\"\n          @click=${this.trackClick}\n          data-event-click-tracking=\"${this.analyticsEvent(link.title)}\"\n          ><img src=\"${ifDefined(link.icon)}\" loading=\"lazy\" />${link.title}</a\n        >\n      `,\n    );\n  }\n\n  renderLinks(links: IATopNavLink[]) {\n    return links.map(\n      (link) => html`\n        <li>\n          <a\n            .href=\"${formatUrl(link.url, this.baseHost)}\"\n            @click=${this.trackClick}\n            data-event-click-tracking=\"${this.analyticsEvent(link.title)}\"\n            >${link.title}</a\n          >\n        </li>\n      `,\n    );\n  }\n\n  render() {\n    if (!this.menu) {\n      return html``;\n    }\n\n    if (this.menuItems) {\n      this.links = this.menuItems;\n    }\n\n    if (this.menu === 'web') {\n      return html` <wayback-slider\n        .baseHost=${this.baseHost}\n        .config=${this.config}\n        .archiveItLinks=${this.menuItems.archiveItLinks}\n        .browserExtensionsLinks=${this.menuItems.browserExtensionsLinks}\n        .mobileAppsLinks=${this.menuItems.mobileAppsLinks}\n      ></wayback-slider>`;\n    }\n\n    // if (this.menu === 'more') {\n    //   return html` <more-slider\n    //     .baseHost=${this.baseHost}\n    //     .config=${this.config}\n    //     .menuItems=${this.menuItems}\n    //   >\n    //   </more-slider>`;\n    // }\n\n    return html`\n      <h3>${this.links.heading}</h3>\n      <div class=\"icon-links\">${this.iconLinks}</div>\n      <div class=\"links featured\">\n        <h4>Featured</h4>\n        <ul>\n          ${this.renderLinks(this.links.featuredLinks)}\n        </ul>\n      </div>\n      <div class=\"links top\">\n        <h4>Top</h4>\n        <ul>\n          ${this.renderLinks(this.links.links)}\n        </ul>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/models.d.ts

@@ -0,0 +1,51 @@
+export interface IATopNavConfig {
+    /**
+     * Google Analytics event category
+     */
+    eventCategory?: string;
+    /**
+     * Copy to display for number of pages archived at the top of the Wayback search form
+     *
+     * ie. "425 billion"
+     */
+    waybackPagesArchived?: string;
+    /**
+     * Array of strings representing the values of options that should be hidden from search options
+     */
+    hiddenSearchOptions?: string[];
+    /**
+     * Map from dropdown item ids to any callout text that should be applied beside them
+     */
+    callouts?: Record<string, string>;
+}
+export interface IATopNavLink {
+    title: string;
+    url?: string;
+    class?: string;
+    icon?: string;
+    analyticsEvent?: string;
+    external?: boolean;
+}
+export interface IATopNavMediaMenu {
+    heading: string;
+    iconLinks: IATopNavLink[];
+    featuredLinks: IATopNavLink[];
+    links: IATopNavLink[];
+    mobileAppsLinks: IATopNavLink[];
+    browserExtensionsLinks: IATopNavLink[];
+    archiveItLinks: IATopNavLink[];
+}
+export interface IATopNavMenuConfig {
+    audio: IATopNavMediaMenu;
+    images: IATopNavMediaMenu;
+    more: IATopNavLink[];
+    signedOut: IATopNavLink[];
+    software: IATopNavMediaMenu;
+    texts: IATopNavMediaMenu;
+    user: IATopNavLink[];
+    userAdmin: IATopNavLink[];
+    userAdminFlags: IATopNavLink[];
+    video: IATopNavMediaMenu;
+    web: IATopNavMediaMenu;
+}
+export type IATopNavSecondIdentitySlotMode = 'allow' | '';

package/dist/src/models.js

@@ -0,0 +1,25 @@
+export {};
+// export declare class IATopNav extends LitElement {
+//   localLinks?: boolean;
+//   baseHost?: string;
+//   config?: IATopNavConfig;
+//   hideSearch?: boolean;
+//   mediaBaseHost?: string;
+//   menuSliderOpen?: boolean;
+//   openMenu?: string;
+//   screenName?: string;
+//   searchIn?: string;
+//   searchQuery?: string;
+//   secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;
+//   selectedMenuOption?: string;
+//   username?: string;
+//   userProfileImagePath?: string;
+//   menus: IATopNavMenuConfig;
+//   /**
+//    * Copy to display for number of pages archived at the top of the Wayback search form
+//    *
+//    * ie. "425 billion"
+//    */
+//   waybackPagesArchived?: string;
+// }
+//# sourceMappingURL=models.js.map

package/dist/src/models.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"models.js","sourceRoot":"","sources":["../../src/models.ts"],"names":[],"mappings":";AA2FA,qDAAqD;AACrD,0BAA0B;AAC1B,uBAAuB;AACvB,6BAA6B;AAC7B,0BAA0B;AAC1B,4BAA4B;AAC5B,8BAA8B;AAC9B,uBAAuB;AACvB,yBAAyB;AACzB,uBAAuB;AACvB,0BAA0B;AAC1B,6DAA6D;AAC7D,iCAAiC;AACjC,uBAAuB;AACvB,mCAAmC;AACnC,+BAA+B;AAC/B,QAAQ;AACR,0FAA0F;AAC1F,OAAO;AACP,yBAAyB;AACzB,QAAQ;AACR,mCAAmC;AACnC,IAAI","sourcesContent":["export interface IATopNavConfig {\n  /**\n   * Google Analytics event category\n   */\n  eventCategory?: string;\n\n  /**\n   * Copy to display for number of pages archived at the top of the Wayback search form\n   *\n   * ie. \"425 billion\"\n   */\n  waybackPagesArchived?: string;\n\n  /**\n   * Array of strings representing the values of options that should be hidden from search options\n   */\n  hiddenSearchOptions?: string[];\n\n  /**\n   * Map from dropdown item ids to any callout text that should be applied beside them\n   */\n  callouts?: Record<string, string>;\n}\n\nexport interface IATopNavLink {\n  title: string;\n\n  url?: string;\n\n  class?: string;\n\n  icon?: string;\n\n  analyticsEvent?: string;\n\n  external?: boolean;\n}\n\n// export interface IATopNavIconLink extends IATopNavLink {\n//   /**\n//    * Icon URL\n//    */\n//   icon: string;\n// }\n\n// export interface IATopNavAnalyticsLink extends IATopNavLink {\n//   /**\n//    * Google analytics event name\n//    */\n//   analyticsEvent?: string;\n// }\n\n// export interface IATopNavExternalLink extends IATopNavLink {\n//   /**\n//    * Is the link external or not\n//    */\n//   external: boolean;\n// }\n\nexport interface IATopNavMediaMenu {\n  heading: string;\n  iconLinks: IATopNavLink[];\n  featuredLinks: IATopNavLink[];\n  links: IATopNavLink[];\n  mobileAppsLinks: IATopNavLink[];\n  browserExtensionsLinks: IATopNavLink[];\n  archiveItLinks: IATopNavLink[];\n}\n\n// export interface IATopNavWaybackMenuConfig {\n//   mobileAppsLinks: IATopNavLink[];\n//   browserExtensionsLinks: IATopNavLink[];\n//   archiveItLinks: IATopNavLink[];\n// }\n\nexport interface IATopNavMenuConfig {\n  audio: IATopNavMediaMenu;\n  images: IATopNavMediaMenu;\n  more: IATopNavLink[];\n  signedOut: IATopNavLink[];\n  software: IATopNavMediaMenu;\n  texts: IATopNavMediaMenu;\n  user: IATopNavLink[];\n  userAdmin: IATopNavLink[];\n  userAdminFlags: IATopNavLink[];\n  video: IATopNavMediaMenu;\n  web: IATopNavMediaMenu;\n}\n\nexport type IATopNavSecondIdentitySlotMode = 'allow' | '';\n\n// export declare class IATopNav extends LitElement {\n//   localLinks?: boolean;\n//   baseHost?: string;\n//   config?: IATopNavConfig;\n//   hideSearch?: boolean;\n//   mediaBaseHost?: string;\n//   menuSliderOpen?: boolean;\n//   openMenu?: string;\n//   screenName?: string;\n//   searchIn?: string;\n//   searchQuery?: string;\n//   secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;\n//   selectedMenuOption?: string;\n//   username?: string;\n//   userProfileImagePath?: string;\n//   menus: IATopNavMenuConfig;\n//   /**\n//    * Copy to display for number of pages archived at the top of the Wayback search form\n//    *\n//    * ie. \"425 billion\"\n//    */\n//   waybackPagesArchived?: string;\n// }\n"]}

package/dist/src/more-slider.d.ts

@@ -0,0 +1,10 @@
+import TrackedElement from './tracked-element';
+import { IATopNavConfig, IATopNavLink } from './models';
+export declare class MoreSlider extends TrackedElement {
+    baseHost: string;
+    config: IATopNavConfig;
+    menuItems: IATopNavLink[];
+    static get styles(): import("lit").CSSResult;
+    analyticsEvent(title: string): string;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/src/more-slider.js

@@ -0,0 +1,50 @@
+import { __decorate } from "tslib";
+import { html } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+import TrackedElement from './tracked-element';
+import toSentenceCase from './lib/toSentenceCase';
+import moreSliderCSS from './styles/more-slider';
+import formatUrl from './lib/formatUrl';
+import { defaultTopNavConfig } from './data/menus';
+let MoreSlider = class MoreSlider extends TrackedElement {
+    constructor() {
+        super(...arguments);
+        this.baseHost = '';
+        this.config = defaultTopNavConfig;
+        this.menuItems = [];
+    }
+    static get styles() {
+        return moreSliderCSS;
+    }
+    analyticsEvent(title) {
+        return `${this.config.eventCategory}|NavMore${toSentenceCase(title)}`;
+    }
+    render() {
+        return html `
+      <ul>
+        ${this.menuItems.map((item) => html `<li>
+              <a
+                @click=${this.trackClick}
+                href=${formatUrl(item.url, this.baseHost)}
+                data-event-click-tracking="${this.analyticsEvent(item.title)}"
+                >${item.title}</a
+              >
+            </li>`)}
+      </ul>
+    `;
+    }
+};
+__decorate([
+    property({ type: String })
+], MoreSlider.prototype, "baseHost", void 0);
+__decorate([
+    property({ type: Object })
+], MoreSlider.prototype, "config", void 0);
+__decorate([
+    property({ type: Array })
+], MoreSlider.prototype, "menuItems", void 0);
+MoreSlider = __decorate([
+    customElement('more-slider')
+], MoreSlider);
+export { MoreSlider };
+//# sourceMappingURL=more-slider.js.map

package/dist/src/more-slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"more-slider.js","sourceRoot":"","sources":["../../src/more-slider.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAE5D,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,cAAc,MAAM,sBAAsB,CAAC;AAClD,OAAO,aAAa,MAAM,sBAAsB,CAAC;AACjD,OAAO,SAAS,MAAM,iBAAiB,CAAC;AAExC,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAG5C,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQ,cAAc;IAAvC;;QACuB,aAAQ,GAAG,EAAE,CAAC;QACd,WAAM,GAAmB,mBAAmB,CAAC;QAC9C,cAAS,GAAmB,EAAE,CAAC;IA2B5D,CAAC;IAzBC,MAAM,KAAK,MAAM;QACf,OAAO,aAAa,CAAC;IACvB,CAAC;IAED,cAAc,CAAC,KAAa;QAC1B,OAAO,GAAG,IAAI,CAAC,MAAM,CAAC,aAAa,WAAW,cAAc,CAAC,KAAK,CAAC,EAAE,CAAC;IACxE,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;;UAEL,IAAI,CAAC,SAAS,CAAC,GAAG,CAClB,CAAC,IAAI,EAAE,EAAE,CACP,IAAI,CAAA;;yBAES,IAAI,CAAC,UAAU;uBACjB,SAAS,CAAC,IAAI,CAAC,GAAG,EAAE,IAAI,CAAC,QAAQ,CAAC;6CACZ,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,CAAC;mBACzD,IAAI,CAAC,KAAK;;kBAEX,CACT;;KAEJ,CAAC;IACJ,CAAC;CACF,CAAA;AA7B6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0CAA8C;AAC9C;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;6CAAgC;AAH/C,UAAU;IADtB,aAAa,CAAC,aAAa,CAAC;GAChB,UAAU,CA8BtB","sourcesContent":["import { html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport TrackedElement from './tracked-element';\nimport toSentenceCase from './lib/toSentenceCase';\nimport moreSliderCSS from './styles/more-slider';\nimport formatUrl from './lib/formatUrl';\nimport { IATopNavConfig, IATopNavLink } from './models';\nimport { defaultTopNavConfig } from './data/menus';\n\n@customElement('more-slider')\nexport class MoreSlider extends TrackedElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: Array }) menuItems: IATopNavLink[] = [];\n\n  static get styles() {\n    return moreSliderCSS;\n  }\n\n  analyticsEvent(title: string) {\n    return `${this.config.eventCategory}|NavMore${toSentenceCase(title)}`;\n  }\n\n  render() {\n    return html`\n      <ul>\n        ${this.menuItems.map(\n          (item) =>\n            html`<li>\n              <a\n                @click=${this.trackClick}\n                href=${formatUrl(item.url, this.baseHost)}\n                data-event-click-tracking=\"${this.analyticsEvent(item.title)}\"\n                >${item.title}</a\n              >\n            </li>`,\n        )}\n      </ul>\n    `;\n  }\n}\n"]}

package/dist/src/nav-search.d.ts

@@ -0,0 +1,19 @@
+import { nothing } from 'lit';
+import TrackedElement from './tracked-element';
+import { IATopNavConfig } from './models';
+export declare class NavSearch extends TrackedElement {
+    baseHost: string;
+    config: IATopNavConfig;
+    locationHandler: (url: string) => void;
+    open: boolean;
+    openMenu: string;
+    searchIn: string;
+    searchQuery: string;
+    private queryInput?;
+    static get styles(): import("lit").CSSResult;
+    search(e: CustomEvent): boolean;
+    toggleSearchMenu(): void;
+    get searchInsideInput(): import("lit").TemplateResult<1> | typeof nothing;
+    get searchEndpoint(): string;
+    render(): import("lit").TemplateResult<1>;
+}

package/dist/src/nav-search.js

@@ -0,0 +1,124 @@
+import { __decorate } from "tslib";
+import { nothing, html } from 'lit';
+import TrackedElement from './tracked-element';
+import navSearchCSS from './styles/nav-search';
+import icons from './assets/img/icons';
+import formatUrl from './lib/formatUrl';
+import { customElement, property, query } from 'lit/decorators.js';
+import { defaultTopNavConfig } from './data/menus';
+let NavSearch = class NavSearch extends TrackedElement {
+    constructor() {
+        super(...arguments);
+        this.baseHost = '';
+        this.config = defaultTopNavConfig;
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        this.locationHandler = (url) => { };
+        this.open = false;
+        this.openMenu = '';
+        this.searchIn = '';
+        this.searchQuery = '';
+    }
+    static get styles() {
+        return navSearchCSS;
+    }
+    search(e) {
+        var _a;
+        const query = (_a = this.queryInput) === null || _a === void 0 ? void 0 : _a.value;
+        if (!query) {
+            e.preventDefault();
+            return false;
+        }
+        // TV search points to a detail page with a q param instead
+        if (this.searchIn === 'TV') {
+            this.locationHandler(formatUrl(`/details/tv?q=${query}`, this.baseHost));
+            e.preventDefault();
+            return false;
+        }
+        this.trackSubmit(e);
+        return true;
+    }
+    toggleSearchMenu() {
+        if (this.openMenu === 'search') {
+            return;
+        }
+        this.dispatchEvent(new CustomEvent('menuToggled', {
+            detail: {
+                menuName: 'search',
+            },
+            composed: true,
+            bubbles: true,
+        }));
+    }
+    get searchInsideInput() {
+        return this.searchIn
+            ? html `<input type="hidden" name="sin" value="${this.searchIn}" />`
+            : nothing;
+    }
+    get searchEndpoint() {
+        return '/search';
+    }
+    render() {
+        var _a, _b;
+        const searchMenuClass = this.open ? 'flex' : 'search-inactive';
+        return html `
+      <div class="search-activated fade-in ${searchMenuClass}">
+        <form
+          id="nav-search"
+          class="highlight"
+          .action=${formatUrl(this.searchEndpoint, this.baseHost)}
+          method="get"
+          @submit=${this.search}
+          data-event-submit-tracking="${(_a = this.config) === null || _a === void 0 ? void 0 : _a.eventCategory}|NavSearchSubmit"
+        >
+          <input
+            type="text"
+            name="query"
+            class="search-field"
+            placeholder="Search"
+            autocomplete="off"
+            value=${this.searchQuery || ''}
+            @focus=${this.toggleSearchMenu}
+          />
+          ${this.searchInsideInput}
+          <button
+            type="submit"
+            class="search"
+            tabindex="-1"
+            data-event-click-tracking="${(_b = this.config) === null || _b === void 0 ? void 0 : _b.eventCategory}|NavSearchClose"
+          >
+            ${icons.search}
+          </button>
+        </form>
+      </div>
+    `;
+    }
+};
+__decorate([
+    property({ type: String })
+], NavSearch.prototype, "baseHost", void 0);
+__decorate([
+    property({ type: Object })
+], NavSearch.prototype, "config", void 0);
+__decorate([
+    property({ type: Object })
+], NavSearch.prototype, "locationHandler", void 0);
+__decorate([
+    property({ type: Boolean })
+], NavSearch.prototype, "open", void 0);
+__decorate([
+    property({ type: String })
+], NavSearch.prototype, "openMenu", void 0);
+__decorate([
+    property({ type: String })
+], NavSearch.prototype, "searchIn", void 0);
+__decorate([
+    property({ type: String })
+], NavSearch.prototype, "searchQuery", void 0);
+__decorate([
+    query('[name=query]')
+], NavSearch.prototype, "queryInput", void 0);
+NavSearch = __decorate([
+    customElement('nav-search')
+], NavSearch);
+export { NavSearch };
+//# sourceMappingURL=nav-search.js.map

package/dist/src/nav-search.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"nav-search.js","sourceRoot":"","sources":["../../src/nav-search.ts"],"names":[],"mappings":"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","sourcesContent":["import { nothing, html } from 'lit';\n\nimport TrackedElement from './tracked-element';\nimport navSearchCSS from './styles/nav-search';\nimport icons from './assets/img/icons';\nimport formatUrl from './lib/formatUrl';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { defaultTopNavConfig } from './data/menus';\nimport { IATopNavConfig } from './models';\n\n@customElement('nav-search')\nexport class NavSearch extends TrackedElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  @property({ type: Object }) locationHandler = (url: string) => {};\n  @property({ type: Boolean }) open = false;\n  @property({ type: String }) openMenu = '';\n  @property({ type: String }) searchIn = '';\n  @property({ type: String }) searchQuery = '';\n\n  @query('[name=query]') private queryInput?: HTMLInputElement;\n\n  static get styles() {\n    return navSearchCSS;\n  }\n\n  search(e: CustomEvent) {\n    const query = this.queryInput?.value;\n\n    if (!query) {\n      e.preventDefault();\n      return false;\n    }\n\n    // TV search points to a detail page with a q param instead\n    if (this.searchIn === 'TV') {\n      this.locationHandler(\n        formatUrl(`/details/tv?q=${query}` as string & Location, this.baseHost),\n      );\n      e.preventDefault();\n      return false;\n    }\n\n    this.trackSubmit(e);\n    return true;\n  }\n\n  toggleSearchMenu() {\n    if (this.openMenu === 'search') {\n      return;\n    }\n    this.dispatchEvent(\n      new CustomEvent('menuToggled', {\n        detail: {\n          menuName: 'search',\n        },\n        composed: true,\n        bubbles: true,\n      }),\n    );\n  }\n\n  get searchInsideInput() {\n    return this.searchIn\n      ? html`<input type=\"hidden\" name=\"sin\" value=\"${this.searchIn}\" />`\n      : nothing;\n  }\n\n  get searchEndpoint() {\n    return '/search';\n  }\n\n  render() {\n    const searchMenuClass = this.open ? 'flex' : 'search-inactive';\n\n    return html`\n      <div class=\"search-activated fade-in ${searchMenuClass}\">\n        <form\n          id=\"nav-search\"\n          class=\"highlight\"\n          .action=${formatUrl(\n            this.searchEndpoint as string & Location,\n            this.baseHost,\n          )}\n          method=\"get\"\n          @submit=${this.search}\n          data-event-submit-tracking=\"${this.config\n            ?.eventCategory}|NavSearchSubmit\"\n        >\n          <input\n            type=\"text\"\n            name=\"query\"\n            class=\"search-field\"\n            placeholder=\"Search\"\n            autocomplete=\"off\"\n            value=${this.searchQuery || ''}\n            @focus=${this.toggleSearchMenu}\n          />\n          ${this.searchInsideInput}\n          <button\n            type=\"submit\"\n            class=\"search\"\n            tabindex=\"-1\"\n            data-event-click-tracking=\"${this.config\n              ?.eventCategory}|NavSearchClose\"\n          >\n            ${icons.search}\n          </button>\n        </form>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/primary-nav.d.ts

@@ -0,0 +1,45 @@
+import { nothing, PropertyValues } from 'lit';
+import TrackedElement from './tracked-element';
+import './assets/img/hamburger';
+import './login-button';
+import './nav-search';
+import './media-menu';
+import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from './models';
+export declare class PrimaryNav extends TrackedElement {
+    mediaBaseHost: string;
+    baseHost: string;
+    hideSearch: boolean;
+    config: IATopNavConfig;
+    openMenu: string;
+    screenName: string;
+    searchIn: string;
+    searchQuery: string;
+    secondIdentitySlotMode: IATopNavSecondIdentitySlotMode;
+    selectedMenuOption: string;
+    signedOutMenuOpen: boolean;
+    userMenuOpen: boolean;
+    mediaMenuAnimate: boolean;
+    username: string;
+    userProfileImagePath: string;
+    currentTab: {
+        mediatype: string;
+        moveTo: string;
+    } | undefined;
+    signedOutMenuToggled: unknown;
+    static get styles(): import("lit").CSSResult;
+    toggleMediaMenu(e: Event): void;
+    toggleSearchMenu(e: Event): void;
+    toggleUserMenu(e: Event): void;
+    updated(props: PropertyValues): typeof nothing | undefined;
+    get userIcon(): import("lit").TemplateResult<1>;
+    get loginIcon(): import("lit").TemplateResult<1>;
+    get searchMenuOpen(): boolean;
+    get allowSecondaryIcon(): boolean;
+    get searchMenu(): import("lit").TemplateResult<1> | typeof nothing;
+    get mobileDonateHeart(): import("lit").TemplateResult<1>;
+    get uploadButtonTemplate(): import("lit").TemplateResult<1>;
+    get userStateTemplate(): import("lit").TemplateResult<1>;
+    get secondLogoSlot(): import("lit").TemplateResult<1> | typeof nothing;
+    get secondLogoClass(): "" | "second-logo";
+    render(): import("lit").TemplateResult<1>;
+}