@internetarchive/collection-browser 0.4.11 → 0.4.13-alpha.1

package/dist/src/restoration-state-handler.js

@@ -1,231 +1,231 @@
-import { SearchType, } from '@internetarchive/search-service';
-import { getCookie, setCookie } from 'typescript-cookie';
-import { MetadataFieldToSortField, } from './models';
-export class RestorationStateHandler {
-    constructor(options) {
-        this.cookieDomain = '.archive.org';
-        this.cookieExpiration = 30;
-        this.cookiePath = '/';
-        this.context = options.context;
-    }
-    persistState(state) {
-        if (state.displayMode)
-            this.persistViewStateToCookies(state.displayMode);
-        this.persistQueryStateToUrl(state);
-    }
-    getRestorationState() {
-        const restorationState = this.loadQueryStateFromUrl();
-        const displayMode = this.loadTileViewStateFromCookies();
-        restorationState.displayMode = displayMode;
-        return restorationState;
-    }
-    persistViewStateToCookies(displayMode) {
-        const gridState = displayMode === 'grid' ? 'tiles' : 'lists';
-        setCookie(`view-${this.context}`, gridState, {
-            domain: this.cookieDomain,
-            expires: this.cookieExpiration,
-            path: this.cookiePath,
-        });
-        const detailsState = displayMode === 'list-detail' ? 'showdetails' : '';
-        setCookie(`showdetails-${this.context}`, detailsState, {
-            domain: this.cookieDomain,
-            expires: this.cookieExpiration,
-            path: this.cookiePath,
-        });
-    }
-    loadTileViewStateFromCookies() {
-        const viewState = getCookie(`view-${this.context}`);
-        const detailsState = getCookie(`showdetails-${this.context}`);
-        if (viewState === 'tiles' || viewState === undefined)
-            return 'grid';
-        if (detailsState === 'showdetails')
-            return 'list-detail';
-        return 'list-compact';
-    }
-    persistQueryStateToUrl(state) {
-        const url = new URL(window.location.href);
-        const { searchParams } = url;
-        searchParams.delete('sin');
-        searchParams.delete('sort');
-        searchParams.delete('query');
-        searchParams.delete('page');
-        searchParams.delete('and[]');
-        searchParams.delete('not[]');
-        if (state.searchType) {
-            searchParams.set('sin', state.searchType === SearchType.FULLTEXT ? 'TXT' : '');
-        }
-        if (state.sortParam) {
-            const prefix = state.sortParam.direction === 'desc' ? '-' : '';
-            searchParams.set('sort', `${prefix}${state.sortParam.field}`);
-        }
-        if (state.baseQuery) {
-            searchParams.set('query', state.baseQuery);
-        }
-        if (state.currentPage) {
-            if (state.currentPage > 1) {
-                searchParams.set('page', state.currentPage.toString());
-            }
-            else {
-                searchParams.delete('page');
-            }
-        }
-        if (state.selectedFacets) {
-            for (const [facetName, facetValues] of Object.entries(state.selectedFacets)) {
-                const facetEntries = Object.entries(facetValues);
-                // eslint-disable-next-line no-continue
-                if (facetEntries.length === 0)
-                    continue;
-                for (const [key, data] of facetEntries) {
-                    const notValue = data.state === 'hidden';
-                    const paramValue = `${facetName}:"${key}"`;
-                    if (notValue) {
-                        searchParams.append('not[]', paramValue);
-                    }
-                    else {
-                        searchParams.append('and[]', paramValue);
-                    }
-                }
-            }
-        }
-        if (state.minSelectedDate && state.maxSelectedDate) {
-            searchParams.append('and[]', `year:[${state.minSelectedDate} TO ${state.maxSelectedDate}]`);
-        }
-        if (state.titleQuery) {
-            searchParams.append('and[]', state.titleQuery);
-        }
-        if (state.creatorQuery) {
-            searchParams.append('and[]', state.creatorQuery);
-        }
-        window.history.pushState({
-            sort: state.sortParam,
-            query: state.baseQuery,
-            page: state.currentPage,
-            and: state.selectedFacets,
-            not: state.selectedFacets,
-            minDate: state.minSelectedDate,
-            maxDate: state.maxSelectedDate,
-        }, '', url);
-    }
-    loadQueryStateFromUrl() {
-        const url = new URL(window.location.href);
-        const searchInside = url.searchParams.get('sin');
-        const pageNumber = url.searchParams.get('page');
-        const searchQuery = url.searchParams.get('query');
-        const sortQuery = url.searchParams.get('sort');
-        const facetAnds = url.searchParams.getAll('and[]');
-        const facetNots = url.searchParams.getAll('not[]');
-        const restorationState = {
-            selectedFacets: {
-                subject: {},
-                lending: {},
-                creator: {},
-                mediatype: {},
-                language: {},
-                collection: {},
-                year: {},
-            },
-        };
-        if (searchInside) {
-            restorationState.searchType =
-                searchInside === 'TXT' ? SearchType.FULLTEXT : SearchType.METADATA;
-        }
-        if (pageNumber) {
-            const parsed = parseInt(pageNumber, 10);
-            restorationState.currentPage = parsed;
-        }
-        else {
-            restorationState.currentPage = 1;
-        }
-        if (searchQuery) {
-            restorationState.baseQuery = searchQuery;
-        }
-        if (sortQuery) {
-            // check for two different sort formats: `date desc` and `-date`
-            const hasSpace = sortQuery.indexOf(' ') > -1;
-            if (hasSpace) {
-                const [field, direction] = sortQuery.split(' ');
-                const metadataField = MetadataFieldToSortField[field];
-                if (metadataField) {
-                    restorationState.selectedSort = metadataField;
-                }
-                if (direction === 'desc' || direction === 'asc') {
-                    restorationState.sortDirection = direction;
-                }
-            }
-            else {
-                const sortDirection = sortQuery.startsWith('-') ? 'desc' : 'asc';
-                const sortField = sortQuery.startsWith('-')
-                    ? sortQuery.slice(1)
-                    : sortQuery;
-                const metadataField = MetadataFieldToSortField[sortField];
-                if (metadataField)
-                    restorationState.selectedSort = metadataField;
-                restorationState.sortDirection = sortDirection;
-            }
-        }
-        if (facetAnds) {
-            facetAnds.forEach(and => {
-                const [field, value] = and.split(':');
-                switch (field) {
-                    case 'year': {
-                        const [minDate, maxDate] = value.split(' TO ');
-                        // we have two potential ways of filtering by date:
-                        // the range with "date TO date" or the single date with "date"
-                        // this is checking for the range case and if we don't have those, fall
-                        // back to the single date case
-                        if (minDate && maxDate) {
-                            restorationState.minSelectedDate = minDate.substring(1, minDate.length);
-                            restorationState.maxSelectedDate = maxDate.substring(0, maxDate.length - 1);
-                        }
-                        else {
-                            this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'selected');
-                        }
-                        break;
-                    }
-                    case 'firstTitle':
-                        restorationState.selectedTitleFilter = value;
-                        break;
-                    case 'firstCreator':
-                        restorationState.selectedCreatorFilter = value;
-                        break;
-                    default:
-                        this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'selected');
-                }
-            });
-        }
-        if (facetNots) {
-            facetNots.forEach(not => {
-                const [field, value] = not.split(':');
-                this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'hidden');
-            });
-        }
-        return restorationState;
-    }
-    // remove optional opening and closing quotes from a string
-    stripQuotes(value) {
-        if (value.startsWith('"') && value.endsWith('"')) {
-            return value.substring(1, value.length - 1);
-        }
-        return value;
-    }
-    /**
-     * Sets the facet state for the given field & value to the given state,
-     * creating any previously-undefined buckets as needed.
-     */
-    setSelectedFacetState(selectedFacets, field, value, state) {
-        var _a;
-        const facet = selectedFacets[field];
-        const unQuotedValue = this.stripQuotes(value);
-        (_a = facet[unQuotedValue]) !== null && _a !== void 0 ? _a : (facet[unQuotedValue] = this.getDefaultBucket(value));
-        facet[unQuotedValue].state = state;
-    }
-    /** Returns a default bucket with the given key, count of 0, and state 'none'. */
-    getDefaultBucket(key) {
-        return {
-            key,
-            count: 0,
-            state: 'none',
-        };
-    }
-}
+import { SearchType, } from '@internetarchive/search-service';
+import { getCookie, setCookie } from 'typescript-cookie';
+import { MetadataFieldToSortField, } from './models';
+export class RestorationStateHandler {
+    constructor(options) {
+        this.cookieDomain = '.archive.org';
+        this.cookieExpiration = 30;
+        this.cookiePath = '/';
+        this.context = options.context;
+    }
+    persistState(state) {
+        if (state.displayMode)
+            this.persistViewStateToCookies(state.displayMode);
+        this.persistQueryStateToUrl(state);
+    }
+    getRestorationState() {
+        const restorationState = this.loadQueryStateFromUrl();
+        const displayMode = this.loadTileViewStateFromCookies();
+        restorationState.displayMode = displayMode;
+        return restorationState;
+    }
+    persistViewStateToCookies(displayMode) {
+        const gridState = displayMode === 'grid' ? 'tiles' : 'lists';
+        setCookie(`view-${this.context}`, gridState, {
+            domain: this.cookieDomain,
+            expires: this.cookieExpiration,
+            path: this.cookiePath,
+        });
+        const detailsState = displayMode === 'list-detail' ? 'showdetails' : '';
+        setCookie(`showdetails-${this.context}`, detailsState, {
+            domain: this.cookieDomain,
+            expires: this.cookieExpiration,
+            path: this.cookiePath,
+        });
+    }
+    loadTileViewStateFromCookies() {
+        const viewState = getCookie(`view-${this.context}`);
+        const detailsState = getCookie(`showdetails-${this.context}`);
+        if (viewState === 'tiles' || viewState === undefined)
+            return 'grid';
+        if (detailsState === 'showdetails')
+            return 'list-detail';
+        return 'list-compact';
+    }
+    persistQueryStateToUrl(state) {
+        const url = new URL(window.location.href);
+        const { searchParams } = url;
+        searchParams.delete('sin');
+        searchParams.delete('sort');
+        searchParams.delete('query');
+        searchParams.delete('page');
+        searchParams.delete('and[]');
+        searchParams.delete('not[]');
+        if (state.searchType) {
+            searchParams.set('sin', state.searchType === SearchType.FULLTEXT ? 'TXT' : '');
+        }
+        if (state.sortParam) {
+            const prefix = state.sortParam.direction === 'desc' ? '-' : '';
+            searchParams.set('sort', `${prefix}${state.sortParam.field}`);
+        }
+        if (state.baseQuery) {
+            searchParams.set('query', state.baseQuery);
+        }
+        if (state.currentPage) {
+            if (state.currentPage > 1) {
+                searchParams.set('page', state.currentPage.toString());
+            }
+            else {
+                searchParams.delete('page');
+            }
+        }
+        if (state.selectedFacets) {
+            for (const [facetName, facetValues] of Object.entries(state.selectedFacets)) {
+                const facetEntries = Object.entries(facetValues);
+                // eslint-disable-next-line no-continue
+                if (facetEntries.length === 0)
+                    continue;
+                for (const [key, data] of facetEntries) {
+                    const notValue = data.state === 'hidden';
+                    const paramValue = `${facetName}:"${key}"`;
+                    if (notValue) {
+                        searchParams.append('not[]', paramValue);
+                    }
+                    else {
+                        searchParams.append('and[]', paramValue);
+                    }
+                }
+            }
+        }
+        if (state.minSelectedDate && state.maxSelectedDate) {
+            searchParams.append('and[]', `year:[${state.minSelectedDate} TO ${state.maxSelectedDate}]`);
+        }
+        if (state.titleQuery) {
+            searchParams.append('and[]', state.titleQuery);
+        }
+        if (state.creatorQuery) {
+            searchParams.append('and[]', state.creatorQuery);
+        }
+        window.history.pushState({
+            sort: state.sortParam,
+            query: state.baseQuery,
+            page: state.currentPage,
+            and: state.selectedFacets,
+            not: state.selectedFacets,
+            minDate: state.minSelectedDate,
+            maxDate: state.maxSelectedDate,
+        }, '', url);
+    }
+    loadQueryStateFromUrl() {
+        const url = new URL(window.location.href);
+        const searchInside = url.searchParams.get('sin');
+        const pageNumber = url.searchParams.get('page');
+        const searchQuery = url.searchParams.get('query');
+        const sortQuery = url.searchParams.get('sort');
+        const facetAnds = url.searchParams.getAll('and[]');
+        const facetNots = url.searchParams.getAll('not[]');
+        const restorationState = {
+            selectedFacets: {
+                subject: {},
+                lending: {},
+                creator: {},
+                mediatype: {},
+                language: {},
+                collection: {},
+                year: {},
+            },
+        };
+        if (searchInside) {
+            restorationState.searchType =
+                searchInside === 'TXT' ? SearchType.FULLTEXT : SearchType.METADATA;
+        }
+        if (pageNumber) {
+            const parsed = parseInt(pageNumber, 10);
+            restorationState.currentPage = parsed;
+        }
+        else {
+            restorationState.currentPage = 1;
+        }
+        if (searchQuery) {
+            restorationState.baseQuery = searchQuery;
+        }
+        if (sortQuery) {
+            // check for two different sort formats: `date desc` and `-date`
+            const hasSpace = sortQuery.indexOf(' ') > -1;
+            if (hasSpace) {
+                const [field, direction] = sortQuery.split(' ');
+                const metadataField = MetadataFieldToSortField[field];
+                if (metadataField) {
+                    restorationState.selectedSort = metadataField;
+                }
+                if (direction === 'desc' || direction === 'asc') {
+                    restorationState.sortDirection = direction;
+                }
+            }
+            else {
+                const sortDirection = sortQuery.startsWith('-') ? 'desc' : 'asc';
+                const sortField = sortQuery.startsWith('-')
+                    ? sortQuery.slice(1)
+                    : sortQuery;
+                const metadataField = MetadataFieldToSortField[sortField];
+                if (metadataField)
+                    restorationState.selectedSort = metadataField;
+                restorationState.sortDirection = sortDirection;
+            }
+        }
+        if (facetAnds) {
+            facetAnds.forEach(and => {
+                const [field, value] = and.split(':');
+                switch (field) {
+                    case 'year': {
+                        const [minDate, maxDate] = value.split(' TO ');
+                        // we have two potential ways of filtering by date:
+                        // the range with "date TO date" or the single date with "date"
+                        // this is checking for the range case and if we don't have those, fall
+                        // back to the single date case
+                        if (minDate && maxDate) {
+                            restorationState.minSelectedDate = minDate.substring(1, minDate.length);
+                            restorationState.maxSelectedDate = maxDate.substring(0, maxDate.length - 1);
+                        }
+                        else {
+                            this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'selected');
+                        }
+                        break;
+                    }
+                    case 'firstTitle':
+                        restorationState.selectedTitleFilter = value;
+                        break;
+                    case 'firstCreator':
+                        restorationState.selectedCreatorFilter = value;
+                        break;
+                    default:
+                        this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'selected');
+                }
+            });
+        }
+        if (facetNots) {
+            facetNots.forEach(not => {
+                const [field, value] = not.split(':');
+                this.setSelectedFacetState(restorationState.selectedFacets, field, value, 'hidden');
+            });
+        }
+        return restorationState;
+    }
+    // remove optional opening and closing quotes from a string
+    stripQuotes(value) {
+        if (value.startsWith('"') && value.endsWith('"')) {
+            return value.substring(1, value.length - 1);
+        }
+        return value;
+    }
+    /**
+     * Sets the facet state for the given field & value to the given state,
+     * creating any previously-undefined buckets as needed.
+     */
+    setSelectedFacetState(selectedFacets, field, value, state) {
+        var _a;
+        const facet = selectedFacets[field];
+        const unQuotedValue = this.stripQuotes(value);
+        (_a = facet[unQuotedValue]) !== null && _a !== void 0 ? _a : (facet[unQuotedValue] = this.getDefaultBucket(value));
+        facet[unQuotedValue].state = state;
+    }
+    /** Returns a default bucket with the given key, count of 0, and state 'none'. */
+    getDefaultBucket(key) {
+        return {
+            key,
+            count: 0,
+            state: 'none',
+        };
+    }
+}
 //# sourceMappingURL=restoration-state-handler.js.map

package/dist/src/sort-filter-bar/alpha-bar-tooltip.d.ts

@@ -1,6 +1,6 @@
-import { LitElement, CSSResultGroup } from 'lit';
-export declare class AlphaBarTooltip extends LitElement {
-    numResults: number;
-    render(): import("lit-html").TemplateResult<1>;
-    static get styles(): CSSResultGroup;
-}
+import { LitElement, CSSResultGroup } from 'lit';
+export declare class AlphaBarTooltip extends LitElement {
+    numResults: number;
+    render(): import("lit-html").TemplateResult<1>;
+    static get styles(): CSSResultGroup;
+}

package/dist/src/sort-filter-bar/alpha-bar-tooltip.js

@@ -1,12 +1,12 @@
-import { __decorate } from "tslib";
-import { LitElement, html, css } from 'lit';
-import { customElement, property } from 'lit/decorators.js';
-let AlphaBarTooltip = class AlphaBarTooltip extends LitElement {
-    constructor() {
-        super(...arguments);
-        this.numResults = 0;
-    }
-    render() {
+import { __decorate } from "tslib";
+import { LitElement, html, css } from 'lit';
+import { customElement, property } from 'lit/decorators.js';
+let AlphaBarTooltip = class AlphaBarTooltip extends LitElement {
+    constructor() {
+        super(...arguments);
+        this.numResults = 0;
+    }
+    render() {
         return html `
       <div id="tooltip-container" role="tooltip">
         <div id="arrow"></div>
@@ -14,21 +14,20 @@ let AlphaBarTooltip = class AlphaBarTooltip extends LitElement {
           ${this.numResults} ${this.numResults === 1 ? 'result' : 'results'}
         </div>
       </div>
-    `;
-    }
-    static get styles() {
-        const arrowSize = css `var(--tooltipArrowSize, 5px)`;
-        const arrowOffset = css `var(--tooltipArrowOffset, 0px)`;
+    `;
+    }
+    static get styles() {
+        const arrowSize = css `var(--tooltipArrowSize, 5px)`;
+        const arrowOffset = css `var(--tooltipArrowOffset, 0px)`;
         return css `
       #tooltip-container {
         width: max-content;
         max-width: 200px;
-        padding-top: ${arrowSize};
         pointer-events: none;
       }
 
       #arrow {
-        position: absolute;
+        position: relative;
         left: calc(50% + ${arrowOffset});
         top: 0;
         width: 0;
@@ -48,14 +47,14 @@ let AlphaBarTooltip = class AlphaBarTooltip extends LitElement {
         text-align: center;
         text-decoration: none;
       }
-    `;
-    }
-};
-__decorate([
-    property({ type: Number })
-], AlphaBarTooltip.prototype, "numResults", void 0);
-AlphaBarTooltip = __decorate([
-    customElement('alpha-bar-tooltip')
-], AlphaBarTooltip);
-export { AlphaBarTooltip };
+    `;
+    }
+};
+__decorate([
+    property({ type: Number })
+], AlphaBarTooltip.prototype, "numResults", void 0);
+AlphaBarTooltip = __decorate([
+    customElement('alpha-bar-tooltip')
+], AlphaBarTooltip);
+export { AlphaBarTooltip };
 //# sourceMappingURL=alpha-bar-tooltip.js.map

package/dist/src/sort-filter-bar/alpha-bar-tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"alpha-bar-tooltip.js","sourceRoot":"","sources":["../../../src/sort-filter-bar/alpha-bar-tooltip.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5D,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAA/C;;QAC8B,eAAU,GAAW,CAAC,CAAC;IAgDrD,CAAC;IA9CC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;YAIH,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;;;KAGtE,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,SAAS,GAAG,GAAG,CAAA,8BAA8B,CAAC;QACpD,MAAM,WAAW,GAAG,GAAG,CAAA,gCAAgC,CAAC;QAExD,OAAO,GAAG,CAAA;;;;uBAIS,SAAS;;;;;;2BAML,WAAW;;;;gCAIN,SAAS;iCACR,SAAS;kBACxB,SAAS;;;;;;;;;;;;;KAatB,CAAC;IACJ,CAAC;CACF,CAAA;AAhD6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAwB;AADxC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAiD3B;SAjDY,eAAe","sourcesContent":["import { LitElement, html, css, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('alpha-bar-tooltip')\nexport class AlphaBarTooltip extends LitElement {\n  @property({ type: Number }) numResults: number = 0;\n\n  render() {\n    return html`\n      <div id=\"tooltip-container\" role=\"tooltip\">\n        <div id=\"arrow\"></div>\n        <div id=\"tooltip-text\">\n          ${this.numResults} ${this.numResults === 1 ? 'result' : 'results'}\n        </div>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    const arrowSize = css`var(--tooltipArrowSize, 5px)`;\n    const arrowOffset = css`var(--tooltipArrowOffset, 0px)`;\n\n    return css`\n      #tooltip-container {\n        width: max-content;\n        max-width: 200px;\n        padding-top: ${arrowSize};\n        pointer-events: none;\n      }\n\n      #arrow {\n        position: absolute;\n        left: calc(50% + ${arrowOffset});\n        top: 0;\n        width: 0;\n        height: 0;\n        margin-top: calc(-1 * ${arrowSize});\n        margin-left: calc(-1 * ${arrowSize});\n        border: ${arrowSize} solid transparent;\n        border-bottom-color: black;\n      }\n\n      #tooltip-text {\n        padding: 3px 8px;\n        border-radius: 4px;\n        background-color: #000;\n        color: white;\n        font-size: 1.2rem;\n        text-align: center;\n        text-decoration: none;\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"alpha-bar-tooltip.js","sourceRoot":"","sources":["../../../src/sort-filter-bar/alpha-bar-tooltip.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,GAAG,EAAkB,MAAM,KAAK,CAAC;AAC5D,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAG5D,IAAa,eAAe,GAA5B,MAAa,eAAgB,SAAQ,UAAU;IAA/C;;QAC8B,eAAU,GAAW,CAAC,CAAC;IA+CrD,CAAC;IA7CC,MAAM;QACJ,OAAO,IAAI,CAAA;;;;YAIH,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,UAAU,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;;;KAGtE,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,MAAM,SAAS,GAAG,GAAG,CAAA,8BAA8B,CAAC;QACpD,MAAM,WAAW,GAAG,GAAG,CAAA,gCAAgC,CAAC;QAExD,OAAO,GAAG,CAAA;;;;;;;;;2BASa,WAAW;;;;gCAIN,SAAS;iCACR,SAAS;kBACxB,SAAS;;;;;;;;;;;;;KAatB,CAAC;IACJ,CAAC;CACF,CAAA;AA/C6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAwB;AADxC,eAAe;IAD3B,aAAa,CAAC,mBAAmB,CAAC;GACtB,eAAe,CAgD3B;SAhDY,eAAe","sourcesContent":["import { LitElement, html, css, CSSResultGroup } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\n@customElement('alpha-bar-tooltip')\nexport class AlphaBarTooltip extends LitElement {\n  @property({ type: Number }) numResults: number = 0;\n\n  render() {\n    return html`\n      <div id=\"tooltip-container\" role=\"tooltip\">\n        <div id=\"arrow\"></div>\n        <div id=\"tooltip-text\">\n          ${this.numResults} ${this.numResults === 1 ? 'result' : 'results'}\n        </div>\n      </div>\n    `;\n  }\n\n  static get styles(): CSSResultGroup {\n    const arrowSize = css`var(--tooltipArrowSize, 5px)`;\n    const arrowOffset = css`var(--tooltipArrowOffset, 0px)`;\n\n    return css`\n      #tooltip-container {\n        width: max-content;\n        max-width: 200px;\n        pointer-events: none;\n      }\n\n      #arrow {\n        position: relative;\n        left: calc(50% + ${arrowOffset});\n        top: 0;\n        width: 0;\n        height: 0;\n        margin-top: calc(-1 * ${arrowSize});\n        margin-left: calc(-1 * ${arrowSize});\n        border: ${arrowSize} solid transparent;\n        border-bottom-color: black;\n      }\n\n      #tooltip-text {\n        padding: 3px 8px;\n        border-radius: 4px;\n        background-color: #000;\n        color: white;\n        font-size: 1.2rem;\n        text-align: center;\n        text-decoration: none;\n      }\n    `;\n  }\n}\n"]}

package/dist/src/sort-filter-bar/alpha-bar.d.ts

@@ -1,20 +1,20 @@
-import { LitElement, TemplateResult } from 'lit';
-import type { PrefixFilterCounts } from '../models';
-import './alpha-bar-tooltip';
-export declare class AlphaBar extends LitElement {
-    selectedLetter: string | null;
-    letterCounts?: PrefixFilterCounts;
-    private tooltipShown;
-    private hoveredLetter?;
-    private tooltip?;
-    private readonly alphabet;
-    private get selectedUppercaseLetter();
-    render(): TemplateResult<1>;
-    private letterLinkTemplate;
-    private tooltipTemplate;
-    private letterClicked;
-    private handleMouseMove;
-    private handleMouseLeave;
-    private positionTooltip;
-    static styles: import("lit").CSSResult;
-}
+import { LitElement, TemplateResult } from 'lit';
+import type { PrefixFilterCounts } from '../models';
+import './alpha-bar-tooltip';
+export declare class AlphaBar extends LitElement {
+    selectedLetter: string | null;
+    letterCounts?: PrefixFilterCounts;
+    private tooltipShown;
+    private hoveredLetter?;
+    private tooltip?;
+    private readonly alphabet;
+    private get selectedUppercaseLetter();
+    render(): TemplateResult<1>;
+    private letterLinkTemplate;
+    private tooltipTemplate;
+    private letterClicked;
+    private handleMouseMove;
+    private handleMouseLeave;
+    private positionTooltip;
+    static styles: import("lit").CSSResult;
+}