@internetarchive/collection-browser 0.4.8 → 0.4.9-alpha.1

package/dist/src/collection-facets/more-facets-pagination.d.ts

@@ -1,36 +1,36 @@
-import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
-export declare class MoreFacetsPagination extends LitElement {
-    /**
-     * Total number of pages
-     */
-    size: number;
-    /**
-     * Number of pages can be moved in back/forward
-     */
-    step: number;
-    currentPage: number;
-    pages?: number[];
-    firstUpdated(): void;
-    updated(changed: Map<string, any>): void;
-    /** creates `this.pages` array that notes which pages to draw
-     * - `0` is elipses marker
-     * - rule: selected page is centered between -2/+2 pages
-     * - outlier: first page selected, show _1_ 2 3 ... N
-     * - outlier: second page selected, show 1 _2_ 3 4 ... N
-     * - outlier: last page selected, show 1 ... N-2 N-1 _N_
-     * - outlier: if page count = 7, & selected is either [2, 3, 4, 5, 6], show all pages
-     */
-    observePageCount(): void;
-    private createFirstNode;
-    private createMiddelNode;
-    private createLastNode;
-    private get getEllipsisTemplate();
-    emitPageClick(): void;
-    private onRewind;
-    private onForward;
-    private onChange;
-    private getPageTemplate;
-    private get getPagesTemplate();
-    render(): TemplateResult<1>;
-    static get styles(): CSSResultGroup;
-}
+import { CSSResultGroup, LitElement, TemplateResult } from 'lit';
+export declare class MoreFacetsPagination extends LitElement {
+    /**
+     * Total number of pages
+     */
+    size: number;
+    /**
+     * Number of pages can be moved in back/forward
+     */
+    step: number;
+    currentPage: number;
+    pages?: number[];
+    firstUpdated(): void;
+    updated(changed: Map<string, any>): void;
+    /** creates `this.pages` array that notes which pages to draw
+     * - `0` is elipses marker
+     * - rule: selected page is centered between -2/+2 pages
+     * - outlier: first page selected, show _1_ 2 3 ... N
+     * - outlier: second page selected, show 1 _2_ 3 4 ... N
+     * - outlier: last page selected, show 1 ... N-2 N-1 _N_
+     * - outlier: if page count = 7, & selected is either [2, 3, 4, 5, 6], show all pages
+     */
+    observePageCount(): void;
+    private createFirstNode;
+    private createMiddelNode;
+    private createLastNode;
+    private get getEllipsisTemplate();
+    emitPageClick(): void;
+    private onRewind;
+    private onForward;
+    private onChange;
+    private getPageTemplate;
+    private get getPagesTemplate();
+    render(): TemplateResult<1>;
+    static get styles(): CSSResultGroup;
+}

package/dist/src/collection-facets/more-facets-pagination.js

@@ -1,161 +1,161 @@
-import { __decorate } from "tslib";
-import { css, html, LitElement, nothing, } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import arrowLeftIcon from '../assets/img/icons/arrow-left';
-import arrowRightIcon from '../assets/img/icons/arrow-right';
-let MoreFacetsPagination = class MoreFacetsPagination extends LitElement {
-    constructor() {
-        super(...arguments);
-        /**
-         * Number of pages can be moved in back/forward
-         */
-        this.step = 2;
-        this.currentPage = 1;
-        this.pages = [];
-    }
-    firstUpdated() {
-        this.observePageCount();
-    }
-    updated(changed) {
-        if (changed.has('size')) {
-            this.observePageCount();
-        }
-        if (changed.has('currentPage')) {
-            this.observePageCount();
-            this.emitPageClick();
-        }
-    }
-    /** creates `this.pages` array that notes which pages to draw
-     * - `0` is elipses marker
-     * - rule: selected page is centered between -2/+2 pages
-     * - outlier: first page selected, show _1_ 2 3 ... N
-     * - outlier: second page selected, show 1 _2_ 3 4 ... N
-     * - outlier: last page selected, show 1 ... N-2 N-1 _N_
-     * - outlier: if page count = 7, & selected is either [2, 3, 4, 5, 6], show all pages
-     */
-    observePageCount() {
-        this.pages = []; /* `0` is elipses marker */
-        const paginatorMaxPagesToShow = 7;
-        const atMinThreshold = this.size <= paginatorMaxPagesToShow;
-        /** Display outliers  */
-        if (this.size <= 5) {
-            // display all pages
-            this.pages = [...Array(this.size).keys()].map(i => i + 1);
-            return;
-        }
-        if (this.size === paginatorMaxPagesToShow) {
-            // edge: 7 pages
-            if (this.currentPage === 2) {
-                this.pages = [1, 2, 3, 4, 0, this.size];
-                return;
-            }
-            if (this.currentPage === this.size - 1) {
-                this.pages = [1, 0, 4, 5, this.size - 1, this.size];
-                return;
-            }
-        }
-        if (this.currentPage === 1) {
-            // first page
-            this.pages = [1, 2, 3, 0, this.size];
-            return;
-        }
-        if (this.currentPage === this.size) {
-            // last page
-            this.pages = [1, 0, this.size - 2, this.size - 1, this.size];
-            return;
-        }
-        if (this.currentPage === this.size - 1) {
-            // second last page
-            this.pages = [
-                1,
-                0,
-                this.size - 3,
-                this.size - 2,
-                this.size - 1,
-                this.size,
-            ];
-            return;
-        }
-        if (atMinThreshold &&
-            this.currentPage > 1 &&
-            this.currentPage < paginatorMaxPagesToShow) {
-            this.pages = [...Array(this.size).keys()].map(i => i + 1);
-            return;
-        }
-        /* The rest here calculates the range to display in "page window" */
-        let startPage = this.currentPage - this.step;
-        let endPage = this.currentPage + this.step;
-        if (startPage <= 0) {
-            endPage += -startPage + 1;
-            startPage = 1;
-        }
-        if (endPage >= this.size) {
-            startPage = Math.max(startPage - (endPage - this.size), 1);
-            endPage = this.size;
-        }
-        if (startPage === 2) {
-            endPage -= 1;
-        }
-        if (endPage === this.size - 1) {
-            startPage += 1;
-        }
-        // create first page node
-        this.createFirstNode(startPage);
-        // create middle pages node
-        this.createMiddelNode(startPage, endPage);
-        // create last page node
-        this.createLastNode(endPage);
-    }
-    createFirstNode(startPage) {
-        var _a, _b;
-        if (startPage > 1) {
-            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(1);
-        }
-        if (startPage > 2) {
-            (_b = this.pages) === null || _b === void 0 ? void 0 : _b.push(0); // let's asssume 0 is for ellipsis template
-        }
-    }
-    createMiddelNode(startPage, endPage) {
-        var _a;
-        for (let page = startPage; page <= endPage; page += 1) {
-            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(page);
-        }
-    }
-    createLastNode(endPage) {
-        var _a, _b;
-        if (endPage < this.size - 1) {
-            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(0); // let's asssume 0 is for ellipsis template
-        }
-        if (endPage < this.size) {
-            (_b = this.pages) === null || _b === void 0 ? void 0 : _b.push(this.size);
-        }
-    }
-    get getEllipsisTemplate() {
-        return html `<i class="ellipses">...</i>`;
-    }
-    emitPageClick() {
-        this.dispatchEvent(new CustomEvent('pageNumberClicked', {
-            detail: { page: this.currentPage },
-            bubbles: true,
-            composed: true,
-        }));
-    }
-    onRewind() {
-        this.currentPage -= 1;
-        if (this.currentPage < 1) {
-            this.currentPage = 1;
-        }
-    }
-    onForward() {
-        this.currentPage += 1;
-        if (this.currentPage > this.size) {
-            this.currentPage = this.size;
-        }
-    }
-    onChange(page) {
-        this.currentPage = page;
-    }
-    getPageTemplate(page) {
+import { __decorate } from "tslib";
+import { css, html, LitElement, nothing, } from 'lit';
+import { customElement, property, state } from 'lit/decorators.js';
+import arrowLeftIcon from '../assets/img/icons/arrow-left';
+import arrowRightIcon from '../assets/img/icons/arrow-right';
+let MoreFacetsPagination = class MoreFacetsPagination extends LitElement {
+    constructor() {
+        super(...arguments);
+        /**
+         * Number of pages can be moved in back/forward
+         */
+        this.step = 2;
+        this.currentPage = 1;
+        this.pages = [];
+    }
+    firstUpdated() {
+        this.observePageCount();
+    }
+    updated(changed) {
+        if (changed.has('size')) {
+            this.observePageCount();
+        }
+        if (changed.has('currentPage')) {
+            this.observePageCount();
+            this.emitPageClick();
+        }
+    }
+    /** creates `this.pages` array that notes which pages to draw
+     * - `0` is elipses marker
+     * - rule: selected page is centered between -2/+2 pages
+     * - outlier: first page selected, show _1_ 2 3 ... N
+     * - outlier: second page selected, show 1 _2_ 3 4 ... N
+     * - outlier: last page selected, show 1 ... N-2 N-1 _N_
+     * - outlier: if page count = 7, & selected is either [2, 3, 4, 5, 6], show all pages
+     */
+    observePageCount() {
+        this.pages = []; /* `0` is elipses marker */
+        const paginatorMaxPagesToShow = 7;
+        const atMinThreshold = this.size <= paginatorMaxPagesToShow;
+        /** Display outliers  */
+        if (this.size <= 5) {
+            // display all pages
+            this.pages = [...Array(this.size).keys()].map(i => i + 1);
+            return;
+        }
+        if (this.size === paginatorMaxPagesToShow) {
+            // edge: 7 pages
+            if (this.currentPage === 2) {
+                this.pages = [1, 2, 3, 4, 0, this.size];
+                return;
+            }
+            if (this.currentPage === this.size - 1) {
+                this.pages = [1, 0, 4, 5, this.size - 1, this.size];
+                return;
+            }
+        }
+        if (this.currentPage === 1) {
+            // first page
+            this.pages = [1, 2, 3, 0, this.size];
+            return;
+        }
+        if (this.currentPage === this.size) {
+            // last page
+            this.pages = [1, 0, this.size - 2, this.size - 1, this.size];
+            return;
+        }
+        if (this.currentPage === this.size - 1) {
+            // second last page
+            this.pages = [
+                1,
+                0,
+                this.size - 3,
+                this.size - 2,
+                this.size - 1,
+                this.size,
+            ];
+            return;
+        }
+        if (atMinThreshold &&
+            this.currentPage > 1 &&
+            this.currentPage < paginatorMaxPagesToShow) {
+            this.pages = [...Array(this.size).keys()].map(i => i + 1);
+            return;
+        }
+        /* The rest here calculates the range to display in "page window" */
+        let startPage = this.currentPage - this.step;
+        let endPage = this.currentPage + this.step;
+        if (startPage <= 0) {
+            endPage += -startPage + 1;
+            startPage = 1;
+        }
+        if (endPage >= this.size) {
+            startPage = Math.max(startPage - (endPage - this.size), 1);
+            endPage = this.size;
+        }
+        if (startPage === 2) {
+            endPage -= 1;
+        }
+        if (endPage === this.size - 1) {
+            startPage += 1;
+        }
+        // create first page node
+        this.createFirstNode(startPage);
+        // create middle pages node
+        this.createMiddelNode(startPage, endPage);
+        // create last page node
+        this.createLastNode(endPage);
+    }
+    createFirstNode(startPage) {
+        var _a, _b;
+        if (startPage > 1) {
+            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(1);
+        }
+        if (startPage > 2) {
+            (_b = this.pages) === null || _b === void 0 ? void 0 : _b.push(0); // let's asssume 0 is for ellipsis template
+        }
+    }
+    createMiddelNode(startPage, endPage) {
+        var _a;
+        for (let page = startPage; page <= endPage; page += 1) {
+            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(page);
+        }
+    }
+    createLastNode(endPage) {
+        var _a, _b;
+        if (endPage < this.size - 1) {
+            (_a = this.pages) === null || _a === void 0 ? void 0 : _a.push(0); // let's asssume 0 is for ellipsis template
+        }
+        if (endPage < this.size) {
+            (_b = this.pages) === null || _b === void 0 ? void 0 : _b.push(this.size);
+        }
+    }
+    get getEllipsisTemplate() {
+        return html `<i class="ellipses">...</i>`;
+    }
+    emitPageClick() {
+        this.dispatchEvent(new CustomEvent('pageNumberClicked', {
+            detail: { page: this.currentPage },
+            bubbles: true,
+            composed: true,
+        }));
+    }
+    onRewind() {
+        this.currentPage -= 1;
+        if (this.currentPage < 1) {
+            this.currentPage = 1;
+        }
+    }
+    onForward() {
+        this.currentPage += 1;
+        if (this.currentPage > this.size) {
+            this.currentPage = this.size;
+        }
+    }
+    onChange(page) {
+        this.currentPage = page;
+    }
+    getPageTemplate(page) {
         return html `
       <button
         @click=${() => this.onChange(page)}
@@ -164,20 +164,20 @@ let MoreFacetsPagination = class MoreFacetsPagination extends LitElement {
       >
         ${page}
       </button>
-    `;
-    }
-    get getPagesTemplate() {
-        var _a;
-        if (!this.pages || !this.pages.length) {
-            return nothing;
-        }
+    `;
+    }
+    get getPagesTemplate() {
+        var _a;
+        if (!this.pages || !this.pages.length) {
+            return nothing;
+        }
         return html `
-      ${(_a = this.pages) === null || _a === void 0 ? void 0 : _a.map(page => html `${page !== 0
-            ? this.getPageTemplate(page)
+      ${(_a = this.pages) === null || _a === void 0 ? void 0 : _a.map(page => html `${page !== 0
+            ? this.getPageTemplate(page)
             : this.getEllipsisTemplate}`)}
-    `;
-    }
-    render() {
+    `;
+    }
+    render() {
         return html `
       <div class="facets-pagination">
         <button class="arrow-icon rewind" @click=${this.onRewind}>
@@ -190,9 +190,9 @@ let MoreFacetsPagination = class MoreFacetsPagination extends LitElement {
           ${arrowRightIcon}
         </button>
       </div>
-    `;
-    }
-    static get styles() {
+    `;
+    }
+    static get styles() {
         return css `
       .facets-pagination {
         user-select: none;
@@ -245,23 +245,23 @@ let MoreFacetsPagination = class MoreFacetsPagination extends LitElement {
         clip: rect(0, 0, 0, 0);
         border: 0;
       }
-    `;
-    }
-};
-__decorate([
-    property({ type: Number })
-], MoreFacetsPagination.prototype, "size", void 0);
-__decorate([
-    property({ type: Number })
-], MoreFacetsPagination.prototype, "step", void 0);
-__decorate([
-    property({ type: Number })
-], MoreFacetsPagination.prototype, "currentPage", void 0);
-__decorate([
-    state()
-], MoreFacetsPagination.prototype, "pages", void 0);
-MoreFacetsPagination = __decorate([
-    customElement('more-facets-pagination')
-], MoreFacetsPagination);
-export { MoreFacetsPagination };
+    `;
+    }
+};
+__decorate([
+    property({ type: Number })
+], MoreFacetsPagination.prototype, "size", void 0);
+__decorate([
+    property({ type: Number })
+], MoreFacetsPagination.prototype, "step", void 0);
+__decorate([
+    property({ type: Number })
+], MoreFacetsPagination.prototype, "currentPage", void 0);
+__decorate([
+    state()
+], MoreFacetsPagination.prototype, "pages", void 0);
+MoreFacetsPagination = __decorate([
+    customElement('more-facets-pagination')
+], MoreFacetsPagination);
+export { MoreFacetsPagination };
 //# sourceMappingURL=more-facets-pagination.js.map

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

@@ -1,77 +1,83 @@
-import { LitElement, PropertyValues, TemplateResult } from 'lit';
-import type { Aggregation, FilterMap, SearchServiceInterface, SearchType } from '@internetarchive/search-service';
-import '@internetarchive/histogram-date-range';
-import '@internetarchive/feature-feedback';
-import '@internetarchive/collection-name-cache';
-import type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';
-import { ModalManagerInterface } from '@internetarchive/modal-manager';
-import type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';
-import { FacetOption, SelectedFacets, FacetGroup } from './models';
-import type { LanguageCodeHandlerInterface } from './language-code-handler/language-code-handler';
-import './collection-facets/more-facets-content';
-import './collection-facets/facets-template';
-import './collection-facets/facet-tombstone-row';
-export declare class CollectionFacets extends LitElement {
-    searchService?: SearchServiceInterface;
-    searchType?: SearchType;
-    aggregations?: Record<string, Aggregation>;
-    fullYearsHistogramAggregation?: Aggregation;
-    minSelectedDate?: string;
-    maxSelectedDate?: string;
-    moreLinksVisible: boolean;
-    facetsLoading: boolean;
-    fullYearAggregationLoading: boolean;
-    selectedFacets?: SelectedFacets;
-    collapsableFacets: boolean;
-    showHistogramDatePicker: boolean;
-    query?: string;
-    filterMap?: FilterMap;
-    modalManager?: ModalManagerInterface;
-    analyticsHandler?: AnalyticsManagerInterface;
-    languageCodeHandler?: LanguageCodeHandlerInterface;
-    collectionNameCache?: CollectionNameCacheInterface;
-    /** Fires when a facet is clicked */
-    onFacetClick?: (name: FacetOption, facetChecked: boolean, negative: boolean) => void;
-    openFacets: Record<FacetOption, boolean>;
-    /**
-     * render number of facet items
-     */
-    private allowedFacetCount;
-    render(): TemplateResult<1>;
-    updated(changed: PropertyValues): void;
-    private dispatchFacetsChangedEvent;
-    private get currentYearsHistogramAggregation();
-    private get histogramTemplate();
-    private histogramDateRangeUpdated;
-    /**
-     * Combines the selected facets with the aggregations to create a single list of facets
-     */
-    private get mergedFacets();
-    /**
-     * Converts the selected facets to a `FacetGroup` array,
-     * which is easier to work with
-     */
-    private get selectedFacetGroups();
-    /**
-     * Converts the raw `aggregations` to `FacetGroups`, which are easier to use
-     */
-    private get aggregationFacetGroups();
-    /**
-     * Generate the template for a facet group with a header and the collapsible
-     * chevron for the mobile view
-     */
-    private getFacetGroupTemplate;
-    private getTombstoneFacetGroupTemplate;
-    /**
-     * Generate the More... link button just below the facets group
-     *
-     * TODO: want to fire analytics?
-     */
-    private searchMoreFacetsLink;
-    showMoreFacetsModal(facetGroup: FacetGroup, sortedBy: string): Promise<void>;
-    /**
-     * Generate the list template for each bucket in a facet group
-     */
-    private getFacetTemplate;
-    static get styles(): import("lit").CSSResult;
-}
+import { LitElement, PropertyValues, TemplateResult } from 'lit';
+import type { Aggregation, FilterMap, SearchServiceInterface, SearchType } from '@internetarchive/search-service';
+import '@internetarchive/histogram-date-range';
+import '@internetarchive/feature-feedback';
+import '@internetarchive/collection-name-cache';
+import type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';
+import { ModalManagerInterface } from '@internetarchive/modal-manager';
+import type { FeatureFeedbackServiceInterface } from '@internetarchive/feature-feedback';
+import type { RecaptchaManagerInterface } from '@internetarchive/recaptcha-manager';
+import type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';
+import type { SharedResizeObserverInterface } from '@internetarchive/shared-resize-observer';
+import { FacetOption, SelectedFacets, FacetGroup } from './models';
+import type { LanguageCodeHandlerInterface } from './language-code-handler/language-code-handler';
+import './collection-facets/more-facets-content';
+import './collection-facets/facets-template';
+import './collection-facets/facet-tombstone-row';
+export declare class CollectionFacets extends LitElement {
+    searchService?: SearchServiceInterface;
+    searchType?: SearchType;
+    aggregations?: Record<string, Aggregation>;
+    fullYearsHistogramAggregation?: Aggregation;
+    minSelectedDate?: string;
+    maxSelectedDate?: string;
+    moreLinksVisible: boolean;
+    facetsLoading: boolean;
+    fullYearAggregationLoading: boolean;
+    selectedFacets?: SelectedFacets;
+    collapsableFacets: boolean;
+    showHistogramDatePicker: boolean;
+    query?: string;
+    filterMap?: FilterMap;
+    modalManager?: ModalManagerInterface;
+    resizeObserver?: SharedResizeObserverInterface;
+    featureFeedbackService?: FeatureFeedbackServiceInterface;
+    recaptchaManager?: RecaptchaManagerInterface;
+    analyticsHandler?: AnalyticsManagerInterface;
+    languageCodeHandler?: LanguageCodeHandlerInterface;
+    collectionNameCache?: CollectionNameCacheInterface;
+    /** Fires when a facet is clicked */
+    onFacetClick?: (name: FacetOption, facetChecked: boolean, negative: boolean) => void;
+    openFacets: Record<FacetOption, boolean>;
+    /**
+     * render number of facet items
+     */
+    private allowedFacetCount;
+    render(): TemplateResult<1>;
+    updated(changed: PropertyValues): void;
+    private dispatchFacetsChangedEvent;
+    private get currentYearsHistogramAggregation();
+    private get histogramTemplate();
+    private histogramDateRangeUpdated;
+    /**
+     * Combines the selected facets with the aggregations to create a single list of facets
+     */
+    private get mergedFacets();
+    /**
+     * Converts the selected facets to a `FacetGroup` array,
+     * which is easier to work with
+     */
+    private get selectedFacetGroups();
+    /**
+     * Converts the raw `aggregations` to `FacetGroups`, which are easier to use
+     */
+    private get aggregationFacetGroups();
+    /**
+     * Generate the template for a facet group with a header and the collapsible
+     * chevron for the mobile view
+     */
+    private getFacetGroupTemplate;
+    private getTombstoneFacetGroupTemplate;
+    /**
+     * Generate the More... link button just below the facets group
+     *
+     * TODO: want to fire analytics?
+     */
+    private searchMoreFacetsLink;
+    showMoreFacetsModal(facetGroup: FacetGroup, sortedBy: string): Promise<void>;
+    /**
+     * Generate the list template for each bucket in a facet group
+     */
+    private getFacetTemplate;
+    static get styles(): import("lit").CSSResult;
+}