@internetarchive/ia-topnav 1.4.1 → 2.0.0

package/test/primary-nav.test.ts

@@ -1,94 +1,135 @@
-import {
-  html,
-  fixture,
-  expect,
-  fixtureCleanup,
-  elementUpdated,
-} from '@open-wc/testing';
-
-import '../src/primary-nav';
-import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from '../src/models';
-import { PrimaryNav } from '../src/primary-nav';
-
-const component = ({
-  baseHost = 'archive.org',
-  username = '',
-  screenName = '',
-  hideSearch = false,
-  config = {},
-  secondIdentitySlotMode = 'allow',
-}: {
-  baseHost?: string;
-  username?: string;
-  screenName?: string;
-  hideSearch?: boolean;
-  config?: IATopNavConfig;
-  secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;
-}) =>
-  html` <primary-nav
-    .baseHost=${baseHost}
-    .username=${username}
-    .screenName=${screenName}
-    ?hideSearch=${hideSearch}
-    .config=${config}
-    .secondIdentitySlotMode=${secondIdentitySlotMode}
-  ></primary-nav>`;
-
-afterEach(() => {
-  fixtureCleanup();
-});
-
-describe('<primary-nav>', () => {
-  it('renders the login link when no username present', async () => {
-    const el = await fixture<PrimaryNav>(
-      component({
-        baseHost: 'archive.org',
-        username: '',
-      }),
-    );
-
-    expect(el.shadowRoot?.querySelector('login-button')).to.not.be.undefined;
-  });
-
-  it('does not render search menu toggle and search form if hideSearch true', async () => {
-    const el = await fixture<PrimaryNav>(
-      component({
-        baseHost: 'archive.org',
-        username: 'shaneriley',
-        screenName: 'shaneriley',
-        hideSearch: true,
-      }),
-    );
-
-    expect(el.shadowRoot?.querySelector('.search-trigger')).to.equal(null);
-    expect(el.shadowRoot?.querySelector('nav-search')).to.equal(null);
-  });
-
-  it('opens a slot with `secondIdentitySlotMode`', async () => {
-    const el = await fixture<PrimaryNav>(
-      component({
-        baseHost: 'archive.org',
-        username: 'boop',
-        screenName: 'somesuperlongscreenname',
-        secondIdentitySlotMode: 'allow',
-      }),
-    );
-
-    const brandingBlock = el.shadowRoot?.querySelector('div.branding');
-    expect(brandingBlock?.getAttribute('class')).to.contain(
-      'branding second-logo',
-    );
-
-    const slot = brandingBlock?.querySelector('slot');
-    expect(slot).to.exist;
-    expect(slot?.getAttribute('name')).to.equal('opt-sec-logo');
-
-    el.secondIdentitySlotMode = '';
-    await elementUpdated(el);
-    const noSlotBrandingBlock = el.shadowRoot?.querySelector('div.branding');
-    expect(noSlotBrandingBlock?.getAttribute('class')).to.contain('branding');
-
-    const noSlot = noSlotBrandingBlock?.querySelector('slot');
-    expect(noSlot).to.not.exist;
-  });
-});
+import {
+  html,
+  fixture,
+  expect,
+  fixtureCleanup,
+  elementUpdated,
+} from '@open-wc/testing';
+
+import '../src/primary-nav';
+import { IATopNavConfig, IATopNavSecondIdentitySlotMode } from '../src/models';
+import { PrimaryNav } from '../src/primary-nav';
+
+const component = ({
+  baseHost = 'archive.org',
+  username = '',
+  screenName = '',
+  hideSearch = false,
+  config = {},
+  secondIdentitySlotMode = 'allow',
+}: {
+  baseHost?: string;
+  username?: string;
+  screenName?: string;
+  hideSearch?: boolean;
+  config?: IATopNavConfig;
+  secondIdentitySlotMode?: IATopNavSecondIdentitySlotMode;
+}) =>
+  html` <primary-nav
+    .baseHost=${baseHost}
+    .username=${username}
+    .screenName=${screenName}
+    ?hideSearch=${hideSearch}
+    .config=${config}
+    .secondIdentitySlotMode=${secondIdentitySlotMode}
+  ></primary-nav>`;
+
+afterEach(() => {
+  fixtureCleanup();
+});
+
+describe('<primary-nav>', () => {
+  it('renders the login link when no username present', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: '',
+      }),
+    );
+
+    expect(el.shadowRoot?.querySelector('login-button')).to.not.be.undefined;
+  });
+
+  it('does not render search trigger or search slot if hideSearch true', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: 'shaneriley',
+        screenName: 'shaneriley',
+        hideSearch: true,
+      }),
+    );
+
+    expect(el.shadowRoot?.querySelector('.search-trigger')).to.equal(null);
+    expect(el.shadowRoot?.querySelector('.search-container')).to.not.exist;
+  });
+
+  it('renders search slot container', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: 'testuser',
+        screenName: 'testuser',
+      }),
+    );
+
+    expect(el.shadowRoot?.querySelector('.search-container')).to.exist;
+
+    const slot = el.shadowRoot?.querySelector<HTMLSlotElement>(
+      'slot[name="search"]',
+    );
+    expect(slot).to.exist;
+  });
+
+  it('renders search trigger button for mobile toggle', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: 'testuser',
+        screenName: 'testuser',
+      }),
+    );
+
+    expect(el.shadowRoot?.querySelector('.search-trigger')).to.exist;
+  });
+
+  it('does not render nav-search', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: 'testuser',
+        screenName: 'testuser',
+      }),
+    );
+
+    expect(el.shadowRoot?.querySelector('nav-search')).to.not.exist;
+  });
+
+  it('opens a slot with `secondIdentitySlotMode`', async () => {
+    const el = await fixture<PrimaryNav>(
+      component({
+        baseHost: 'archive.org',
+        username: 'boop',
+        screenName: 'somesuperlongscreenname',
+        secondIdentitySlotMode: 'allow',
+      }),
+    );
+
+    const brandingBlock = el.shadowRoot?.querySelector('div.branding');
+    expect(brandingBlock?.getAttribute('class')).to.contain(
+      'branding second-logo',
+    );
+
+    const slot = brandingBlock?.querySelector('slot');
+    expect(slot).to.exist;
+    expect(slot?.getAttribute('name')).to.equal('opt-sec-logo');
+
+    el.secondIdentitySlotMode = '';
+    await elementUpdated(el);
+    const noSlotBrandingBlock = el.shadowRoot?.querySelector('div.branding');
+    expect(noSlotBrandingBlock?.getAttribute('class')).to.contain('branding');
+
+    const noSlot = noSlotBrandingBlock?.querySelector('slot');
+    expect(noSlot).to.not.exist;
+  });
+});

package/tsconfig.json

@@ -1,31 +1,31 @@
-{
-  "compilerOptions": {
-    "target": "es2018",
-    "module": "esnext",
-    "moduleResolution": "node",
-    "noEmitOnError": true,
-    "lib": ["es2017", "dom"],
-    "strict": true,
-    "esModuleInterop": false,
-    "allowSyntheticDefaultImports": true,
-    "experimentalDecorators": true,
-    "importHelpers": true,
-    "outDir": "dist",
-    "sourceMap": true,
-    "inlineSources": true,
-    "rootDir": "./",
-    "declaration": true,
-    "plugins": [
-      {
-        "name": "ts-lit-plugin"
-      }
-    ],
-    "paths": {
-      // workaround for: https://github.com/vitest-dev/vitest/issues/4567
-      "rollup/parseAst": [
-        "./node_modules/rollup/dist/parseAst"
-    ]
-}
-  },
-  "include": ["**/*.ts"]
-}
+{
+  "compilerOptions": {
+    "target": "es2018",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "noEmitOnError": true,
+    "lib": ["es2017", "dom"],
+    "strict": true,
+    "esModuleInterop": false,
+    "allowSyntheticDefaultImports": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "outDir": "dist",
+    "sourceMap": true,
+    "inlineSources": true,
+    "rootDir": "./",
+    "declaration": true,
+    "plugins": [
+      {
+        "name": "ts-lit-plugin"
+      }
+    ],
+    "paths": {
+      // workaround for: https://github.com/vitest-dev/vitest/issues/4567
+      "rollup/parseAst": [
+        "./node_modules/rollup/dist/parseAst"
+    ]
+}
+  },
+  "include": ["**/*.ts"]
+}

package/web-dev-server.config.mjs

@@ -1,32 +1,32 @@
-// import { hmrPlugin, presets } from '@open-wc/dev-server-hmr';
-
-/** Use Hot Module replacement by adding --hmr to the start command */
-const hmr = process.argv.includes('--hmr');
-
-export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
-  nodeResolve: true,
-  open: '/demo',
-  watch: !hmr,
-  sslCert: './ssl/server.crt',
-  sslKey: './ssl/server.key',
-  hostname: 'local.archive.org',
-  http2: true,
-
-  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
-  // esbuildTarget: 'auto'
-
-  /** Set appIndex to enable SPA routing */
-  // appIndex: 'demo/index.html',
-
-  /** Configure bare import resolve plugin */
-  // nodeResolve: {
-  //   exportConditions: ['browser', 'development']
-  // },
-
-  plugins: [
-    /** Use Hot Module Replacement by uncommenting. Requires @open-wc/dev-server-hmr plugin */
-    // hmr && hmrPlugin({ exclude: ['**/*/node_modules/**/*'], presets: [presets.litElement] }),
-  ],
-
-  // See documentation for all available options
-});
+// import { hmrPlugin, presets } from '@open-wc/dev-server-hmr';
+
+/** Use Hot Module replacement by adding --hmr to the start command */
+const hmr = process.argv.includes('--hmr');
+
+export default /** @type {import('@web/dev-server').DevServerConfig} */ ({
+  nodeResolve: true,
+  open: '/demo',
+  watch: !hmr,
+  sslCert: './ssl/server.crt',
+  sslKey: './ssl/server.key',
+  hostname: 'local.archive.org',
+  http2: true,
+
+  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
+  // esbuildTarget: 'auto'
+
+  /** Set appIndex to enable SPA routing */
+  // appIndex: 'demo/index.html',
+
+  /** Configure bare import resolve plugin */
+  // nodeResolve: {
+  //   exportConditions: ['browser', 'development']
+  // },
+
+  plugins: [
+    /** Use Hot Module Replacement by uncommenting. Requires @open-wc/dev-server-hmr plugin */
+    // hmr && hmrPlugin({ exclude: ['**/*/node_modules/**/*'], presets: [presets.litElement] }),
+  ],
+
+  // See documentation for all available options
+});

package/web-test-runner.config.mjs

@@ -1,41 +1,41 @@
-// import { playwrightLauncher } from '@web/test-runner-playwright';
-
-const filteredLogs = ['Running in dev mode', 'lit-html is in dev mode'];
-
-export default /** @type {import("@web/test-runner").TestRunnerConfig} */ ({
-  /** Test files to run */
-  files: 'dist/test/**/*.test.js',
-
-  /** Resolve bare module imports */
-  nodeResolve: {
-    exportConditions: ['browser', 'development'],
-  },
-
-  /** Filter out lit dev mode logs */
-  filterBrowserLogs(log) {
-    for (const arg of log.args) {
-      if (typeof arg === 'string' && filteredLogs.some(l => arg.includes(l))) {
-        return false;
-      }
-    }
-    return true;
-  },
-
-  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
-  // esbuildTarget: 'auto',
-
-  /** Amount of browsers to run concurrently */
-  // concurrentBrowsers: 2,
-
-  /** Amount of test files per browser to test concurrently */
-  // concurrency: 1,
-
-  /** Browsers to run tests on */
-  // browsers: [
-  //   playwrightLauncher({ product: 'chromium' }),
-  //   playwrightLauncher({ product: 'firefox' }),
-  //   playwrightLauncher({ product: 'webkit' }),
-  // ],
-
-  // See documentation for all available options
-});
+// import { playwrightLauncher } from '@web/test-runner-playwright';
+
+const filteredLogs = ['Running in dev mode', 'lit-html is in dev mode'];
+
+export default /** @type {import("@web/test-runner").TestRunnerConfig} */ ({
+  /** Test files to run */
+  files: 'dist/test/**/*.test.js',
+
+  /** Resolve bare module imports */
+  nodeResolve: {
+    exportConditions: ['browser', 'development'],
+  },
+
+  /** Filter out lit dev mode logs */
+  filterBrowserLogs(log) {
+    for (const arg of log.args) {
+      if (typeof arg === 'string' && filteredLogs.some(l => arg.includes(l))) {
+        return false;
+      }
+    }
+    return true;
+  },
+
+  /** Compile JS for older browsers. Requires @web/dev-server-esbuild plugin */
+  // esbuildTarget: 'auto',
+
+  /** Amount of browsers to run concurrently */
+  // concurrentBrowsers: 2,
+
+  /** Amount of test files per browser to test concurrently */
+  // concurrency: 1,
+
+  /** Browsers to run tests on */
+  // browsers: [
+  //   playwrightLauncher({ product: 'chromium' }),
+  //   playwrightLauncher({ product: 'firefox' }),
+  //   playwrightLauncher({ product: 'webkit' }),
+  // ],
+
+  // See documentation for all available options
+});

package/dist/src/lib/location-handler.d.ts

@@ -1 +0,0 @@
-export default function (url: string): void;

package/dist/src/lib/location-handler.js

@@ -1,5 +0,0 @@
-/* istanbul ignore file */
-export default function (url) {
-    window.location.href = url;
-}
-//# sourceMappingURL=location-handler.js.map

package/dist/src/lib/location-handler.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"location-handler.js","sourceRoot":"","sources":["../../../src/lib/location-handler.ts"],"names":[],"mappings":"AAAA,0BAA0B;AAE1B,MAAM,CAAC,OAAO,WAAW,GAAW;IAClC,MAAM,CAAC,QAAQ,CAAC,IAAI,GAAG,GAAG,CAAC;AAC7B,CAAC","sourcesContent":["/* istanbul ignore file */\n\nexport default function (url: string) {\n  window.location.href = url;\n}\n"]}

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

@@ -1,19 +0,0 @@
-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

@@ -1,127 +0,0 @@
-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/format-url';
-import { customElement, property, query } from 'lit/decorators.js';
-import { defaultTopNavConfig } from './data/menus';
-import { iaSronlyStyles } from '@internetarchive/ia-styles';
-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, iaSronlyStyles];
-    }
-    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"
-        >
-          <label for="query" class="sr-only">Search the Archive</label>
-          <input
-            type="text"
-            name="query"
-            id="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

@@ -1 +0,0 @@
-{"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/format-url';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { defaultTopNavConfig } from './data/menus';\nimport { IATopNavConfig } from './models';\nimport { iaSronlyStyles } from '@internetarchive/ia-styles';\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, iaSronlyStyles];\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          <label for=\"query\" class=\"sr-only\">Search the Archive</label>\n          <input\n            type=\"text\"\n            name=\"query\"\n            id=\"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/search-menu.d.ts

@@ -1,20 +0,0 @@
-import TrackedElement from './tracked-element';
-import { IATopNavConfig } from './models';
-export declare class SearchMenu extends TrackedElement {
-    baseHost: string;
-    config: IATopNavConfig;
-    hideSearch: boolean;
-    openMenu: string;
-    searchMenuOpen: boolean;
-    searchMenuAnimate: boolean;
-    selectedSearchType: string;
-    static get styles(): import("lit").CSSResult;
-    firstUpdated(): void;
-    disconnectedCallback(): void;
-    private handleKeyDownEvent;
-    selectSearchType(e: Event): void;
-    searchInChanged(e: InputEvent): void;
-    get searchTypesTemplate(): import("lit").TemplateResult<1>[];
-    get menuClass(): "closed" | "open";
-    render(): import("lit").TemplateResult<1>;
-}