@internetarchive/collection-browser 0.1.1 → 0.1.3

package/demo/app-root.ts

@@ -155,6 +155,7 @@ export class AppRoot extends LitElement {
       <div id="collection-browser-container">
         <collection-browser
           .baseNavigationUrl=${'https://archive.org'}
+          .baseImageUrl=${'https://archive.org'}
           .searchService=${this.searchService}
           .resizeObserver=${this.resizeObserver}
           .collectionNameCache=${this.collectionNameCache}

package/dist/demo/app-root.js

@@ -135,6 +135,7 @@ let AppRoot = class AppRoot extends LitElement {
       <div id="collection-browser-container">
         <collection-browser
           .baseNavigationUrl=${'https://archive.org'}
+          .baseImageUrl=${'https://archive.org'}
           .searchService=${this.searchService}
           .resizeObserver=${this.resizeObserver}
           .collectionNameCache=${this.collectionNameCache}

package/dist/demo/app-root.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import { SearchService } from '@internetarchive/search-service';\nimport { LocalCache } from '@internetarchive/local-cache';\nimport { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { CollectionNameCache } from '@internetarchive/collection-name-cache';\nimport type { CollectionBrowser } from '../src/collection-browser';\nimport '../src/collection-browser';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  private searchService = SearchService.default;\n\n  private resizeObserver = new SharedResizeObserver();\n\n  private localCache = new LocalCache();\n\n  private collectionNameCache = new CollectionNameCache({\n    searchService: this.searchService,\n    localCache: this.localCache,\n  });\n\n  @state() private currentPage?: number;\n\n  @state() private searchQuery?: string;\n\n  @state() private cellWidth: number = 18;\n\n  @state() private cellHeight: number = 29;\n\n  @state() private rowGap: number = 1.7;\n\n  @state() private colGap: number = 1.7;\n\n  @query('#base-query-field') private baseQueryField!: HTMLInputElement;\n\n  @query('#page-number-input') private pageNumberInput!: HTMLInputElement;\n\n  @query('collection-browser') private collectionBrowser!: CollectionBrowser;\n\n  private searchPressed(e: Event) {\n    e.preventDefault();\n    this.searchQuery = this.baseQueryField.value;\n    if ((this.currentPage ?? 1) > 1) {\n      this.collectionBrowser.goToPage(this.currentPage ?? 1);\n    }\n  }\n\n  private changePagePressed(e: Event) {\n    e.preventDefault();\n    this.currentPage = this.pageNumberInput.valueAsNumber;\n    this.collectionBrowser.goToPage(this.currentPage);\n  }\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('currentPage') && this.currentPage) {\n      this.pageNumberInput.value = this.currentPage.toString();\n    }\n\n    if (changed.has('searchQuery')) {\n      this.queryUpdated();\n    }\n  }\n\n  private queryUpdated() {\n    this.collectionBrowser.baseQuery = this.searchQuery;\n  }\n\n  render() {\n    return html`\n      <div id=\"dev-tools\">\n        <form @submit=${this.searchPressed}>\n          Query:\n          <input\n            type=\"text\"\n            id=\"base-query-field\"\n            .value=${this.searchQuery ?? ''}\n          />\n          <input type=\"submit\" value=\"Search\" />\n        </form>\n\n        <form @submit=${this.changePagePressed}>\n          Page: <input type=\"number\" value=\"1\" id=\"page-number-input\" />\n          <input type=\"submit\" value=\"Go\" />\n        </form>\n\n        <div id=\"cell-controls\">\n          <div id=\"cell-size-control\">\n            <div>\n              <label for=\"cell-width-slider\">Minimum cell width:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"18\"\n                step=\"0.1\"\n                id=\"cell-width-slider\"\n                @input=${this.widthChanged}\n              />\n              <span>${this.cellWidth}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-height-slider\">Cell height:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"29\"\n                step=\"0.1\"\n                id=\"cell-height-slider\"\n                @input=${this.heightChanged}\n              />\n              <span>${this.cellHeight}rem</span>\n            </div>\n            <div>\n              <label for=\"show-outline-check\">Show outlines:</label>\n              <input\n                type=\"checkbox\"\n                id=\"show-outline-check\"\n                @click=${this.outlineChanged}\n              />\n            </div>\n          </div>\n          <div id=\"cell-gap-control\">\n            <div>\n              <label for=\"cell-row-gap-slider\">Row gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-row-gap-slider\"\n                @input=${this.rowGapChanged}\n              />\n              <span>${this.rowGap}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-col-gap-slider\">Col gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-col-gap-slider\"\n                @input=${this.colGapChanged}\n              />\n              <span>${this.colGap}rem</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div id=\"collection-browser-container\">\n        <collection-browser\n          .baseNavigationUrl=${'https://archive.org'}\n          .searchService=${this.searchService}\n          .resizeObserver=${this.resizeObserver}\n          .collectionNameCache=${this.collectionNameCache}\n          .showHistogramDatePicker=${true}\n          @visiblePageChanged=${this.visiblePageChanged}\n          @baseQueryChanged=${this.baseQueryChanged}\n        >\n        </collection-browser>\n      </div>\n    `;\n  }\n\n  private baseQueryChanged(e: CustomEvent<{ baseQuery?: string }>) {\n    this.searchQuery = e.detail.baseQuery;\n  }\n\n  private outlineChanged(e: Event) {\n    const target = e.target as HTMLInputElement;\n    if (target.checked) {\n      this.collectionBrowser.style.setProperty(\n        '--infiniteScrollerCellOutline',\n        '1px solid #33D1FF'\n      );\n    } else {\n      this.collectionBrowser.style.removeProperty(\n        '--infiniteScrollerCellOutline'\n      );\n    }\n  }\n\n  private rowGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.rowGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserRowGap',\n      `${input.value}rem`\n    );\n  }\n\n  private colGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.colGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserColGap',\n      `${input.value}rem`\n    );\n  }\n\n  private widthChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellWidth = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinWidth',\n      `${input.value}rem`\n    );\n  }\n\n  private heightChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellHeight = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinHeight',\n      `${input.value}rem`\n    );\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMaxHeight',\n      `${input.value}rem`\n    );\n  }\n\n  private visiblePageChanged(e: CustomEvent<{ pageNumber: number }>) {\n    const { pageNumber } = e.detail;\n    if (pageNumber === this.currentPage) return;\n    this.currentPage = pageNumber;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n    }\n\n    input,\n    button {\n      font-size: 1.6rem;\n    }\n\n    collection-browser {\n      margin-top: 30rem;\n    }\n\n    #base-query-field {\n      width: 300px;\n    }\n\n    #dev-tools {\n      position: fixed;\n      top: 0;\n      left: 0;\n      z-index: 10;\n      -webkit-backdrop-filter: blur(10px);\n      backdrop-filter: blur(10px);\n      padding: 0.5rem 1rem;\n      border: 1px solid black;\n    }\n\n    #cell-controls {\n      display: flex;\n    }\n\n    #cell-controls label {\n      display: inline-block;\n      width: 10rem;\n    }\n\n    #cell-gap-control {\n      margin-left: 1rem;\n    }\n  `;\n}\n"]}
+{"version":3,"file":"app-root.js","sourceRoot":"","sources":["../../demo/app-root.ts"],"names":[],"mappings":"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","sourcesContent":["import { SearchService } from '@internetarchive/search-service';\nimport { LocalCache } from '@internetarchive/local-cache';\nimport { html, css, LitElement, PropertyValues } from 'lit';\nimport { customElement, query, state } from 'lit/decorators.js';\nimport { SharedResizeObserver } from '@internetarchive/shared-resize-observer';\nimport { CollectionNameCache } from '@internetarchive/collection-name-cache';\nimport type { CollectionBrowser } from '../src/collection-browser';\nimport '../src/collection-browser';\n\n@customElement('app-root')\nexport class AppRoot extends LitElement {\n  private searchService = SearchService.default;\n\n  private resizeObserver = new SharedResizeObserver();\n\n  private localCache = new LocalCache();\n\n  private collectionNameCache = new CollectionNameCache({\n    searchService: this.searchService,\n    localCache: this.localCache,\n  });\n\n  @state() private currentPage?: number;\n\n  @state() private searchQuery?: string;\n\n  @state() private cellWidth: number = 18;\n\n  @state() private cellHeight: number = 29;\n\n  @state() private rowGap: number = 1.7;\n\n  @state() private colGap: number = 1.7;\n\n  @query('#base-query-field') private baseQueryField!: HTMLInputElement;\n\n  @query('#page-number-input') private pageNumberInput!: HTMLInputElement;\n\n  @query('collection-browser') private collectionBrowser!: CollectionBrowser;\n\n  private searchPressed(e: Event) {\n    e.preventDefault();\n    this.searchQuery = this.baseQueryField.value;\n    if ((this.currentPage ?? 1) > 1) {\n      this.collectionBrowser.goToPage(this.currentPage ?? 1);\n    }\n  }\n\n  private changePagePressed(e: Event) {\n    e.preventDefault();\n    this.currentPage = this.pageNumberInput.valueAsNumber;\n    this.collectionBrowser.goToPage(this.currentPage);\n  }\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('currentPage') && this.currentPage) {\n      this.pageNumberInput.value = this.currentPage.toString();\n    }\n\n    if (changed.has('searchQuery')) {\n      this.queryUpdated();\n    }\n  }\n\n  private queryUpdated() {\n    this.collectionBrowser.baseQuery = this.searchQuery;\n  }\n\n  render() {\n    return html`\n      <div id=\"dev-tools\">\n        <form @submit=${this.searchPressed}>\n          Query:\n          <input\n            type=\"text\"\n            id=\"base-query-field\"\n            .value=${this.searchQuery ?? ''}\n          />\n          <input type=\"submit\" value=\"Search\" />\n        </form>\n\n        <form @submit=${this.changePagePressed}>\n          Page: <input type=\"number\" value=\"1\" id=\"page-number-input\" />\n          <input type=\"submit\" value=\"Go\" />\n        </form>\n\n        <div id=\"cell-controls\">\n          <div id=\"cell-size-control\">\n            <div>\n              <label for=\"cell-width-slider\">Minimum cell width:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"18\"\n                step=\"0.1\"\n                id=\"cell-width-slider\"\n                @input=${this.widthChanged}\n              />\n              <span>${this.cellWidth}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-height-slider\">Cell height:</label>\n              <input\n                type=\"range\"\n                min=\"10\"\n                max=\"100\"\n                value=\"29\"\n                step=\"0.1\"\n                id=\"cell-height-slider\"\n                @input=${this.heightChanged}\n              />\n              <span>${this.cellHeight}rem</span>\n            </div>\n            <div>\n              <label for=\"show-outline-check\">Show outlines:</label>\n              <input\n                type=\"checkbox\"\n                id=\"show-outline-check\"\n                @click=${this.outlineChanged}\n              />\n            </div>\n          </div>\n          <div id=\"cell-gap-control\">\n            <div>\n              <label for=\"cell-row-gap-slider\">Row gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-row-gap-slider\"\n                @input=${this.rowGapChanged}\n              />\n              <span>${this.rowGap}rem</span>\n            </div>\n            <div>\n              <label for=\"cell-col-gap-slider\">Col gap:</label>\n              <input\n                type=\"range\"\n                min=\"0\"\n                max=\"5\"\n                value=\"1.7\"\n                step=\"0.1\"\n                id=\"cell-col-gap-slider\"\n                @input=${this.colGapChanged}\n              />\n              <span>${this.colGap}rem</span>\n            </div>\n          </div>\n        </div>\n      </div>\n\n      <div id=\"collection-browser-container\">\n        <collection-browser\n          .baseNavigationUrl=${'https://archive.org'}\n          .baseImageUrl=${'https://archive.org'}\n          .searchService=${this.searchService}\n          .resizeObserver=${this.resizeObserver}\n          .collectionNameCache=${this.collectionNameCache}\n          .showHistogramDatePicker=${true}\n          @visiblePageChanged=${this.visiblePageChanged}\n          @baseQueryChanged=${this.baseQueryChanged}\n        >\n        </collection-browser>\n      </div>\n    `;\n  }\n\n  private baseQueryChanged(e: CustomEvent<{ baseQuery?: string }>) {\n    this.searchQuery = e.detail.baseQuery;\n  }\n\n  private outlineChanged(e: Event) {\n    const target = e.target as HTMLInputElement;\n    if (target.checked) {\n      this.collectionBrowser.style.setProperty(\n        '--infiniteScrollerCellOutline',\n        '1px solid #33D1FF'\n      );\n    } else {\n      this.collectionBrowser.style.removeProperty(\n        '--infiniteScrollerCellOutline'\n      );\n    }\n  }\n\n  private rowGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.rowGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserRowGap',\n      `${input.value}rem`\n    );\n  }\n\n  private colGapChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.colGap = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserColGap',\n      `${input.value}rem`\n    );\n  }\n\n  private widthChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellWidth = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinWidth',\n      `${input.value}rem`\n    );\n  }\n\n  private heightChanged(e: Event) {\n    const input = e.target as HTMLInputElement;\n    this.cellHeight = parseFloat(input.value);\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMinHeight',\n      `${input.value}rem`\n    );\n    this.collectionBrowser.style.setProperty(\n      '--collectionBrowserCellMaxHeight',\n      `${input.value}rem`\n    );\n  }\n\n  private visiblePageChanged(e: CustomEvent<{ pageNumber: number }>) {\n    const { pageNumber } = e.detail;\n    if (pageNumber === this.currentPage) return;\n    this.currentPage = pageNumber;\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n    }\n\n    input,\n    button {\n      font-size: 1.6rem;\n    }\n\n    collection-browser {\n      margin-top: 30rem;\n    }\n\n    #base-query-field {\n      width: 300px;\n    }\n\n    #dev-tools {\n      position: fixed;\n      top: 0;\n      left: 0;\n      z-index: 10;\n      -webkit-backdrop-filter: blur(10px);\n      backdrop-filter: blur(10px);\n      padding: 0.5rem 1rem;\n      border: 1px solid black;\n    }\n\n    #cell-controls {\n      display: flex;\n    }\n\n    #cell-controls label {\n      display: inline-block;\n      width: 10rem;\n    }\n\n    #cell-gap-control {\n      margin-left: 1rem;\n    }\n  `;\n}\n"]}

package/dist/src/collection-browser.d.ts

@@ -14,6 +14,7 @@ import { SelectedFacets, SortField, CollectionBrowserContext, CollectionDisplayM
 import { RestorationStateHandlerInterface } from './restoration-state-handler';
 export declare class CollectionBrowser extends LitElement implements InfiniteScrollerCellProviderInterface, SharedResizeObserverResizeHandlerInterface {
     baseNavigationUrl?: string;
+    baseImageUrl?: string;
     searchService?: SearchServiceInterface;
     baseQuery?: string;
     displayMode?: CollectionDisplayMode;

package/dist/src/collection-browser.js

@@ -318,7 +318,9 @@ let CollectionBrowser = class CollectionBrowser extends LitElement {
         this.restoreState();
     }
     updated(changed) {
-        if (changed.has('displayMode') || changed.has('baseNavigationUrl')) {
+        if (changed.has('displayMode') ||
+            changed.has('baseNavigationUrl') ||
+            changed.has('baseImageUrl')) {
             this.infiniteScroller.reload();
         }
         if (changed.has('baseQuery')) {
@@ -843,6 +845,7 @@ let CollectionBrowser = class CollectionBrowser extends LitElement {
             return undefined;
         return html ` <tile-dispatcher
       .baseNavigationUrl=${this.baseNavigationUrl}
+      .baseImageUrl=${this.baseImageUrl}
       .model=${model}
       .tileDisplayMode=${this.displayMode}
       .resizeObserver=${this.resizeObserver}
@@ -1042,6 +1045,9 @@ CollectionBrowser.styles = css `
 __decorate([
     property({ type: String })
 ], CollectionBrowser.prototype, "baseNavigationUrl", void 0);
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "baseImageUrl", void 0);
 __decorate([
     property({ type: Object })
 ], CollectionBrowser.prototype, "searchService", void 0);

package/dist/src/collection-browser.js.map

@@ -1 +1 @@
-{"version":3,"file":"collection-browser.js","sourceRoot":"","sources":["../../src/collection-browser.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport {\n  html,\n  css,\n  LitElement,\n  PropertyValues,\n  TemplateResult,\n  nothing,\n} from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type {\n  InfiniteScroller,\n  InfiniteScrollerCellProviderInterface,\n} from '@internetarchive/infinite-scroller';\nimport type {\n  Aggregation,\n  Metadata,\n  SearchParams,\n  SearchServiceInterface,\n  SortDirection,\n  SortParam,\n} from '@internetarchive/search-service';\nimport {\n  SharedResizeObserverInterface,\n  SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\nimport '@internetarchive/infinite-scroller';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport './tiles/tile-dispatcher';\nimport './tiles/collection-browser-loading-tile';\nimport './sort-filter-bar/sort-filter-bar';\nimport './collection-facets';\nimport './circular-activity-indicator';\nimport './sort-filter-bar/sort-filter-bar';\nimport {\n  SelectedFacets,\n  SortField,\n  SortFieldToMetadataField,\n  CollectionBrowserContext,\n  defaultSelectedFacets,\n  TileModel,\n  CollectionDisplayMode,\n} from './models';\nimport {\n  RestorationStateHandlerInterface,\n  RestorationStateHandler,\n  RestorationState,\n} from './restoration-state-handler';\nimport chevronIcon from './assets/img/icons/chevron';\nimport { LanguageCodeHandler } from './language-code-handler/language-code-handler';\n\n@customElement('collection-browser')\nexport class CollectionBrowser\n  extends LitElement\n  implements\n    InfiniteScrollerCellProviderInterface,\n    SharedResizeObserverResizeHandlerInterface\n{\n  @property({ type: String }) baseNavigationUrl?: string;\n\n  @property({ type: Object }) searchService?: SearchServiceInterface;\n\n  @property({ type: String }) baseQuery?: string;\n\n  @property({ type: String }) displayMode?: CollectionDisplayMode;\n\n  @property({ type: Object }) sortParam: SortParam | null = null;\n\n  @property({ type: String }) selectedSort: SortField = SortField.relevance;\n\n  @property({ type: String }) selectedTitleFilter: string | null = null;\n\n  @property({ type: String }) selectedCreatorFilter: string | null = null;\n\n  @property({ type: String }) sortDirection: SortDirection | null = null;\n\n  @property({ type: String }) dateRangeQueryClause?: string;\n\n  @property({ type: Number }) pageSize = 50;\n\n  @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\n\n  @property({ type: String }) titleQuery?: string;\n\n  @property({ type: String }) creatorQuery?: string;\n\n  @property({ type: Number }) currentPage?: number;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n  @property({ type: Boolean }) showHistogramDatePicker = false;\n\n  @property({ type: Object })\n  collectionNameCache?: CollectionNameCacheInterface;\n\n  @property({ type: String }) pageContext: CollectionBrowserContext = 'search';\n\n  @property({ type: Object })\n  restorationStateHandler: RestorationStateHandlerInterface = new RestorationStateHandler(\n    {\n      context: this.pageContext,\n    }\n  );\n\n  @property({ type: Number }) mobileBreakpoint = 600;\n\n  /**\n   * The page that the consumer wants to load.\n   */\n  private initialPageNumber = 1;\n\n  /**\n   * This the the number of pages that we want to show.\n   *\n   * The data isn't necessarily loaded for all of the pages, but this lets us\n   * know how many cells we should render.\n   */\n  @state() private pagesToRender = this.initialPageNumber;\n\n  @state() private searchResultsLoading = false;\n\n  @state() private facetsLoading = false;\n\n  @state() private fullYearAggregationLoading = false;\n\n  @state() private aggregations?: Record<string, Aggregation>;\n\n  @state() private fullYearsHistogramAggregation: Aggregation | undefined;\n\n  @state() private totalResults?: number;\n\n  @state() private mobileView = false;\n\n  @state() private mobileFacetsVisible = false;\n\n  @query('#content-container') private contentContainer!: HTMLDivElement;\n\n  private languageCodeHandler = new LanguageCodeHandler();\n\n  /**\n   * When we're animated scrolling to the page, we don't want to fetch\n   * all of the pages as it scrolls so this lets us know if we're scrolling\n   */\n  private isScrollingToCell = false;\n\n  /**\n   * When we've reached the end of the data, stop trying to fetch more\n   */\n  private endOfDataReached = false;\n\n  private placeholderCellTemplate = html`<collection-browser-loading-tile></collection-browser-loading-tile>`;\n\n  private tileModelAtCellIndex(index: number): TileModel | undefined {\n    const pageNumber = Math.floor(index / this.pageSize) + 1;\n    const itemIndex = index % this.pageSize;\n    const model = this.dataSource[pageNumber]?.[itemIndex];\n    /**\n     * If we encounter a model we don't have yet and we're not in the middle of an\n     * automated scroll, fetch the page and just return undefined.\n     * The datasource will be updated once the page is loaded and the cell will be rendered.\n     *\n     * We disable it during the automated scroll since we may fetch pages for cells the\n     * user may never see.\n     */\n    if (!model && !this.isScrollingToCell) {\n      this.fetchPage(pageNumber);\n    }\n    return model;\n  }\n\n  private get sortFilterQueries(): string {\n    const queries = [this.titleQuery, this.creatorQuery];\n    return queries.filter(q => q).join(' AND ');\n  }\n\n  // this is the total number of tiles we expect if\n  // the data returned is a full page worth\n  // this is useful for putting in placeholders for the expected number of tiles\n  private get estimatedTileCount(): number {\n    return this.pagesToRender * this.pageSize;\n  }\n\n  // this is the actual number of tiles in the datasource,\n  // which is useful for removing excess placeholder tiles\n  // once we reached the end of the data\n  private get actualTileCount(): number {\n    return Object.keys(this.dataSource).reduce(\n      (acc, page) => acc + this.dataSource[page].length,\n      0\n    );\n  }\n\n  /**\n   * The results per page so we can paginate.\n   *\n   * This allows us to start in the middle of the search results and\n   * fetch data before or after the current page. If we don't have a key\n   * for the previous/next page, we'll fetch the next/previous page to populate it\n   */\n  private dataSource: Record<string, TileModel[]> = {};\n\n  @query('infinite-scroller')\n  private infiniteScroller!: InfiniteScroller;\n\n  /**\n   * Go to the given page of results\n   *\n   * @param pageNumber\n   */\n  goToPage(pageNumber: number) {\n    this.initialPageNumber = pageNumber;\n    this.pagesToRender = pageNumber;\n    this.scrollToPage(pageNumber);\n  }\n\n  clearFilters() {\n    this.selectedFacets = defaultSelectedFacets;\n    this.sortParam = null;\n    this.selectedTitleFilter = null;\n    this.selectedCreatorFilter = null;\n    this.titleQuery = undefined;\n    this.creatorQuery = undefined;\n    this.selectedSort = SortField.relevance;\n    this.sortDirection = null;\n  }\n\n  render() {\n    return html`\n      <div id=\"content-container\" class=${this.mobileView ? 'mobile' : ''}>\n        <div id=\"left-column\" class=\"column\">\n          <div id=\"mobile-header-container\">\n            ${this.mobileView\n              ? html`\n                  <div id=\"mobile-filter-collapse\">\n                    <h1\n                      @click=${() => {\n                        this.mobileFacetsVisible = !this.mobileFacetsVisible;\n                      }}\n                      @keyup=${() => {\n                        this.mobileFacetsVisible = !this.mobileFacetsVisible;\n                      }}\n                    >\n                      <span\n                        class=\"collapser ${this.mobileFacetsVisible\n                          ? 'open'\n                          : ''}\"\n                      >\n                        ${chevronIcon}\n                      </span>\n                      Filters\n                    </h1>\n                  </div>\n                `\n              : nothing}\n            <div id=\"results-total\">\n              <span id=\"big-results-count\"\n                >${this.totalResults !== undefined\n                  ? this.totalResults.toLocaleString()\n                  : '-'}</span\n              >\n              <span id=\"big-results-label\">Results</span>\n            </div>\n          </div>\n          <div\n            id=\"facets-container\"\n            class=${!this.mobileView || this.mobileFacetsVisible\n              ? 'expanded'\n              : ''}\n          >\n            ${this.facetsTemplate}\n          </div>\n        </div>\n        <div id=\"right-column\" class=\"column\">\n          ${this.searchResultsLoading ? this.loadingTemplate : nothing}\n          <sort-filter-bar\n            .selectedSort=${this.selectedSort}\n            .sortDirection=${this.sortDirection}\n            .displayMode=${this.displayMode}\n            .selectedTitleFilter=${this.selectedTitleFilter}\n            .selectedCreatorFilter=${this.selectedCreatorFilter}\n            .resizeObserver=${this.resizeObserver}\n            @sortChanged=${this.userChangedSort}\n            @displayModeChanged=${this.displayModeChanged}\n            @titleLetterChanged=${this.titleLetterSelected}\n            @creatorLetterChanged=${this.creatorLetterSelected}\n          ></sort-filter-bar>\n\n          ${this.displayMode === `list-compact`\n            ? this.listHeaderTemplate\n            : nothing}\n          ${!this.searchResultsLoading && this.totalResults === 0\n            ? html`\n                <h2>\n                  Your search did not match any items in the Archive. Try\n                  different keywords or a more general search.\n                </h2>\n              `\n            : nothing}\n\n          <infinite-scroller\n            class=\"${ifDefined(this.displayMode)}\"\n            .cellProvider=${this}\n            .placeholderCellTemplate=${this.placeholderCellTemplate}\n            @scrollThresholdReached=${this.scrollThresholdReached}\n            @visibleCellsChanged=${this.visibleCellsChanged}\n          >\n          </infinite-scroller>\n        </div>\n      </div>\n    `;\n  }\n\n  private userChangedSort(\n    e: CustomEvent<{\n      selectedSort: SortField;\n      sortDirection: SortDirection | null;\n    }>\n  ) {\n    const { selectedSort, sortDirection } = e.detail;\n    this.selectedSort = selectedSort;\n    this.sortDirection = sortDirection;\n\n    if ((this.currentPage ?? 1) > 1) {\n      this.goToPage(1);\n    }\n    this.currentPage = 1;\n  }\n\n  private selectedSortChanged() {\n    if (this.selectedSort === 'relevance' || this.sortDirection === null) {\n      this.sortParam = null;\n      return;\n    }\n    const sortField = SortFieldToMetadataField[this.selectedSort];\n    if (!sortField) return;\n    this.sortParam = { field: sortField, direction: this.sortDirection };\n  }\n\n  private displayModeChanged(\n    e: CustomEvent<{ displayMode: CollectionDisplayMode }>\n  ) {\n    this.displayMode = e.detail.displayMode;\n  }\n\n  private selectedTitleLetterChanged() {\n    this.titleQuery = this.selectedTitleFilter\n      ? `firstTitle:${this.selectedTitleFilter}`\n      : undefined;\n  }\n\n  private selectedCreatorLetterChanged() {\n    this.creatorQuery = this.selectedCreatorFilter\n      ? `firstCreator:${this.selectedCreatorFilter}`\n      : undefined;\n  }\n\n  private titleLetterSelected(e: CustomEvent<{ selectedLetter: string }>) {\n    this.selectedCreatorFilter = null;\n    this.selectedTitleFilter = e.detail.selectedLetter;\n  }\n\n  private creatorLetterSelected(e: CustomEvent<{ selectedLetter: string }>) {\n    this.selectedTitleFilter = null;\n    this.selectedCreatorFilter = e.detail.selectedLetter;\n  }\n\n  private get facetDataLoading(): boolean {\n    return this.facetsLoading || this.fullYearAggregationLoading;\n  }\n\n  private get facetsTemplate() {\n    return html`\n      ${this.facetsLoading ? this.loadingTemplate : nothing}\n      <collection-facets\n        @facetsChanged=${this.facetsChanged}\n        @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n        .aggregations=${this.aggregations}\n        .fullYearsHistogramAggregation=${this.fullYearsHistogramAggregation}\n        .minSelectedDate=${this.minSelectedDate}\n        .maxSelectedDate=${this.maxSelectedDate}\n        .selectedFacets=${this.selectedFacets}\n        .collectionNameCache=${this.collectionNameCache}\n        .languageCodeHandler=${this.languageCodeHandler}\n        .showHistogramDatePicker=${this.showHistogramDatePicker}\n        ?collapsableFacets=${this.mobileView}\n        ?facetsLoading=${this.facetDataLoading}\n        ?fullYearAggregationLoading=${this.fullYearAggregationLoading}\n      ></collection-facets>\n    `;\n  }\n\n  private get loadingTemplate() {\n    return html`\n      <div class=\"loading-cover\">\n        <circular-activity-indicator></circular-activity-indicator>\n      </div>\n    `;\n  }\n\n  private get listHeaderTemplate() {\n    return html`\n      <div id=\"list-header\">\n        <tile-dispatcher\n          .tileDisplayMode=${'list-header'}\n          .resizeObserver=${this.resizeObserver}\n          .sortParam=${this.sortParam}\n          .mobileBreakpoint=${this.mobileBreakpoint}\n        >\n        </tile-dispatcher>\n      </div>\n    `;\n  }\n\n  private get queryDebuggingTemplate() {\n    return html`\n      <div>\n        <ul>\n          <li>Base Query: ${this.baseQuery}</li>\n          <li>Facet Query: ${this.facetQuery}</li>\n          <li>Sort Filter Query: ${this.sortFilterQueries}</li>\n          <li>Date Range Query: ${this.dateRangeQueryClause}</li>\n          <li>Sort: ${this.sortParam?.field} ${this.sortParam?.direction}</li>\n          <li>Full Query: ${this.fullQuery}</li>\n        </ul>\n      </div>\n    `;\n  }\n\n  private histogramDateRangeUpdated(\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ) {\n    const { minDate, maxDate } = e.detail;\n    this.dateRangeQueryClause = `year:[${minDate} TO ${maxDate}]`;\n  }\n\n  firstUpdated(): void {\n    this.setupStateRestorationObserver();\n    this.restoreState();\n  }\n\n  updated(changed: PropertyValues) {\n    if (changed.has('displayMode') || changed.has('baseNavigationUrl')) {\n      this.infiniteScroller.reload();\n    }\n    if (changed.has('baseQuery')) {\n      this.emitBaseQueryChanged();\n    }\n    if (changed.has('currentPage') || changed.has('displayMode')) {\n      this.persistState();\n    }\n    if (\n      changed.has('baseQuery') ||\n      changed.has('titleQuery') ||\n      changed.has('creatorQuery') ||\n      changed.has('dateRangeQueryClause') ||\n      changed.has('sortParam') ||\n      changed.has('selectedFacets') ||\n      changed.has('searchService')\n    ) {\n      this.handleQueryChange();\n    }\n    if (changed.has('selectedSort') || changed.has('sortDirection')) {\n      this.selectedSortChanged();\n    }\n    if (changed.has('selectedTitleFilter')) {\n      this.selectedTitleLetterChanged();\n    }\n    if (changed.has('selectedCreatorFilter')) {\n      this.selectedCreatorLetterChanged();\n    }\n    if (changed.has('pagesToRender')) {\n      if (!this.endOfDataReached) {\n        this.infiniteScroller.itemCount = this.estimatedTileCount;\n      }\n    }\n    if (changed.has('resizeObserver')) {\n      const oldObserver = changed.get(\n        'resizeObserver'\n      ) as SharedResizeObserverInterface;\n      if (oldObserver) this.disconnectResizeObserver(oldObserver);\n      this.setupResizeObserver();\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver) {\n      this.disconnectResizeObserver(this.resizeObserver);\n    }\n    if (this.boundNavigationHandler) {\n      window.removeEventListener('popstate', this.boundNavigationHandler);\n    }\n  }\n\n  handleResize(entry: ResizeObserverEntry): void {\n    if (entry.target === this.contentContainer) {\n      this.mobileView = entry.contentRect.width < 600;\n    }\n  }\n\n  private emitBaseQueryChanged() {\n    this.dispatchEvent(\n      new CustomEvent<{ baseQuery?: string }>('baseQueryChanged', {\n        detail: {\n          baseQuery: this.baseQuery,\n        },\n      })\n    );\n  }\n\n  private disconnectResizeObserver(\n    resizeObserver: SharedResizeObserverInterface\n  ) {\n    resizeObserver.removeObserver({\n      target: this.contentContainer,\n      handler: this,\n    });\n  }\n\n  private setupResizeObserver() {\n    if (!this.resizeObserver) return;\n    this.resizeObserver.addObserver({\n      target: this.contentContainer,\n      handler: this,\n    });\n  }\n\n  /**\n   * When the visible cells change from the infinite scroller, we want to emit\n   * which page is currently visible so the consumer can update its UI or the URL\n   *\n   * @param e\n   * @returns\n   */\n  private visibleCellsChanged(\n    e: CustomEvent<{ visibleCellIndices: number[] }>\n  ) {\n    if (this.isScrollingToCell) return;\n    const { visibleCellIndices } = e.detail;\n    if (visibleCellIndices.length === 0) return;\n    const lastVisibleCellIndex =\n      visibleCellIndices[visibleCellIndices.length - 1];\n    const lastVisibleCellPage =\n      Math.floor(lastVisibleCellIndex / this.pageSize) + 1;\n    if (this.currentPage !== lastVisibleCellPage) {\n      this.currentPage = lastVisibleCellPage;\n    }\n    const event = new CustomEvent('visiblePageChanged', {\n      detail: {\n        pageNumber: lastVisibleCellPage,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  // we only want to scroll on the very first query change\n  // so this keeps track of whether we've already set the initial query\n  private initialQueryChangeHappened = false;\n\n  private historyPopOccurred = false;\n\n  // this lets us store the query key so we know if it's actually changed or not\n  private previousQueryKey?: string;\n\n  private async handleQueryChange() {\n    // only reset if the query has actually changed\n    if (!this.searchService || this.pageFetchQueryKey === this.previousQueryKey)\n      return;\n    this.previousQueryKey = this.pageFetchQueryKey;\n\n    this.dataSource = {};\n    this.pageFetchesInProgress = {};\n    this.endOfDataReached = false;\n    this.pagesToRender = this.initialPageNumber;\n    if (!this.initialQueryChangeHappened && this.initialPageNumber > 1) {\n      this.scrollToPage(this.initialPageNumber);\n    }\n    this.initialQueryChangeHappened = true;\n    // if the query changed as part of a window.history pop event, we don't want to\n    // persist the state because it overwrites the forward history\n    if (!this.historyPopOccurred) {\n      this.persistState();\n      this.historyPopOccurred = false;\n    }\n\n    await Promise.all([\n      this.doInitialPageFetch(),\n      this.fetchFacets(),\n      this.fetchFullYearHistogram(),\n    ]);\n  }\n\n  private setupStateRestorationObserver() {\n    if (this.boundNavigationHandler) return;\n    this.boundNavigationHandler = this.historyNavigationHandler.bind(this);\n    // when the user navigates back, we want to update the UI to match the URL\n    window.addEventListener('popstate', this.boundNavigationHandler);\n  }\n\n  private boundNavigationHandler?: () => void;\n\n  private historyNavigationHandler() {\n    this.historyPopOccurred = true;\n    this.restoreState();\n  }\n\n  private restoreState() {\n    const restorationState = this.restorationStateHandler.getRestorationState();\n    this.displayMode = restorationState.displayMode;\n    this.selectedSort = restorationState.selectedSort ?? SortField.relevance;\n    this.sortDirection = restorationState.sortDirection ?? null;\n    this.selectedTitleFilter = restorationState.selectedTitleFilter ?? null;\n    this.selectedCreatorFilter = restorationState.selectedCreatorFilter ?? null;\n    this.selectedFacets = restorationState.selectedFacets;\n    this.baseQuery = restorationState.baseQuery;\n    this.titleQuery = restorationState.titleQuery;\n    this.creatorQuery = restorationState.creatorQuery;\n    this.dateRangeQueryClause = restorationState.dateRangeQueryClause;\n    this.sortParam = restorationState.sortParam ?? null;\n    this.currentPage = restorationState.currentPage ?? 1;\n    this.minSelectedDate = restorationState.minSelectedDate;\n    this.maxSelectedDate = restorationState.maxSelectedDate;\n    if (this.currentPage > 1) {\n      this.goToPage(this.currentPage);\n    }\n  }\n\n  private persistState() {\n    const restorationState: RestorationState = {\n      displayMode: this.displayMode,\n      sortParam: this.sortParam ?? undefined,\n      selectedSort: this.selectedSort,\n      sortDirection: this.sortDirection ?? undefined,\n      selectedFacets: this.selectedFacets ?? defaultSelectedFacets,\n      baseQuery: this.baseQuery,\n      currentPage: this.currentPage,\n      dateRangeQueryClause: this.dateRangeQueryClause,\n      titleQuery: this.titleQuery,\n      creatorQuery: this.creatorQuery,\n      minSelectedDate: this.minSelectedDate,\n      maxSelectedDate: this.maxSelectedDate,\n      selectedTitleFilter: this.selectedTitleFilter ?? undefined,\n      selectedCreatorFilter: this.selectedCreatorFilter ?? undefined,\n    };\n    this.restorationStateHandler.persistState(restorationState);\n  }\n\n  private async doInitialPageFetch() {\n    this.searchResultsLoading = true;\n    await this.fetchPage(this.initialPageNumber);\n    this.searchResultsLoading = false;\n  }\n\n  private get fullQuery(): string | undefined {\n    let { fullQueryWithoutDate } = this;\n    const { dateRangeQueryClause } = this;\n    if (dateRangeQueryClause) {\n      fullQueryWithoutDate += ` AND ${dateRangeQueryClause}`;\n    }\n    return fullQueryWithoutDate;\n  }\n\n  private get fullQueryWithoutDate(): string | undefined {\n    if (!this.baseQuery) return undefined;\n    let fullQuery = this.baseQuery;\n    const { facetQuery, sortFilterQueries } = this;\n    if (facetQuery) {\n      fullQuery += ` AND ${facetQuery}`;\n    }\n    if (sortFilterQueries) {\n      fullQuery += ` AND ${sortFilterQueries}`;\n    }\n    return fullQuery;\n  }\n\n  /**\n   * Generates a query string for the given facets\n   *\n   * Example: `mediatype:(\"collection\" OR \"audio\" OR -\"etree\") AND year:(\"2000\" OR \"2001\")`\n   */\n  private get facetQuery(): string | undefined {\n    if (!this.selectedFacets) return undefined;\n    const facetQuery = [];\n    for (const [facetName, facetValues] of Object.entries(\n      this.selectedFacets\n    )) {\n      const facetEntries = Object.entries(facetValues);\n      // eslint-disable-next-line no-continue\n      if (facetEntries.length === 0) continue;\n      const facetValuesArray: string[] = [];\n      for (const [key, facetState] of facetEntries) {\n        const plusMinusPrefix = facetState === 'hidden' ? '-' : '';\n\n        if (facetName === 'language') {\n          const languages =\n            this.languageCodeHandler.getCodeArrayFromCodeString(key);\n          for (const language of languages) {\n            facetValuesArray.push(`${plusMinusPrefix}\"${language}\"`);\n          }\n        } else {\n          facetValuesArray.push(`${plusMinusPrefix}\"${key}\"`);\n        }\n      }\n      const valueQuery = facetValuesArray.join(` OR `);\n      facetQuery.push(`${facetName}:(${valueQuery})`);\n    }\n    return facetQuery.length > 0 ? `(${facetQuery.join(' AND ')})` : undefined;\n  }\n\n  facetsChanged(e: CustomEvent<SelectedFacets>) {\n    this.selectedFacets = e.detail;\n  }\n\n  private async fetchFacets() {\n    if (!this.fullQuery) return;\n\n    const aggregations = {\n      advancedParams: [\n        {\n          field: 'subjectSorter',\n          size: 6,\n        },\n        {\n          field: 'mediatypeSorter',\n          size: 6,\n        },\n        {\n          field: 'languageSorter',\n          size: 6,\n        },\n        {\n          field: 'creatorSorter',\n          size: 6,\n        },\n        {\n          field: 'collection',\n          size: 12,\n        },\n        {\n          field: 'year',\n          size: 50,\n        },\n      ],\n    };\n\n    const params: SearchParams = {\n      query: this.fullQuery,\n      fields: ['identifier'],\n      aggregations,\n      rows: 1,\n    };\n    this.facetsLoading = true;\n    const results = await this.searchService?.search(params);\n    this.facetsLoading = false;\n\n    this.aggregations = results?.success?.response.aggregations;\n  }\n\n  /**\n   * If we haven't changed the query, we don't need to fetch the full year histogram\n   *\n   * @private\n   * @type {string}\n   * @memberof CollectionBrowser\n   */\n  private previousFullQueryNoDate?: string;\n\n  /**\n   * The query key is a string that uniquely identifies the current query\n   * without the date range.\n   *\n   * If this doesn't change, we don't need to re-fetch the histogram date range\n   */\n  private get fullQueryNoDateKey() {\n    return `${this.fullQueryWithoutDate}-${this.sortParam?.field}-${this.sortParam?.direction}`;\n  }\n\n  /**\n   * This method is similar to fetching the facets above,\n   * but only fetching the year histogram. There is a subtle difference\n   * in how you have to fetch the year histogram where you can't use the\n   * advanced JSON syntax like the other aggregations. It's a special\n   * case that @ximm put it place.\n   */\n  private async fetchFullYearHistogram(): Promise<void> {\n    const { fullQueryNoDateKey } = this;\n    if (\n      !this.fullQueryWithoutDate ||\n      fullQueryNoDateKey === this.previousFullQueryNoDate\n    )\n      return;\n    this.previousFullQueryNoDate = fullQueryNoDateKey;\n\n    const aggregations = {\n      simpleParams: ['year'],\n    };\n\n    const params = {\n      query: this.fullQueryWithoutDate,\n      fields: ['identifier'],\n      aggregations,\n      rows: 1,\n    };\n\n    this.fullYearAggregationLoading = true;\n    const results = await this.searchService?.search(params);\n    this.fullYearAggregationLoading = false;\n\n    this.fullYearsHistogramAggregation =\n      results?.success?.response?.aggregations?.year_histogram;\n  }\n\n  private scrollToPage(pageNumber: number) {\n    const cellIndexToScrollTo = this.pageSize * (pageNumber - 1);\n    // without this setTimeout, Safari just pauses until the `fetchPage` is complete\n    // then scrolls to the cell\n    setTimeout(() => {\n      this.isScrollingToCell = true;\n      this.infiniteScroller.scrollToCell(cellIndexToScrollTo, true);\n      // This timeout is to give the scroll animation time to finish\n      // then updating the infinite scroller once we're done scrolling\n      // There's no scroll animation completion callback so we're\n      // giving it 0.5s to finish.\n      setTimeout(() => {\n        this.isScrollingToCell = false;\n        this.infiniteScroller.reload();\n      }, 500);\n    }, 0);\n  }\n\n  /**\n   * The query key is a string that uniquely identifies the current query\n   *\n   * This lets us keep track of queries so we don't persist data that's\n   * no longer relevant.\n   */\n  private get pageFetchQueryKey() {\n    return `${this.fullQuery}-${this.sortParam?.field}-${this.sortParam?.direction}`;\n  }\n\n  // this maps the query to the pages being fetched for that query\n  private pageFetchesInProgress: Record<string, Set<number>> = {};\n\n  async fetchPage(pageNumber: number) {\n    if (!this.fullQuery) return;\n\n    // if we already have data, don't fetch again\n    if (this.dataSource[pageNumber]) return;\n\n    if (this.endOfDataReached) return;\n\n    // if a fetch is already in progress for this query and page, don't fetch again\n    const { pageFetchQueryKey } = this;\n    const pageFetches =\n      this.pageFetchesInProgress[pageFetchQueryKey] ?? new Set();\n    if (pageFetches.has(pageNumber)) return;\n    pageFetches.add(pageNumber);\n    this.pageFetchesInProgress[pageFetchQueryKey] = pageFetches;\n\n    const sortParams = this.sortParam ? [this.sortParam] : [];\n    const params = {\n      query: this.fullQuery,\n      fields: [\n        'addeddate',\n        'avg_rating',\n        'collections_raw',\n        'creator',\n        'date',\n        'description',\n        'downloads',\n        'identifier',\n        'issue',\n        'item_count',\n        'mediatype',\n        'num_favorites',\n        'num_reviews',\n        'publicdate',\n        'reviewdate',\n        'source',\n        'subject', // topic\n        'title',\n        'volume',\n      ],\n      page: pageNumber,\n      rows: this.pageSize,\n      sort: sortParams,\n    };\n    const results = await this.searchService?.search(params);\n    const success = results?.success;\n\n    if (!success) return;\n\n    this.totalResults = success.response.numFound;\n\n    // this is checking to see if the query has changed since the data was fetched\n    // if so, we just want to discard the data since there should be a new query\n    // right behind it\n    const searchQuery = success.responseHeader.params.qin;\n    const searchSort = success.responseHeader.params.sort;\n    let sortChanged = false;\n    if (!searchSort) {\n      // if we went from no sort to sort, the sort has changed\n      if (this.sortParam) {\n        sortChanged = true;\n      }\n    } else {\n      // check if the sort has changed\n      const split = searchSort.split(' ');\n      if (split.length > 1) {\n        const field = searchSort.split(' ')[0];\n        const direction = searchSort.split(' ')[1];\n        if (\n          field !== this.sortParam?.field ||\n          direction !== this.sortParam?.direction\n        ) {\n          sortChanged = true;\n        }\n      }\n    }\n    const queryChangedSinceFetch =\n      searchQuery !== this.fullQuery || sortChanged;\n    if (queryChangedSinceFetch) return;\n\n    const { docs } = success.response;\n    if (docs && docs.length > 0) {\n      this.preloadCollectionNames(docs);\n      this.updateDataSource(pageNumber, docs);\n    }\n    if (docs.length < this.pageSize) {\n      this.endOfDataReached = true;\n      // this updates the infinite scroller to show the actual size\n      this.infiniteScroller.itemCount = this.actualTileCount;\n    }\n    this.pageFetchesInProgress[pageFetchQueryKey]?.delete(pageNumber);\n    this.searchResultsLoading = false;\n  }\n\n  private preloadCollectionNames(docs: Metadata[]) {\n    const collectionIds = docs.map(doc => doc.collections_raw?.values).flat();\n    const collectionIdsArray = Array.from(new Set(collectionIds)) as string[];\n    this.collectionNameCache?.preloadIdentifiers(collectionIdsArray);\n  }\n\n  /**\n   * This is useful for determining whether we need to reload the scroller.\n   *\n   * When the fetch completes, we need to reload the scroller if the cells for that\n   * page are visible, but if the page is not currenlty visible, we don't need to reload\n   */\n  private get currentVisiblePageNumbers(): number[] {\n    const visibleCells = this.infiniteScroller.getVisibleCellIndices();\n    const visiblePages = new Set<number>();\n    visibleCells.forEach(cellIndex => {\n      const visiblePage = Math.floor(cellIndex / this.pageSize) + 1;\n      visiblePages.add(visiblePage);\n    });\n    return Array.from(visiblePages);\n  }\n\n  /**\n   * Update the datasource from the fetch response\n   *\n   * @param pageNumber\n   * @param docs\n   */\n  private updateDataSource(pageNumber: number, docs: Metadata[]) {\n    // copy our existing datasource so when we set it below, it gets set\n    // instead of modifying the existing dataSource since object changes\n    // don't trigger a re-render\n    const datasource = { ...this.dataSource };\n    const tiles: TileModel[] = [];\n    docs?.forEach(doc => {\n      if (!doc.identifier) return;\n      tiles.push({\n        averageRating: doc.avg_rating?.value,\n        collections: doc.collections_raw?.values ?? [],\n        commentCount: doc.num_reviews?.value ?? 0,\n        creator: doc.creator?.value,\n        creators: doc.creator?.values ?? [],\n        dateAdded: doc.addeddate?.value,\n        dateArchived: doc.publicdate?.value,\n        datePublished: doc.date?.value,\n        dateReviewed: doc.reviewdate?.value,\n        description: doc.description?.value,\n        favCount: doc.num_favorites?.value ?? 0,\n        identifier: doc.identifier,\n        issue: doc.issue?.value,\n        itemCount: doc.item_count?.value ?? 0,\n        mediatype: doc.mediatype?.value ?? 'data',\n        source: doc.source?.value,\n        subjects: doc.subject?.values ?? [],\n        title: this.etreeTitle(\n          doc.title?.value,\n          doc.mediatype?.value,\n          doc.collection?.values\n        ),\n        volume: doc.volume?.value,\n        viewCount: doc.downloads?.value ?? 0,\n      });\n    });\n    datasource[pageNumber] = tiles;\n    this.dataSource = datasource;\n    const visiblePages = this.currentVisiblePageNumbers;\n    const needsReload = visiblePages.includes(pageNumber);\n    if (needsReload) {\n      this.infiniteScroller.reload();\n    }\n  }\n\n  /*\n   * Convert etree titles\n   * \"[Creator] Live at [Place] on [Date]\" => \"[Date]: [Place]\"\n   *\n   * Todo: Check collection(s) for etree, need to get as array.\n   * Current search-service only returns first collection as string.\n   */\n  private etreeTitle(\n    title: string | undefined,\n    mediatype: string | undefined,\n    collections: string[] | undefined\n  ): string {\n    if (mediatype === 'etree' || collections?.includes('etree')) {\n      const regex = /^(.*) Live at (.*) on (\\d\\d\\d\\d-\\d\\d-\\d\\d)$/;\n      const newTitle = title?.replace(regex, '$3: $2');\n      if (newTitle) {\n        return `${newTitle}`;\n      }\n    }\n    return title ?? '';\n  }\n\n  cellForIndex(index: number): TemplateResult | undefined {\n    const model = this.tileModelAtCellIndex(index);\n    if (!model) return undefined;\n\n    return html` <tile-dispatcher\n      .baseNavigationUrl=${this.baseNavigationUrl}\n      .model=${model}\n      .tileDisplayMode=${this.displayMode}\n      .resizeObserver=${this.resizeObserver}\n      .collectionNameCache=${this.collectionNameCache}\n      .sortParam=${this.sortParam}\n      .mobileBreakpoint=${this.mobileBreakpoint}\n    ></tile-dispatcher>`;\n  }\n\n  /**\n   * When the user scrolls near to the bottom of the page, fetch the next page\n   * increase the number of pages to render and start fetching data for the new page\n   */\n  private scrollThresholdReached() {\n    this.pagesToRender += 1;\n    this.fetchPage(this.pagesToRender);\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n    }\n\n    #content-container {\n      display: flex;\n    }\n\n    .collapser {\n      display: inline-block;\n    }\n\n    .collapser svg {\n      width: 10px;\n      height: 10px;\n      transition: transform 0.2s ease-out;\n    }\n\n    .collapser.open svg {\n      transform: rotate(90deg);\n    }\n\n    #mobile-filter-collapse h1 {\n      cursor: pointer;\n    }\n\n    #content-container.mobile {\n      display: block;\n    }\n\n    .column {\n      padding-top: 2rem;\n    }\n\n    #right-column {\n      flex: 1;\n      position: relative;\n      border-left: 1px solid rgb(232, 232, 232);\n      padding-left: 1rem;\n    }\n\n    .mobile #right-column {\n      border-left: none;\n      padding: 0;\n    }\n\n    #left-column {\n      width: 18rem;\n      padding-right: 12px;\n      padding-right: 1rem;\n    }\n\n    .mobile #left-column {\n      width: 100%;\n      padding: 0;\n    }\n\n    #mobile-header-container {\n      display: flex;\n      justify-content: space-between;\n    }\n\n    #facets-container {\n      position: relative;\n      max-height: 0;\n      transition: max-height 0.2s ease-in-out;\n      z-index: 1;\n    }\n\n    .mobile #facets-container {\n      overflow: hidden;\n    }\n\n    #facets-container.expanded {\n      max-height: 2000px;\n    }\n\n    #results-total {\n      display: flex;\n      align-items: center;\n      margin-bottom: 5rem;\n    }\n\n    .mobile #results-total {\n      margin-bottom: 0;\n    }\n\n    #big-results-count {\n      font-size: 2.4rem;\n      font-weight: 500;\n      margin-right: 5px;\n    }\n\n    #big-results-label {\n      font-size: 1rem;\n      font-weight: 200;\n      text-transform: uppercase;\n    }\n\n    #list-header {\n      max-height: 4.2rem;\n    }\n\n    .loading-cover {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      justify-content: center;\n      z-index: 1;\n      padding-top: 50px;\n    }\n\n    circular-activity-indicator {\n      width: 30px;\n      height: 30px;\n    }\n\n    sort-filter-bar {\n      display: block;\n      margin-bottom: 4rem;\n    }\n\n    infinite-scroller {\n      display: block;\n      --infiniteScrollerRowGap: var(--collectionBrowserRowGap, 1.7rem);\n      --infiniteScrollerColGap: var(--collectionBrowserColGap, 1.7rem);\n    }\n\n    infinite-scroller.list-compact {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        100%\n      );\n      --infiniteScrollerCellMinHeight: 34px; /* override infinite scroller component */\n      --infiniteScrollerCellMaxHeight: 56px;\n      --infiniteScrollerRowGap: 0px;\n    }\n\n    infinite-scroller.list-detail {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        100%\n      );\n      --infiniteScrollerCellMinHeight: var(\n        --collectionBrowserCellMinHeight,\n        5rem\n      );\n      /*\n        30px in spec, compensating for a -4px margin\n        to align title with top of item image\n        src/tiles/list/tile-list.ts\n       */\n      --infiniteScrollerRowGap: 34px;\n    }\n\n    .mobile infinite-scroller.list-detail {\n      --infiniteScrollerRowGap: 24px;\n    }\n\n    infinite-scroller.grid {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        18rem\n      );\n      --infiniteScrollerCellMaxWidth: var(--collectionBrowserCellMaxWidth, 1fr);\n      --infiniteScrollerCellMinHeight: var(\n        --collectionBrowserCellMinHeight,\n        29rem\n      );\n      --infiniteScrollerCellMaxHeight: var(\n        --collectionBrowserCellMaxHeight,\n        29rem\n      );\n    }\n  `;\n}\n"]}
+{"version":3,"file":"collection-browser.js","sourceRoot":"","sources":["../../src/collection-browser.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport {\n  html,\n  css,\n  LitElement,\n  PropertyValues,\n  TemplateResult,\n  nothing,\n} from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport type {\n  InfiniteScroller,\n  InfiniteScrollerCellProviderInterface,\n} from '@internetarchive/infinite-scroller';\nimport type {\n  Aggregation,\n  Metadata,\n  SearchParams,\n  SearchServiceInterface,\n  SortDirection,\n  SortParam,\n} from '@internetarchive/search-service';\nimport {\n  SharedResizeObserverInterface,\n  SharedResizeObserverResizeHandlerInterface,\n} from '@internetarchive/shared-resize-observer';\nimport '@internetarchive/infinite-scroller';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport './tiles/tile-dispatcher';\nimport './tiles/collection-browser-loading-tile';\nimport './sort-filter-bar/sort-filter-bar';\nimport './collection-facets';\nimport './circular-activity-indicator';\nimport './sort-filter-bar/sort-filter-bar';\nimport {\n  SelectedFacets,\n  SortField,\n  SortFieldToMetadataField,\n  CollectionBrowserContext,\n  defaultSelectedFacets,\n  TileModel,\n  CollectionDisplayMode,\n} from './models';\nimport {\n  RestorationStateHandlerInterface,\n  RestorationStateHandler,\n  RestorationState,\n} from './restoration-state-handler';\nimport chevronIcon from './assets/img/icons/chevron';\nimport { LanguageCodeHandler } from './language-code-handler/language-code-handler';\n\n@customElement('collection-browser')\nexport class CollectionBrowser\n  extends LitElement\n  implements\n    InfiniteScrollerCellProviderInterface,\n    SharedResizeObserverResizeHandlerInterface\n{\n  @property({ type: String }) baseNavigationUrl?: string;\n\n  @property({ type: String }) baseImageUrl?: string;\n\n  @property({ type: Object }) searchService?: SearchServiceInterface;\n\n  @property({ type: String }) baseQuery?: string;\n\n  @property({ type: String }) displayMode?: CollectionDisplayMode;\n\n  @property({ type: Object }) sortParam: SortParam | null = null;\n\n  @property({ type: String }) selectedSort: SortField = SortField.relevance;\n\n  @property({ type: String }) selectedTitleFilter: string | null = null;\n\n  @property({ type: String }) selectedCreatorFilter: string | null = null;\n\n  @property({ type: String }) sortDirection: SortDirection | null = null;\n\n  @property({ type: String }) dateRangeQueryClause?: string;\n\n  @property({ type: Number }) pageSize = 50;\n\n  @property({ type: Object }) resizeObserver?: SharedResizeObserverInterface;\n\n  @property({ type: String }) titleQuery?: string;\n\n  @property({ type: String }) creatorQuery?: string;\n\n  @property({ type: Number }) currentPage?: number;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n  @property({ type: Boolean }) showHistogramDatePicker = false;\n\n  @property({ type: Object })\n  collectionNameCache?: CollectionNameCacheInterface;\n\n  @property({ type: String }) pageContext: CollectionBrowserContext = 'search';\n\n  @property({ type: Object })\n  restorationStateHandler: RestorationStateHandlerInterface = new RestorationStateHandler(\n    {\n      context: this.pageContext,\n    }\n  );\n\n  @property({ type: Number }) mobileBreakpoint = 600;\n\n  /**\n   * The page that the consumer wants to load.\n   */\n  private initialPageNumber = 1;\n\n  /**\n   * This the the number of pages that we want to show.\n   *\n   * The data isn't necessarily loaded for all of the pages, but this lets us\n   * know how many cells we should render.\n   */\n  @state() private pagesToRender = this.initialPageNumber;\n\n  @state() private searchResultsLoading = false;\n\n  @state() private facetsLoading = false;\n\n  @state() private fullYearAggregationLoading = false;\n\n  @state() private aggregations?: Record<string, Aggregation>;\n\n  @state() private fullYearsHistogramAggregation: Aggregation | undefined;\n\n  @state() private totalResults?: number;\n\n  @state() private mobileView = false;\n\n  @state() private mobileFacetsVisible = false;\n\n  @query('#content-container') private contentContainer!: HTMLDivElement;\n\n  private languageCodeHandler = new LanguageCodeHandler();\n\n  /**\n   * When we're animated scrolling to the page, we don't want to fetch\n   * all of the pages as it scrolls so this lets us know if we're scrolling\n   */\n  private isScrollingToCell = false;\n\n  /**\n   * When we've reached the end of the data, stop trying to fetch more\n   */\n  private endOfDataReached = false;\n\n  private placeholderCellTemplate = html`<collection-browser-loading-tile></collection-browser-loading-tile>`;\n\n  private tileModelAtCellIndex(index: number): TileModel | undefined {\n    const pageNumber = Math.floor(index / this.pageSize) + 1;\n    const itemIndex = index % this.pageSize;\n    const model = this.dataSource[pageNumber]?.[itemIndex];\n    /**\n     * If we encounter a model we don't have yet and we're not in the middle of an\n     * automated scroll, fetch the page and just return undefined.\n     * The datasource will be updated once the page is loaded and the cell will be rendered.\n     *\n     * We disable it during the automated scroll since we may fetch pages for cells the\n     * user may never see.\n     */\n    if (!model && !this.isScrollingToCell) {\n      this.fetchPage(pageNumber);\n    }\n    return model;\n  }\n\n  private get sortFilterQueries(): string {\n    const queries = [this.titleQuery, this.creatorQuery];\n    return queries.filter(q => q).join(' AND ');\n  }\n\n  // this is the total number of tiles we expect if\n  // the data returned is a full page worth\n  // this is useful for putting in placeholders for the expected number of tiles\n  private get estimatedTileCount(): number {\n    return this.pagesToRender * this.pageSize;\n  }\n\n  // this is the actual number of tiles in the datasource,\n  // which is useful for removing excess placeholder tiles\n  // once we reached the end of the data\n  private get actualTileCount(): number {\n    return Object.keys(this.dataSource).reduce(\n      (acc, page) => acc + this.dataSource[page].length,\n      0\n    );\n  }\n\n  /**\n   * The results per page so we can paginate.\n   *\n   * This allows us to start in the middle of the search results and\n   * fetch data before or after the current page. If we don't have a key\n   * for the previous/next page, we'll fetch the next/previous page to populate it\n   */\n  private dataSource: Record<string, TileModel[]> = {};\n\n  @query('infinite-scroller')\n  private infiniteScroller!: InfiniteScroller;\n\n  /**\n   * Go to the given page of results\n   *\n   * @param pageNumber\n   */\n  goToPage(pageNumber: number) {\n    this.initialPageNumber = pageNumber;\n    this.pagesToRender = pageNumber;\n    this.scrollToPage(pageNumber);\n  }\n\n  clearFilters() {\n    this.selectedFacets = defaultSelectedFacets;\n    this.sortParam = null;\n    this.selectedTitleFilter = null;\n    this.selectedCreatorFilter = null;\n    this.titleQuery = undefined;\n    this.creatorQuery = undefined;\n    this.selectedSort = SortField.relevance;\n    this.sortDirection = null;\n  }\n\n  render() {\n    return html`\n      <div id=\"content-container\" class=${this.mobileView ? 'mobile' : ''}>\n        <div id=\"left-column\" class=\"column\">\n          <div id=\"mobile-header-container\">\n            ${this.mobileView\n              ? html`\n                  <div id=\"mobile-filter-collapse\">\n                    <h1\n                      @click=${() => {\n                        this.mobileFacetsVisible = !this.mobileFacetsVisible;\n                      }}\n                      @keyup=${() => {\n                        this.mobileFacetsVisible = !this.mobileFacetsVisible;\n                      }}\n                    >\n                      <span\n                        class=\"collapser ${this.mobileFacetsVisible\n                          ? 'open'\n                          : ''}\"\n                      >\n                        ${chevronIcon}\n                      </span>\n                      Filters\n                    </h1>\n                  </div>\n                `\n              : nothing}\n            <div id=\"results-total\">\n              <span id=\"big-results-count\"\n                >${this.totalResults !== undefined\n                  ? this.totalResults.toLocaleString()\n                  : '-'}</span\n              >\n              <span id=\"big-results-label\">Results</span>\n            </div>\n          </div>\n          <div\n            id=\"facets-container\"\n            class=${!this.mobileView || this.mobileFacetsVisible\n              ? 'expanded'\n              : ''}\n          >\n            ${this.facetsTemplate}\n          </div>\n        </div>\n        <div id=\"right-column\" class=\"column\">\n          ${this.searchResultsLoading ? this.loadingTemplate : nothing}\n          <sort-filter-bar\n            .selectedSort=${this.selectedSort}\n            .sortDirection=${this.sortDirection}\n            .displayMode=${this.displayMode}\n            .selectedTitleFilter=${this.selectedTitleFilter}\n            .selectedCreatorFilter=${this.selectedCreatorFilter}\n            .resizeObserver=${this.resizeObserver}\n            @sortChanged=${this.userChangedSort}\n            @displayModeChanged=${this.displayModeChanged}\n            @titleLetterChanged=${this.titleLetterSelected}\n            @creatorLetterChanged=${this.creatorLetterSelected}\n          ></sort-filter-bar>\n\n          ${this.displayMode === `list-compact`\n            ? this.listHeaderTemplate\n            : nothing}\n          ${!this.searchResultsLoading && this.totalResults === 0\n            ? html`\n                <h2>\n                  Your search did not match any items in the Archive. Try\n                  different keywords or a more general search.\n                </h2>\n              `\n            : nothing}\n\n          <infinite-scroller\n            class=\"${ifDefined(this.displayMode)}\"\n            .cellProvider=${this}\n            .placeholderCellTemplate=${this.placeholderCellTemplate}\n            @scrollThresholdReached=${this.scrollThresholdReached}\n            @visibleCellsChanged=${this.visibleCellsChanged}\n          >\n          </infinite-scroller>\n        </div>\n      </div>\n    `;\n  }\n\n  private userChangedSort(\n    e: CustomEvent<{\n      selectedSort: SortField;\n      sortDirection: SortDirection | null;\n    }>\n  ) {\n    const { selectedSort, sortDirection } = e.detail;\n    this.selectedSort = selectedSort;\n    this.sortDirection = sortDirection;\n\n    if ((this.currentPage ?? 1) > 1) {\n      this.goToPage(1);\n    }\n    this.currentPage = 1;\n  }\n\n  private selectedSortChanged() {\n    if (this.selectedSort === 'relevance' || this.sortDirection === null) {\n      this.sortParam = null;\n      return;\n    }\n    const sortField = SortFieldToMetadataField[this.selectedSort];\n    if (!sortField) return;\n    this.sortParam = { field: sortField, direction: this.sortDirection };\n  }\n\n  private displayModeChanged(\n    e: CustomEvent<{ displayMode: CollectionDisplayMode }>\n  ) {\n    this.displayMode = e.detail.displayMode;\n  }\n\n  private selectedTitleLetterChanged() {\n    this.titleQuery = this.selectedTitleFilter\n      ? `firstTitle:${this.selectedTitleFilter}`\n      : undefined;\n  }\n\n  private selectedCreatorLetterChanged() {\n    this.creatorQuery = this.selectedCreatorFilter\n      ? `firstCreator:${this.selectedCreatorFilter}`\n      : undefined;\n  }\n\n  private titleLetterSelected(e: CustomEvent<{ selectedLetter: string }>) {\n    this.selectedCreatorFilter = null;\n    this.selectedTitleFilter = e.detail.selectedLetter;\n  }\n\n  private creatorLetterSelected(e: CustomEvent<{ selectedLetter: string }>) {\n    this.selectedTitleFilter = null;\n    this.selectedCreatorFilter = e.detail.selectedLetter;\n  }\n\n  private get facetDataLoading(): boolean {\n    return this.facetsLoading || this.fullYearAggregationLoading;\n  }\n\n  private get facetsTemplate() {\n    return html`\n      ${this.facetsLoading ? this.loadingTemplate : nothing}\n      <collection-facets\n        @facetsChanged=${this.facetsChanged}\n        @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n        .aggregations=${this.aggregations}\n        .fullYearsHistogramAggregation=${this.fullYearsHistogramAggregation}\n        .minSelectedDate=${this.minSelectedDate}\n        .maxSelectedDate=${this.maxSelectedDate}\n        .selectedFacets=${this.selectedFacets}\n        .collectionNameCache=${this.collectionNameCache}\n        .languageCodeHandler=${this.languageCodeHandler}\n        .showHistogramDatePicker=${this.showHistogramDatePicker}\n        ?collapsableFacets=${this.mobileView}\n        ?facetsLoading=${this.facetDataLoading}\n        ?fullYearAggregationLoading=${this.fullYearAggregationLoading}\n      ></collection-facets>\n    `;\n  }\n\n  private get loadingTemplate() {\n    return html`\n      <div class=\"loading-cover\">\n        <circular-activity-indicator></circular-activity-indicator>\n      </div>\n    `;\n  }\n\n  private get listHeaderTemplate() {\n    return html`\n      <div id=\"list-header\">\n        <tile-dispatcher\n          .tileDisplayMode=${'list-header'}\n          .resizeObserver=${this.resizeObserver}\n          .sortParam=${this.sortParam}\n          .mobileBreakpoint=${this.mobileBreakpoint}\n        >\n        </tile-dispatcher>\n      </div>\n    `;\n  }\n\n  private get queryDebuggingTemplate() {\n    return html`\n      <div>\n        <ul>\n          <li>Base Query: ${this.baseQuery}</li>\n          <li>Facet Query: ${this.facetQuery}</li>\n          <li>Sort Filter Query: ${this.sortFilterQueries}</li>\n          <li>Date Range Query: ${this.dateRangeQueryClause}</li>\n          <li>Sort: ${this.sortParam?.field} ${this.sortParam?.direction}</li>\n          <li>Full Query: ${this.fullQuery}</li>\n        </ul>\n      </div>\n    `;\n  }\n\n  private histogramDateRangeUpdated(\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ) {\n    const { minDate, maxDate } = e.detail;\n    this.dateRangeQueryClause = `year:[${minDate} TO ${maxDate}]`;\n  }\n\n  firstUpdated(): void {\n    this.setupStateRestorationObserver();\n    this.restoreState();\n  }\n\n  updated(changed: PropertyValues) {\n    if (\n      changed.has('displayMode') ||\n      changed.has('baseNavigationUrl') ||\n      changed.has('baseImageUrl')\n    ) {\n      this.infiniteScroller.reload();\n    }\n    if (changed.has('baseQuery')) {\n      this.emitBaseQueryChanged();\n    }\n    if (changed.has('currentPage') || changed.has('displayMode')) {\n      this.persistState();\n    }\n    if (\n      changed.has('baseQuery') ||\n      changed.has('titleQuery') ||\n      changed.has('creatorQuery') ||\n      changed.has('dateRangeQueryClause') ||\n      changed.has('sortParam') ||\n      changed.has('selectedFacets') ||\n      changed.has('searchService')\n    ) {\n      this.handleQueryChange();\n    }\n    if (changed.has('selectedSort') || changed.has('sortDirection')) {\n      this.selectedSortChanged();\n    }\n    if (changed.has('selectedTitleFilter')) {\n      this.selectedTitleLetterChanged();\n    }\n    if (changed.has('selectedCreatorFilter')) {\n      this.selectedCreatorLetterChanged();\n    }\n    if (changed.has('pagesToRender')) {\n      if (!this.endOfDataReached) {\n        this.infiniteScroller.itemCount = this.estimatedTileCount;\n      }\n    }\n    if (changed.has('resizeObserver')) {\n      const oldObserver = changed.get(\n        'resizeObserver'\n      ) as SharedResizeObserverInterface;\n      if (oldObserver) this.disconnectResizeObserver(oldObserver);\n      this.setupResizeObserver();\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver) {\n      this.disconnectResizeObserver(this.resizeObserver);\n    }\n    if (this.boundNavigationHandler) {\n      window.removeEventListener('popstate', this.boundNavigationHandler);\n    }\n  }\n\n  handleResize(entry: ResizeObserverEntry): void {\n    if (entry.target === this.contentContainer) {\n      this.mobileView = entry.contentRect.width < 600;\n    }\n  }\n\n  private emitBaseQueryChanged() {\n    this.dispatchEvent(\n      new CustomEvent<{ baseQuery?: string }>('baseQueryChanged', {\n        detail: {\n          baseQuery: this.baseQuery,\n        },\n      })\n    );\n  }\n\n  private disconnectResizeObserver(\n    resizeObserver: SharedResizeObserverInterface\n  ) {\n    resizeObserver.removeObserver({\n      target: this.contentContainer,\n      handler: this,\n    });\n  }\n\n  private setupResizeObserver() {\n    if (!this.resizeObserver) return;\n    this.resizeObserver.addObserver({\n      target: this.contentContainer,\n      handler: this,\n    });\n  }\n\n  /**\n   * When the visible cells change from the infinite scroller, we want to emit\n   * which page is currently visible so the consumer can update its UI or the URL\n   *\n   * @param e\n   * @returns\n   */\n  private visibleCellsChanged(\n    e: CustomEvent<{ visibleCellIndices: number[] }>\n  ) {\n    if (this.isScrollingToCell) return;\n    const { visibleCellIndices } = e.detail;\n    if (visibleCellIndices.length === 0) return;\n    const lastVisibleCellIndex =\n      visibleCellIndices[visibleCellIndices.length - 1];\n    const lastVisibleCellPage =\n      Math.floor(lastVisibleCellIndex / this.pageSize) + 1;\n    if (this.currentPage !== lastVisibleCellPage) {\n      this.currentPage = lastVisibleCellPage;\n    }\n    const event = new CustomEvent('visiblePageChanged', {\n      detail: {\n        pageNumber: lastVisibleCellPage,\n      },\n    });\n    this.dispatchEvent(event);\n  }\n\n  // we only want to scroll on the very first query change\n  // so this keeps track of whether we've already set the initial query\n  private initialQueryChangeHappened = false;\n\n  private historyPopOccurred = false;\n\n  // this lets us store the query key so we know if it's actually changed or not\n  private previousQueryKey?: string;\n\n  private async handleQueryChange() {\n    // only reset if the query has actually changed\n    if (!this.searchService || this.pageFetchQueryKey === this.previousQueryKey)\n      return;\n    this.previousQueryKey = this.pageFetchQueryKey;\n\n    this.dataSource = {};\n    this.pageFetchesInProgress = {};\n    this.endOfDataReached = false;\n    this.pagesToRender = this.initialPageNumber;\n    if (!this.initialQueryChangeHappened && this.initialPageNumber > 1) {\n      this.scrollToPage(this.initialPageNumber);\n    }\n    this.initialQueryChangeHappened = true;\n    // if the query changed as part of a window.history pop event, we don't want to\n    // persist the state because it overwrites the forward history\n    if (!this.historyPopOccurred) {\n      this.persistState();\n      this.historyPopOccurred = false;\n    }\n\n    await Promise.all([\n      this.doInitialPageFetch(),\n      this.fetchFacets(),\n      this.fetchFullYearHistogram(),\n    ]);\n  }\n\n  private setupStateRestorationObserver() {\n    if (this.boundNavigationHandler) return;\n    this.boundNavigationHandler = this.historyNavigationHandler.bind(this);\n    // when the user navigates back, we want to update the UI to match the URL\n    window.addEventListener('popstate', this.boundNavigationHandler);\n  }\n\n  private boundNavigationHandler?: () => void;\n\n  private historyNavigationHandler() {\n    this.historyPopOccurred = true;\n    this.restoreState();\n  }\n\n  private restoreState() {\n    const restorationState = this.restorationStateHandler.getRestorationState();\n    this.displayMode = restorationState.displayMode;\n    this.selectedSort = restorationState.selectedSort ?? SortField.relevance;\n    this.sortDirection = restorationState.sortDirection ?? null;\n    this.selectedTitleFilter = restorationState.selectedTitleFilter ?? null;\n    this.selectedCreatorFilter = restorationState.selectedCreatorFilter ?? null;\n    this.selectedFacets = restorationState.selectedFacets;\n    this.baseQuery = restorationState.baseQuery;\n    this.titleQuery = restorationState.titleQuery;\n    this.creatorQuery = restorationState.creatorQuery;\n    this.dateRangeQueryClause = restorationState.dateRangeQueryClause;\n    this.sortParam = restorationState.sortParam ?? null;\n    this.currentPage = restorationState.currentPage ?? 1;\n    this.minSelectedDate = restorationState.minSelectedDate;\n    this.maxSelectedDate = restorationState.maxSelectedDate;\n    if (this.currentPage > 1) {\n      this.goToPage(this.currentPage);\n    }\n  }\n\n  private persistState() {\n    const restorationState: RestorationState = {\n      displayMode: this.displayMode,\n      sortParam: this.sortParam ?? undefined,\n      selectedSort: this.selectedSort,\n      sortDirection: this.sortDirection ?? undefined,\n      selectedFacets: this.selectedFacets ?? defaultSelectedFacets,\n      baseQuery: this.baseQuery,\n      currentPage: this.currentPage,\n      dateRangeQueryClause: this.dateRangeQueryClause,\n      titleQuery: this.titleQuery,\n      creatorQuery: this.creatorQuery,\n      minSelectedDate: this.minSelectedDate,\n      maxSelectedDate: this.maxSelectedDate,\n      selectedTitleFilter: this.selectedTitleFilter ?? undefined,\n      selectedCreatorFilter: this.selectedCreatorFilter ?? undefined,\n    };\n    this.restorationStateHandler.persistState(restorationState);\n  }\n\n  private async doInitialPageFetch() {\n    this.searchResultsLoading = true;\n    await this.fetchPage(this.initialPageNumber);\n    this.searchResultsLoading = false;\n  }\n\n  private get fullQuery(): string | undefined {\n    let { fullQueryWithoutDate } = this;\n    const { dateRangeQueryClause } = this;\n    if (dateRangeQueryClause) {\n      fullQueryWithoutDate += ` AND ${dateRangeQueryClause}`;\n    }\n    return fullQueryWithoutDate;\n  }\n\n  private get fullQueryWithoutDate(): string | undefined {\n    if (!this.baseQuery) return undefined;\n    let fullQuery = this.baseQuery;\n    const { facetQuery, sortFilterQueries } = this;\n    if (facetQuery) {\n      fullQuery += ` AND ${facetQuery}`;\n    }\n    if (sortFilterQueries) {\n      fullQuery += ` AND ${sortFilterQueries}`;\n    }\n    return fullQuery;\n  }\n\n  /**\n   * Generates a query string for the given facets\n   *\n   * Example: `mediatype:(\"collection\" OR \"audio\" OR -\"etree\") AND year:(\"2000\" OR \"2001\")`\n   */\n  private get facetQuery(): string | undefined {\n    if (!this.selectedFacets) return undefined;\n    const facetQuery = [];\n    for (const [facetName, facetValues] of Object.entries(\n      this.selectedFacets\n    )) {\n      const facetEntries = Object.entries(facetValues);\n      // eslint-disable-next-line no-continue\n      if (facetEntries.length === 0) continue;\n      const facetValuesArray: string[] = [];\n      for (const [key, facetState] of facetEntries) {\n        const plusMinusPrefix = facetState === 'hidden' ? '-' : '';\n\n        if (facetName === 'language') {\n          const languages =\n            this.languageCodeHandler.getCodeArrayFromCodeString(key);\n          for (const language of languages) {\n            facetValuesArray.push(`${plusMinusPrefix}\"${language}\"`);\n          }\n        } else {\n          facetValuesArray.push(`${plusMinusPrefix}\"${key}\"`);\n        }\n      }\n      const valueQuery = facetValuesArray.join(` OR `);\n      facetQuery.push(`${facetName}:(${valueQuery})`);\n    }\n    return facetQuery.length > 0 ? `(${facetQuery.join(' AND ')})` : undefined;\n  }\n\n  facetsChanged(e: CustomEvent<SelectedFacets>) {\n    this.selectedFacets = e.detail;\n  }\n\n  private async fetchFacets() {\n    if (!this.fullQuery) return;\n\n    const aggregations = {\n      advancedParams: [\n        {\n          field: 'subjectSorter',\n          size: 6,\n        },\n        {\n          field: 'mediatypeSorter',\n          size: 6,\n        },\n        {\n          field: 'languageSorter',\n          size: 6,\n        },\n        {\n          field: 'creatorSorter',\n          size: 6,\n        },\n        {\n          field: 'collection',\n          size: 12,\n        },\n        {\n          field: 'year',\n          size: 50,\n        },\n      ],\n    };\n\n    const params: SearchParams = {\n      query: this.fullQuery,\n      fields: ['identifier'],\n      aggregations,\n      rows: 1,\n    };\n    this.facetsLoading = true;\n    const results = await this.searchService?.search(params);\n    this.facetsLoading = false;\n\n    this.aggregations = results?.success?.response.aggregations;\n  }\n\n  /**\n   * If we haven't changed the query, we don't need to fetch the full year histogram\n   *\n   * @private\n   * @type {string}\n   * @memberof CollectionBrowser\n   */\n  private previousFullQueryNoDate?: string;\n\n  /**\n   * The query key is a string that uniquely identifies the current query\n   * without the date range.\n   *\n   * If this doesn't change, we don't need to re-fetch the histogram date range\n   */\n  private get fullQueryNoDateKey() {\n    return `${this.fullQueryWithoutDate}-${this.sortParam?.field}-${this.sortParam?.direction}`;\n  }\n\n  /**\n   * This method is similar to fetching the facets above,\n   * but only fetching the year histogram. There is a subtle difference\n   * in how you have to fetch the year histogram where you can't use the\n   * advanced JSON syntax like the other aggregations. It's a special\n   * case that @ximm put it place.\n   */\n  private async fetchFullYearHistogram(): Promise<void> {\n    const { fullQueryNoDateKey } = this;\n    if (\n      !this.fullQueryWithoutDate ||\n      fullQueryNoDateKey === this.previousFullQueryNoDate\n    )\n      return;\n    this.previousFullQueryNoDate = fullQueryNoDateKey;\n\n    const aggregations = {\n      simpleParams: ['year'],\n    };\n\n    const params = {\n      query: this.fullQueryWithoutDate,\n      fields: ['identifier'],\n      aggregations,\n      rows: 1,\n    };\n\n    this.fullYearAggregationLoading = true;\n    const results = await this.searchService?.search(params);\n    this.fullYearAggregationLoading = false;\n\n    this.fullYearsHistogramAggregation =\n      results?.success?.response?.aggregations?.year_histogram;\n  }\n\n  private scrollToPage(pageNumber: number) {\n    const cellIndexToScrollTo = this.pageSize * (pageNumber - 1);\n    // without this setTimeout, Safari just pauses until the `fetchPage` is complete\n    // then scrolls to the cell\n    setTimeout(() => {\n      this.isScrollingToCell = true;\n      this.infiniteScroller.scrollToCell(cellIndexToScrollTo, true);\n      // This timeout is to give the scroll animation time to finish\n      // then updating the infinite scroller once we're done scrolling\n      // There's no scroll animation completion callback so we're\n      // giving it 0.5s to finish.\n      setTimeout(() => {\n        this.isScrollingToCell = false;\n        this.infiniteScroller.reload();\n      }, 500);\n    }, 0);\n  }\n\n  /**\n   * The query key is a string that uniquely identifies the current query\n   *\n   * This lets us keep track of queries so we don't persist data that's\n   * no longer relevant.\n   */\n  private get pageFetchQueryKey() {\n    return `${this.fullQuery}-${this.sortParam?.field}-${this.sortParam?.direction}`;\n  }\n\n  // this maps the query to the pages being fetched for that query\n  private pageFetchesInProgress: Record<string, Set<number>> = {};\n\n  async fetchPage(pageNumber: number) {\n    if (!this.fullQuery) return;\n\n    // if we already have data, don't fetch again\n    if (this.dataSource[pageNumber]) return;\n\n    if (this.endOfDataReached) return;\n\n    // if a fetch is already in progress for this query and page, don't fetch again\n    const { pageFetchQueryKey } = this;\n    const pageFetches =\n      this.pageFetchesInProgress[pageFetchQueryKey] ?? new Set();\n    if (pageFetches.has(pageNumber)) return;\n    pageFetches.add(pageNumber);\n    this.pageFetchesInProgress[pageFetchQueryKey] = pageFetches;\n\n    const sortParams = this.sortParam ? [this.sortParam] : [];\n    const params = {\n      query: this.fullQuery,\n      fields: [\n        'addeddate',\n        'avg_rating',\n        'collections_raw',\n        'creator',\n        'date',\n        'description',\n        'downloads',\n        'identifier',\n        'issue',\n        'item_count',\n        'mediatype',\n        'num_favorites',\n        'num_reviews',\n        'publicdate',\n        'reviewdate',\n        'source',\n        'subject', // topic\n        'title',\n        'volume',\n      ],\n      page: pageNumber,\n      rows: this.pageSize,\n      sort: sortParams,\n    };\n    const results = await this.searchService?.search(params);\n    const success = results?.success;\n\n    if (!success) return;\n\n    this.totalResults = success.response.numFound;\n\n    // this is checking to see if the query has changed since the data was fetched\n    // if so, we just want to discard the data since there should be a new query\n    // right behind it\n    const searchQuery = success.responseHeader.params.qin;\n    const searchSort = success.responseHeader.params.sort;\n    let sortChanged = false;\n    if (!searchSort) {\n      // if we went from no sort to sort, the sort has changed\n      if (this.sortParam) {\n        sortChanged = true;\n      }\n    } else {\n      // check if the sort has changed\n      const split = searchSort.split(' ');\n      if (split.length > 1) {\n        const field = searchSort.split(' ')[0];\n        const direction = searchSort.split(' ')[1];\n        if (\n          field !== this.sortParam?.field ||\n          direction !== this.sortParam?.direction\n        ) {\n          sortChanged = true;\n        }\n      }\n    }\n    const queryChangedSinceFetch =\n      searchQuery !== this.fullQuery || sortChanged;\n    if (queryChangedSinceFetch) return;\n\n    const { docs } = success.response;\n    if (docs && docs.length > 0) {\n      this.preloadCollectionNames(docs);\n      this.updateDataSource(pageNumber, docs);\n    }\n    if (docs.length < this.pageSize) {\n      this.endOfDataReached = true;\n      // this updates the infinite scroller to show the actual size\n      this.infiniteScroller.itemCount = this.actualTileCount;\n    }\n    this.pageFetchesInProgress[pageFetchQueryKey]?.delete(pageNumber);\n    this.searchResultsLoading = false;\n  }\n\n  private preloadCollectionNames(docs: Metadata[]) {\n    const collectionIds = docs.map(doc => doc.collections_raw?.values).flat();\n    const collectionIdsArray = Array.from(new Set(collectionIds)) as string[];\n    this.collectionNameCache?.preloadIdentifiers(collectionIdsArray);\n  }\n\n  /**\n   * This is useful for determining whether we need to reload the scroller.\n   *\n   * When the fetch completes, we need to reload the scroller if the cells for that\n   * page are visible, but if the page is not currenlty visible, we don't need to reload\n   */\n  private get currentVisiblePageNumbers(): number[] {\n    const visibleCells = this.infiniteScroller.getVisibleCellIndices();\n    const visiblePages = new Set<number>();\n    visibleCells.forEach(cellIndex => {\n      const visiblePage = Math.floor(cellIndex / this.pageSize) + 1;\n      visiblePages.add(visiblePage);\n    });\n    return Array.from(visiblePages);\n  }\n\n  /**\n   * Update the datasource from the fetch response\n   *\n   * @param pageNumber\n   * @param docs\n   */\n  private updateDataSource(pageNumber: number, docs: Metadata[]) {\n    // copy our existing datasource so when we set it below, it gets set\n    // instead of modifying the existing dataSource since object changes\n    // don't trigger a re-render\n    const datasource = { ...this.dataSource };\n    const tiles: TileModel[] = [];\n    docs?.forEach(doc => {\n      if (!doc.identifier) return;\n      tiles.push({\n        averageRating: doc.avg_rating?.value,\n        collections: doc.collections_raw?.values ?? [],\n        commentCount: doc.num_reviews?.value ?? 0,\n        creator: doc.creator?.value,\n        creators: doc.creator?.values ?? [],\n        dateAdded: doc.addeddate?.value,\n        dateArchived: doc.publicdate?.value,\n        datePublished: doc.date?.value,\n        dateReviewed: doc.reviewdate?.value,\n        description: doc.description?.value,\n        favCount: doc.num_favorites?.value ?? 0,\n        identifier: doc.identifier,\n        issue: doc.issue?.value,\n        itemCount: doc.item_count?.value ?? 0,\n        mediatype: doc.mediatype?.value ?? 'data',\n        source: doc.source?.value,\n        subjects: doc.subject?.values ?? [],\n        title: this.etreeTitle(\n          doc.title?.value,\n          doc.mediatype?.value,\n          doc.collection?.values\n        ),\n        volume: doc.volume?.value,\n        viewCount: doc.downloads?.value ?? 0,\n      });\n    });\n    datasource[pageNumber] = tiles;\n    this.dataSource = datasource;\n    const visiblePages = this.currentVisiblePageNumbers;\n    const needsReload = visiblePages.includes(pageNumber);\n    if (needsReload) {\n      this.infiniteScroller.reload();\n    }\n  }\n\n  /*\n   * Convert etree titles\n   * \"[Creator] Live at [Place] on [Date]\" => \"[Date]: [Place]\"\n   *\n   * Todo: Check collection(s) for etree, need to get as array.\n   * Current search-service only returns first collection as string.\n   */\n  private etreeTitle(\n    title: string | undefined,\n    mediatype: string | undefined,\n    collections: string[] | undefined\n  ): string {\n    if (mediatype === 'etree' || collections?.includes('etree')) {\n      const regex = /^(.*) Live at (.*) on (\\d\\d\\d\\d-\\d\\d-\\d\\d)$/;\n      const newTitle = title?.replace(regex, '$3: $2');\n      if (newTitle) {\n        return `${newTitle}`;\n      }\n    }\n    return title ?? '';\n  }\n\n  cellForIndex(index: number): TemplateResult | undefined {\n    const model = this.tileModelAtCellIndex(index);\n    if (!model) return undefined;\n\n    return html` <tile-dispatcher\n      .baseNavigationUrl=${this.baseNavigationUrl}\n      .baseImageUrl=${this.baseImageUrl}\n      .model=${model}\n      .tileDisplayMode=${this.displayMode}\n      .resizeObserver=${this.resizeObserver}\n      .collectionNameCache=${this.collectionNameCache}\n      .sortParam=${this.sortParam}\n      .mobileBreakpoint=${this.mobileBreakpoint}\n    ></tile-dispatcher>`;\n  }\n\n  /**\n   * When the user scrolls near to the bottom of the page, fetch the next page\n   * increase the number of pages to render and start fetching data for the new page\n   */\n  private scrollThresholdReached() {\n    this.pagesToRender += 1;\n    this.fetchPage(this.pagesToRender);\n  }\n\n  static styles = css`\n    :host {\n      display: block;\n    }\n\n    #content-container {\n      display: flex;\n    }\n\n    .collapser {\n      display: inline-block;\n    }\n\n    .collapser svg {\n      width: 10px;\n      height: 10px;\n      transition: transform 0.2s ease-out;\n    }\n\n    .collapser.open svg {\n      transform: rotate(90deg);\n    }\n\n    #mobile-filter-collapse h1 {\n      cursor: pointer;\n    }\n\n    #content-container.mobile {\n      display: block;\n    }\n\n    .column {\n      padding-top: 2rem;\n    }\n\n    #right-column {\n      flex: 1;\n      position: relative;\n      border-left: 1px solid rgb(232, 232, 232);\n      padding-left: 1rem;\n    }\n\n    .mobile #right-column {\n      border-left: none;\n      padding: 0;\n    }\n\n    #left-column {\n      width: 18rem;\n      padding-right: 12px;\n      padding-right: 1rem;\n    }\n\n    .mobile #left-column {\n      width: 100%;\n      padding: 0;\n    }\n\n    #mobile-header-container {\n      display: flex;\n      justify-content: space-between;\n    }\n\n    #facets-container {\n      position: relative;\n      max-height: 0;\n      transition: max-height 0.2s ease-in-out;\n      z-index: 1;\n    }\n\n    .mobile #facets-container {\n      overflow: hidden;\n    }\n\n    #facets-container.expanded {\n      max-height: 2000px;\n    }\n\n    #results-total {\n      display: flex;\n      align-items: center;\n      margin-bottom: 5rem;\n    }\n\n    .mobile #results-total {\n      margin-bottom: 0;\n    }\n\n    #big-results-count {\n      font-size: 2.4rem;\n      font-weight: 500;\n      margin-right: 5px;\n    }\n\n    #big-results-label {\n      font-size: 1rem;\n      font-weight: 200;\n      text-transform: uppercase;\n    }\n\n    #list-header {\n      max-height: 4.2rem;\n    }\n\n    .loading-cover {\n      position: absolute;\n      top: 0;\n      left: 0;\n      width: 100%;\n      height: 100%;\n      display: flex;\n      justify-content: center;\n      z-index: 1;\n      padding-top: 50px;\n    }\n\n    circular-activity-indicator {\n      width: 30px;\n      height: 30px;\n    }\n\n    sort-filter-bar {\n      display: block;\n      margin-bottom: 4rem;\n    }\n\n    infinite-scroller {\n      display: block;\n      --infiniteScrollerRowGap: var(--collectionBrowserRowGap, 1.7rem);\n      --infiniteScrollerColGap: var(--collectionBrowserColGap, 1.7rem);\n    }\n\n    infinite-scroller.list-compact {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        100%\n      );\n      --infiniteScrollerCellMinHeight: 34px; /* override infinite scroller component */\n      --infiniteScrollerCellMaxHeight: 56px;\n      --infiniteScrollerRowGap: 0px;\n    }\n\n    infinite-scroller.list-detail {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        100%\n      );\n      --infiniteScrollerCellMinHeight: var(\n        --collectionBrowserCellMinHeight,\n        5rem\n      );\n      /*\n        30px in spec, compensating for a -4px margin\n        to align title with top of item image\n        src/tiles/list/tile-list.ts\n       */\n      --infiniteScrollerRowGap: 34px;\n    }\n\n    .mobile infinite-scroller.list-detail {\n      --infiniteScrollerRowGap: 24px;\n    }\n\n    infinite-scroller.grid {\n      --infiniteScrollerCellMinWidth: var(\n        --collectionBrowserCellMinWidth,\n        18rem\n      );\n      --infiniteScrollerCellMaxWidth: var(--collectionBrowserCellMaxWidth, 1fr);\n      --infiniteScrollerCellMinHeight: var(\n        --collectionBrowserCellMinHeight,\n        29rem\n      );\n      --infiniteScrollerCellMaxHeight: var(\n        --collectionBrowserCellMaxHeight,\n        29rem\n      );\n    }\n  `;\n}\n"]}

package/dist/src/tiles/grid/item-tile.d.ts

@@ -4,7 +4,7 @@ import '../mediatype-icon';
 import '../item-image';
 export declare class ItemTile extends LitElement {
     model?: TileModel;
-    baseNavigationUrl?: string;
+    baseImageUrl?: string;
     render(): import("lit-html").TemplateResult<1>;
     static get styles(): CSSResultGroup;
 }

package/dist/src/tiles/grid/item-tile.js

@@ -18,10 +18,7 @@ let ItemTile = class ItemTile extends LitElement {
         <div id="title-image-container">
           <h1 id="item-title" title=${itemTitle}>${(_c = this.model) === null || _c === void 0 ? void 0 : _c.title}</h1>
           <div id="item-image-container">
-            <item-image
-              .model=${this.model}
-              .baseNavigationUrl=${this.baseNavigationUrl}
-            >
+            <item-image .model=${this.model} .baseImageUrl=${this.baseImageUrl}>
             </item-image>
           </div>
           <div class="item-creator">
@@ -195,7 +192,7 @@ __decorate([
 ], ItemTile.prototype, "model", void 0);
 __decorate([
     property({ type: String })
-], ItemTile.prototype, "baseNavigationUrl", void 0);
+], ItemTile.prototype, "baseImageUrl", void 0);
 ItemTile = __decorate([
     customElement('item-tile')
 ], ItemTile);

package/dist/src/tiles/grid/item-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"item-tile.js","sourceRoot":"","sources":["../../../../src/tiles/grid/item-tile.ts"],"names":[],"mappings":";AAAA,yCAAyC;AACzC,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,SAAS,MAAM,eAAe,CAAC;AAEtC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,eAAe,CAAC;AAGvB,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAKtC,MAAM;;QACJ,MAAM,SAAS,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,KAAI,EAAE,CAAC;QAC1C,MAAM,WAAW,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,OAAO,KAAI,GAAG,CAAC;QAE/C,OAAO,IAAI,CAAA;;;sCAGuB,SAAS,IAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK;;;uBAG7C,IAAI,CAAC,KAAK;mCACE,IAAI,CAAC,iBAAiB;;;;;;gDAMT,WAAW;;;;;;;;;;;6BAW9B,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS;8BACpB,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW;;;;;;gBAMrC,SAAS;;kBAEP,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,EAAE,OAAO,EAAE,OAAO,CAAC;;;;gBAItD,kBAAkB;;kBAEhB,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,EAAE,OAAO,EAAE,OAAO,CAAC;;;;gBAItD,WAAW;;kBAET,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC;;;;;;KAMhE,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,eAAe,GAAG,GAAG,CAAA,wCAAwC,CAAC;QAEpE,OAAO,GAAG,CAAA;;;yBAGW,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoHnC,CAAC;IACJ,CAAC;CACF,CAAA;AA1L6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAA4B;AAH5C,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CA2LpB;SA3LY,QAAQ","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { TileModel } from '../../models';\nimport { formatCount } from '../../utils/format-count';\n\nimport { favoriteFilledIcon } from './icons/favorite-filled';\nimport { reviewsIcon } from './icons/reviews';\nimport viewsIcon from './icons/views';\n\nimport '../mediatype-icon';\nimport '../item-image';\n\n@customElement('item-tile')\nexport class ItemTile extends LitElement {\n  @property({ type: Object }) model?: TileModel;\n\n  @property({ type: String }) baseNavigationUrl?: string;\n\n  render() {\n    const itemTitle = this.model?.title || '';\n    const itemCreator = this.model?.creator || '-';\n\n    return html`\n      <div id=\"container\">\n        <div id=\"title-image-container\">\n          <h1 id=\"item-title\" title=${itemTitle}>${this.model?.title}</h1>\n          <div id=\"item-image-container\">\n            <item-image\n              .model=${this.model}\n              .baseNavigationUrl=${this.baseNavigationUrl}\n            >\n            </item-image>\n          </div>\n          <div class=\"item-creator\">\n            <div class=\"truncated\">\n              <span><strong>By:&nbsp;</strong>${itemCreator}</span>\n            </div>\n          </div>\n        </div>\n\n        <div class=\"hr\"></div>\n\n        <div id=\"item-stats-container\">\n          <div id=\"stats-holder\">\n            <div class=\"col\">\n              <mediatype-icon\n                .mediatype=${this.model?.mediatype}\n                .collection=${this.model?.collections}\n                style=\"--iconHeight:25px; --iconWidth:25px;\"\n              >\n              </mediatype-icon>\n            </div>\n            <div class=\"col\">\n              ${viewsIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.viewCount, 'short', 'short')}\n              </p>\n            </div>\n            <div class=\"col\">\n              ${favoriteFilledIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.itemCount, 'short', 'short')}\n              </p>\n            </div>\n            <div class=\"col\">\n              ${reviewsIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.favCount, 'short', 'short')}\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    const cornerRadiusCss = css`var(--collectionTileCornerRadius, 4px)`;\n\n    return css`\n      #container {\n        background-color: #ffffff;\n        border-radius: ${cornerRadiusCss};\n        box-shadow: 1px 1px 2px 0px;\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n        position: relative;\n      }\n\n      #title-image-container {\n        display: flex;\n        flex: 1;\n        flex-direction: column;\n        padding: 0.5rem 0.5rem 0 0.5rem;\n      }\n\n      #item-title {\n        color: #2c2c2c;\n        font-size: 1.6rem;\n        text-align: center;\n        margin-top: 0rem;\n        margin-bottom: 0.5rem;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        display: -webkit-box;\n        -webkit-line-clamp: 2;\n        -webkit-box-orient: vertical;\n        line-height: 2rem;\n        height: 4rem;\n      }\n\n      #item-image-container {\n        display: flex;\n        justify-content: center;\n        flex: 1;\n      }\n\n      .hidden {\n        display: none;\n      }\n\n      #container:hover > #title-image-container > .item-title {\n        text-decoration: underline;\n      }\n\n      /** this is a workaround for Safari 15 where the hover effects are not working */\n      #title-image-container:hover > #item-title {\n        text-decoration: underline;\n      }\n\n      #container:hover > #item-title {\n        background-color: #fcfcfc;\n      }\n\n      .item-creator {\n        display: flex;\n        justify-content: center;\n        align-items: flex-end; /* Important to start text from bottom */\n        height: 3rem;\n        padding-top: 1rem;\n      }\n\n      .truncated {\n        flex: 1;\n        min-width: 0; /* Important for long words! */\n      }\n\n      .truncated span {\n        font-size: 1.4rem;\n        color: #2c2c2c;\n        -webkit-line-clamp: 2;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        display: -webkit-box;\n        -webkit-box-orient: vertical;\n        word-wrap: break-word;\n        line-height: 2rem;\n        text-align: center;\n      }\n\n      .hr {\n        border: 0.5px solid #ccc;\n      }\n\n      #item-stats-container {\n        align-items: center;\n        display: flex;\n        height: 5.5rem;\n        padding-left: 1rem;\n        padding-right: 0.5rem;\n      }\n\n      #stats-holder {\n        align-items: center;\n        display: flex;\n        flex: 1;\n        justify-content: space-evenly;\n        text-align: center;\n        width: 100%;\n      }\n\n      svg {\n        height: 10px;\n        width: 10px;\n      }\n\n      .status-text {\n        font-size: 14px;\n        color: #2c2c2c;\n        margin: auto;\n        display: block;\n        text-align: center;\n      }\n\n      .col {\n        width: 25%;\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"item-tile.js","sourceRoot":"","sources":["../../../../src/tiles/grid/item-tile.ts"],"names":[],"mappings":";AAAA,yCAAyC;AACzC,OAAO,EAAE,GAAG,EAAkB,IAAI,EAAE,UAAU,EAAE,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5D,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAEvD,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAC9C,OAAO,SAAS,MAAM,eAAe,CAAC;AAEtC,OAAO,mBAAmB,CAAC;AAC3B,OAAO,eAAe,CAAC;AAGvB,IAAa,QAAQ,GAArB,MAAa,QAAS,SAAQ,UAAU;IAKtC,MAAM;;QACJ,MAAM,SAAS,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK,KAAI,EAAE,CAAC;QAC1C,MAAM,WAAW,GAAG,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,OAAO,KAAI,GAAG,CAAC;QAE/C,OAAO,IAAI,CAAA;;;sCAGuB,SAAS,IAAI,MAAA,IAAI,CAAC,KAAK,0CAAE,KAAK;;iCAEnC,IAAI,CAAC,KAAK,kBAAkB,IAAI,CAAC,YAAY;;;;;gDAK9B,WAAW;;;;;;;;;;;6BAW9B,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS;8BACpB,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW;;;;;;gBAMrC,SAAS;;kBAEP,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,EAAE,OAAO,EAAE,OAAO,CAAC;;;;gBAItD,kBAAkB;;kBAEhB,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,EAAE,OAAO,EAAE,OAAO,CAAC;;;;gBAItD,WAAW;;kBAET,WAAW,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,CAAC;;;;;;KAMhE,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,eAAe,GAAG,GAAG,CAAA,wCAAwC,CAAC;QAEpE,OAAO,GAAG,CAAA;;;yBAGW,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAoHnC,CAAC;IACJ,CAAC;CACF,CAAA;AAvL6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAuB;AAHvC,QAAQ;IADpB,aAAa,CAAC,WAAW,CAAC;GACd,QAAQ,CAwLpB;SAxLY,QAAQ","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport { css, CSSResultGroup, html, LitElement } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { TileModel } from '../../models';\nimport { formatCount } from '../../utils/format-count';\n\nimport { favoriteFilledIcon } from './icons/favorite-filled';\nimport { reviewsIcon } from './icons/reviews';\nimport viewsIcon from './icons/views';\n\nimport '../mediatype-icon';\nimport '../item-image';\n\n@customElement('item-tile')\nexport class ItemTile extends LitElement {\n  @property({ type: Object }) model?: TileModel;\n\n  @property({ type: String }) baseImageUrl?: string;\n\n  render() {\n    const itemTitle = this.model?.title || '';\n    const itemCreator = this.model?.creator || '-';\n\n    return html`\n      <div id=\"container\">\n        <div id=\"title-image-container\">\n          <h1 id=\"item-title\" title=${itemTitle}>${this.model?.title}</h1>\n          <div id=\"item-image-container\">\n            <item-image .model=${this.model} .baseImageUrl=${this.baseImageUrl}>\n            </item-image>\n          </div>\n          <div class=\"item-creator\">\n            <div class=\"truncated\">\n              <span><strong>By:&nbsp;</strong>${itemCreator}</span>\n            </div>\n          </div>\n        </div>\n\n        <div class=\"hr\"></div>\n\n        <div id=\"item-stats-container\">\n          <div id=\"stats-holder\">\n            <div class=\"col\">\n              <mediatype-icon\n                .mediatype=${this.model?.mediatype}\n                .collection=${this.model?.collections}\n                style=\"--iconHeight:25px; --iconWidth:25px;\"\n              >\n              </mediatype-icon>\n            </div>\n            <div class=\"col\">\n              ${viewsIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.viewCount, 'short', 'short')}\n              </p>\n            </div>\n            <div class=\"col\">\n              ${favoriteFilledIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.itemCount, 'short', 'short')}\n              </p>\n            </div>\n            <div class=\"col\">\n              ${reviewsIcon}\n              <p class=\"status-text\">\n                ${formatCount(this.model?.favCount, 'short', 'short')}\n              </p>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    const cornerRadiusCss = css`var(--collectionTileCornerRadius, 4px)`;\n\n    return css`\n      #container {\n        background-color: #ffffff;\n        border-radius: ${cornerRadiusCss};\n        box-shadow: 1px 1px 2px 0px;\n        display: flex;\n        flex-direction: column;\n        height: 100%;\n        position: relative;\n      }\n\n      #title-image-container {\n        display: flex;\n        flex: 1;\n        flex-direction: column;\n        padding: 0.5rem 0.5rem 0 0.5rem;\n      }\n\n      #item-title {\n        color: #2c2c2c;\n        font-size: 1.6rem;\n        text-align: center;\n        margin-top: 0rem;\n        margin-bottom: 0.5rem;\n        overflow: hidden;\n        text-overflow: ellipsis;\n        display: -webkit-box;\n        -webkit-line-clamp: 2;\n        -webkit-box-orient: vertical;\n        line-height: 2rem;\n        height: 4rem;\n      }\n\n      #item-image-container {\n        display: flex;\n        justify-content: center;\n        flex: 1;\n      }\n\n      .hidden {\n        display: none;\n      }\n\n      #container:hover > #title-image-container > .item-title {\n        text-decoration: underline;\n      }\n\n      /** this is a workaround for Safari 15 where the hover effects are not working */\n      #title-image-container:hover > #item-title {\n        text-decoration: underline;\n      }\n\n      #container:hover > #item-title {\n        background-color: #fcfcfc;\n      }\n\n      .item-creator {\n        display: flex;\n        justify-content: center;\n        align-items: flex-end; /* Important to start text from bottom */\n        height: 3rem;\n        padding-top: 1rem;\n      }\n\n      .truncated {\n        flex: 1;\n        min-width: 0; /* Important for long words! */\n      }\n\n      .truncated span {\n        font-size: 1.4rem;\n        color: #2c2c2c;\n        -webkit-line-clamp: 2;\n        text-overflow: ellipsis;\n        overflow: hidden;\n        display: -webkit-box;\n        -webkit-box-orient: vertical;\n        word-wrap: break-word;\n        line-height: 2rem;\n        text-align: center;\n      }\n\n      .hr {\n        border: 0.5px solid #ccc;\n      }\n\n      #item-stats-container {\n        align-items: center;\n        display: flex;\n        height: 5.5rem;\n        padding-left: 1rem;\n        padding-right: 0.5rem;\n      }\n\n      #stats-holder {\n        align-items: center;\n        display: flex;\n        flex: 1;\n        justify-content: space-evenly;\n        text-align: center;\n        width: 100%;\n      }\n\n      svg {\n        height: 10px;\n        width: 10px;\n      }\n\n      .status-text {\n        font-size: 14px;\n        color: #2c2c2c;\n        margin: auto;\n        display: block;\n        text-align: center;\n      }\n\n      .col {\n        width: 25%;\n      }\n    `;\n  }\n}\n"]}

package/dist/src/tiles/item-image.d.ts

@@ -2,7 +2,7 @@ import { CSSResultGroup, PropertyValues, LitElement } from 'lit';
 import { TileModel } from '../models';
 export declare class ItemImage extends LitElement {
     model?: TileModel;
-    baseNavigationUrl?: string;
+    baseImageUrl?: string;
     isListTile: boolean;
     private isDeemphasize;
     private itemImageWaveform;

package/dist/src/tiles/item-image.js

@@ -31,7 +31,7 @@ let ItemImage = class ItemImage extends LitElement {
     }
     get imageSrc() {
         var _a;
-        return `${this.baseNavigationUrl}/services/img/${(_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier}`;
+        return `${this.baseImageUrl}/services/img/${(_a = this.model) === null || _a === void 0 ? void 0 : _a.identifier}`;
     }
     // Templates
     get backgroundImageTemplate() {
@@ -94,7 +94,7 @@ let ItemImage = class ItemImage extends LitElement {
       .item-image {
         width: 16rem;
         height: 16rem;
-        object-fit: cover;
+        object-fit: contain;
         background-repeat: no-repeat;
         background-position: center center;
         position: relative;
@@ -198,7 +198,7 @@ __decorate([
 ], ItemImage.prototype, "model", void 0);
 __decorate([
     property({ type: String })
-], ItemImage.prototype, "baseNavigationUrl", void 0);
+], ItemImage.prototype, "baseImageUrl", void 0);
 __decorate([
     property({ type: Boolean })
 ], ItemImage.prototype, "isListTile", void 0);

package/dist/src/tiles/item-image.js.map

@@ -1 +1 @@
-{"version":3,"file":"item-image.js","sourceRoot":"","sources":["../../../src/tiles/item-image.ts"],"names":[],"mappings":";AAAA,OAAO,EACL,GAAG,EAEH,IAAI,EACJ,OAAO,EAEP,UAAU,GACX,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,MAAM,8BAA8B,CAAC;AAKzD,IAAa,SAAS,GAAtB,MAAa,SAAU,SAAQ,UAAU;IAAzC;;QAK+B,eAAU,GAAG,KAAK,CAAC;QAE/B,kBAAa,GAAG,KAAK,CAAC;IAoMzC,CAAC;IAhMW,OAAO,CAAC,OAAuB;QACvC,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;YACxB,IAAI,CAAC,aAAa,EAAE,CAAC;SACtB;IACH,CAAC;IAEO,aAAa;;QACnB,IAAI,CAAC,aAAa;YAChB,MAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,mCAAI,KAAK,CAAC;IAC7D,CAAC;IAED,MAAM;;QACJ,OAAO,IAAI,CAAA;mBACI,SAAS,CAAC,IAAI,CAAC,aAAa,CAAC;UACtC,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,SAAS,MAAK,OAAO;YACjC,CAAC,CAAC,IAAI,CAAC,gBAAgB;YACvB,CAAC,CAAC,IAAI,CAAC,uBAAuB;UAC9B,IAAI,CAAC,kBAAkB;;KAE5B,CAAC;IACJ,CAAC;IAED,IAAY,QAAQ;;QAClB,OAAO,GAAG,IAAI,CAAC,iBAAiB,iBAAiB,MAAA,IAAI,CAAC,KAAK,0CAAE,UAAU,EAAE,CAAC;IAC5E,CAAC;IAED,YAAY;IACZ,IAAY,uBAAuB;QACjC,OAAO,IAAI,CAAA;;gBAEC,IAAI,CAAC,UAAU;sCACO,IAAI,CAAC,QAAQ;;KAE9C,CAAC;IACJ,CAAC;IAED,IAAY,gBAAgB;;QAC1B,OAAO,IAAI,CAAA;4BACa,IAAI,CAAC,cAAc;;;iBAG9B,IAAI,CAAC,QAAQ;iBACb,SAAS,CAAC,MAAA,IAAI,CAAC,KAAK,0CAAE,UAAU,CAAC;kBAChC,IAAI,CAAC,oBAAoB;;;KAGtC,CAAC;IACJ,CAAC;IAED,IAAY,kBAAkB;QAC5B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO,OAAO,CAAC;SAChB;QACD,OAAO,IAAI,CAAA;;KAEV,CAAC;IACJ,CAAC;IAEO,oBAAoB;QAC1B,MAAM,WAAW,GACf,IAAI,CAAC,iBAAiB,CAAC,YAAY;YACnC,IAAI,CAAC,iBAAiB,CAAC,aAAa,CAAC;QACvC,IAAI,WAAW,KAAK,CAAC,EAAE;YACrB,IAAI,CAAC,iBAAiB,CAAC,SAAS,CAAC,GAAG,CAAC,UAAU,CAAC,CAAC;SAClD;IACH,CAAC;IAED,UAAU;IACV,IAAY,UAAU;QACpB,OAAO,cAAc,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EAAE,CAAC;IACxE,CAAC;IAED,IAAY,aAAa;QACvB,OAAO,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,CAAC;IAC3D,CAAC;IAED,IAAY,cAAc;QACxB,OAAO,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;IAC1D,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA6GT,CAAC;IACJ,CAAC;CACF,CAAA;AA1M6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wCAAmB;AAElB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAA4B;AAE1B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;6CAAoB;AAEvC;IAAR,KAAK,EAAE;gDAA+B;AAEjB;IAArB,KAAK,CAAC,aAAa,CAAC;oDAA8C;AATxD,SAAS;IADrB,aAAa,CAAC,YAAY,CAAC;GACf,SAAS,CA2MrB;SA3MY,SAAS","sourcesContent":["import {\n  css,\n  CSSResultGroup,\n  html,\n  nothing,\n  PropertyValues,\n  LitElement,\n} from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { TileModel } from '../models';\n\n@customElement('item-image')\nexport class ItemImage extends LitElement {\n  @property({ type: Object }) model?: TileModel;\n\n  @property({ type: String }) baseNavigationUrl?: string;\n\n  @property({ type: Boolean }) isListTile = false;\n\n  @state() private isDeemphasize = false;\n\n  @query('.item-image') private itemImageWaveform!: HTMLImageElement;\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('model')) {\n      this.setDeemphsize();\n    }\n  }\n\n  private setDeemphsize() {\n    this.isDeemphasize =\n      this.model?.collections.includes('deemphasize') ?? false;\n  }\n\n  render() {\n    return html`\n      <div class=${ifDefined(this.imageBoxClass)}>\n        ${this.model?.mediatype === 'audio'\n          ? this.waveformTemplate\n          : this.backgroundImageTemplate}\n        ${this.tileActionTemplate}\n      </div>\n    `;\n  }\n\n  private get imageSrc() {\n    return `${this.baseNavigationUrl}/services/img/${this.model?.identifier}`;\n  }\n\n  // Templates\n  private get backgroundImageTemplate() {\n    return html`\n      <div\n        class=${this.imageClass}\n        style=\"background-image:url(${this.imageSrc})\"\n      ></div>\n    `;\n  }\n\n  private get waveformTemplate() {\n    return html`\n      <div class=\"box\" id=${this.randomGradient}>\n        <img\n          class=\"item-image\"\n          src=\"${this.imageSrc}\"\n          alt=\"${ifDefined(this.model?.identifier)}\"\n          @load=${this.onLoadItemImageCheck}\n        />\n      </div>\n    `;\n  }\n\n  private get tileActionTemplate() {\n    if (!this.isDeemphasize) {\n      return nothing;\n    }\n    return html`\n      <div class=\"tile-action no-preview\">Content may be inappropriate</div>\n    `;\n  }\n\n  private onLoadItemImageCheck() {\n    const aspectRatio =\n      this.itemImageWaveform.naturalWidth /\n      this.itemImageWaveform.naturalHeight;\n    if (aspectRatio === 4) {\n      this.itemImageWaveform.classList.add('waveform');\n    }\n  }\n\n  // Classes\n  private get imageClass() {\n    return `item-image ${this.isDeemphasize ? 'deemphasize' : 'default'}`;\n  }\n\n  private get imageBoxClass() {\n    return this.isDeemphasize ? 'item-image-box' : undefined;\n  }\n\n  private get randomGradient() {\n    return `grad${Math.floor(Math.random() * (6 - 1) + 1)}`;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      .item-image-box {\n        width: 16rem;\n        height: 16rem;\n        overflow: hidden;\n        position: relative;\n        box-shadow: 1px 1px 2px 0px;\n        display: flex;\n      }\n\n      .item-image {\n        width: 16rem;\n        height: 16rem;\n        object-fit: cover;\n        background-repeat: no-repeat;\n        background-position: center center;\n        position: relative;\n        -webkit-appearance: none;\n        overflow: visible;\n      }\n\n      .waveform {\n        mix-blend-mode: screen;\n      }\n\n      .default {\n        background-size: contain;\n        filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));\n      }\n\n      .deemphasize {\n        background-size: cover;\n        filter: blur(15px);\n        z-index: 1;\n      }\n\n      .tile-action {\n        border: 1px solid currentColor;\n        border-radius: 1px;\n        padding: 5px;\n        font-weight: 500;\n        width: auto;\n        position: absolute;\n        z-index: 2;\n        display: flex;\n        top: 5.5rem;\n      }\n\n      .no-preview {\n        background-color: #fffecb;\n        color: #2c2c2c;\n        font-size: 1.4rem;\n        line-height: 2rem;\n        text-align: center;\n      }\n\n      #grad1 {\n        background: linear-gradient(\n          hsl(300, 80%, 55%),\n          hsl(330, 80%, 33%) 35%,\n          hsl(330, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad2 {\n        background: linear-gradient(\n          hsl(200, 80%, 55%),\n          hsl(230, 80%, 33%) 35%,\n          hsl(230, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad3 {\n        background: linear-gradient(\n          hsl(160, 80%, 55%),\n          hsl(190, 80%, 33%) 35%,\n          hsl(190, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad4 {\n        background: linear-gradient(\n          hsl(250, 80%, 55%),\n          hsl(280, 80%, 33%) 35%,\n          hsl(280, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad5 {\n        background: linear-gradient(\n          hsl(280, 80%, 55%),\n          hsl(310, 80%, 33%) 35%,\n          hsl(310, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad6 {\n        background: linear-gradient(\n          hsl(340, 80%, 55%),\n          hsl(0, 80%, 33%) 35%,\n          hsl(0, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"item-image.js","sourceRoot":"","sources":["../../../src/tiles/item-image.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  css,\n  CSSResultGroup,\n  html,\n  nothing,\n  PropertyValues,\n  LitElement,\n} from 'lit';\nimport { customElement, property, query, state } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\n\nimport { TileModel } from '../models';\n\n@customElement('item-image')\nexport class ItemImage extends LitElement {\n  @property({ type: Object }) model?: TileModel;\n\n  @property({ type: String }) baseImageUrl?: string;\n\n  @property({ type: Boolean }) isListTile = false;\n\n  @state() private isDeemphasize = false;\n\n  @query('.item-image') private itemImageWaveform!: HTMLImageElement;\n\n  protected updated(changed: PropertyValues): void {\n    if (changed.has('model')) {\n      this.setDeemphsize();\n    }\n  }\n\n  private setDeemphsize() {\n    this.isDeemphasize =\n      this.model?.collections.includes('deemphasize') ?? false;\n  }\n\n  render() {\n    return html`\n      <div class=${ifDefined(this.imageBoxClass)}>\n        ${this.model?.mediatype === 'audio'\n          ? this.waveformTemplate\n          : this.backgroundImageTemplate}\n        ${this.tileActionTemplate}\n      </div>\n    `;\n  }\n\n  private get imageSrc() {\n    return `${this.baseImageUrl}/services/img/${this.model?.identifier}`;\n  }\n\n  // Templates\n  private get backgroundImageTemplate() {\n    return html`\n      <div\n        class=${this.imageClass}\n        style=\"background-image:url(${this.imageSrc})\"\n      ></div>\n    `;\n  }\n\n  private get waveformTemplate() {\n    return html`\n      <div class=\"box\" id=${this.randomGradient}>\n        <img\n          class=\"item-image\"\n          src=\"${this.imageSrc}\"\n          alt=\"${ifDefined(this.model?.identifier)}\"\n          @load=${this.onLoadItemImageCheck}\n        />\n      </div>\n    `;\n  }\n\n  private get tileActionTemplate() {\n    if (!this.isDeemphasize) {\n      return nothing;\n    }\n    return html`\n      <div class=\"tile-action no-preview\">Content may be inappropriate</div>\n    `;\n  }\n\n  private onLoadItemImageCheck() {\n    const aspectRatio =\n      this.itemImageWaveform.naturalWidth /\n      this.itemImageWaveform.naturalHeight;\n    if (aspectRatio === 4) {\n      this.itemImageWaveform.classList.add('waveform');\n    }\n  }\n\n  // Classes\n  private get imageClass() {\n    return `item-image ${this.isDeemphasize ? 'deemphasize' : 'default'}`;\n  }\n\n  private get imageBoxClass() {\n    return this.isDeemphasize ? 'item-image-box' : undefined;\n  }\n\n  private get randomGradient() {\n    return `grad${Math.floor(Math.random() * (6 - 1) + 1)}`;\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      .item-image-box {\n        width: 16rem;\n        height: 16rem;\n        overflow: hidden;\n        position: relative;\n        box-shadow: 1px 1px 2px 0px;\n        display: flex;\n      }\n\n      .item-image {\n        width: 16rem;\n        height: 16rem;\n        object-fit: contain;\n        background-repeat: no-repeat;\n        background-position: center center;\n        position: relative;\n        -webkit-appearance: none;\n        overflow: visible;\n      }\n\n      .waveform {\n        mix-blend-mode: screen;\n      }\n\n      .default {\n        background-size: contain;\n        filter: drop-shadow(1px 1px 2px rgba(0, 0, 0, 0.8));\n      }\n\n      .deemphasize {\n        background-size: cover;\n        filter: blur(15px);\n        z-index: 1;\n      }\n\n      .tile-action {\n        border: 1px solid currentColor;\n        border-radius: 1px;\n        padding: 5px;\n        font-weight: 500;\n        width: auto;\n        position: absolute;\n        z-index: 2;\n        display: flex;\n        top: 5.5rem;\n      }\n\n      .no-preview {\n        background-color: #fffecb;\n        color: #2c2c2c;\n        font-size: 1.4rem;\n        line-height: 2rem;\n        text-align: center;\n      }\n\n      #grad1 {\n        background: linear-gradient(\n          hsl(300, 80%, 55%),\n          hsl(330, 80%, 33%) 35%,\n          hsl(330, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad2 {\n        background: linear-gradient(\n          hsl(200, 80%, 55%),\n          hsl(230, 80%, 33%) 35%,\n          hsl(230, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad3 {\n        background: linear-gradient(\n          hsl(160, 80%, 55%),\n          hsl(190, 80%, 33%) 35%,\n          hsl(190, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad4 {\n        background: linear-gradient(\n          hsl(250, 80%, 55%),\n          hsl(280, 80%, 33%) 35%,\n          hsl(280, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad5 {\n        background: linear-gradient(\n          hsl(280, 80%, 55%),\n          hsl(310, 80%, 33%) 35%,\n          hsl(310, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n\n      #grad6 {\n        background: linear-gradient(\n          hsl(340, 80%, 55%),\n          hsl(0, 80%, 33%) 35%,\n          hsl(0, 80%, 22%) 70%,\n          hsl(0, 0%, 0%)\n        );\n      }\n    `;\n  }\n}\n"]}

package/dist/src/tiles/list/tile-list-compact.d.ts

@@ -9,6 +9,7 @@ export declare class TileListCompact extends LitElement {
     currentHeight?: number;
     sortParam: SortParam | null;
     mobileBreakpoint?: number;
+    baseImageUrl?: string;
     render(): import("lit-html").TemplateResult<1>;
     private get collectionColor();
     private get imageTemplate();