@internetarchive/collection-browser 0.4.4-alpha → 0.4.4

package/dist/test/tiles/hover/hover-pane-controller.test.js

@@ -0,0 +1,279 @@
+import { __decorate } from "tslib";
+import { expect, fixture } from '@open-wc/testing';
+import { html, LitElement, nothing } from 'lit';
+import { customElement, property, query } from 'lit/decorators.js';
+import { HoverPaneController, } from '../../../src/tiles/hover/hover-pane-controller';
+let HostElement = class HostElement extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.suppressHoverPane = false;
+    }
+    render() {
+        var _a;
+        return html ` ${(_a = this.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()} `;
+    }
+    firstUpdated() {
+        this.controller = new HoverPaneController(this, this.controllerOptions);
+    }
+    getHoverPane() {
+        return this.suppressHoverPane ? undefined : this.hoverPane;
+    }
+    getHoverPaneProps() {
+        return {
+            model: {
+                collectionFilesCount: 1,
+                collections: ['foo', 'bar'],
+                collectionSize: 1,
+                commentCount: 1,
+                contentWarning: false,
+                creators: ['foo', 'bar'],
+                favCount: 1,
+                identifier: 'foo',
+                itemCount: 1,
+                loginRequired: false,
+                mediatype: 'data',
+                subjects: ['foo', 'bar'],
+                title: 'foo',
+                viewCount: 1,
+            },
+            loggedIn: false,
+            sortParam: null,
+        };
+    }
+};
+__decorate([
+    property({ type: Object })
+], HostElement.prototype, "controllerOptions", void 0);
+__decorate([
+    property({ type: Boolean })
+], HostElement.prototype, "suppressHoverPane", void 0);
+__decorate([
+    query('tile-hover-pane')
+], HostElement.prototype, "hoverPane", void 0);
+HostElement = __decorate([
+    customElement('host-element')
+], HostElement);
+describe('Hover Pane Controller', () => {
+    let oldMatchMedia;
+    let oldOnTouchStart;
+    before(() => {
+        oldMatchMedia = window.matchMedia;
+        oldOnTouchStart = window.ontouchstart;
+        window.matchMedia = () => ({ matches: true });
+        window.ontouchstart = () => { };
+    });
+    after(() => {
+        window.matchMedia = oldMatchMedia;
+        window.ontouchstart = oldOnTouchStart;
+    });
+    it('should initially provide empty template', async () => {
+        var _a;
+        const host = await fixture(html `<host-element></host-element>`);
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).to.equal(nothing);
+    });
+    it('should produce a hover pane template after mousemove, and hide it after mouseleave', async () => {
+        var _a, _b;
+        const host = await fixture(html `<host-element
+        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}
+      ></host-element>`);
+        host.dispatchEvent(new MouseEvent('mousemove'));
+        // Need to wait a tick for the event handlers to run
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing); // Is a TemplateResult
+        host.dispatchEvent(new MouseEvent('mouseleave'));
+        // Need to wait for the fade out transition
+        await new Promise(resolve => {
+            setTimeout(resolve, 150);
+        });
+        expect((_b = host.controller) === null || _b === void 0 ? void 0 : _b.getTemplate()).to.equal(nothing);
+    });
+    it('should produce a hover pane template after mouseenter, even without mousemove', async () => {
+        var _a;
+        const host = await fixture(html `<host-element
+        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}
+      ></host-element>`);
+        host.dispatchEvent(new MouseEvent('mouseenter'));
+        // Need to wait a tick for the event handlers to run
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing); // Is a TemplateResult
+    });
+    it('should immediately fade back in if mouse enters while fading out', async () => {
+        var _a;
+        const host = await fixture(html `<host-element
+        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}
+      ></host-element>`);
+        // Enter the host element and wait for the show handlers to run
+        host.dispatchEvent(new MouseEvent('mousemove'));
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        // Leave the host element so it begins fading out, but not all the way
+        host.dispatchEvent(new MouseEvent('mouseleave'));
+        await new Promise(resolve => {
+            setTimeout(resolve, 20);
+        });
+        // Re-enter the host element and wait long enough that it would disappear
+        // if the hide were not cancelled
+        host.dispatchEvent(new MouseEvent('mousemove'));
+        await new Promise(resolve => {
+            setTimeout(resolve, 150);
+        });
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing);
+    });
+    it('should flip hover pane if it would overflow the viewport', async () => {
+        var _a, _b, _c, _d, _e;
+        const host = await fixture(html `<host-element
+        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}
+      ></host-element>`);
+        host.dispatchEvent(new MouseEvent('mousemove', { clientX: 800, clientY: 600 }));
+        // Need to wait a tick for the event handlers to run
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        await host.updateComplete;
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing);
+        expect((_c = (_b = host.getHoverPane()) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect()) === null || _c === void 0 ? void 0 : _c.right).to.be.lessThan(window.innerWidth);
+        expect((_e = (_d = host.getHoverPane()) === null || _d === void 0 ? void 0 : _d.getBoundingClientRect()) === null || _e === void 0 ? void 0 : _e.bottom).to.be.lessThan(window.innerHeight);
+    });
+    it('should gracefully handle undefined hover pane from host element', async () => {
+        var _a, _b;
+        const host = await fixture(html `<host-element
+        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}
+        ?suppressHoverPane=${true}
+      ></host-element>`);
+        host.dispatchEvent(new MouseEvent('mousemove'));
+        // Need to wait a tick for the event handlers to run
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing);
+        host.dispatchEvent(new MouseEvent('mouseleave'));
+        await new Promise(resolve => {
+            setTimeout(resolve, 20);
+        });
+        host.dispatchEvent(new MouseEvent('mousemove'));
+        await new Promise(resolve => {
+            setTimeout(resolve, 0);
+        });
+        host.dispatchEvent(new MouseEvent('mouseleave'));
+        // Need to wait for the fade out transition
+        await new Promise(resolve => {
+            setTimeout(resolve, 150);
+        });
+        expect((_b = host.controller) === null || _b === void 0 ? void 0 : _b.getTemplate()).to.equal(nothing);
+    });
+    describe('Touch & long-press', () => {
+        const getTouchStartEvent = (host) => new TouchEvent('touchstart', {
+            touches: [new Touch({ identifier: 0, target: host })],
+        });
+        it('should produce a hover pane after long press', async () => {
+            var _a;
+            const host = await fixture(html `<host-element
+          .controllerOptions=${{
+                showDelay: 0,
+                longPressDelay: 0,
+                enableLongPress: true,
+            }}
+        ></host-element>`);
+            // Touch the host element and wait for the long press handlers to run
+            host.dispatchEvent(getTouchStartEvent(host));
+            await new Promise(resolve => {
+                setTimeout(resolve, 0);
+            });
+            expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing); // Is a TemplateResult
+        });
+        it('should cancel a long press by moving', async () => {
+            var _a;
+            const host = await fixture(html `<host-element
+          .controllerOptions=${{
+                showDelay: 0,
+                longPressDelay: 100,
+                enableLongPress: true,
+            }}
+        ></host-element>`);
+            // Touch the host element
+            host.dispatchEvent(getTouchStartEvent(host));
+            await new Promise(resolve => {
+                setTimeout(resolve, 0);
+            });
+            // Move the touch point, cancelling the long press
+            host.dispatchEvent(new TouchEvent('touchmove'));
+            await new Promise(resolve => {
+                setTimeout(resolve, 150);
+            });
+            expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).to.equal(nothing);
+        });
+        it('should cancel a long press by ending touch', async () => {
+            var _a;
+            const host = await fixture(html `<host-element
+          .controllerOptions=${{
+                showDelay: 0,
+                longPressDelay: 100,
+                enableLongPress: true,
+            }}
+        ></host-element>`);
+            // Touch the host element
+            host.dispatchEvent(getTouchStartEvent(host));
+            await new Promise(resolve => {
+                setTimeout(resolve, 0);
+            });
+            // Lift the touch point, cancelling the long press
+            host.dispatchEvent(new TouchEvent('touchend'));
+            await new Promise(resolve => {
+                setTimeout(resolve, 150);
+            });
+            expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).to.equal(nothing);
+        });
+        it('should cancel a long press by cancelling touch (e.g., too many touch points)', async () => {
+            var _a;
+            const host = await fixture(html `<host-element
+          .controllerOptions=${{
+                showDelay: 0,
+                longPressDelay: 100,
+                enableLongPress: true,
+            }}
+        ></host-element>`);
+            // Touch the host element
+            host.dispatchEvent(getTouchStartEvent(host));
+            await new Promise(resolve => {
+                setTimeout(resolve, 0);
+            });
+            // Cancel the touch point, also cancelling the long press
+            host.dispatchEvent(new TouchEvent('touchcancel'));
+            await new Promise(resolve => {
+                setTimeout(resolve, 150);
+            });
+            expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).to.equal(nothing);
+        });
+        it('should close the hover pane on mobile when touching the backdrop', async () => {
+            var _a, _b, _c, _d;
+            const host = await fixture(html `<host-element
+          .controllerOptions=${{
+                showDelay: 0,
+                hideDelay: 0,
+                longPressDelay: 0,
+                enableLongPress: true,
+                mobileBreakpoint: 9999, // Ensure we get the mobile view
+            }}
+        ></host-element>`);
+            // Touch the host element
+            host.dispatchEvent(getTouchStartEvent(host));
+            await new Promise(resolve => {
+                setTimeout(resolve, 0);
+            });
+            expect((_a = host.controller) === null || _a === void 0 ? void 0 : _a.getTemplate()).not.to.equal(nothing);
+            await host.updateComplete;
+            // Touch the backdrop
+            (_c = (_b = host.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#touch-backdrop')) === null || _c === void 0 ? void 0 : _c.dispatchEvent(new TouchEvent('touchstart'));
+            await new Promise(resolve => {
+                setTimeout(resolve, 150);
+            });
+            expect((_d = host.controller) === null || _d === void 0 ? void 0 : _d.getTemplate()).to.equal(nothing);
+        });
+    });
+});
+//# sourceMappingURL=hover-pane-controller.test.js.map

package/dist/test/tiles/hover/hover-pane-controller.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hover-pane-controller.test.js","sourceRoot":"","sources":["../../../../test/tiles/hover/hover-pane-controller.test.ts"],"names":[],"mappings":"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","sourcesContent":["import { expect, fixture } from '@open-wc/testing';\nimport { html, LitElement, nothing, TemplateResult } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport {\n  HoverPaneController,\n  HoverPaneControllerInterface,\n  HoverPaneControllerOptions,\n  HoverPaneProperties,\n  HoverPaneProviderInterface,\n} from '../../../src/tiles/hover/hover-pane-controller';\nimport type { TileHoverPane } from '../../../src/tiles/hover/tile-hover-pane';\n\n@customElement('host-element')\nclass HostElement extends LitElement implements HoverPaneProviderInterface {\n  @property({ type: Object }) controllerOptions?: HoverPaneControllerOptions;\n\n  @property({ type: Boolean }) suppressHoverPane: boolean = false;\n\n  @query('tile-hover-pane') hoverPane?: TileHoverPane;\n\n  controller?: HoverPaneControllerInterface;\n\n  render(): TemplateResult {\n    return html` ${this.controller?.getTemplate()} `;\n  }\n\n  protected firstUpdated(): void {\n    this.controller = new HoverPaneController(this, this.controllerOptions);\n  }\n\n  getHoverPane(): HTMLElement | undefined {\n    return this.suppressHoverPane ? undefined : this.hoverPane;\n  }\n\n  getHoverPaneProps(): HoverPaneProperties {\n    return {\n      model: {\n        collectionFilesCount: 1,\n        collections: ['foo', 'bar'],\n        collectionSize: 1,\n        commentCount: 1,\n        contentWarning: false,\n        creators: ['foo', 'bar'],\n        favCount: 1,\n        identifier: 'foo',\n        itemCount: 1,\n        loginRequired: false,\n        mediatype: 'data',\n        subjects: ['foo', 'bar'],\n        title: 'foo',\n        viewCount: 1,\n      },\n      loggedIn: false,\n      sortParam: null,\n    };\n  }\n}\n\ndescribe('Hover Pane Controller', () => {\n  let oldMatchMedia: typeof window.matchMedia;\n  let oldOnTouchStart: typeof window.ontouchstart;\n\n  before(() => {\n    oldMatchMedia = window.matchMedia;\n    oldOnTouchStart = window.ontouchstart;\n    window.matchMedia = () => ({ matches: true } as MediaQueryList);\n    window.ontouchstart = () => {};\n  });\n\n  after(() => {\n    window.matchMedia = oldMatchMedia;\n    window.ontouchstart = oldOnTouchStart;\n  });\n\n  it('should initially provide empty template', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element></host-element>`\n    );\n    expect(host.controller?.getTemplate()).to.equal(nothing);\n  });\n\n  it('should produce a hover pane template after mousemove, and hide it after mouseleave', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element\n        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}\n      ></host-element>`\n    );\n\n    host.dispatchEvent(new MouseEvent('mousemove'));\n    // Need to wait a tick for the event handlers to run\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n\n    expect(host.controller?.getTemplate()).not.to.equal(nothing); // Is a TemplateResult\n\n    host.dispatchEvent(new MouseEvent('mouseleave'));\n    // Need to wait for the fade out transition\n    await new Promise(resolve => {\n      setTimeout(resolve, 150);\n    });\n\n    expect(host.controller?.getTemplate()).to.equal(nothing);\n  });\n\n  it('should produce a hover pane template after mouseenter, even without mousemove', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element\n        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}\n      ></host-element>`\n    );\n\n    host.dispatchEvent(new MouseEvent('mouseenter'));\n    // Need to wait a tick for the event handlers to run\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n\n    expect(host.controller?.getTemplate()).not.to.equal(nothing); // Is a TemplateResult\n  });\n\n  it('should immediately fade back in if mouse enters while fading out', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element\n        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}\n      ></host-element>`\n    );\n\n    // Enter the host element and wait for the show handlers to run\n    host.dispatchEvent(new MouseEvent('mousemove'));\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n\n    // Leave the host element so it begins fading out, but not all the way\n    host.dispatchEvent(new MouseEvent('mouseleave'));\n    await new Promise(resolve => {\n      setTimeout(resolve, 20);\n    });\n\n    // Re-enter the host element and wait long enough that it would disappear\n    // if the hide were not cancelled\n    host.dispatchEvent(new MouseEvent('mousemove'));\n    await new Promise(resolve => {\n      setTimeout(resolve, 150);\n    });\n\n    expect(host.controller?.getTemplate()).not.to.equal(nothing);\n  });\n\n  it('should flip hover pane if it would overflow the viewport', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element\n        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}\n      ></host-element>`\n    );\n\n    host.dispatchEvent(\n      new MouseEvent('mousemove', { clientX: 800, clientY: 600 })\n    );\n    // Need to wait a tick for the event handlers to run\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n    await host.updateComplete;\n\n    expect(host.controller?.getTemplate()).not.to.equal(nothing);\n    expect(host.getHoverPane()?.getBoundingClientRect()?.right).to.be.lessThan(\n      window.innerWidth\n    );\n    expect(host.getHoverPane()?.getBoundingClientRect()?.bottom).to.be.lessThan(\n      window.innerHeight\n    );\n  });\n\n  it('should gracefully handle undefined hover pane from host element', async () => {\n    const host = await fixture<HostElement>(\n      html`<host-element\n        .controllerOptions=${{ showDelay: 0, hideDelay: 0 }}\n        ?suppressHoverPane=${true}\n      ></host-element>`\n    );\n\n    host.dispatchEvent(new MouseEvent('mousemove'));\n    // Need to wait a tick for the event handlers to run\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n\n    expect(host.controller?.getTemplate()).not.to.equal(nothing);\n\n    host.dispatchEvent(new MouseEvent('mouseleave'));\n    await new Promise(resolve => {\n      setTimeout(resolve, 20);\n    });\n\n    host.dispatchEvent(new MouseEvent('mousemove'));\n    await new Promise(resolve => {\n      setTimeout(resolve, 0);\n    });\n\n    host.dispatchEvent(new MouseEvent('mouseleave'));\n    // Need to wait for the fade out transition\n    await new Promise(resolve => {\n      setTimeout(resolve, 150);\n    });\n\n    expect(host.controller?.getTemplate()).to.equal(nothing);\n  });\n\n  describe('Touch & long-press', () => {\n    const getTouchStartEvent = (host: EventTarget) =>\n      new TouchEvent('touchstart', {\n        touches: [new Touch({ identifier: 0, target: host })],\n      });\n\n    it('should produce a hover pane after long press', async () => {\n      const host = await fixture<HostElement>(\n        html`<host-element\n          .controllerOptions=${{\n            showDelay: 0,\n            longPressDelay: 0,\n            enableLongPress: true,\n          }}\n        ></host-element>`\n      );\n\n      // Touch the host element and wait for the long press handlers to run\n      host.dispatchEvent(getTouchStartEvent(host));\n      await new Promise(resolve => {\n        setTimeout(resolve, 0);\n      });\n\n      expect(host.controller?.getTemplate()).not.to.equal(nothing); // Is a TemplateResult\n    });\n\n    it('should cancel a long press by moving', async () => {\n      const host = await fixture<HostElement>(\n        html`<host-element\n          .controllerOptions=${{\n            showDelay: 0,\n            longPressDelay: 100,\n            enableLongPress: true,\n          }}\n        ></host-element>`\n      );\n\n      // Touch the host element\n      host.dispatchEvent(getTouchStartEvent(host));\n      await new Promise(resolve => {\n        setTimeout(resolve, 0);\n      });\n\n      // Move the touch point, cancelling the long press\n      host.dispatchEvent(new TouchEvent('touchmove'));\n      await new Promise(resolve => {\n        setTimeout(resolve, 150);\n      });\n\n      expect(host.controller?.getTemplate()).to.equal(nothing);\n    });\n\n    it('should cancel a long press by ending touch', async () => {\n      const host = await fixture<HostElement>(\n        html`<host-element\n          .controllerOptions=${{\n            showDelay: 0,\n            longPressDelay: 100,\n            enableLongPress: true,\n          }}\n        ></host-element>`\n      );\n\n      // Touch the host element\n      host.dispatchEvent(getTouchStartEvent(host));\n      await new Promise(resolve => {\n        setTimeout(resolve, 0);\n      });\n\n      // Lift the touch point, cancelling the long press\n      host.dispatchEvent(new TouchEvent('touchend'));\n      await new Promise(resolve => {\n        setTimeout(resolve, 150);\n      });\n\n      expect(host.controller?.getTemplate()).to.equal(nothing);\n    });\n\n    it('should cancel a long press by cancelling touch (e.g., too many touch points)', async () => {\n      const host = await fixture<HostElement>(\n        html`<host-element\n          .controllerOptions=${{\n            showDelay: 0,\n            longPressDelay: 100,\n            enableLongPress: true,\n          }}\n        ></host-element>`\n      );\n\n      // Touch the host element\n      host.dispatchEvent(getTouchStartEvent(host));\n      await new Promise(resolve => {\n        setTimeout(resolve, 0);\n      });\n\n      // Cancel the touch point, also cancelling the long press\n      host.dispatchEvent(new TouchEvent('touchcancel'));\n      await new Promise(resolve => {\n        setTimeout(resolve, 150);\n      });\n\n      expect(host.controller?.getTemplate()).to.equal(nothing);\n    });\n\n    it('should close the hover pane on mobile when touching the backdrop', async () => {\n      const host = await fixture<HostElement>(\n        html`<host-element\n          .controllerOptions=${{\n            showDelay: 0,\n            hideDelay: 0,\n            longPressDelay: 0,\n            enableLongPress: true,\n            mobileBreakpoint: 9999, // Ensure we get the mobile view\n          }}\n        ></host-element>`\n      );\n\n      // Touch the host element\n      host.dispatchEvent(getTouchStartEvent(host));\n      await new Promise(resolve => {\n        setTimeout(resolve, 0);\n      });\n\n      expect(host.controller?.getTemplate()).not.to.equal(nothing);\n\n      await host.updateComplete;\n\n      // Touch the backdrop\n      host.shadowRoot\n        ?.querySelector('#touch-backdrop')\n        ?.dispatchEvent(new TouchEvent('touchstart'));\n      await new Promise(resolve => {\n        setTimeout(resolve, 150);\n      });\n\n      expect(host.controller?.getTemplate()).to.equal(nothing);\n    });\n  });\n});\n"]}

package/dist/test/tiles/hover/tile-hover-pane.test.d.ts

@@ -0,0 +1 @@
+import '../../../src/tiles/hover/tile-hover-pane';

package/dist/test/tiles/hover/tile-hover-pane.test.js

@@ -0,0 +1,14 @@
+import { expect, fixture } from '@open-wc/testing';
+import { html } from 'lit';
+import '../../../src/tiles/hover/tile-hover-pane';
+describe('Tile Hover Pane', () => {
+    it('should render initial component', async () => {
+        var _a, _b;
+        const el = await fixture(html `<tile-hover-pane></tile-hover-pane>`);
+        const container = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#container');
+        const listView = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('tile-list');
+        expect(container).to.exist;
+        expect(listView).to.exist;
+    });
+});
+//# sourceMappingURL=tile-hover-pane.test.js.map

package/dist/test/tiles/hover/tile-hover-pane.test.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tile-hover-pane.test.js","sourceRoot":"","sources":["../../../../test/tiles/hover/tile-hover-pane.test.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,kBAAkB,CAAC;AACnD,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAG3B,OAAO,0CAA0C,CAAC;AAElD,QAAQ,CAAC,iBAAiB,EAAE,GAAG,EAAE;IAC/B,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;;QAC/C,MAAM,EAAE,GAAG,MAAM,OAAO,CACtB,IAAI,CAAA,qCAAqC,CAC1C,CAAC;QAEF,MAAM,SAAS,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,YAAY,CAAC,CAAC;QAC7D,MAAM,QAAQ,GAAG,MAAA,EAAE,CAAC,UAAU,0CAAE,aAAa,CAAC,WAAW,CAAC,CAAC;QAE3D,MAAM,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;QAC3B,MAAM,CAAC,QAAQ,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC;IAC5B,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import { expect, fixture } from '@open-wc/testing';\nimport { html } from 'lit';\nimport type { TileHoverPane } from '../../../src/tiles/hover/tile-hover-pane';\n\nimport '../../../src/tiles/hover/tile-hover-pane';\n\ndescribe('Tile Hover Pane', () => {\n  it('should render initial component', async () => {\n    const el = await fixture<TileHoverPane>(\n      html`<tile-hover-pane></tile-hover-pane>`\n    );\n\n    const container = el.shadowRoot?.querySelector('#container');\n    const listView = el.shadowRoot?.querySelector('tile-list');\n\n    expect(container).to.exist;\n    expect(listView).to.exist;\n  });\n});\n"]}

package/dist/test/tiles/list/tile-list.test.js

@@ -6,7 +6,7 @@ import { MockCollectionNameCache } from '../../mocks/mock-collection-name-cache'
 describe('List Tile', () => {
     it('should render initial component', async () => {
         var _a, _b, _c;
-        const el = await fixture(html `<tile-list></tile-list>`);
+        const el = await fixture(html `<tile-list .model=${{}}></tile-list>`);
         const listContainer = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('#list-line');
         const itemTitle = (_b = el.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('#title');
         const imageBlock = (_c = el.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('image-block');
@@ -145,6 +145,51 @@ describe('List Tile', () => {
         expect(descriptionBlock).to.exist;
         expect((_b = descriptionBlock === null || descriptionBlock === void 0 ? void 0 : descriptionBlock.textContent) === null || _b === void 0 ? void 0 : _b.trim()).to.equal('line1 line2'); // line break replaced by space
     });
+    it('should render mediatype icon as link to corresponding mediatype collection details', async () => {
+        var _a;
+        const model = {
+            mediatype: 'texts',
+        };
+        const el = await fixture(html `
+      <tile-list
+        .baseNavigationUrl=${'https://archive.org'}
+        .model=${model}
+      ></tile-list>
+    `);
+        const mediatypeLink = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('a#icon-right');
+        expect(mediatypeLink).to.exist;
+        expect(mediatypeLink === null || mediatypeLink === void 0 ? void 0 : mediatypeLink.getAttribute('href')).to.equal(`https://archive.org/details/texts`);
+    });
+    it('should render collection mediatype icon as link to search page', async () => {
+        var _a;
+        const model = {
+            mediatype: 'collection',
+        };
+        const el = await fixture(html `
+      <tile-list
+        .baseNavigationUrl=${'https://archive.org'}
+        .model=${model}
+      ></tile-list>
+    `);
+        const mediatypeLink = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('a#icon-right');
+        expect(mediatypeLink).to.exist;
+        expect(mediatypeLink === null || mediatypeLink === void 0 ? void 0 : mediatypeLink.getAttribute('href')).to.equal(`https://archive.org/search?query=mediatype:collection&sort=-downloads`);
+    });
+    it('should not render account mediatype icon as link', async () => {
+        var _a;
+        const model = {
+            mediatype: 'account',
+        };
+        const el = await fixture(html `
+      <tile-list
+        .baseNavigationUrl=${'https://archive.org'}
+        .model=${model}
+      ></tile-list>
+    `);
+        const mediatypeLink = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('a#icon-right');
+        expect(mediatypeLink).to.exist;
+        expect(mediatypeLink === null || mediatypeLink === void 0 ? void 0 : mediatypeLink.getAttribute('href')).not.to.exist;
+    });
     it('should render date added for accounts', async () => {
         var _a, _b;
         const el = await fixture(html `

package/dist/test/tiles/list/tile-list.test.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile-list.test.js","sourceRoot":"","sources":["../../../../test/tiles/list/tile-list.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport { expect, fixture } from '@open-wc/testing';\nimport { html } from 'lit';\nimport type { TileList } from '../../../src/tiles/list/tile-list';\n\nimport '../../../src/tiles/list/tile-list';\nimport { MockCollectionNameCache } from '../../mocks/mock-collection-name-cache';\nimport type { TileModel } from '../../../src/models';\n\ndescribe('List Tile', () => {\n  it('should render initial component', async () => {\n    const el = await fixture<TileList>(html`<tile-list></tile-list>`);\n\n    const listContainer = el.shadowRoot?.querySelector('#list-line');\n    const itemTitle = el.shadowRoot?.querySelector('#title');\n    const imageBlock = el.shadowRoot?.querySelector('image-block');\n\n    expect(listContainer).to.exist;\n    expect(itemTitle).to.exist;\n    expect(imageBlock).to.exist;\n  });\n\n  it('should render the mobile template if below mobile breakpoint', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .mobileBreakpoint=${500} .currentWidth=${400}> </tile-list>\n    `);\n\n    const listContainer = el.shadowRoot?.getElementById('list-line');\n    const topLine = el.shadowRoot?.getElementById('list-line-top');\n    const bottomLine = el.shadowRoot?.getElementById('list-line-bottom');\n\n    expect(listContainer).to.exist;\n    expect(listContainer?.classList.contains('mobile')).to.be.true;\n    expect(topLine).to.exist;\n    expect(bottomLine).to.exist;\n  });\n\n  it('should render with creator element but not dates', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ creators: ['someone'] }}></tile-list>\n    `);\n\n    const creator = el.shadowRoot?.querySelector('#creator');\n    const datesLine = el.shadowRoot?.querySelector('#dates-line');\n\n    expect(creator).to.exist;\n    expect(datesLine?.children.length).to.equal(0);\n  });\n\n  it('should render with snippet block when it has snippets', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ snippets: ['some {{{snippet}}} text'] }}>\n      </tile-list>\n    `);\n\n    const snippetBlock = el.shadowRoot?.querySelector('text-snippet-block');\n\n    expect(snippetBlock).to.exist;\n  });\n\n  it('should not render snippet block when no snippets are present', async () => {\n    const el = await fixture<TileList>(html`<tile-list></tile-list>`);\n\n    const snippetBlock = el.shadowRoot?.querySelector('text-snippet-block');\n\n    expect(snippetBlock).to.not.exist;\n  });\n\n  it('should not render suppressed collections', async () => {\n    const collectionNameCache = new MockCollectionNameCache();\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ collections: ['deemphasize', 'community', 'foo'] }}\n        .collectionNameCache=${collectionNameCache}\n      >\n      </tile-list>\n    `);\n\n    const collectionsRow = el.shadowRoot?.getElementById('collections');\n    expect(collectionsRow).to.exist;\n\n    const collectionLinks = collectionsRow?.querySelectorAll('a[href]');\n    expect(collectionLinks?.length).to.equal(1);\n    expect(collectionLinks?.item(0).getAttribute('href')).to.equal(\n      '/details/foo'\n    );\n  });\n\n  it('should not render fav- collections', async () => {\n    const collectionNameCache = new MockCollectionNameCache();\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ collections: ['fav-foo', 'bar'] }}\n        .collectionNameCache=${collectionNameCache}\n      >\n      </tile-list>\n    `);\n\n    const collectionsRow = el.shadowRoot?.getElementById('collections');\n    expect(collectionsRow).to.exist;\n\n    const collectionLinks = collectionsRow?.querySelectorAll('a[href]');\n    expect(collectionLinks?.length).to.equal(1);\n    expect(collectionLinks?.item(0).getAttribute('href')).to.equal(\n      '/details/bar'\n    );\n  });\n\n  it('should render weekly views when sorting by week', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ viewCount: 50, weeklyViewCount: 10 }}\n        .sortParam=${{ field: 'week', direction: 'desc' }}\n      >\n      </tile-list>\n    `);\n\n    const viewsRow = el.shadowRoot?.getElementById('views-line');\n    expect(viewsRow).to.exist;\n    expect(viewsRow?.textContent?.trim()).to.equal('Views:  10');\n  });\n\n  it('should render added date when sorting by it', async () => {\n    const model: Partial<TileModel> = {\n      dateAdded: new Date('2010-01-01'),\n      dateArchived: new Date('2011-01-01'),\n      datePublished: new Date('2012-01-01'),\n      dateReviewed: new Date('2013-01-01'),\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${model}\n        .sortParam=${{ field: 'addeddate', direction: 'desc' }}\n      >\n      </tile-list>\n    `);\n\n    const dateRow = el.shadowRoot?.getElementById('dates-line');\n    expect(dateRow).to.exist;\n    expect(dateRow?.textContent?.trim()).to.contain('Added:  Jan 01, 2010');\n  });\n\n  it('should render links to /search pages (not search.php) for subject, creator, and source', async () => {\n    const model: Partial<TileModel> = {\n      subjects: ['foo'],\n      creators: ['bar'],\n      source: 'baz',\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${model}></tile-list>\n    `);\n\n    const subjectLink = el.shadowRoot?.querySelector('#topics a[href]');\n    expect(subjectLink).to.exist;\n    expect(subjectLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('subject:\"foo\"')}`\n    );\n\n    const creatorLink = el.shadowRoot?.querySelector('#creator a[href]');\n    expect(creatorLink).to.exist;\n    expect(creatorLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('creator:\"bar\"')}`\n    );\n\n    const sourceLink = el.shadowRoot?.querySelector('#source a[href]');\n    expect(sourceLink).to.exist;\n    expect(sourceLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('source:\"baz\"')}`\n    );\n  });\n\n  it('should render multi-line descriptions with spaces b/w lines', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ description: 'line1\\nline2' }}> </tile-list>\n    `);\n\n    const descriptionBlock = el.shadowRoot?.getElementById('description');\n    expect(descriptionBlock).to.exist;\n    expect(descriptionBlock?.textContent?.trim()).to.equal('line1 line2'); // line break replaced by space\n  });\n\n  it('should render date added for accounts', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{\n          mediatype: 'account',\n          dateAdded: new Date('2015-05-05T00:00:00'),\n        }}\n      >\n      </tile-list>\n    `);\n\n    const creatorBlock = el.shadowRoot?.getElementById('creator');\n    expect(creatorBlock).to.exist;\n    expect(creatorBlock?.textContent?.trim()).to.equal('Archivist since 2015');\n  });\n});\n"]}
+{"version":3,"file":"tile-list.test.js","sourceRoot":"","sources":["../../../../test/tiles/list/tile-list.test.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport { expect, fixture } from '@open-wc/testing';\nimport { html } from 'lit';\nimport type { TileList } from '../../../src/tiles/list/tile-list';\n\nimport '../../../src/tiles/list/tile-list';\nimport { MockCollectionNameCache } from '../../mocks/mock-collection-name-cache';\nimport type { TileModel } from '../../../src/models';\n\ndescribe('List Tile', () => {\n  it('should render initial component', async () => {\n    const el = await fixture<TileList>(\n      html`<tile-list .model=${{}}></tile-list>`\n    );\n\n    const listContainer = el.shadowRoot?.querySelector('#list-line');\n    const itemTitle = el.shadowRoot?.querySelector('#title');\n    const imageBlock = el.shadowRoot?.querySelector('image-block');\n\n    expect(listContainer).to.exist;\n    expect(itemTitle).to.exist;\n    expect(imageBlock).to.exist;\n  });\n\n  it('should render the mobile template if below mobile breakpoint', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .mobileBreakpoint=${500} .currentWidth=${400}> </tile-list>\n    `);\n\n    const listContainer = el.shadowRoot?.getElementById('list-line');\n    const topLine = el.shadowRoot?.getElementById('list-line-top');\n    const bottomLine = el.shadowRoot?.getElementById('list-line-bottom');\n\n    expect(listContainer).to.exist;\n    expect(listContainer?.classList.contains('mobile')).to.be.true;\n    expect(topLine).to.exist;\n    expect(bottomLine).to.exist;\n  });\n\n  it('should render with creator element but not dates', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ creators: ['someone'] }}></tile-list>\n    `);\n\n    const creator = el.shadowRoot?.querySelector('#creator');\n    const datesLine = el.shadowRoot?.querySelector('#dates-line');\n\n    expect(creator).to.exist;\n    expect(datesLine?.children.length).to.equal(0);\n  });\n\n  it('should render with snippet block when it has snippets', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ snippets: ['some {{{snippet}}} text'] }}>\n      </tile-list>\n    `);\n\n    const snippetBlock = el.shadowRoot?.querySelector('text-snippet-block');\n\n    expect(snippetBlock).to.exist;\n  });\n\n  it('should not render snippet block when no snippets are present', async () => {\n    const el = await fixture<TileList>(html`<tile-list></tile-list>`);\n\n    const snippetBlock = el.shadowRoot?.querySelector('text-snippet-block');\n\n    expect(snippetBlock).to.not.exist;\n  });\n\n  it('should not render suppressed collections', async () => {\n    const collectionNameCache = new MockCollectionNameCache();\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ collections: ['deemphasize', 'community', 'foo'] }}\n        .collectionNameCache=${collectionNameCache}\n      >\n      </tile-list>\n    `);\n\n    const collectionsRow = el.shadowRoot?.getElementById('collections');\n    expect(collectionsRow).to.exist;\n\n    const collectionLinks = collectionsRow?.querySelectorAll('a[href]');\n    expect(collectionLinks?.length).to.equal(1);\n    expect(collectionLinks?.item(0).getAttribute('href')).to.equal(\n      '/details/foo'\n    );\n  });\n\n  it('should not render fav- collections', async () => {\n    const collectionNameCache = new MockCollectionNameCache();\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ collections: ['fav-foo', 'bar'] }}\n        .collectionNameCache=${collectionNameCache}\n      >\n      </tile-list>\n    `);\n\n    const collectionsRow = el.shadowRoot?.getElementById('collections');\n    expect(collectionsRow).to.exist;\n\n    const collectionLinks = collectionsRow?.querySelectorAll('a[href]');\n    expect(collectionLinks?.length).to.equal(1);\n    expect(collectionLinks?.item(0).getAttribute('href')).to.equal(\n      '/details/bar'\n    );\n  });\n\n  it('should render weekly views when sorting by week', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{ viewCount: 50, weeklyViewCount: 10 }}\n        .sortParam=${{ field: 'week', direction: 'desc' }}\n      >\n      </tile-list>\n    `);\n\n    const viewsRow = el.shadowRoot?.getElementById('views-line');\n    expect(viewsRow).to.exist;\n    expect(viewsRow?.textContent?.trim()).to.equal('Views:  10');\n  });\n\n  it('should render added date when sorting by it', async () => {\n    const model: Partial<TileModel> = {\n      dateAdded: new Date('2010-01-01'),\n      dateArchived: new Date('2011-01-01'),\n      datePublished: new Date('2012-01-01'),\n      dateReviewed: new Date('2013-01-01'),\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${model}\n        .sortParam=${{ field: 'addeddate', direction: 'desc' }}\n      >\n      </tile-list>\n    `);\n\n    const dateRow = el.shadowRoot?.getElementById('dates-line');\n    expect(dateRow).to.exist;\n    expect(dateRow?.textContent?.trim()).to.contain('Added:  Jan 01, 2010');\n  });\n\n  it('should render links to /search pages (not search.php) for subject, creator, and source', async () => {\n    const model: Partial<TileModel> = {\n      subjects: ['foo'],\n      creators: ['bar'],\n      source: 'baz',\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${model}></tile-list>\n    `);\n\n    const subjectLink = el.shadowRoot?.querySelector('#topics a[href]');\n    expect(subjectLink).to.exist;\n    expect(subjectLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('subject:\"foo\"')}`\n    );\n\n    const creatorLink = el.shadowRoot?.querySelector('#creator a[href]');\n    expect(creatorLink).to.exist;\n    expect(creatorLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('creator:\"bar\"')}`\n    );\n\n    const sourceLink = el.shadowRoot?.querySelector('#source a[href]');\n    expect(sourceLink).to.exist;\n    expect(sourceLink?.getAttribute('href')).to.equal(\n      `/search?query=${encodeURIComponent('source:\"baz\"')}`\n    );\n  });\n\n  it('should render multi-line descriptions with spaces b/w lines', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list .model=${{ description: 'line1\\nline2' }}> </tile-list>\n    `);\n\n    const descriptionBlock = el.shadowRoot?.getElementById('description');\n    expect(descriptionBlock).to.exist;\n    expect(descriptionBlock?.textContent?.trim()).to.equal('line1 line2'); // line break replaced by space\n  });\n\n  it('should render mediatype icon as link to corresponding mediatype collection details', async () => {\n    const model: Partial<TileModel> = {\n      mediatype: 'texts',\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .baseNavigationUrl=${'https://archive.org'}\n        .model=${model}\n      ></tile-list>\n    `);\n\n    const mediatypeLink = el.shadowRoot?.querySelector('a#icon-right');\n    expect(mediatypeLink).to.exist;\n    expect(mediatypeLink?.getAttribute('href')).to.equal(\n      `https://archive.org/details/texts`\n    );\n  });\n\n  it('should render collection mediatype icon as link to search page', async () => {\n    const model: Partial<TileModel> = {\n      mediatype: 'collection',\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .baseNavigationUrl=${'https://archive.org'}\n        .model=${model}\n      ></tile-list>\n    `);\n\n    const mediatypeLink = el.shadowRoot?.querySelector('a#icon-right');\n    expect(mediatypeLink).to.exist;\n    expect(mediatypeLink?.getAttribute('href')).to.equal(\n      `https://archive.org/search?query=mediatype:collection&sort=-downloads`\n    );\n  });\n\n  it('should not render account mediatype icon as link', async () => {\n    const model: Partial<TileModel> = {\n      mediatype: 'account',\n    };\n\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .baseNavigationUrl=${'https://archive.org'}\n        .model=${model}\n      ></tile-list>\n    `);\n\n    const mediatypeLink = el.shadowRoot?.querySelector('a#icon-right');\n    expect(mediatypeLink).to.exist;\n    expect(mediatypeLink?.getAttribute('href')).not.to.exist;\n  });\n\n  it('should render date added for accounts', async () => {\n    const el = await fixture<TileList>(html`\n      <tile-list\n        .model=${{\n          mediatype: 'account',\n          dateAdded: new Date('2015-05-05T00:00:00'),\n        }}\n      >\n      </tile-list>\n    `);\n\n    const creatorBlock = el.shadowRoot?.getElementById('creator');\n    expect(creatorBlock).to.exist;\n    expect(creatorBlock?.textContent?.trim()).to.equal('Archivist since 2015');\n  });\n});\n"]}

package/index.html

@@ -2,6 +2,7 @@
 <html lang="en-GB">
 <head>
   <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
   <style>
     html {
       font-size: 10px; /* This is to match petabox's base font size */

package/package.json

@@ -3,7 +3,7 @@
   "description": "The Internet Archive Collection Browser.",
   "license": "AGPL-3.0-only",
   "author": "Internet Archive",
-  "version": "0.4.4-alpha",
+  "version": "0.4.4",
   "main": "dist/index.js",
   "module": "dist/index.js",
   "scripts": {
@@ -26,7 +26,7 @@
     "@internetarchive/collection-name-cache": "^0.2.3",
     "@internetarchive/feature-feedback": "^0.1.4",
     "@internetarchive/field-parsers": "^0.1.3",
-    "@internetarchive/histogram-date-range": "^0.1.7",
+    "@internetarchive/histogram-date-range": "^0.1.8",
     "@internetarchive/ia-activity-indicator": "^0.0.3",
     "@internetarchive/infinite-scroller": "^0.1.3",
     "@internetarchive/local-cache": "^0.2.1",

package/src/app-root.ts

@@ -125,7 +125,7 @@ export class AppRoot extends LitElement {
         <div id="dev-tools" class=${this.getClass}>
           <div id="search-and-page-inputs">
             <form @submit=${this.searchPressed}>
-              Query:
+              <label for="base-query-field"> Query: </label>
               <input
                 type="text"
                 id="base-query-field"
@@ -134,7 +134,8 @@ export class AppRoot extends LitElement {
               <input type="submit" value="Search" />
             </form>
             <form @submit=${this.changePagePressed}>
-              Page: <input type="number" value="1" id="page-number-input" />
+              <label for="page-number-input"> Page: </label>
+              <input type="number" value="1" id="page-number-input" />
               <input type="submit" value="Go" />
             </form>
           </div>
@@ -587,10 +588,24 @@ export class AppRoot extends LitElement {
       cursor: pointer;
     }
 
+    #search-and-page-inputs {
+      flex-wrap: wrap;
+      row-gap: 2px;
+    }
+
     #search-and-page-inputs > form {
       margin-right: 1rem;
     }
 
+    #search-and-page-inputs label {
+      display: inline-block;
+      min-width: 50px;
+    }
+
+    #page-number-input {
+      width: 75px;
+    }
+
     .search-type {
       margin-right: 1rem;
     }