@internetarchive/elements 1.1.3-webdev-9241.0 → 1.1.3

package/dist/src/elements/ia-topnav/ia-topnav-media-menu.js

@@ -1,222 +0,0 @@
-import { __decorate } from "tslib";
-import { LitElement, css, html } from 'lit';
-import { property, queryAll } from 'lit/decorators.js';
-import { customElement } from '../../util/custom-element.js';
-import { defaultTopNavConfig } from './data/menus.js';
-import { formatUrl } from './lib/helpers.js';
-import './ia-topnav-media-button.js';
-import { TOPNAV_MOBILE_BREAKPOINT } from './models.js';
-import themeStyles from '../../themes/theme-styles.js';
-import { localized, msg } from '@lit/localize';
-/**
- * The top-level media buttons. A function so the labels are read in the
- * current locale each time the menu renders.
- */
-function menuSelection() {
-    return [
-        {
-            icon: 'web',
-            menu: 'web',
-            href: 'https://web.archive.org',
-            label: 'Wayback Machine',
-        },
-        {
-            icon: 'texts',
-            menu: 'texts',
-            href: '/details/texts',
-            label: msg('Texts'),
-        },
-        {
-            icon: 'video',
-            menu: 'video',
-            href: '/details/movies',
-            label: msg('Video'),
-        },
-        {
-            icon: 'audio',
-            menu: 'audio',
-            href: '/details/audio',
-            label: msg('Audio'),
-        },
-        {
-            icon: 'software',
-            menu: 'software',
-            href: '/details/software',
-            label: msg('Software'),
-        },
-        {
-            icon: 'images',
-            menu: 'images',
-            href: '/details/image',
-            label: msg('Images'),
-        },
-        {
-            icon: 'donate',
-            menu: 'donate',
-            href: '/donate/?origin=iawww-mbhmbgrmenu',
-            label: msg('Donate'),
-            followable: true,
-        },
-        {
-            icon: 'ellipses',
-            menu: 'more',
-            href: '/about/',
-            label: msg('More'),
-        },
-    ];
-}
-let MediaMenu = class MediaMenu extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.baseHost = '';
-        this.config = defaultTopNavConfig;
-        this.openMenu = '';
-        this.selectedMenuOption = '';
-    }
-    updated(props) {
-        if (props.has('currentTab')) {
-            const mediaButtons = Array.from(this.mediaButtons ?? []);
-            mediaButtons.map((button, index) => {
-                const linkItem = button.shadowRoot?.querySelector('a.menu-item');
-                if (linkItem) {
-                    if (linkItem.classList.contains(`${this.selectedMenuOption}`)) {
-                        linkItem.classList.remove('selected');
-                        linkItem.blur();
-                        const newFocusIndex = this.currentTab?.moveTo === 'next' ? index + 1 : index - 1;
-                        (mediaButtons[newFocusIndex]?.shadowRoot?.querySelector('a.menu-item')).focus();
-                    }
-                }
-            });
-        }
-    }
-    render() {
-        return html `
-      <div class="media-menu-container ${this.menuClass}">
-        <div class="overflow-clip">
-          <nav class="media-menu-inner" aria-expanded="${this.menuOpened}">
-            <div class="menu-group">${this.mediaMenuOptionsTemplate}</div>
-          </nav>
-        </div>
-      </div>
-    `;
-    }
-    get mediaMenuOptionsTemplate() {
-        const buttons = menuSelection().map(({ icon, menu, label, href, followable }) => {
-            const selected = this.selectedMenuOption === menu;
-            return html `
-          <ia-topnav-media-button
-            .config=${this.config}
-            .icon=${icon}
-            .href=${formatUrl(href, this.baseHost)}
-            ?followable=${followable}
-            .label=${label}
-            .mediatype=${menu}
-            .openMenu=${this.openMenu}
-            .selected=${selected}
-            .selectedMenuOption=${this.selectedMenuOption}
-            data-mediatype="${menu}"
-          ></ia-topnav-media-button>
-        `;
-        });
-        return buttons;
-    }
-    get menuOpened() {
-        return this.openMenu === 'media';
-    }
-    get menuClass() {
-        return this.menuOpened ? 'open' : 'closed';
-    }
-    static get styles() {
-        return [
-            themeStyles,
-            css `
-        :host {
-          outline: none;
-        }
-
-        .media-menu-inner {
-          z-index: -1;
-          top: -40rem;
-          background-color: var(--mediaMenuBg);
-          margin: 0;
-          overflow: hidden;
-          transition-duration: 0.2s;
-          transition-property: top;
-          transition-timing-function: ease;
-        }
-
-        .menu-group {
-          position: relative;
-          line-height: normal;
-        }
-
-        /* Mobile view styles */
-        @media (max-width: ${TOPNAV_MOBILE_BREAKPOINT - 1}px) {
-          .media-menu-inner {
-            position: absolute;
-            width: 100%;
-          }
-
-          .open .media-menu-inner {
-            top: 0;
-          }
-
-          .overflow-clip {
-            position: absolute;
-            z-index: -1; /** needs to be under the navigation, otherwise it intercepts clicks */
-            top: 4rem;
-            left: 0;
-            height: 0;
-            width: 100%;
-            overflow: hidden;
-            transition-duration: 0.2s;
-            transition-property: height;
-          }
-
-          .open .overflow-clip {
-            height: 40rem;
-          }
-        }
-
-        /* Desktop view styles */
-        @media (min-width: ${TOPNAV_MOBILE_BREAKPOINT}px) {
-          .media-menu-inner {
-            display: block;
-            position: static;
-            width: auto;
-            height: 5rem;
-            transition-property: none;
-          }
-
-          .menu-group {
-            font-size: 0;
-          }
-        }
-      `,
-        ];
-    }
-};
-__decorate([
-    property({ type: String })
-], MediaMenu.prototype, "baseHost", void 0);
-__decorate([
-    property({ type: Object })
-], MediaMenu.prototype, "config", void 0);
-__decorate([
-    property({ type: String })
-], MediaMenu.prototype, "openMenu", void 0);
-__decorate([
-    property({ type: String })
-], MediaMenu.prototype, "selectedMenuOption", void 0);
-__decorate([
-    property({ type: Object })
-], MediaMenu.prototype, "currentTab", void 0);
-__decorate([
-    queryAll('ia-topnav-media-button')
-], MediaMenu.prototype, "mediaButtons", void 0);
-MediaMenu = __decorate([
-    customElement('ia-topnav-media-menu'),
-    localized()
-], MediaMenu);
-export { MediaMenu };
-//# sourceMappingURL=ia-topnav-media-menu.js.map

package/dist/src/elements/ia-topnav/ia-topnav-media-menu.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ia-topnav-media-menu.js","sourceRoot":"","sources":["../../../../src/elements/ia-topnav/ia-topnav-media-menu.ts"],"names":[],"mappings":";AAAA,OAAO,EAAkB,UAAU,EAAkB,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC5E,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,0BAA0B,CAAC;AAElC,OAAO,EAAkB,wBAAwB,EAAE,MAAM,UAAU,CAAC;AACpE,OAAO,WAAW,MAAM,0BAA0B,CAAC;AACnD,OAAO,EAAE,SAAS,EAAE,GAAG,EAAE,MAAM,eAAe,CAAC;AAU/C;;;GAGG;AACH,SAAS,aAAa;IACpB,OAAO;QACL;YACE,IAAI,EAAE,KAAK;YACX,IAAI,EAAE,KAAK;YACX,IAAI,EAAE,yBAAyB;YAC/B,KAAK,EAAE,iBAAiB;SACzB;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,iBAAiB;YACvB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;SACpB;QACD;YACE,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,OAAO;YACb,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC;SACpB;QACD;YACE,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,mBAAmB;YACzB,KAAK,EAAE,GAAG,CAAC,UAAU,CAAC;SACvB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,gBAAgB;YACtB,KAAK,EAAE,GAAG,CAAC,QAAQ,CAAC;SACrB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,QAAQ;YACd,IAAI,EAAE,mCAAmC;YACzC,KAAK,EAAE,GAAG,CAAC,QAAQ,CAAC;YACpB,UAAU,EAAE,IAAI;SACjB;QACD;YACE,IAAI,EAAE,UAAU;YAChB,IAAI,EAAE,MAAM;YACZ,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,GAAG,CAAC,MAAM,CAAC;SACnB;KACF,CAAC;AACJ,CAAC;AAIM,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQ,UAAU;IAAlC;;QACuB,aAAQ,GAAG,EAAE,CAAC;QACd,WAAM,GAAmB,mBAAmB,CAAC;QAC7C,aAAQ,GAAG,EAAE,CAAC;QACd,uBAAkB,GAAG,EAAE,CAAC;IA6ItD,CAAC;IAxIC,OAAO,CAAC,KAAqB;QAC3B,IAAI,KAAK,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE,CAAC;YAC5B,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC;YAEzD,YAAY,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE;gBACjC,MAAM,QAAQ,GAAG,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,aAAa,CAAC,CAAC;gBACjE,IAAI,QAAQ,EAAE,CAAC;oBACb,IAAI,QAAQ,CAAC,SAAS,CAAC,QAAQ,CAAC,GAAG,IAAI,CAAC,kBAAkB,EAAE,CAAC,EAAE,CAAC;wBAC9D,QAAQ,CAAC,SAAS,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC;wBACrC,QAAwB,CAAC,IAAI,EAAE,CAAC;wBAEjC,MAAM,aAAa,GACjB,IAAI,CAAC,UAAU,EAAE,MAAM,KAAK,MAAM,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC;wBAC7D,CACE,YAAY,CAAC,aAAa,CAAC,EAAE,UAAU,EAAE,aAAa,CACpD,aAAa,CAEhB,CAAA,CAAC,KAAK,EAAE,CAAC;oBACZ,CAAC;gBACH,CAAC;YACH,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAA;yCAC0B,IAAI,CAAC,SAAS;;yDAEE,IAAI,CAAC,UAAU;sCAClC,IAAI,CAAC,wBAAwB;;;;KAI9D,CAAC;IACJ,CAAC;IAED,IAAI,wBAAwB;QAC1B,MAAM,OAAO,GAAG,aAAa,EAAE,CAAC,GAAG,CACjC,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,EAAE;YAC1C,MAAM,QAAQ,GAAG,IAAI,CAAC,kBAAkB,KAAK,IAAI,CAAC;YAClD,OAAO,IAAI,CAAA;;sBAEG,IAAI,CAAC,MAAM;oBACb,IAAI;oBACJ,SAAS,CAAC,IAAyB,EAAE,IAAI,CAAC,QAAQ,CAAC;0BAC7C,UAAU;qBACf,KAAK;yBACD,IAAI;wBACL,IAAI,CAAC,QAAQ;wBACb,QAAQ;kCACE,IAAI,CAAC,kBAAkB;8BAC3B,IAAI;;SAEzB,CAAC;QACJ,CAAC,CACF,CAAC;QACF,OAAO,OAAO,CAAC;IACjB,CAAC;IAED,IAAI,UAAU;QACZ,OAAO,IAAI,CAAC,QAAQ,KAAK,OAAO,CAAC;IACnC,CAAC;IAED,IAAI,SAAS;QACX,OAAO,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,QAAQ,CAAC;IAC7C,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,WAAW;YACX,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;6BAsBoB,wBAAwB,GAAG,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;6BA4B5B,wBAAwB;;;;;;;;;;;;;OAa9C;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAhJ6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yCAA8C;AAC7C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;2CAAe;AACd;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;qDAAyB;AACxB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAA4C;AAEnC;IAAnC,QAAQ,CAAC,wBAAwB,CAAC;+CAA8B;AAPtD,SAAS;IAFrB,aAAa,CAAC,sBAAsB,CAAC;IACrC,SAAS,EAAE;GACC,SAAS,CAiJrB","sourcesContent":["import { CSSResultGroup, LitElement, PropertyValues, css, html } from 'lit';\nimport { property, queryAll } from 'lit/decorators.js';\nimport { customElement } from '@src/util/custom-element';\n\nimport { defaultTopNavConfig } from './data/menus';\nimport { formatUrl } from './lib/helpers';\nimport './ia-topnav-media-button';\nimport { MediaButton } from './ia-topnav-media-button';\nimport { IATopNavConfig, TOPNAV_MOBILE_BREAKPOINT } from './models';\nimport themeStyles from '@src/themes/theme-styles';\nimport { localized, msg } from '@lit/localize';\n\ntype MediaMenuOption = {\n  icon: string;\n  menu: string;\n  href: string;\n  label: string;\n  followable?: boolean;\n};\n\n/**\n * The top-level media buttons. A function so the labels are read in the\n * current locale each time the menu renders.\n */\nfunction menuSelection(): MediaMenuOption[] {\n  return [\n    {\n      icon: 'web',\n      menu: 'web',\n      href: 'https://web.archive.org',\n      label: 'Wayback Machine',\n    },\n    {\n      icon: 'texts',\n      menu: 'texts',\n      href: '/details/texts',\n      label: msg('Texts'),\n    },\n    {\n      icon: 'video',\n      menu: 'video',\n      href: '/details/movies',\n      label: msg('Video'),\n    },\n    {\n      icon: 'audio',\n      menu: 'audio',\n      href: '/details/audio',\n      label: msg('Audio'),\n    },\n    {\n      icon: 'software',\n      menu: 'software',\n      href: '/details/software',\n      label: msg('Software'),\n    },\n    {\n      icon: 'images',\n      menu: 'images',\n      href: '/details/image',\n      label: msg('Images'),\n    },\n    {\n      icon: 'donate',\n      menu: 'donate',\n      href: '/donate/?origin=iawww-mbhmbgrmenu',\n      label: msg('Donate'),\n      followable: true,\n    },\n    {\n      icon: 'ellipses',\n      menu: 'more',\n      href: '/about/',\n      label: msg('More'),\n    },\n  ];\n}\n\n@customElement('ia-topnav-media-menu')\n@localized()\nexport class MediaMenu extends LitElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: String }) openMenu = '';\n  @property({ type: String }) selectedMenuOption = '';\n  @property({ type: Object }) currentTab: { moveTo: string } | undefined;\n\n  @queryAll('ia-topnav-media-button') mediaButtons?: MediaButton[];\n\n  updated(props: PropertyValues) {\n    if (props.has('currentTab')) {\n      const mediaButtons = Array.from(this.mediaButtons ?? []);\n\n      mediaButtons.map((button, index) => {\n        const linkItem = button.shadowRoot?.querySelector('a.menu-item');\n        if (linkItem) {\n          if (linkItem.classList.contains(`${this.selectedMenuOption}`)) {\n            linkItem.classList.remove('selected');\n            (linkItem as HTMLElement).blur();\n\n            const newFocusIndex =\n              this.currentTab?.moveTo === 'next' ? index + 1 : index - 1;\n            (\n              mediaButtons[newFocusIndex]?.shadowRoot?.querySelector(\n                'a.menu-item',\n              ) as HTMLElement\n            ).focus();\n          }\n        }\n      });\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"media-menu-container ${this.menuClass}\">\n        <div class=\"overflow-clip\">\n          <nav class=\"media-menu-inner\" aria-expanded=\"${this.menuOpened}\">\n            <div class=\"menu-group\">${this.mediaMenuOptionsTemplate}</div>\n          </nav>\n        </div>\n      </div>\n    `;\n  }\n\n  get mediaMenuOptionsTemplate() {\n    const buttons = menuSelection().map(\n      ({ icon, menu, label, href, followable }) => {\n        const selected = this.selectedMenuOption === menu;\n        return html`\n          <ia-topnav-media-button\n            .config=${this.config}\n            .icon=${icon}\n            .href=${formatUrl(href as string & Location, this.baseHost)}\n            ?followable=${followable}\n            .label=${label}\n            .mediatype=${menu}\n            .openMenu=${this.openMenu}\n            .selected=${selected}\n            .selectedMenuOption=${this.selectedMenuOption}\n            data-mediatype=\"${menu}\"\n          ></ia-topnav-media-button>\n        `;\n      },\n    );\n    return buttons;\n  }\n\n  get menuOpened() {\n    return this.openMenu === 'media';\n  }\n\n  get menuClass() {\n    return this.menuOpened ? 'open' : 'closed';\n  }\n\n  static get styles(): CSSResultGroup {\n    return [\n      themeStyles,\n      css`\n        :host {\n          outline: none;\n        }\n\n        .media-menu-inner {\n          z-index: -1;\n          top: -40rem;\n          background-color: var(--mediaMenuBg);\n          margin: 0;\n          overflow: hidden;\n          transition-duration: 0.2s;\n          transition-property: top;\n          transition-timing-function: ease;\n        }\n\n        .menu-group {\n          position: relative;\n          line-height: normal;\n        }\n\n        /* Mobile view styles */\n        @media (max-width: ${TOPNAV_MOBILE_BREAKPOINT - 1}px) {\n          .media-menu-inner {\n            position: absolute;\n            width: 100%;\n          }\n\n          .open .media-menu-inner {\n            top: 0;\n          }\n\n          .overflow-clip {\n            position: absolute;\n            z-index: -1; /** needs to be under the navigation, otherwise it intercepts clicks */\n            top: 4rem;\n            left: 0;\n            height: 0;\n            width: 100%;\n            overflow: hidden;\n            transition-duration: 0.2s;\n            transition-property: height;\n          }\n\n          .open .overflow-clip {\n            height: 40rem;\n          }\n        }\n\n        /* Desktop view styles */\n        @media (min-width: ${TOPNAV_MOBILE_BREAKPOINT}px) {\n          .media-menu-inner {\n            display: block;\n            position: static;\n            width: auto;\n            height: 5rem;\n            transition-property: none;\n          }\n\n          .menu-group {\n            font-size: 0;\n          }\n        }\n      `,\n    ];\n  }\n}\n"]}

package/dist/src/elements/ia-topnav/ia-topnav-media-slider.d.ts

@@ -1,16 +0,0 @@
-import { CSSResultGroup, LitElement, PropertyValues } from 'lit';
-import './ia-topnav-media-subnav.js';
-import { IATopNavConfig, IATopNavMenuConfig } from './models.js';
-export declare class MediaSlider extends LitElement {
-    baseHost: string;
-    config: IATopNavConfig;
-    mediaSliderOpen: boolean;
-    menus: IATopNavMenuConfig;
-    selectedMenuOption: string;
-    private previousKeydownListener;
-    shouldUpdate(): boolean;
-    updated(props: PropertyValues): void;
-    render(): import("lit").TemplateResult<1>;
-    static get styles(): CSSResultGroup;
-}
-//# sourceMappingURL=ia-topnav-media-slider.d.ts.map

package/dist/src/elements/ia-topnav/ia-topnav-media-slider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ia-topnav-media-slider.d.ts","sourceRoot":"","sources":["../../../../src/elements/ia-topnav/ia-topnav-media-slider.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAC5E,OAAO,0BAA0B,CAAC;AAIlC,OAAO,EACL,cAAc,EACd,kBAAkB,EAEnB,MAAM,UAAU,CAAC;AAIlB,qBACa,WAAY,SAAQ,UAAU;IACb,QAAQ,SAAM;IACd,MAAM,EAAE,cAAc,CAAuB;IAC5C,eAAe,UAAS;IACzB,KAAK,EAAE,kBAAkB,CAAsB;IAC/C,kBAAkB,SAAW;IAEzD,OAAO,CAAC,uBAAuB,CAC6B;IAE5D,YAAY;IAWZ,OAAO,CAAC,KAAK,EAAE,cAAc;IAmB7B,MAAM;IA8EN,MAAM,KAAK,MAAM,IAAI,cAAc,CAmFlC;CACF"}

package/dist/src/elements/ia-topnav/ia-topnav-media-slider.js

@@ -1,221 +0,0 @@
-import { __decorate } from "tslib";
-import { LitElement, css, html } from 'lit';
-import './ia-topnav-media-subnav.js';
-import KeyboardNavigation from './lib/keyboard-navigation.js';
-import { property } from 'lit/decorators.js';
-import { customElement } from '../../util/custom-element.js';
-import { TOPNAV_MOBILE_BREAKPOINT, } from './models.js';
-import { buildTopNavMenus, defaultTopNavConfig } from './data/menus.js';
-import themeStyles from '../../themes/theme-styles.js';
-let MediaSlider = class MediaSlider extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.baseHost = '';
-        this.config = defaultTopNavConfig;
-        this.mediaSliderOpen = false;
-        this.menus = buildTopNavMenus();
-        this.selectedMenuOption = 'texts';
-    }
-    shouldUpdate() {
-        const scrollPane = this.shadowRoot
-            ? this.shadowRoot.querySelector('.information-menu')
-            : null;
-        if (scrollPane) {
-            scrollPane.scrollTop = 0;
-        }
-        return true;
-    }
-    updated(props) {
-        if (props.has('selectedMenuOption') && this.selectedMenuOption) {
-            const container = this.shadowRoot?.querySelector('.has-focused')?.shadowRoot;
-            if (container) {
-                const keyboardNavigation = new KeyboardNavigation(container, this.selectedMenuOption);
-                if (this.previousKeydownListener) {
-                    this.removeEventListener('keydown', this.previousKeydownListener);
-                }
-                this.addEventListener('keydown', keyboardNavigation.handleKeyDown);
-                this.previousKeydownListener = keyboardNavigation.handleKeyDown;
-            }
-        }
-    }
-    render() {
-        const sliderDetailsClass = this.mediaSliderOpen ? 'open' : 'closed';
-        return html `
-      <div class="media-slider-container">
-        <div class="overflow-clip ${sliderDetailsClass}">
-          <div class="information-menu ${sliderDetailsClass}">
-            <div class="info-box">
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'audio'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="audio"
-                .menuItems=${this.menus.audio}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'images'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="images"
-                .menuItems=${this.menus.images}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'software'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="software"
-                .menuItems=${this.menus.software}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'texts'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="texts"
-                .menuItems=${this.menus.texts}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'video'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="video"
-                .menuItems=${this.menus.video}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'web'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="web"
-                .menuItems=${this.menus.web}
-              ></ia-topnav-media-subnav>
-              <ia-topnav-media-subnav
-                .baseHost=${this.baseHost}
-                .config=${this.config}
-                class="${this.selectedMenuOption === 'more'
-            ? 'has-focused'
-            : 'hidden'}"
-                menu="more"
-                .menuItems=${this.menus.more}
-              ></ia-topnav-media-subnav>
-            </div>
-          </div>
-        </div>
-      </div>
-    `;
-    }
-    static get styles() {
-        return [
-            themeStyles,
-            css `
-        .media-slider-container {
-          position: relative;
-        }
-
-        .overflow-clip {
-          display: none;
-          position: absolute;
-          top: 0;
-          right: 0;
-          left: 0;
-          height: 0;
-          overflow: hidden;
-          transition: height 0.2s ease;
-        }
-
-        .information-menu {
-          position: absolute;
-          top: 0;
-          right: 0;
-          left: 0;
-          padding: 0;
-          height: 31.9rem;
-          overflow-x: hidden;
-          font-size: 1.4rem;
-          background: var(--mediaSliderBg);
-        }
-
-        .open {
-          display: block;
-        }
-
-        .hidden {
-          display: none;
-        }
-
-        .info-box {
-          padding: 1rem;
-        }
-
-        @media (max-width: ${TOPNAV_MOBILE_BREAKPOINT - 1}px) {
-          .overflow-clip.open {
-            display: block;
-            height: 35.8rem;
-            left: 4rem;
-            top: 0;
-          }
-        }
-
-        @media (min-width: ${TOPNAV_MOBILE_BREAKPOINT}px) {
-          .overflow-clip {
-            display: block;
-          }
-
-          .information-menu {
-            left: 0;
-            z-index: 3;
-            height: auto;
-            min-height: 21rem;
-            background: var(--mediaSliderDesktopBg);
-            transform: translate(0, -100%);
-            transition: transform 0.2s ease;
-          }
-
-          .overflow-clip.open {
-            height: 22rem;
-          }
-
-          .information-menu.open {
-            transform: translate(0, 0);
-          }
-
-          .info-box {
-            max-width: 100rem;
-            padding: 1.5rem 0;
-            margin: 0 auto;
-          }
-        }
-      `,
-        ];
-    }
-};
-__decorate([
-    property({ type: String })
-], MediaSlider.prototype, "baseHost", void 0);
-__decorate([
-    property({ type: Object })
-], MediaSlider.prototype, "config", void 0);
-__decorate([
-    property({ type: Boolean })
-], MediaSlider.prototype, "mediaSliderOpen", void 0);
-__decorate([
-    property({ type: Object })
-], MediaSlider.prototype, "menus", void 0);
-__decorate([
-    property({ type: String })
-], MediaSlider.prototype, "selectedMenuOption", void 0);
-MediaSlider = __decorate([
-    customElement('ia-topnav-media-slider')
-], MediaSlider);
-export { MediaSlider };
-//# sourceMappingURL=ia-topnav-media-slider.js.map

package/dist/src/elements/ia-topnav/ia-topnav-media-slider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ia-topnav-media-slider.js","sourceRoot":"","sources":["../../../../src/elements/ia-topnav/ia-topnav-media-slider.ts"],"names":[],"mappings":"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","sourcesContent":["import { CSSResultGroup, LitElement, PropertyValues, css, html } from 'lit';\nimport './ia-topnav-media-subnav';\nimport KeyboardNavigation from './lib/keyboard-navigation';\nimport { property } from 'lit/decorators.js';\nimport { customElement } from '@src/util/custom-element';\nimport {\n  IATopNavConfig,\n  IATopNavMenuConfig,\n  TOPNAV_MOBILE_BREAKPOINT,\n} from './models';\nimport { buildTopNavMenus, defaultTopNavConfig } from './data/menus';\nimport themeStyles from '@src/themes/theme-styles';\n\n@customElement('ia-topnav-media-slider')\nexport class MediaSlider extends LitElement {\n  @property({ type: String }) baseHost = '';\n  @property({ type: Object }) config: IATopNavConfig = defaultTopNavConfig;\n  @property({ type: Boolean }) mediaSliderOpen = false;\n  @property({ type: Object }) menus: IATopNavMenuConfig = buildTopNavMenus();\n  @property({ type: String }) selectedMenuOption = 'texts';\n\n  private previousKeydownListener: // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  ((this: HTMLElement, ev: KeyboardEvent) => any) | undefined;\n\n  shouldUpdate() {\n    const scrollPane = this.shadowRoot\n      ? this.shadowRoot.querySelector('.information-menu')\n      : null;\n\n    if (scrollPane) {\n      scrollPane.scrollTop = 0;\n    }\n    return true;\n  }\n\n  updated(props: PropertyValues) {\n    if (props.has('selectedMenuOption') && this.selectedMenuOption) {\n      const container =\n        this.shadowRoot?.querySelector('.has-focused')?.shadowRoot;\n      if (container) {\n        const keyboardNavigation = new KeyboardNavigation(\n          container as unknown as HTMLElement,\n          this.selectedMenuOption,\n        );\n\n        if (this.previousKeydownListener) {\n          this.removeEventListener('keydown', this.previousKeydownListener);\n        }\n        this.addEventListener('keydown', keyboardNavigation.handleKeyDown);\n        this.previousKeydownListener = keyboardNavigation.handleKeyDown;\n      }\n    }\n  }\n\n  render() {\n    const sliderDetailsClass = this.mediaSliderOpen ? 'open' : 'closed';\n\n    return html`\n      <div class=\"media-slider-container\">\n        <div class=\"overflow-clip ${sliderDetailsClass}\">\n          <div class=\"information-menu ${sliderDetailsClass}\">\n            <div class=\"info-box\">\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'audio'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"audio\"\n                .menuItems=${this.menus.audio}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'images'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"images\"\n                .menuItems=${this.menus.images}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'software'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"software\"\n                .menuItems=${this.menus.software}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'texts'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"texts\"\n                .menuItems=${this.menus.texts}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'video'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"video\"\n                .menuItems=${this.menus.video}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'web'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"web\"\n                .menuItems=${this.menus.web}\n              ></ia-topnav-media-subnav>\n              <ia-topnav-media-subnav\n                .baseHost=${this.baseHost}\n                .config=${this.config}\n                class=\"${this.selectedMenuOption === 'more'\n                  ? 'has-focused'\n                  : 'hidden'}\"\n                menu=\"more\"\n                .menuItems=${this.menus.more}\n              ></ia-topnav-media-subnav>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    return [\n      themeStyles,\n      css`\n        .media-slider-container {\n          position: relative;\n        }\n\n        .overflow-clip {\n          display: none;\n          position: absolute;\n          top: 0;\n          right: 0;\n          left: 0;\n          height: 0;\n          overflow: hidden;\n          transition: height 0.2s ease;\n        }\n\n        .information-menu {\n          position: absolute;\n          top: 0;\n          right: 0;\n          left: 0;\n          padding: 0;\n          height: 31.9rem;\n          overflow-x: hidden;\n          font-size: 1.4rem;\n          background: var(--mediaSliderBg);\n        }\n\n        .open {\n          display: block;\n        }\n\n        .hidden {\n          display: none;\n        }\n\n        .info-box {\n          padding: 1rem;\n        }\n\n        @media (max-width: ${TOPNAV_MOBILE_BREAKPOINT - 1}px) {\n          .overflow-clip.open {\n            display: block;\n            height: 35.8rem;\n            left: 4rem;\n            top: 0;\n          }\n        }\n\n        @media (min-width: ${TOPNAV_MOBILE_BREAKPOINT}px) {\n          .overflow-clip {\n            display: block;\n          }\n\n          .information-menu {\n            left: 0;\n            z-index: 3;\n            height: auto;\n            min-height: 21rem;\n            background: var(--mediaSliderDesktopBg);\n            transform: translate(0, -100%);\n            transition: transform 0.2s ease;\n          }\n\n          .overflow-clip.open {\n            height: 22rem;\n          }\n\n          .information-menu.open {\n            transform: translate(0, 0);\n          }\n\n          .info-box {\n            max-width: 100rem;\n            padding: 1.5rem 0;\n            margin: 0 auto;\n          }\n        }\n      `,\n    ];\n  }\n}\n"]}

package/dist/src/elements/ia-topnav/ia-topnav-media-subnav.d.ts

@@ -1,20 +0,0 @@
-import { CSSResultGroup } from 'lit';
-import TrackedElement from './tracked-element.js';
-import './ia-topnav-wayback-slider.js';
-import './ia-topnav-more-slider.js';
-import { IATopNavConfig, IATopNavLink, IATopNavMediaMenu } from './models.js';
-export declare class MediaSubnav extends TrackedElement {
-    baseHost: string;
-    config: IATopNavConfig;
-    menu: '' | 'web' | 'more' | 'audio' | 'images' | 'software' | 'texts' | 'video';
-    menuItems: IATopNavMediaMenu;
-    private links;
-    shouldUpdate(): boolean;
-    render(): import("lit").TemplateResult<1>;
-    static get defaultLinks(): IATopNavMediaMenu;
-    analyticsEvent(title: string): string;
-    get iconLinks(): import("lit").TemplateResult<1>[];
-    renderLinks(links: IATopNavLink[]): import("lit").TemplateResult<1>[];
-    static get styles(): CSSResultGroup;
-}
-//# sourceMappingURL=ia-topnav-media-subnav.d.ts.map

package/dist/src/elements/ia-topnav/ia-topnav-media-subnav.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"ia-topnav-media-subnav.d.ts","sourceRoot":"","sources":["../../../../src/elements/ia-topnav/ia-topnav-media-subnav.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAa,MAAM,KAAK,CAAC;AAGhD,OAAO,cAAc,MAAM,mBAAmB,CAAC;AAC/C,OAAO,4BAA4B,CAAC;AACpC,OAAO,yBAAyB,CAAC;AAIjC,OAAO,EACL,cAAc,EACd,YAAY,EACZ,iBAAiB,EAElB,MAAM,UAAU,CAAC;AAMlB,qBAEa,WAAY,SAAQ,cAAc;IACjB,QAAQ,SAAM;IACd,MAAM,EAAE,cAAc,CAAuB;IAC7C,IAAI,EAC5B,EAAE,GACF,KAAK,GACL,MAAM,GACN,OAAO,GACP,QAAQ,GACR,UAAU,GACV,OAAO,GACP,OAAO,CAAM;IACW,SAAS,EAAE,iBAAiB,CAC7B;IAE3B,OAAO,CAAC,KAAK,CAA+C;IAE5D,YAAY;IAOZ,MAAM;IA8CN,MAAM,KAAK,YAAY,IAAI,iBAAiB,CAU3C;IAED,cAAc,CAAC,KAAK,EAAE,MAAM;IAI5B,IAAI,SAAS,sCAWZ;IAED,WAAW,CAAC,KAAK,EAAE,YAAY,EAAE;IAejC,MAAM,KAAK,MAAM,IAAI,cAAc,CA8JlC;CACF"}