@internetarchive/collection-browser 0.0.1-alpha.1

package/dist/src/collection-browser.js

@@ -0,0 +1,697 @@
+import { __decorate } from "tslib";
+/* eslint-disable import/no-duplicates */
+import { html, css, LitElement, nothing, } from 'lit';
+import { customElement, property, query, state } from 'lit/decorators.js';
+import { SearchParams, } from '@internetarchive/search-service';
+import { AggregateSearchParams, } from '@internetarchive/search-service/dist/src/search-params';
+import '@internetarchive/infinite-scroller';
+import '@internetarchive/histogram-date-range';
+import './tiles/tile-dispatcher';
+import './tiles/loading-tile';
+import './sort-filter-bar/sort-filter-bar';
+import './collection-facets';
+import './circular-activity-indicator';
+let CollectionBrowser = class CollectionBrowser extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.showDeleteButtons = false;
+        this.displayMode = 'grid';
+        this.pageSize = 50;
+        /**
+         * The page that the consumer wants to load.
+         */
+        this.initialPageNumber = 1;
+        /**
+         * This the the number of pages that we want to show.
+         *
+         * The data isn't necessarily loaded for all of the pages, but this lets us
+         * know how many cells we should render.
+         */
+        this.pagesToRender = this.initialPageNumber;
+        this.searchResultsLoading = false;
+        this.selectedFacets = {};
+        this.facetsLoading = false;
+        this.fullYearAggregationLoading = false;
+        /**
+         * When we're animated scrolling to the page, we don't want to fetch
+         * all of the pages as it scrolls so this lets us know if we're scrolling
+         */
+        this.isScrollingToCell = false;
+        /**
+         * When we've reached the end of the data, stop trying to fetch more
+         */
+        this.endOfDataReached = false;
+        this.placeholderCellTemplate = html `<loading-tile></loading-tile>`;
+        /**
+         * The results per page so we can paginate.
+         *
+         * This allows us to start in the middle of the search results and
+         * fetch data before or after the current page. If we don't have a key
+         * for the previous/next page, we'll fetch the next/previous page to populate it
+         */
+        this.dataSource = {};
+        // we only want to scroll on the very first query change
+        // so this keeps track of whether we've already set the initial query
+        this.initialQueryChangeHappened = false;
+        // this maps the query to the pages being fetched for that query
+        this.pageFetchesInProgress = {};
+    }
+    tileModelAtCellIndex(index) {
+        var _a;
+        const pageNumber = Math.floor(index / this.pageSize) + 1;
+        const itemIndex = index % this.pageSize;
+        const model = (_a = this.dataSource[pageNumber]) === null || _a === void 0 ? void 0 : _a[itemIndex];
+        /**
+         * If we encounter a model we don't have yet and we're not in the middle of an
+         * automated scroll, fetch the page and just return undefined.
+         * The datasource will be updated once the page is loaded and the cell will be rendered.
+         *
+         * We disable it during the automated scroll since we may fetch pages for cells the
+         * user may never see.
+         */
+        if (!model && !this.isScrollingToCell) {
+            this.fetchPage(pageNumber);
+        }
+        return model;
+    }
+    // this is the total number of tiles we expect if
+    // the data returned is a full page worth
+    // this is useful for putting in placeholders for the expected number of tiles
+    get estimatedTileCount() {
+        return this.pagesToRender * this.pageSize;
+    }
+    // this is the actual number of tiles in the datasource,
+    // which is useful for removing excess placeholder tiles
+    // once we reached the end of the data
+    get actualTileCount() {
+        return Object.keys(this.dataSource).reduce((acc, page) => acc + this.dataSource[page].length, 0);
+    }
+    /**
+     *
+     * @param pageNumber
+     * @param scroll
+     */
+    goToPage(pageNumber) {
+        this.initialPageNumber = pageNumber;
+        this.pagesToRender = pageNumber;
+        this.scrollToPage(pageNumber);
+    }
+    render() {
+        var _a, _b;
+        return html `
+      <h1>Collection Browser</h1>
+
+      <div id="query">
+        <ul>
+          <li>Base Query: ${this.baseQuery}</li>
+          <li>Facet Query: ${this.facetQuery}</li>
+          <li>Additional Query: ${this.additionalQueryClause}</li>
+          <li>Date Range Query: ${this.dateRangeQueryClause}</li>
+          <li>Sort: ${(_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.field} ${(_b = this.sortParam) === null || _b === void 0 ? void 0 : _b.direction}</li>
+          <li>Full Query: ${this.fullQuery}</li>
+        </ul>
+      </div>
+
+      <div id="content-container">
+        <div id="left-column">
+          <div id="histogram-container">${this.histogramTemplate}</div>
+          <div id="facets-container">
+            ${this.facetsLoading ? this.loadingTemplate : nothing}
+            <collection-facets
+              @facetsChanged=${this.facetsChanged}
+              .aggregations=${this.aggregations}
+            ></collection-facets>
+          </div>
+        </div>
+        <div id="right-column">
+          ${this.searchResultsLoading ? this.loadingTemplate : nothing}
+          <infinite-scroller
+            class="${this.displayMode}"
+            .cellProvider=${this}
+            .placeholderCellTemplate=${this.placeholderCellTemplate}
+            @scrollThresholdReached=${this.scrollThresholdReached}
+            @visibleCellsChanged=${this.visibleCellsChanged}
+          >
+          </infinite-scroller>
+        </div>
+      </div>
+    `;
+    }
+    get loadingTemplate() {
+        return html `
+      <div class="loading-cover">
+        <circular-activity-indicator></circular-activity-indicator>
+      </div>
+    `;
+    }
+    get currentYearsHistogramAggregation() {
+        var _a;
+        return (_a = this.aggregations) === null || _a === void 0 ? void 0 : _a.year_histogram;
+    }
+    get histogramDataLoading() {
+        return this.facetsLoading || this.fullYearAggregationLoading;
+    }
+    get histogramTemplate() {
+        const { currentYearsHistogramAggregation, fullYearsHistogramAggregation } = this;
+        return html `
+      <histogram-date-range
+        .minDate=${fullYearsHistogramAggregation === null || fullYearsHistogramAggregation === void 0 ? void 0 : fullYearsHistogramAggregation.first_bucket_key}
+        .maxDate=${fullYearsHistogramAggregation === null || fullYearsHistogramAggregation === void 0 ? void 0 : fullYearsHistogramAggregation.last_bucket_key}
+        .minSelectedDate=${currentYearsHistogramAggregation === null || currentYearsHistogramAggregation === void 0 ? void 0 : currentYearsHistogramAggregation.first_bucket_key}
+        .maxSelectedDate=${currentYearsHistogramAggregation === null || currentYearsHistogramAggregation === void 0 ? void 0 : currentYearsHistogramAggregation.last_bucket_key}
+        .updateDelay=${100}
+        missingDataMessage="..."
+        ?loading=${this.histogramDataLoading}
+        .width=${150}
+        .bins=${fullYearsHistogramAggregation === null || fullYearsHistogramAggregation === void 0 ? void 0 : fullYearsHistogramAggregation.buckets}
+        @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}
+      ></histogram-date-range>
+    `;
+    }
+    histogramDateRangeUpdated(e) {
+        const { minDate, maxDate } = e.detail;
+        this.dateRangeQueryClause = `year:[${minDate} TO ${maxDate}]`;
+    }
+    updated(changed) {
+        if (changed.has('displayMode') || changed.has('showDeleteButtons')) {
+            this.infiniteScroller.reload();
+        }
+        if (changed.has('baseQuery') ||
+            changed.has('additionalQueryClause') ||
+            changed.has('dateRangeQueryClause') ||
+            changed.has('sortParam') ||
+            changed.has('selectedFacets')) {
+            this.handleQueryChange();
+        }
+        if (changed.has('pagesToRender')) {
+            if (!this.endOfDataReached) {
+                this.infiniteScroller.itemCount = this.estimatedTileCount;
+            }
+        }
+    }
+    /**
+     * When the visible cells change from the infinite scroller, we want to emit
+     * which page is currently visible so the consumer can update its UI or the URL
+     *
+     * @param e
+     * @returns
+     */
+    visibleCellsChanged(e) {
+        if (this.isScrollingToCell)
+            return;
+        const { visibleCellIndices } = e.detail;
+        if (visibleCellIndices.length === 0)
+            return;
+        const lastVisibleCellIndex = visibleCellIndices[visibleCellIndices.length - 1];
+        const lastVisibleCellPage = Math.floor(lastVisibleCellIndex / this.pageSize) + 1;
+        const event = new CustomEvent('visiblePageChanged', {
+            detail: {
+                pageNumber: lastVisibleCellPage,
+            },
+        });
+        this.dispatchEvent(event);
+    }
+    async handleQueryChange() {
+        // only reset if the query has actually changed
+        if (this.pageFetchQueryKey === this.previousQueryKey)
+            return;
+        this.previousQueryKey = this.pageFetchQueryKey;
+        this.dataSource = {};
+        this.pageFetchesInProgress = {};
+        this.endOfDataReached = false;
+        this.pagesToRender = this.initialPageNumber;
+        if (!this.initialQueryChangeHappened && this.initialPageNumber > 1) {
+            this.scrollToPage(this.initialPageNumber);
+        }
+        this.initialQueryChangeHappened = true;
+        await Promise.all([
+            this.doInitialPageFetch(),
+            this.fetchFacets(),
+            this.fetchFullYearHistogram(),
+        ]);
+    }
+    async doInitialPageFetch() {
+        this.searchResultsLoading = true;
+        await this.fetchPage(this.initialPageNumber);
+        this.searchResultsLoading = false;
+    }
+    get fullQuery() {
+        let { fullQueryWithoutDate } = this;
+        const { dateRangeQueryClause } = this;
+        if (dateRangeQueryClause) {
+            fullQueryWithoutDate += ` AND ${dateRangeQueryClause}`;
+        }
+        return fullQueryWithoutDate;
+    }
+    get fullQueryWithoutDate() {
+        if (!this.baseQuery)
+            return undefined;
+        let fullQuery = this.baseQuery;
+        const { facetQuery, additionalQueryClause } = this;
+        if (facetQuery) {
+            fullQuery += ` AND ${facetQuery}`;
+        }
+        if (additionalQueryClause) {
+            fullQuery += ` AND ${additionalQueryClause}`;
+        }
+        return fullQuery;
+    }
+    get facetQuery() {
+        const facetQuery = [];
+        for (const [facetName, selectedValues] of Object.entries(this.selectedFacets)) {
+            const values = [];
+            for (const value of selectedValues) {
+                values.push(`${facetName}:"${value}"`);
+            }
+            const valueQuery = values.join(' OR ');
+            facetQuery.push(`(${valueQuery})`);
+        }
+        return facetQuery.length > 0 ? `(${facetQuery.join(' AND ')})` : undefined;
+    }
+    facetsChanged(e) {
+        this.selectedFacets = e.detail;
+    }
+    async fetchFacets() {
+        var _a, _b;
+        if (!this.fullQuery)
+            return;
+        const aggregations = new AggregateSearchParams({
+            advancedParams: [
+                {
+                    field: 'subjectSorter',
+                    size: 6,
+                },
+                {
+                    field: 'mediatypeSorter',
+                    size: 6,
+                },
+                {
+                    field: 'languageSorter',
+                    size: 6,
+                },
+                {
+                    field: 'creatorSorter',
+                    size: 6,
+                },
+                {
+                    field: 'collection',
+                    size: 12,
+                },
+                {
+                    field: 'year',
+                    size: 50,
+                },
+            ],
+        });
+        const params = new SearchParams({
+            query: this.fullQuery,
+            fields: ['identifier'],
+            aggregations,
+            rows: 1,
+        });
+        this.facetsLoading = true;
+        const results = await ((_a = this.searchService) === null || _a === void 0 ? void 0 : _a.search(params));
+        this.facetsLoading = false;
+        this.aggregations = (_b = results === null || results === void 0 ? void 0 : results.success) === null || _b === void 0 ? void 0 : _b.response.aggregations;
+    }
+    /**
+     * The query key is a string that uniquely identifies the current query
+     * without the date range.
+     *
+     * If this doesn't change, we don't need to re-fetch the histogram date range
+     */
+    get fullQueryNoDateKey() {
+        var _a;
+        return `${this.fullQueryWithoutDate}-${(_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.asString}`;
+    }
+    /**
+     * This method is similar to fetching the facets above,
+     * but only fetching the year histogram. There is a subtle difference
+     * in how you have to fetch the year histogram where you can't use the
+     * advanced JSON syntax like the other aggregations. It's a special
+     * case that @ximm put it place.
+     */
+    async fetchFullYearHistogram() {
+        var _a, _b, _c, _d;
+        const { fullQueryNoDateKey } = this;
+        if (!this.fullQueryWithoutDate ||
+            fullQueryNoDateKey === this.previousFullQueryNoDate)
+            return;
+        this.previousFullQueryNoDate = fullQueryNoDateKey;
+        const aggregations = new AggregateSearchParams({
+            simpleParams: ['year'],
+        });
+        const params = new SearchParams({
+            query: this.fullQueryWithoutDate,
+            fields: ['identifier'],
+            aggregations,
+            rows: 1,
+        });
+        this.fullYearAggregationLoading = true;
+        const results = await ((_a = this.searchService) === null || _a === void 0 ? void 0 : _a.search(params));
+        this.fullYearAggregationLoading = false;
+        this.fullYearsHistogramAggregation =
+            (_d = (_c = (_b = results === null || results === void 0 ? void 0 : results.success) === null || _b === void 0 ? void 0 : _b.response) === null || _c === void 0 ? void 0 : _c.aggregations) === null || _d === void 0 ? void 0 : _d.year_histogram;
+    }
+    scrollToPage(pageNumber) {
+        const cellIndexToScrollTo = this.pageSize * (pageNumber - 1);
+        // without this setTimeout, Safari just pauses until the `fetchPage` is complete
+        // then scrolls to the cell
+        setTimeout(() => {
+            this.isScrollingToCell = true;
+            this.infiniteScroller.scrollToCell(cellIndexToScrollTo, true);
+            // This timeout is to give the scroll animation time to finish
+            // then updating the infinite scroller once we're done scrolling
+            // There's no scroll animation completion callback so we're
+            // giving it 0.5s to finish.
+            setTimeout(() => {
+                this.isScrollingToCell = false;
+                this.infiniteScroller.reload();
+            }, 500);
+        }, 0);
+    }
+    /**
+     * The query key is a string that uniquely identifies the current query
+     *
+     * This lets us keep track of queries so we don't persist data that's
+     * no longer relevant.
+     */
+    get pageFetchQueryKey() {
+        var _a;
+        return `${this.fullQuery}-${(_a = this.sortParam) === null || _a === void 0 ? void 0 : _a.asString}`;
+    }
+    async fetchPage(pageNumber) {
+        var _a, _b, _c, _d;
+        if (!this.fullQuery)
+            return;
+        // if we already have data, don't fetch again
+        if (this.dataSource[pageNumber])
+            return;
+        if (this.endOfDataReached)
+            return;
+        // if a fetch is already in progress for this query and page, don't fetch again
+        const { pageFetchQueryKey } = this;
+        const pageFetches = (_a = this.pageFetchesInProgress[pageFetchQueryKey]) !== null && _a !== void 0 ? _a : new Set();
+        if (pageFetches.has(pageNumber))
+            return;
+        pageFetches.add(pageNumber);
+        this.pageFetchesInProgress[pageFetchQueryKey] = pageFetches;
+        const sortParams = this.sortParam ? [this.sortParam] : [];
+        const params = new SearchParams({
+            query: this.fullQuery,
+            fields: [
+                'identifier',
+                'title',
+                'mediatype',
+                'downloads',
+                'avg_rating',
+                'num_favorites',
+                'num_reviews',
+                'item_count',
+                'description',
+                'date',
+                'addeddate',
+                'publicdate',
+                'reviewdate',
+                'creator',
+                'subject',
+                'source',
+                'collection',
+            ],
+            page: pageNumber,
+            rows: this.pageSize,
+            sort: sortParams,
+        });
+        const results = await ((_b = this.searchService) === null || _b === void 0 ? void 0 : _b.search(params));
+        const success = results === null || results === void 0 ? void 0 : results.success;
+        if (!success)
+            return;
+        // this is checking to see if the query has changed since the data was fetched
+        // if so, we just want to discard the data since there should be a new query
+        // right behind it
+        const searchQuery = success.responseHeader.params.qin;
+        const searchSort = success.responseHeader.params.sort;
+        const queryChangedSinceFetch = searchQuery !== this.fullQuery || searchSort !== ((_c = this.sortParam) === null || _c === void 0 ? void 0 : _c.asString);
+        if (queryChangedSinceFetch)
+            return;
+        const { docs } = success.response;
+        if (docs && docs.length > 0) {
+            this.updateDataSource(pageNumber, docs);
+        }
+        if (docs.length < this.pageSize) {
+            this.endOfDataReached = true;
+            // this updates the infinite scroller to show the actual size
+            this.infiniteScroller.itemCount = this.actualTileCount;
+        }
+        (_d = this.pageFetchesInProgress[pageFetchQueryKey]) === null || _d === void 0 ? void 0 : _d.delete(pageNumber);
+        this.searchResultsLoading = false;
+    }
+    /**
+     * This is useful for determining whether we need to reload the scroller.
+     *
+     * When the fetch completes, we need to reload the scroller if the cells for that
+     * page are visible, but if the page is not currenlty visible, we don't need to reload
+     */
+    get currentVisiblePageNumbers() {
+        const visibleCells = this.infiniteScroller.getVisibleCellIndices();
+        const visiblePages = new Set();
+        visibleCells.forEach(cellIndex => {
+            const visiblePage = Math.floor(cellIndex / this.pageSize) + 1;
+            visiblePages.add(visiblePage);
+        });
+        return Array.from(visiblePages);
+    }
+    /**
+     * Update the datasource from the fetch response
+     *
+     * @param pageNumber
+     * @param docs
+     */
+    updateDataSource(pageNumber, docs) {
+        // copy our existing datasource so when we set it below, it gets set
+        // instead of modifying the existing dataSource since object changes
+        // don't trigger a re-render
+        const datasource = { ...this.dataSource };
+        const tiles = [];
+        docs === null || docs === void 0 ? void 0 : docs.forEach(doc => {
+            var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x, _y;
+            if (!doc.identifier)
+                return;
+            tiles.push({
+                identifier: doc.identifier,
+                title: this.etreeTitle((_a = doc.title) === null || _a === void 0 ? void 0 : _a.value, (_b = doc.mediatype) === null || _b === void 0 ? void 0 : _b.value),
+                mediatype: (_d = (_c = doc.mediatype) === null || _c === void 0 ? void 0 : _c.value) !== null && _d !== void 0 ? _d : 'data',
+                viewCount: (_f = (_e = doc.downloads) === null || _e === void 0 ? void 0 : _e.value) !== null && _f !== void 0 ? _f : 0,
+                favCount: (_h = (_g = doc.num_favorites) === null || _g === void 0 ? void 0 : _g.value) !== null && _h !== void 0 ? _h : 0,
+                commentCount: (_k = (_j = doc.num_reviews) === null || _j === void 0 ? void 0 : _j.value) !== null && _k !== void 0 ? _k : 0,
+                itemCount: (_m = (_l = doc.item_count) === null || _l === void 0 ? void 0 : _l.value) !== null && _m !== void 0 ? _m : 0,
+                description: (_o = doc.description) === null || _o === void 0 ? void 0 : _o.value,
+                dateAdded: (_p = doc.addeddate) === null || _p === void 0 ? void 0 : _p.value,
+                dateArchived: (_q = doc.publicdate) === null || _q === void 0 ? void 0 : _q.value,
+                dateReviewed: (_r = doc.reviewdate) === null || _r === void 0 ? void 0 : _r.value,
+                datePublished: (_s = doc.date) === null || _s === void 0 ? void 0 : _s.value,
+                creator: (_t = doc.creator) === null || _t === void 0 ? void 0 : _t.value,
+                averageRating: (_u = doc.avg_rating) === null || _u === void 0 ? void 0 : _u.value,
+                subject: (_v = doc.subject) === null || _v === void 0 ? void 0 : _v.value,
+                source: (_w = doc.source) === null || _w === void 0 ? void 0 : _w.value,
+                collection: (_y = (_x = doc.collection) === null || _x === void 0 ? void 0 : _x.values) !== null && _y !== void 0 ? _y : [],
+            });
+        });
+        datasource[pageNumber] = tiles;
+        this.dataSource = datasource;
+        const visiblePages = this.currentVisiblePageNumbers;
+        const needsReload = visiblePages.includes(pageNumber);
+        if (needsReload) {
+            this.infiniteScroller.reload();
+        }
+    }
+    /*
+     * Convert etree titles
+     * "[Creator] Live at [Place] on [Date]" => "[Date]: [Place]"
+     *
+     * Todo: Check collection(s) for etree, need to get as array.
+     * Current search-service only returns first collection as string.
+     */
+    etreeTitle(title, mediatype) {
+        if (mediatype === 'etree') {
+            // || collections.includes('etree')) {
+            const regex = /^(.*) Live at (.*) on (\d\d\d\d-\d\d-\d\d)$/;
+            const newTitle = title === null || title === void 0 ? void 0 : title.replace(regex, '$3: $2');
+            if (newTitle) {
+                return `${newTitle}`;
+            }
+        }
+        return title !== null && title !== void 0 ? title : '';
+    }
+    cellForIndex(index) {
+        const model = this.tileModelAtCellIndex(index);
+        if (!model)
+            return undefined;
+        return html ` <tile-dispatcher
+      .baseNavigationUrl=${this.baseNavigationUrl}
+      .model=${model}
+      .displayMode=${this.displayMode}
+      .resizeObserver=${this.resizeObserver}
+      .sortParam=${this.sortParam}
+      ?showDeleteButton=${this.showDeleteButtons}
+    ></tile-dispatcher>`;
+    }
+    /**
+     * When the user scrolls near to the bottom of the page, fetch the next page
+     * increase the number of pages to render and start fetching data for the new page
+     */
+    scrollThresholdReached() {
+        this.pagesToRender += 1;
+        this.fetchPage(this.pagesToRender);
+    }
+};
+CollectionBrowser.styles = css `
+    :host {
+      display: block;
+    }
+
+    #content-container {
+      display: flex;
+    }
+
+    #right-column {
+      flex: 1;
+      position: relative;
+    }
+
+    #left-column {
+      width: 15rem;
+    }
+
+    #facets-container {
+      position: relative;
+    }
+
+    .loading-cover {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-color: rgba(255, 255, 255, 0.75);
+      display: flex;
+      justify-content: center;
+      z-index: 1;
+      padding-top: 50px;
+    }
+
+    circular-activity-indicator {
+      width: 30px;
+      height: 30px;
+    }
+
+    infinite-scroller {
+      display: block;
+      --infiniteScrollerRowGap: var(--collectionBrowserRowGap, 1.7rem);
+      --infiniteScrollerColGap: var(--collectionBrowserColGap, 1.7rem);
+    }
+
+    infinite-scroller.list-compact {
+      --infiniteScrollerCellMinWidth: var(
+        --collectionBrowserCellMinWidth,
+        100%
+      );
+      --infiniteScrollerCellMinHeight: var(
+        --collectionBrowserCellMinHeight,
+        2rem
+      );
+      --infiniteScrollerCellMaxHeight: var(
+        --collectionBrowserCellMaxHeight,
+        2rem
+      );
+    }
+
+    infinite-scroller.list-detail {
+      --infiniteScrollerCellMinWidth: var(
+        --collectionBrowserCellMinWidth,
+        100%
+      );
+      --infiniteScrollerCellMinHeight: var(
+        --collectionBrowserCellMinHeight,
+        5rem
+      );
+    }
+
+    infinite-scroller.grid {
+      --infiniteScrollerCellMinWidth: var(
+        --collectionBrowserCellMinWidth,
+        18rem
+      );
+      --infiniteScrollerCellMaxWidth: var(--collectionBrowserCellMaxWidth, 1fr);
+      --infiniteScrollerCellMinHeight: var(
+        --collectionBrowserCellMinHeight,
+        29rem
+      );
+      --infiniteScrollerCellMaxHeight: var(
+        --collectionBrowserCellMaxHeight,
+        29rem
+      );
+    }
+  `;
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "baseNavigationUrl", void 0);
+__decorate([
+    property({ type: Object })
+], CollectionBrowser.prototype, "searchService", void 0);
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "baseQuery", void 0);
+__decorate([
+    property({ type: Boolean })
+], CollectionBrowser.prototype, "showDeleteButtons", void 0);
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "displayMode", void 0);
+__decorate([
+    property({ type: Object })
+], CollectionBrowser.prototype, "sortParam", void 0);
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "additionalQueryClause", void 0);
+__decorate([
+    property({ type: String })
+], CollectionBrowser.prototype, "dateRangeQueryClause", void 0);
+__decorate([
+    property({ type: Number })
+], CollectionBrowser.prototype, "pageSize", void 0);
+__decorate([
+    property({ type: Object })
+], CollectionBrowser.prototype, "resizeObserver", void 0);
+__decorate([
+    query('collection-facets')
+], CollectionBrowser.prototype, "collectionFacets", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "pagesToRender", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "searchResultsLoading", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "selectedFacets", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "facetsLoading", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "fullYearAggregationLoading", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "aggregations", void 0);
+__decorate([
+    state()
+], CollectionBrowser.prototype, "fullYearsHistogramAggregation", void 0);
+__decorate([
+    query('infinite-scroller')
+], CollectionBrowser.prototype, "infiniteScroller", void 0);
+CollectionBrowser = __decorate([
+    customElement('collection-browser')
+], CollectionBrowser);
+export { CollectionBrowser };
+//# sourceMappingURL=collection-browser.js.map