@internetarchive/ia-topnav 2.0.1 → 2.1.0-alpha-webdev8170.0

package/dist/index.d.ts

@@ -1,2 +1,2 @@
-import { IATopNav } from './src/ia-topnav';
-export { IATopNav };
+export { IATopNav } from './src/ia-topnav';
+export { TOPNAV_MOBILE_BREAKPOINT } from './src/models';

package/dist/index.js

@@ -1,3 +1,3 @@
-import { IATopNav } from './src/ia-topnav';
-export { IATopNav };
+export { IATopNav } from './src/ia-topnav';
+export { TOPNAV_MOBILE_BREAKPOINT } from './src/models';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,OAAO,EAAE,QAAQ,EAAE,CAAC","sourcesContent":["import { IATopNav } from './src/ia-topnav';\n\nexport { IATopNav };\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,iBAAiB,CAAC;AAE3C,OAAO,EAAE,wBAAwB,EAAE,MAAM,cAAc,CAAC","sourcesContent":["export { IATopNav } from './src/ia-topnav';\n\nexport { TOPNAV_MOBILE_BREAKPOINT } from './src/models';\n"]}

package/dist/src/dropdown-menu.js

@@ -54,12 +54,12 @@ export default class DropdownMenu extends TrackedElement {
         return html `<li class="divider"></li>`;
     }
     dropdownSection(submenu) {
-        return submenu.map((item) => html `
-        <li>
+        return submenu.map((item) => html `
+        <li>
           ${item.url
             ? this.dropdownLink(item)
-            : DropdownMenu.dropdownText(item)}
-        </li>
+            : DropdownMenu.dropdownText(item)}
+        </li>
       `);
     }
     dropdownLink(link) {
@@ -67,18 +67,18 @@ export default class DropdownMenu extends TrackedElement {
         const calloutText = (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.callouts) === null || _b === void 0 ? void 0 : _b[link.title];
         const isMobileUpload = link.class === 'mobile-upload';
         const isTabbable = this.open && !isMobileUpload;
-        return html `<a
-      href="${formatUrl(link.url, this.baseHost)}"
-      class=${ifDefined(link.class)}
-      tabindex="${isTabbable ? '' : '-1'}"
-      @click=${this.trackClick}
-      data-event-click-tracking="${(_c = this.config) === null || _c === void 0 ? void 0 : _c.eventCategory}|Nav${link.analyticsEvent}"
-      aria-label=${calloutText ? `New feature: ${link.title}` : nothing}
-    >
-      ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}
+        return html `<a
+      href="${formatUrl(link.url, this.baseHost)}"
+      class=${ifDefined(link.class)}
+      tabindex="${isTabbable ? '' : '-1'}"
+      @click=${this.trackClick}
+      data-event-click-tracking="${(_c = this.config) === null || _c === void 0 ? void 0 : _c.eventCategory}|Nav${link.analyticsEvent}"
+      aria-label=${calloutText ? `New feature: ${link.title}` : nothing}
+    >
+      ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}
       ${calloutText
             ? html `<span class="callout" aria-hidden="true">${calloutText}</span>`
-            : nothing}
+            : nothing}
     </a>`;
     }
     static dropdownText(item) {
@@ -92,18 +92,18 @@ export default class DropdownMenu extends TrackedElement {
         return 'initial';
     }
     render() {
-        return html `
-      <div class="nav-container">
-        <nav
-          class="${this.menuClass}"
-          aria-hidden="${makeBooleanString(!this.open)}"
-          aria-expanded="${makeBooleanString(this.open)}"
-        >
-          <ul>
-            ${this.dropdownItems}
-          </ul>
-        </nav>
-      </div>
+        return html `
+      <div class="nav-container">
+        <nav
+          class="${this.menuClass}"
+          aria-hidden="${makeBooleanString(!this.open)}"
+          aria-expanded="${makeBooleanString(this.open)}"
+        >
+          <ul>
+            ${this.dropdownItems}
+          </ul>
+        </nav>
+      </div>
     `;
     }
 }

package/dist/src/dropdown-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../src/dropdown-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import {\r\n  CSSResultGroup,\r\n  html,\r\n  nothing,\r\n  PropertyValues,\r\n  TemplateResult,\r\n} from 'lit';\r\nimport { property } from 'lit/decorators.js';\r\n\r\nimport icons from './assets/img/icons';\r\nimport { defaultTopNavConfig } from './data/menus';\r\nimport formatUrl from './lib/format-url';\r\nimport { makeBooleanString } from './lib/make-boolean-string';\r\nimport { IATopNavConfig, IATopNavLink } from './models';\r\nimport dropdownMenuCSS from './styles/dropdown-menu';\r\nimport TrackedElement from './tracked-element';\r\nimport { ifDefined } from 'lit/directives/if-defined.js';\r\nimport KeyboardNavigation from './lib/keyboard-navigation';\r\n\r\nexport default class DropdownMenu extends TrackedElement {\r\n  @property({ type: String }) baseHost = '';\r\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n  @property({ type: Array }) menuItems: IATopNavLink[] | IATopNavLink[][] = [];\r\n  @property({ type: Boolean }) animated = false;\r\n  @property({ type: Boolean }) open = false;\r\n\r\n  private previousKeydownListener?: // eslint-disable-next-line @typescript-eslint/no-explicit-any\r\n  (this: HTMLElement, ev: KeyboardEvent) => any;\r\n\r\n  static get styles(): CSSResultGroup {\r\n    return dropdownMenuCSS;\r\n  }\r\n\r\n  updated(props: PropertyValues) {\r\n    if (props.has('open') && this.open) {\r\n      const container = this.shadowRoot?.querySelector(\r\n        '.nav-container',\r\n      ) as HTMLElement;\r\n\r\n      if (container) {\r\n        const keyboardNavigation = new KeyboardNavigation(\r\n          container,\r\n          'usermenu',\r\n        );\r\n        this.addEventListener('keydown', keyboardNavigation.handleKeyDown);\r\n        if (this.previousKeydownListener) {\r\n          this.removeEventListener('keydown', this.previousKeydownListener);\r\n        }\r\n        this.previousKeydownListener = keyboardNavigation.handleKeyDown;\r\n      }\r\n    }\r\n  }\r\n\r\n  get dropdownItems() {\r\n    if (!this.menuItems) return nothing;\r\n\r\n    if (!Array.isArray(this.menuItems[0])) {\r\n      const submenu = this.menuItems as IATopNavLink[];\r\n      return this.dropdownSection(submenu);\r\n    }\r\n    return this.menuItems.map((submenu, i) => {\r\n      const joiner = i ? DropdownMenu.dropdownDivider : html``;\r\n      if (!Array.isArray(submenu)) {\r\n        return;\r\n      }\r\n      return [joiner, ...this.dropdownSection(submenu)];\r\n    });\r\n  }\r\n\r\n  static get dropdownDivider() {\r\n    return html`<li class=\"divider\"></li>`;\r\n  }\r\n\r\n  private dropdownSection(submenu: IATopNavLink[]): TemplateResult[] {\r\n    return submenu.map(\r\n      (item) => html`\r\n        <li>\r\n          ${item.url\r\n            ? this.dropdownLink(item)\r\n            : DropdownMenu.dropdownText(item)}\r\n        </li>\r\n      `,\r\n    );\r\n  }\r\n\r\n  dropdownLink(link: IATopNavLink): TemplateResult {\r\n    const calloutText = this.config?.callouts?.[link.title];\r\n    const isMobileUpload = link.class === 'mobile-upload';\r\n    const isTabbable = this.open && !isMobileUpload;\r\n\r\n    return html`<a\r\n      href=\"${formatUrl(link.url, this.baseHost)}\"\r\n      class=${ifDefined(link.class)}\r\n      tabindex=\"${isTabbable ? '' : '-1'}\"\r\n      @click=${this.trackClick}\r\n      data-event-click-tracking=\"${this.config\r\n        ?.eventCategory}|Nav${link.analyticsEvent}\"\r\n      aria-label=${calloutText ? `New feature: ${link.title}` : nothing}\r\n    >\r\n      ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}\r\n      ${calloutText\r\n        ? html`<span class=\"callout\" aria-hidden=\"true\">${calloutText}</span>`\r\n        : nothing}\r\n    </a>`;\r\n  }\r\n\r\n  static dropdownText(item: IATopNavLink) {\r\n    return html`<span class=\"info-item\">${item.title}</span>`;\r\n  }\r\n\r\n  get menuClass() {\r\n    if (this.open) return 'open';\r\n    if (this.animated) return 'closed';\r\n    return 'initial';\r\n  }\r\n\r\n  render() {\r\n    return html`\r\n      <div class=\"nav-container\">\r\n        <nav\r\n          class=\"${this.menuClass}\"\r\n          aria-hidden=\"${makeBooleanString(!this.open)}\"\r\n          aria-expanded=\"${makeBooleanString(this.open)}\"\r\n        >\r\n          <ul>\r\n            ${this.dropdownItems}\r\n          </ul>\r\n        </nav>\r\n      </div>\r\n    `;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"dropdown-menu.js","sourceRoot":"","sources":["../../src/dropdown-menu.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  CSSResultGroup,\n  html,\n  nothing,\n  PropertyValues,\n  TemplateResult,\n} from 'lit';\nimport { property } from 'lit/decorators.js';\n\nimport icons from './assets/img/icons';\nimport { defaultTopNavConfig } from './data/menus';\nimport formatUrl from './lib/format-url';\nimport { makeBooleanString } from './lib/make-boolean-string';\nimport { IATopNavConfig, IATopNavLink } from './models';\nimport dropdownMenuCSS from './styles/dropdown-menu';\nimport TrackedElement from './tracked-element';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport KeyboardNavigation from './lib/keyboard-navigation';\n\nexport default class DropdownMenu extends TrackedElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: Array }) menuItems: IATopNavLink[] | IATopNavLink[][] = [];\n  @property({ type: Boolean }) animated = false;\n  @property({ type: Boolean }) open = false;\n\n  private previousKeydownListener?: // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  (this: HTMLElement, ev: KeyboardEvent) => any;\n\n  static get styles(): CSSResultGroup {\n    return dropdownMenuCSS;\n  }\n\n  updated(props: PropertyValues) {\n    if (props.has('open') && this.open) {\n      const container = this.shadowRoot?.querySelector(\n        '.nav-container',\n      ) as HTMLElement;\n\n      if (container) {\n        const keyboardNavigation = new KeyboardNavigation(\n          container,\n          'usermenu',\n        );\n        this.addEventListener('keydown', keyboardNavigation.handleKeyDown);\n        if (this.previousKeydownListener) {\n          this.removeEventListener('keydown', this.previousKeydownListener);\n        }\n        this.previousKeydownListener = keyboardNavigation.handleKeyDown;\n      }\n    }\n  }\n\n  get dropdownItems() {\n    if (!this.menuItems) return nothing;\n\n    if (!Array.isArray(this.menuItems[0])) {\n      const submenu = this.menuItems as IATopNavLink[];\n      return this.dropdownSection(submenu);\n    }\n    return this.menuItems.map((submenu, i) => {\n      const joiner = i ? DropdownMenu.dropdownDivider : html``;\n      if (!Array.isArray(submenu)) {\n        return;\n      }\n      return [joiner, ...this.dropdownSection(submenu)];\n    });\n  }\n\n  static get dropdownDivider() {\n    return html`<li class=\"divider\"></li>`;\n  }\n\n  private dropdownSection(submenu: IATopNavLink[]): TemplateResult[] {\n    return submenu.map(\n      (item) => html`\n        <li>\n          ${item.url\n            ? this.dropdownLink(item)\n            : DropdownMenu.dropdownText(item)}\n        </li>\n      `,\n    );\n  }\n\n  dropdownLink(link: IATopNavLink): TemplateResult {\n    const calloutText = this.config?.callouts?.[link.title];\n    const isMobileUpload = link.class === 'mobile-upload';\n    const isTabbable = this.open && !isMobileUpload;\n\n    return html`<a\n      href=\"${formatUrl(link.url, this.baseHost)}\"\n      class=${ifDefined(link.class)}\n      tabindex=\"${isTabbable ? '' : '-1'}\"\n      @click=${this.trackClick}\n      data-event-click-tracking=\"${this.config\n        ?.eventCategory}|Nav${link.analyticsEvent}\"\n      aria-label=${calloutText ? `New feature: ${link.title}` : nothing}\n    >\n      ${isMobileUpload ? icons.uploadUnpadded : nothing} ${link.title}\n      ${calloutText\n        ? html`<span class=\"callout\" aria-hidden=\"true\">${calloutText}</span>`\n        : nothing}\n    </a>`;\n  }\n\n  static dropdownText(item: IATopNavLink) {\n    return html`<span class=\"info-item\">${item.title}</span>`;\n  }\n\n  get menuClass() {\n    if (this.open) return 'open';\n    if (this.animated) return 'closed';\n    return 'initial';\n  }\n\n  render() {\n    return html`\n      <div class=\"nav-container\">\n        <nav\n          class=\"${this.menuClass}\"\n          aria-hidden=\"${makeBooleanString(!this.open)}\"\n          aria-expanded=\"${makeBooleanString(this.open)}\"\n        >\n          <ul>\n            ${this.dropdownItems}\n          </ul>\n        </nav>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/ia-topnav.js

@@ -139,32 +139,32 @@ let IATopNav = class IATopNav extends LitElement {
         return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';
     }
     get userMenu() {
-        return html `
-      <user-menu
-        .baseHost=${this.normalizedBaseHost}
-        .config=${this.config}
-        .menuItems=${this.userMenuItems}
-        ?open=${this.openMenu === 'user'}
-        .username=${this.username}
-        tabindex="${this.userMenuTabIndex}"
-        @menuToggled=${this.menuToggled}
-        @trackClick=${this.trackClick}
-        @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
-      ></user-menu>
+        return html `
+      <user-menu
+        .baseHost=${this.normalizedBaseHost}
+        .config=${this.config}
+        .menuItems=${this.userMenuItems}
+        ?open=${this.openMenu === 'user'}
+        .username=${this.username}
+        tabindex="${this.userMenuTabIndex}"
+        @menuToggled=${this.menuToggled}
+        @trackClick=${this.trackClick}
+        @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
+      ></user-menu>
     `;
     }
     get signedOutDropdown() {
-        return html `
-      <signed-out-dropdown
-        .baseHost=${this.normalizedBaseHost}
-        .config=${this.config}
-        .open=${this.signedOutOpened}
-        tabindex="${this.signedOutTabIndex}"
-        .menuItems=${this.signedOutMenuItems}
+        return html `
+      <signed-out-dropdown
+        .baseHost=${this.normalizedBaseHost}
+        .config=${this.config}
+        .open=${this.signedOutOpened}
+        tabindex="${this.signedOutTabIndex}"
+        .menuItems=${this.signedOutMenuItems}
         @focusToOtherMenuItem=${(e) => {
             this.currentTab = e.detail;
-        }}
-      ></signed-out-dropdown>
+        }}
+      ></signed-out-dropdown>
     `;
     }
     get signedOutMenuItems() {
@@ -193,9 +193,9 @@ let IATopNav = class IATopNav extends LitElement {
     }
     get secondLogoSlot() {
         return this.allowSecondaryIcon
-            ? html `
-          <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
-          <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
+            ? html `
+          <slot name="opt-sec-logo" slot="opt-sec-logo"></slot>
+          <slot name="opt-sec-logo-mobile" slot="opt-sec-logo-mobile"></slot>
         `
             : nothing;
     }
@@ -203,48 +203,48 @@ let IATopNav = class IATopNav extends LitElement {
         return html `<li class="divider" role="presentation"></li>`;
     }
     render() {
-        return html `
-      <div class="topnav">
-        <primary-nav
-          .baseHost=${this.normalizedBaseHost}
-          .mediaBaseHost=${this.mediaBaseHost}
-          .config=${this.config}
-          .openMenu=${this.openMenu}
-          .screenName=${this.screenName}
-          .secondIdentitySlotMode=${this.secondIdentitySlotMode}
-          .selectedMenuOption=${this.selectedMenuOption}
-          .username=${this.username}
-          .userProfileImagePath=${this.userProfileImagePath}
-          .currentTab=${this.currentTab}
-          ?hideSearch=${this.hideSearch}
-          @mediaTypeSelected=${this.mediaTypeSelected}
-          @trackClick=${this.trackClick}
-          @trackSubmit=${this.trackSubmit}
-          @menuToggled=${this.menuToggled}
-        >
-          ${this.secondLogoSlot} ${this.searchSlot}
-        </primary-nav>
-        <media-slider
-          .baseHost=${this.normalizedBaseHost}
-          .config=${this.config}
-          .selectedMenuOption=${this.selectedMenuOption}
-          .mediaSliderOpen=${this.mediaSliderOpen}
-          .menus=${this.menus}
-          tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
-          @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
-        ></media-slider>
-      </div>
-      ${this.username ? this.userMenu : this.signedOutDropdown}
-      <desktop-subnav
-        .baseHost=${this.normalizedBaseHost}
-        .menuItems=${this.menus.more.links}
-        @focus=${this.closeMenus}
-      ></desktop-subnav>
-      <div
-        id="close-layer"
-        class="${this.closeLayerClass}"
-        @click=${this.closeMenus}
-      ></div>
+        return html `
+      <div class="topnav">
+        <primary-nav
+          .baseHost=${this.normalizedBaseHost}
+          .mediaBaseHost=${this.mediaBaseHost}
+          .config=${this.config}
+          .openMenu=${this.openMenu}
+          .screenName=${this.screenName}
+          .secondIdentitySlotMode=${this.secondIdentitySlotMode}
+          .selectedMenuOption=${this.selectedMenuOption}
+          .username=${this.username}
+          .userProfileImagePath=${this.userProfileImagePath}
+          .currentTab=${this.currentTab}
+          ?hideSearch=${this.hideSearch}
+          @mediaTypeSelected=${this.mediaTypeSelected}
+          @trackClick=${this.trackClick}
+          @trackSubmit=${this.trackSubmit}
+          @menuToggled=${this.menuToggled}
+        >
+          ${this.secondLogoSlot} ${this.searchSlot}
+        </primary-nav>
+        <media-slider
+          .baseHost=${this.normalizedBaseHost}
+          .config=${this.config}
+          .selectedMenuOption=${this.selectedMenuOption}
+          .mediaSliderOpen=${this.mediaSliderOpen}
+          .menus=${this.menus}
+          tabindex="${this.mediaSliderOpen ? '1' : '-1'}"
+          @focusToOtherMenuItem=${(e) => (this.currentTab = e.detail)}
+        ></media-slider>
+      </div>
+      ${this.username ? this.userMenu : this.signedOutDropdown}
+      <desktop-subnav
+        .baseHost=${this.normalizedBaseHost}
+        .menuItems=${this.menus.more.links}
+        @focus=${this.closeMenus}
+      ></desktop-subnav>
+      <div
+        id="close-layer"
+        class="${this.closeLayerClass}"
+        @click=${this.closeMenus}
+      ></div>
     `;
     }
 };

package/dist/src/ia-topnav.js.map

@@ -1 +1 @@
-{"version":3,"file":"ia-topnav.js","sourceRoot":"","sources":["../../src/ia-topnav.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\r\nimport { customElement, property, query, state } from 'lit/decorators.js';\r\n\r\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\r\nimport './desktop-subnav';\r\nimport './dropdown-menu';\r\nimport './media-slider';\r\nimport {\r\n  IATopNavConfig,\r\n  IATopNavMenuConfig,\r\n  IATopNavSecondIdentitySlotMode,\r\n} from './models';\r\nimport './primary-nav';\r\nimport type { PrimaryNav } from './primary-nav';\r\nimport './signed-out-dropdown';\r\nimport iaTopNavCSS from './styles/ia-topnav';\r\nimport './user-menu';\r\n\r\n@customElement('ia-topnav')\r\nexport class IATopNav extends LitElement {\r\n  @property({ type: Boolean }) localLinks = false;\r\n\r\n  @property({ type: String }) waybackPagesArchived = '';\r\n\r\n  @property({ type: String }) baseHost = 'https://archive.org';\r\n\r\n  @property({ type: String }) mediaBaseHost = 'https://archive.org';\r\n\r\n  @property({ type: Boolean }) admin = false;\r\n\r\n  @property({ type: Boolean }) canManageFlags = false;\r\n\r\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n\r\n  @property({ type: Boolean }) hideSearch = false;\r\n\r\n  @property({ type: String }) itemIdentifier = '';\r\n\r\n  @property({ type: Boolean }) mediaSliderOpen = false;\r\n\r\n  @property({ type: String }) openMenu = '';\r\n\r\n  @property({ type: String }) screenName: string = '';\r\n\r\n  @property({ type: String }) selectedMenuOption = '';\r\n\r\n  @property({ type: String }) username: string = '';\r\n\r\n  @property({ type: String }) userProfileImagePath =\r\n    '/services/img/user/profile';\r\n\r\n  @property({ type: String })\r\n  secondIdentitySlotMode: IATopNavSecondIdentitySlotMode = '';\r\n\r\n  @property({ type: Object }) currentTab?: {\r\n    mediatype: string;\r\n    moveTo: string;\r\n  };\r\n\r\n  @query('primary-nav') private primaryNav?: PrimaryNav;\r\n  /** Only one of user-menu or signed-out-dropdown is rendered at a time. */\r\n  @query('user-menu, signed-out-dropdown')\r\n  private accountDropdown?: HTMLElement;\r\n\r\n  @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\r\n\r\n  private boundHandleKeydown = this.handleDocumentKeydown.bind(this);\r\n\r\n  private boundHandleClick = this.handleDocumentClick.bind(this);\r\n\r\n  private get normalizedBaseHost() {\r\n    return !this.localLinks ? this.baseHost : '';\r\n  }\r\n\r\n  static get styles() {\r\n    return iaTopNavCSS;\r\n  }\r\n\r\n  updated(props: PropertyValues) {\r\n    if (\r\n      props.has('username') ||\r\n      props.has('waybackPagesArchived') ||\r\n      props.has('itemIdentifier') ||\r\n      props.has('localLinks') ||\r\n      props.has('baseHost')\r\n    ) {\r\n      this.menuSetup();\r\n    }\r\n  }\r\n\r\n  connectedCallback() {\r\n    super.connectedCallback();\r\n    document.addEventListener('keydown', this.boundHandleKeydown);\r\n    document.addEventListener('click', this.boundHandleClick);\r\n  }\r\n\r\n  disconnectedCallback() {\r\n    super.disconnectedCallback();\r\n    document.removeEventListener('keydown', this.boundHandleKeydown);\r\n    document.removeEventListener('click', this.boundHandleClick);\r\n  }\r\n\r\n  private handleDocumentKeydown(e: KeyboardEvent) {\r\n    if (e.key === 'Escape') {\r\n      this.openMenu = '';\r\n      this.mediaSliderOpen = false;\r\n    }\r\n  }\r\n\r\n  private handleDocumentClick(e: MouseEvent) {\r\n    if (!this.openMenu) return;\r\n    const path = e.composedPath();\r\n    if (!path.includes(this)) {\r\n      this.closeMenus();\r\n    }\r\n  }\r\n\r\n  menuSetup() {\r\n    // re/build the nav\r\n    this.menus = buildTopNavMenus(\r\n      this.username,\r\n      this.normalizedBaseHost,\r\n      this.waybackPagesArchived,\r\n      this.itemIdentifier,\r\n    );\r\n  }\r\n\r\n  menuToggled(e: CustomEvent) {\r\n    const currentMenu = this.openMenu;\r\n    this.openMenu = currentMenu === e.detail.menuName ? '' : e.detail.menuName;\r\n    // Keeps media slider open if media menu is open\r\n    if (this.openMenu === 'media') {\r\n      return;\r\n    }\r\n    this.closeMediaSlider();\r\n\r\n    if (this.openMenu === 'user' || this.openMenu === 'login') {\r\n      if (this.primaryNav && this.accountDropdown) {\r\n        const right = this.primaryNav.getAccountDropdownOffset();\r\n        this.accountDropdown.style.setProperty(\r\n          '--dropdownMenuRight',\r\n          `${right}px`,\r\n        );\r\n      }\r\n    }\r\n  }\r\n\r\n  openMediaSlider() {\r\n    this.mediaSliderOpen = true;\r\n  }\r\n\r\n  closeMediaSlider() {\r\n    this.mediaSliderOpen = false;\r\n    this.selectedMenuOption = '';\r\n  }\r\n\r\n  closeMenus() {\r\n    this.openMenu = '';\r\n    this.closeMediaSlider();\r\n  }\r\n\r\n  trackClick(e: CustomEvent) {\r\n    this.dispatchEvent(\r\n      new CustomEvent('analyticsClick', {\r\n        bubbles: true,\r\n        composed: true,\r\n        detail: e.detail,\r\n      }),\r\n    );\r\n  }\r\n\r\n  trackSubmit(e: CustomEvent) {\r\n    this.dispatchEvent(\r\n      new CustomEvent('analyticsSubmit', {\r\n        bubbles: true,\r\n        composed: true,\r\n        detail: e.detail,\r\n      }),\r\n    );\r\n  }\r\n\r\n  mediaTypeSelected(e: CustomEvent) {\r\n    if (this.selectedMenuOption === e.detail.mediatype) {\r\n      this.closeMediaSlider();\r\n      return;\r\n    }\r\n    this.selectedMenuOption = e.detail.mediatype;\r\n    this.openMediaSlider();\r\n  }\r\n\r\n  get signedOutOpened() {\r\n    return this.openMenu === 'login';\r\n  }\r\n\r\n  get userMenuOpened() {\r\n    return this.openMenu === 'user';\r\n  }\r\n\r\n  get userMenuTabIndex() {\r\n    return this.userMenuOpened ? '' : '-1';\r\n  }\r\n\r\n  get signedOutTabIndex() {\r\n    return this.signedOutOpened ? '' : '-1';\r\n  }\r\n\r\n  get closeLayerClass() {\r\n    return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';\r\n  }\r\n\r\n  get userMenu() {\r\n    return html`\r\n      <user-menu\r\n        .baseHost=${this.normalizedBaseHost}\r\n        .config=${this.config}\r\n        .menuItems=${this.userMenuItems}\r\n        ?open=${this.openMenu === 'user'}\r\n        .username=${this.username}\r\n        tabindex=\"${this.userMenuTabIndex}\"\r\n        @menuToggled=${this.menuToggled}\r\n        @trackClick=${this.trackClick}\r\n        @focusToOtherMenuItem=${(e: CustomEvent) =>\r\n          (this.currentTab = e.detail)}\r\n      ></user-menu>\r\n    `;\r\n  }\r\n\r\n  get signedOutDropdown() {\r\n    return html`\r\n      <signed-out-dropdown\r\n        .baseHost=${this.normalizedBaseHost}\r\n        .config=${this.config}\r\n        .open=${this.signedOutOpened}\r\n        tabindex=\"${this.signedOutTabIndex}\"\r\n        .menuItems=${this.signedOutMenuItems}\r\n        @focusToOtherMenuItem=${(e: CustomEvent) => {\r\n          this.currentTab = e.detail;\r\n        }}\r\n      ></signed-out-dropdown>\r\n    `;\r\n  }\r\n\r\n  get signedOutMenuItems() {\r\n    return this.menus.signedOut;\r\n  }\r\n\r\n  /**\r\n   * Most users just get the basic menu items.\r\n   * For users with `/items` priv, additional admin menu items are included too.\r\n   * Having the `/flags` priv adds a further admin item for managing flags.\r\n   */\r\n  get userMenuItems() {\r\n    const basicItems = this.menus.user;\r\n\r\n    let adminItems = this.menus.userAdmin;\r\n    if (this.canManageFlags) {\r\n      adminItems = adminItems.concat(this.menus.userAdminFlags);\r\n    }\r\n\r\n    return this.itemIdentifier && this.admin\r\n      ? [basicItems, adminItems]\r\n      : [basicItems];\r\n  }\r\n\r\n  get allowSecondaryIcon() {\r\n    return this.secondIdentitySlotMode === 'allow';\r\n  }\r\n\r\n  get searchSlot() {\r\n    return html`<slot name=\"search\" slot=\"search\"></slot>`;\r\n  }\r\n\r\n  get secondLogoSlot() {\r\n    return this.allowSecondaryIcon\r\n      ? html`\r\n          <slot name=\"opt-sec-logo\" slot=\"opt-sec-logo\"></slot>\r\n          <slot name=\"opt-sec-logo-mobile\" slot=\"opt-sec-logo-mobile\"></slot>\r\n        `\r\n      : nothing;\r\n  }\r\n\r\n  get separatorTemplate() {\r\n    return html`<li class=\"divider\" role=\"presentation\"></li>`;\r\n  }\r\n\r\n  render() {\r\n    return html`\r\n      <div class=\"topnav\">\r\n        <primary-nav\r\n          .baseHost=${this.normalizedBaseHost}\r\n          .mediaBaseHost=${this.mediaBaseHost}\r\n          .config=${this.config}\r\n          .openMenu=${this.openMenu}\r\n          .screenName=${this.screenName}\r\n          .secondIdentitySlotMode=${this.secondIdentitySlotMode}\r\n          .selectedMenuOption=${this.selectedMenuOption}\r\n          .username=${this.username}\r\n          .userProfileImagePath=${this.userProfileImagePath}\r\n          .currentTab=${this.currentTab}\r\n          ?hideSearch=${this.hideSearch}\r\n          @mediaTypeSelected=${this.mediaTypeSelected}\r\n          @trackClick=${this.trackClick}\r\n          @trackSubmit=${this.trackSubmit}\r\n          @menuToggled=${this.menuToggled}\r\n        >\r\n          ${this.secondLogoSlot} ${this.searchSlot}\r\n        </primary-nav>\r\n        <media-slider\r\n          .baseHost=${this.normalizedBaseHost}\r\n          .config=${this.config}\r\n          .selectedMenuOption=${this.selectedMenuOption}\r\n          .mediaSliderOpen=${this.mediaSliderOpen}\r\n          .menus=${this.menus}\r\n          tabindex=\"${this.mediaSliderOpen ? '1' : '-1'}\"\r\n          @focusToOtherMenuItem=${(e: CustomEvent) =>\r\n            (this.currentTab = e.detail)}\r\n        ></media-slider>\r\n      </div>\r\n      ${this.username ? this.userMenu : this.signedOutDropdown}\r\n      <desktop-subnav\r\n        .baseHost=${this.normalizedBaseHost}\r\n        .menuItems=${this.menus.more.links}\r\n        @focus=${this.closeMenus}\r\n      ></desktop-subnav>\r\n      <div\r\n        id=\"close-layer\"\r\n        class=\"${this.closeLayerClass}\"\r\n        @click=${this.closeMenus}\r\n      ></div>\r\n    `;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"ia-topnav.js","sourceRoot":"","sources":["../../src/ia-topnav.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, PropertyValues, html, nothing } from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\n\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\nimport './desktop-subnav';\nimport './dropdown-menu';\nimport './media-slider';\nimport {\n  IATopNavConfig,\n  IATopNavMenuConfig,\n  IATopNavSecondIdentitySlotMode,\n} from './models';\nimport './primary-nav';\nimport type { PrimaryNav } from './primary-nav';\nimport './signed-out-dropdown';\nimport iaTopNavCSS from './styles/ia-topnav';\nimport './user-menu';\n\n@customElement('ia-topnav')\nexport class IATopNav extends LitElement {\n  @property({ type: Boolean }) localLinks = false;\n\n  @property({ type: String }) waybackPagesArchived = '';\n\n  @property({ type: String }) baseHost = 'https://archive.org';\n\n  @property({ type: String }) mediaBaseHost = 'https://archive.org';\n\n  @property({ type: Boolean }) admin = false;\n\n  @property({ type: Boolean }) canManageFlags = false;\n\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n\n  @property({ type: Boolean }) hideSearch = false;\n\n  @property({ type: String }) itemIdentifier = '';\n\n  @property({ type: Boolean }) mediaSliderOpen = false;\n\n  @property({ type: String }) openMenu = '';\n\n  @property({ type: String }) screenName: string = '';\n\n  @property({ type: String }) selectedMenuOption = '';\n\n  @property({ type: String }) username: string = '';\n\n  @property({ type: String }) userProfileImagePath =\n    '/services/img/user/profile';\n\n  @property({ type: String })\n  secondIdentitySlotMode: IATopNavSecondIdentitySlotMode = '';\n\n  @property({ type: Object }) currentTab?: {\n    mediatype: string;\n    moveTo: string;\n  };\n\n  @query('primary-nav') private primaryNav?: PrimaryNav;\n  /** Only one of user-menu or signed-out-dropdown is rendered at a time. */\n  @query('user-menu, signed-out-dropdown')\n  private accountDropdown?: HTMLElement;\n\n  @state() private menus: IATopNavMenuConfig = buildTopNavMenus();\n\n  private boundHandleKeydown = this.handleDocumentKeydown.bind(this);\n\n  private boundHandleClick = this.handleDocumentClick.bind(this);\n\n  private get normalizedBaseHost() {\n    return !this.localLinks ? this.baseHost : '';\n  }\n\n  static get styles() {\n    return iaTopNavCSS;\n  }\n\n  updated(props: PropertyValues) {\n    if (\n      props.has('username') ||\n      props.has('waybackPagesArchived') ||\n      props.has('itemIdentifier') ||\n      props.has('localLinks') ||\n      props.has('baseHost')\n    ) {\n      this.menuSetup();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener('keydown', this.boundHandleKeydown);\n    document.addEventListener('click', this.boundHandleClick);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('keydown', this.boundHandleKeydown);\n    document.removeEventListener('click', this.boundHandleClick);\n  }\n\n  private handleDocumentKeydown(e: KeyboardEvent) {\n    if (e.key === 'Escape') {\n      this.openMenu = '';\n      this.mediaSliderOpen = false;\n    }\n  }\n\n  private handleDocumentClick(e: MouseEvent) {\n    if (!this.openMenu) return;\n    const path = e.composedPath();\n    if (!path.includes(this)) {\n      this.closeMenus();\n    }\n  }\n\n  menuSetup() {\n    // re/build the nav\n    this.menus = buildTopNavMenus(\n      this.username,\n      this.normalizedBaseHost,\n      this.waybackPagesArchived,\n      this.itemIdentifier,\n    );\n  }\n\n  menuToggled(e: CustomEvent) {\n    const currentMenu = this.openMenu;\n    this.openMenu = currentMenu === e.detail.menuName ? '' : e.detail.menuName;\n    // Keeps media slider open if media menu is open\n    if (this.openMenu === 'media') {\n      return;\n    }\n    this.closeMediaSlider();\n\n    if (this.openMenu === 'user' || this.openMenu === 'login') {\n      if (this.primaryNav && this.accountDropdown) {\n        const right = this.primaryNav.getAccountDropdownOffset();\n        this.accountDropdown.style.setProperty(\n          '--dropdownMenuRight',\n          `${right}px`,\n        );\n      }\n    }\n  }\n\n  openMediaSlider() {\n    this.mediaSliderOpen = true;\n  }\n\n  closeMediaSlider() {\n    this.mediaSliderOpen = false;\n    this.selectedMenuOption = '';\n  }\n\n  closeMenus() {\n    this.openMenu = '';\n    this.closeMediaSlider();\n  }\n\n  trackClick(e: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('analyticsClick', {\n        bubbles: true,\n        composed: true,\n        detail: e.detail,\n      }),\n    );\n  }\n\n  trackSubmit(e: CustomEvent) {\n    this.dispatchEvent(\n      new CustomEvent('analyticsSubmit', {\n        bubbles: true,\n        composed: true,\n        detail: e.detail,\n      }),\n    );\n  }\n\n  mediaTypeSelected(e: CustomEvent) {\n    if (this.selectedMenuOption === e.detail.mediatype) {\n      this.closeMediaSlider();\n      return;\n    }\n    this.selectedMenuOption = e.detail.mediatype;\n    this.openMediaSlider();\n  }\n\n  get signedOutOpened() {\n    return this.openMenu === 'login';\n  }\n\n  get userMenuOpened() {\n    return this.openMenu === 'user';\n  }\n\n  get userMenuTabIndex() {\n    return this.userMenuOpened ? '' : '-1';\n  }\n\n  get signedOutTabIndex() {\n    return this.signedOutOpened ? '' : '-1';\n  }\n\n  get closeLayerClass() {\n    return !!this.openMenu || this.mediaSliderOpen ? 'visible' : '';\n  }\n\n  get userMenu() {\n    return html`\n      <user-menu\n        .baseHost=${this.normalizedBaseHost}\n        .config=${this.config}\n        .menuItems=${this.userMenuItems}\n        ?open=${this.openMenu === 'user'}\n        .username=${this.username}\n        tabindex=\"${this.userMenuTabIndex}\"\n        @menuToggled=${this.menuToggled}\n        @trackClick=${this.trackClick}\n        @focusToOtherMenuItem=${(e: CustomEvent) =>\n          (this.currentTab = e.detail)}\n      ></user-menu>\n    `;\n  }\n\n  get signedOutDropdown() {\n    return html`\n      <signed-out-dropdown\n        .baseHost=${this.normalizedBaseHost}\n        .config=${this.config}\n        .open=${this.signedOutOpened}\n        tabindex=\"${this.signedOutTabIndex}\"\n        .menuItems=${this.signedOutMenuItems}\n        @focusToOtherMenuItem=${(e: CustomEvent) => {\n          this.currentTab = e.detail;\n        }}\n      ></signed-out-dropdown>\n    `;\n  }\n\n  get signedOutMenuItems() {\n    return this.menus.signedOut;\n  }\n\n  /**\n   * Most users just get the basic menu items.\n   * For users with `/items` priv, additional admin menu items are included too.\n   * Having the `/flags` priv adds a further admin item for managing flags.\n   */\n  get userMenuItems() {\n    const basicItems = this.menus.user;\n\n    let adminItems = this.menus.userAdmin;\n    if (this.canManageFlags) {\n      adminItems = adminItems.concat(this.menus.userAdminFlags);\n    }\n\n    return this.itemIdentifier && this.admin\n      ? [basicItems, adminItems]\n      : [basicItems];\n  }\n\n  get allowSecondaryIcon() {\n    return this.secondIdentitySlotMode === 'allow';\n  }\n\n  get searchSlot() {\n    return html`<slot name=\"search\" slot=\"search\"></slot>`;\n  }\n\n  get secondLogoSlot() {\n    return this.allowSecondaryIcon\n      ? html`\n          <slot name=\"opt-sec-logo\" slot=\"opt-sec-logo\"></slot>\n          <slot name=\"opt-sec-logo-mobile\" slot=\"opt-sec-logo-mobile\"></slot>\n        `\n      : nothing;\n  }\n\n  get separatorTemplate() {\n    return html`<li class=\"divider\" role=\"presentation\"></li>`;\n  }\n\n  render() {\n    return html`\n      <div class=\"topnav\">\n        <primary-nav\n          .baseHost=${this.normalizedBaseHost}\n          .mediaBaseHost=${this.mediaBaseHost}\n          .config=${this.config}\n          .openMenu=${this.openMenu}\n          .screenName=${this.screenName}\n          .secondIdentitySlotMode=${this.secondIdentitySlotMode}\n          .selectedMenuOption=${this.selectedMenuOption}\n          .username=${this.username}\n          .userProfileImagePath=${this.userProfileImagePath}\n          .currentTab=${this.currentTab}\n          ?hideSearch=${this.hideSearch}\n          @mediaTypeSelected=${this.mediaTypeSelected}\n          @trackClick=${this.trackClick}\n          @trackSubmit=${this.trackSubmit}\n          @menuToggled=${this.menuToggled}\n        >\n          ${this.secondLogoSlot} ${this.searchSlot}\n        </primary-nav>\n        <media-slider\n          .baseHost=${this.normalizedBaseHost}\n          .config=${this.config}\n          .selectedMenuOption=${this.selectedMenuOption}\n          .mediaSliderOpen=${this.mediaSliderOpen}\n          .menus=${this.menus}\n          tabindex=\"${this.mediaSliderOpen ? '1' : '-1'}\"\n          @focusToOtherMenuItem=${(e: CustomEvent) =>\n            (this.currentTab = e.detail)}\n        ></media-slider>\n      </div>\n      ${this.username ? this.userMenu : this.signedOutDropdown}\n      <desktop-subnav\n        .baseHost=${this.normalizedBaseHost}\n        .menuItems=${this.menus.more.links}\n        @focus=${this.closeMenus}\n      ></desktop-subnav>\n      <div\n        id=\"close-layer\"\n        class=\"${this.closeLayerClass}\"\n        @click=${this.closeMenus}\n      ></div>\n    `;\n  }\n}\n"]}

package/dist/src/login-button.js

@@ -54,23 +54,23 @@ let LoginButton = class LoginButton extends TrackedElement {
         }));
     }
     render() {
-        return html `
-      <div class="logged-out-toolbar">
-        <button
-          class="logged-out-menu ${this.avatarClass}"
-          @click=${this.toggleDropdown}
-          data-event-click-tracking="${this.analyticsEvent}"
-          aria-label="Toggle login menu"
-          aria-expanded="${makeBooleanString(this.menuOpened)}"
-        >
-          ${icons.user}
-        </button>
-        <span>
-          <a href="${this.signupPath}">Sign up</a>
-          |
-          <a href="${this.loginPath}">Log in</a>
-        </span>
-      </div>
+        return html `
+      <div class="logged-out-toolbar">
+        <button
+          class="logged-out-menu ${this.avatarClass}"
+          @click=${this.toggleDropdown}
+          data-event-click-tracking="${this.analyticsEvent}"
+          aria-label="Toggle login menu"
+          aria-expanded="${makeBooleanString(this.menuOpened)}"
+        >
+          ${icons.user}
+        </button>
+        <span>
+          <a href="${this.signupPath}">Sign up</a>
+          |
+          <a href="${this.loginPath}">Log in</a>
+        </span>
+      </div>
     `;
     }
 };

package/dist/src/login-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"login-button.js","sourceRoot":"","sources":["../../src/login-button.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\r\nimport TrackedElement from './tracked-element';\r\nimport icons from './assets/img/icons';\r\nimport loginButtonCSS from './styles/login-button';\r\nimport formatUrl from './lib/format-url';\r\nimport { makeBooleanString } from './lib/make-boolean-string';\r\nimport { customElement, property, query, state } from 'lit/decorators.js';\r\nimport { IATopNavConfig } from './models';\r\nimport { defaultTopNavConfig } from './data/menus';\r\n\r\n@customElement('login-button')\r\nexport class LoginButton extends TrackedElement {\r\n  @property({ type: String }) baseHost = '';\r\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\r\n  @property({ type: String }) openMenu = '';\r\n\r\n  @query('button.logged-out-menu') private toggleButton?: HTMLButtonElement;\r\n\r\n  @state() private dropdownTabIndex = '';\r\n\r\n  static get styles() {\r\n    return loginButtonCSS;\r\n  }\r\n\r\n  /** Distance (px) from this element's right edge to the right edge of the dropdown toggle icon. */\r\n  getDropdownToggleOffset(): number {\r\n    if (!this.toggleButton) return 0;\r\n    return (\r\n      this.getBoundingClientRect().right -\r\n      this.toggleButton.getBoundingClientRect().right\r\n    );\r\n  }\r\n\r\n  get signupPath() {\r\n    return formatUrl('/signup', this.baseHost);\r\n  }\r\n\r\n  get loginPath() {\r\n    return formatUrl('/login', this.baseHost);\r\n  }\r\n\r\n  get analyticsEvent() {\r\n    return `${this.config?.eventCategory}|NavLoginIcon`;\r\n  }\r\n\r\n  get menuOpened(): boolean {\r\n    return this.openMenu === 'login';\r\n  }\r\n\r\n  get avatarClass() {\r\n    return `dropdown-toggle${this.menuOpened ? ' active' : ''}`;\r\n  }\r\n\r\n  toggleDropdown(e: Event) {\r\n    e.preventDefault();\r\n    this.trackClick(e);\r\n    this.dropdownTabIndex = this.menuOpened ? '' : '-1';\r\n    this.dispatchEvent(\r\n      new CustomEvent('menuToggled', {\r\n        bubbles: true,\r\n        composed: true,\r\n        detail: {\r\n          menuName: 'login',\r\n        },\r\n      }),\r\n    );\r\n  }\r\n\r\n  render() {\r\n    return html`\r\n      <div class=\"logged-out-toolbar\">\r\n        <button\r\n          class=\"logged-out-menu ${this.avatarClass}\"\r\n          @click=${this.toggleDropdown}\r\n          data-event-click-tracking=\"${this.analyticsEvent}\"\r\n          aria-label=\"Toggle login menu\"\r\n          aria-expanded=\"${makeBooleanString(this.menuOpened)}\"\r\n        >\r\n          ${icons.user}\r\n        </button>\r\n        <span>\r\n          <a href=\"${this.signupPath}\">Sign up</a>\r\n          |\r\n          <a href=\"${this.loginPath}\">Log in</a>\r\n        </span>\r\n      </div>\r\n    `;\r\n  }\r\n}\r\n"]}
+{"version":3,"file":"login-button.js","sourceRoot":"","sources":["../../src/login-button.ts"],"names":[],"mappings":"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","sourcesContent":["import { html } from 'lit';\nimport TrackedElement from './tracked-element';\nimport icons from './assets/img/icons';\nimport loginButtonCSS from './styles/login-button';\nimport formatUrl from './lib/format-url';\nimport { makeBooleanString } from './lib/make-boolean-string';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { IATopNavConfig } from './models';\nimport { defaultTopNavConfig } from './data/menus';\n\n@customElement('login-button')\nexport class LoginButton extends TrackedElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: String }) openMenu = '';\n\n  @query('button.logged-out-menu') private toggleButton?: HTMLButtonElement;\n\n  @state() private dropdownTabIndex = '';\n\n  static get styles() {\n    return loginButtonCSS;\n  }\n\n  /** Distance (px) from this element's right edge to the right edge of the dropdown toggle icon. */\n  getDropdownToggleOffset(): number {\n    if (!this.toggleButton) return 0;\n    return (\n      this.getBoundingClientRect().right -\n      this.toggleButton.getBoundingClientRect().right\n    );\n  }\n\n  get signupPath() {\n    return formatUrl('/signup', this.baseHost);\n  }\n\n  get loginPath() {\n    return formatUrl('/login', this.baseHost);\n  }\n\n  get analyticsEvent() {\n    return `${this.config?.eventCategory}|NavLoginIcon`;\n  }\n\n  get menuOpened(): boolean {\n    return this.openMenu === 'login';\n  }\n\n  get avatarClass() {\n    return `dropdown-toggle${this.menuOpened ? ' active' : ''}`;\n  }\n\n  toggleDropdown(e: Event) {\n    e.preventDefault();\n    this.trackClick(e);\n    this.dropdownTabIndex = this.menuOpened ? '' : '-1';\n    this.dispatchEvent(\n      new CustomEvent('menuToggled', {\n        bubbles: true,\n        composed: true,\n        detail: {\n          menuName: 'login',\n        },\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <div class=\"logged-out-toolbar\">\n        <button\n          class=\"logged-out-menu ${this.avatarClass}\"\n          @click=${this.toggleDropdown}\n          data-event-click-tracking=\"${this.analyticsEvent}\"\n          aria-label=\"Toggle login menu\"\n          aria-expanded=\"${makeBooleanString(this.menuOpened)}\"\n        >\n          ${icons.user}\n        </button>\n        <span>\n          <a href=\"${this.signupPath}\">Sign up</a>\n          |\n          <a href=\"${this.loginPath}\">Log in</a>\n        </span>\n      </div>\n    `;\n  }\n}\n"]}

package/dist/src/models.d.ts

@@ -1,3 +1,12 @@
+/**
+ * The pixel width at which ia-topnav switches from mobile to desktop layout.
+ * Desktop styles apply at `min-width: TOPNAV_MOBILE_BREAKPOINT px`.
+ * Mobile styles apply at `max-width: (TOPNAV_MOBILE_BREAKPOINT - 1) px`.
+ *
+ * Exported so that host applications can derive their own media queries from
+ * this value rather than hard-coding it independently.
+ */
+export declare const TOPNAV_MOBILE_BREAKPOINT = 890;
 export interface IATopNavConfig {
     /**
      * Google Analytics event category

package/dist/src/models.js

@@ -1,2 +1,10 @@
-export {};
+/**
+ * The pixel width at which ia-topnav switches from mobile to desktop layout.
+ * Desktop styles apply at `min-width: TOPNAV_MOBILE_BREAKPOINT px`.
+ * Mobile styles apply at `max-width: (TOPNAV_MOBILE_BREAKPOINT - 1) px`.
+ *
+ * Exported so that host applications can derive their own media queries from
+ * this value rather than hard-coding it independently.
+ */
+export const TOPNAV_MOBILE_BREAKPOINT = 890;
 //# sourceMappingURL=models.js.map

package/dist/src/models.js.map

@@ -1 +1 @@
-{"version":3,"file":"models.js","sourceRoot":"","sources":["../../src/models.ts"],"names":[],"mappings":"","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   * 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\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\nexport interface IATopNavMenuConfig {\n  audio: IATopNavMediaMenu;\n  images: IATopNavMediaMenu;\n  more: IATopNavMediaMenu;\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"]}
+{"version":3,"file":"models.js","sourceRoot":"","sources":["../../src/models.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,wBAAwB,GAAG,GAAG,CAAC","sourcesContent":["/**\n * The pixel width at which ia-topnav switches from mobile to desktop layout.\n * Desktop styles apply at `min-width: TOPNAV_MOBILE_BREAKPOINT px`.\n * Mobile styles apply at `max-width: (TOPNAV_MOBILE_BREAKPOINT - 1) px`.\n *\n * Exported so that host applications can derive their own media queries from\n * this value rather than hard-coding it independently.\n */\nexport const TOPNAV_MOBILE_BREAKPOINT = 890;\n\nexport 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   * 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\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\nexport interface IATopNavMenuConfig {\n  audio: IATopNavMediaMenu;\n  images: IATopNavMediaMenu;\n  more: IATopNavMediaMenu;\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"]}