@internetarchive/collection-browser 1.3.1-alpha.4 → 1.4.0

package/dist/src/collection-facets.js

@@ -40,6 +40,10 @@ let CollectionFacets = class CollectionFacets extends LitElement {
          * Maximum # of facet buckets to render per facet group
          */
         this.allowedFacetCount = 6;
+        this.handleExpandedDatePickerClosed = () => {
+            var _a;
+            (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.remove('expanded-date-picker');
+        };
         /**
          * Dispatches a `histogramDateRangeUpdated` event with the date range copied from the
          * input event.
@@ -78,7 +82,7 @@ let CollectionFacets = class CollectionFacets extends LitElement {
      * Opens a modal dialog containing an enlarged version of the date picker.
      */
     showDatePickerModal() {
-        var _a, _b;
+        var _a, _b, _c;
         const { fullYearsHistogramAggregation } = this;
         const minDate = fullYearsHistogramAggregation === null || fullYearsHistogramAggregation === void 0 ? void 0 : fullYearsHistogramAggregation.first_bucket_key;
         const maxDate = fullYearsHistogramAggregation === null || fullYearsHistogramAggregation === void 0 ? void 0 : fullYearsHistogramAggregation.last_bucket_key;
@@ -107,7 +111,9 @@ let CollectionFacets = class CollectionFacets extends LitElement {
         .maxSelectedDate=${this.maxSelectedDate}
         .buckets=${buckets}
         .modalManager=${this.modalManager}
+        .analyticsHandler=${this.analyticsHandler}
         @histogramDateRangeApplied=${this.histogramDateRangeUpdated}
+        @modalClosed=${this.handleExpandedDatePickerClosed}
       ></expanded-date-picker>
     `;
         const config = new ModalConfig({
@@ -121,10 +127,12 @@ let CollectionFacets = class CollectionFacets extends LitElement {
         (_b = this.modalManager) === null || _b === void 0 ? void 0 : _b.showModal({
             config,
             customModalContent,
-            userClosedModalCallback: () => {
-                var _a;
-                (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.classList.remove('expanded-date-picker');
-            },
+            userClosedModalCallback: this.handleExpandedDatePickerClosed,
+        });
+        (_c = this.analyticsHandler) === null || _c === void 0 ? void 0 : _c.sendEvent({
+            category: analyticsCategories.default,
+            action: analyticsActions.histogramExpanded,
+            label: window.location.href,
         });
     }
     updated(changed) {
@@ -210,10 +218,6 @@ let CollectionFacets = class CollectionFacets extends LitElement {
                     return;
                 bucketsWithCount.push(bucket);
             });
-            // For lending facets, only include a specific subset of buckets
-            if (facetKey === 'lending') {
-                bucketsWithCount = bucketsWithCount.filter(bucket => lendingFacetKeysVisibility[bucket.key]);
-            }
             /**
              * render limited facet items on page facet area
              *
@@ -224,6 +228,21 @@ let CollectionFacets = class CollectionFacets extends LitElement {
             if (allowedFacetCount < this.allowedFacetCount) {
                 allowedFacetCount = this.allowedFacetCount; // splice start index from 0th
             }
+            // For lending facets, only include a specific subset of buckets
+            if (facetKey === 'lending') {
+                bucketsWithCount = bucketsWithCount.filter(bucket => lendingFacetKeysVisibility[bucket.key]);
+            }
+            // For mediatype facets, ensure the collection bucket is always shown if present
+            if (facetKey === 'mediatype') {
+                const collectionIndex = bucketsWithCount.findIndex(bucket => bucket.key === 'collection');
+                if (collectionIndex >= allowedFacetCount) {
+                    const [collectionBucket] = bucketsWithCount.splice(collectionIndex, 1);
+                    bucketsWithCount.splice(allowedFacetCount - 1, 0, collectionBucket);
+                    // If we're showing lots of selected facets, ensure we're not cutting off the last one
+                    if (allowedFacetCount > this.allowedFacetCount)
+                        allowedFacetCount += 1;
+                }
+            }
             // splice how many items we want to show in page facet area
             facetGroup.buckets = bucketsWithCount.splice(0, allowedFacetCount);
             facetGroups.push(facetGroup);

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

@@ -1 +1 @@
-{"version":3,"file":"collection-facets.js","sourceRoot":"","sources":["../../src/collection-facets.ts"],"names":[],"mappings":"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","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport {\n  css,\n  html,\n  LitElement,\n  PropertyValues,\n  nothing,\n  TemplateResult,\n} from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { ref } from 'lit/directives/ref.js';\nimport type {\n  Aggregation,\n  AggregationSortType,\n  Bucket,\n  FilterMap,\n  SearchServiceInterface,\n  SearchType,\n} from '@internetarchive/search-service';\nimport '@internetarchive/histogram-date-range';\nimport '@internetarchive/feature-feedback';\nimport '@internetarchive/collection-name-cache';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport {\n  ModalConfig,\n  ModalManagerInterface,\n} from '@internetarchive/modal-manager';\nimport type { FeatureFeedbackServiceInterface } from '@internetarchive/feature-feedback';\nimport type { RecaptchaManagerInterface } from '@internetarchive/recaptcha-manager';\nimport type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';\nimport type { SharedResizeObserverInterface } from '@internetarchive/shared-resize-observer';\nimport chevronIcon from './assets/img/icons/chevron';\nimport expandIcon from './assets/img/icons/expand';\nimport {\n  FacetOption,\n  SelectedFacets,\n  FacetGroup,\n  FacetBucket,\n  facetDisplayOrder,\n  facetTitles,\n  lendingFacetDisplayNames,\n  lendingFacetKeysVisibility,\n  LendingFacetKey,\n  suppressedCollections,\n  defaultFacetSort,\n} from './models';\nimport './collection-facets/more-facets-content';\nimport './collection-facets/facets-template';\nimport './collection-facets/facet-tombstone-row';\nimport './expanded-date-picker';\nimport {\n  analyticsActions,\n  analyticsCategories,\n} from './utils/analytics-events';\nimport { srOnlyStyle } from './styles/sr-only';\nimport { ExpandedDatePicker } from './expanded-date-picker';\n\n@customElement('collection-facets')\nexport class CollectionFacets extends LitElement {\n  @property({ type: Object }) searchService?: SearchServiceInterface;\n\n  @property({ type: String }) searchType?: SearchType;\n\n  @property({ type: Object }) aggregations?: Record<string, Aggregation>;\n\n  @property({ type: Object }) fullYearsHistogramAggregation?: Aggregation;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Boolean }) moreLinksVisible = true;\n\n  @property({ type: Boolean }) facetsLoading = false;\n\n  @property({ type: Boolean }) fullYearAggregationLoading = false;\n\n  @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n  @property({ type: Boolean }) collapsableFacets = false;\n\n  @property({ type: Number }) contentWidth?: number;\n\n  @property({ type: Boolean }) showHistogramDatePicker = false;\n\n  @property({ type: Boolean }) allowExpandingDatePicker = false;\n\n  @property({ type: String }) query?: string;\n\n  @property({ type: Object }) filterMap?: FilterMap;\n\n  @property({ type: Object, attribute: false })\n  modalManager?: ModalManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  resizeObserver?: SharedResizeObserverInterface;\n\n  @property({ type: Object, attribute: false })\n  featureFeedbackService?: FeatureFeedbackServiceInterface;\n\n  @property({ type: Object, attribute: false })\n  recaptchaManager?: RecaptchaManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  analyticsHandler?: AnalyticsManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  collectionNameCache?: CollectionNameCacheInterface;\n\n  @state() openFacets: Record<FacetOption, boolean> = {\n    subject: false,\n    lending: false,\n    mediatype: false,\n    language: false,\n    creator: false,\n    collection: false,\n    year: false,\n  };\n\n  /**\n   * Maximum # of facet buckets to render per facet group\n   */\n  private allowedFacetCount = 6;\n\n  render() {\n    const datePickerLabelId = 'date-picker-label';\n    return html`\n      <div id=\"container\" class=\"${this.facetsLoading ? 'loading' : ''}\">\n        ${this.showHistogramDatePicker &&\n        (this.fullYearsHistogramAggregation || this.fullYearAggregationLoading)\n          ? html`\n              <section class=\"facet-group\" aria-labelledby=${datePickerLabelId}>\n                <h3 id=${datePickerLabelId}>\n                  Year Published <span class=\"sr-only\">range filter</span>\n                  ${this.expandDatePickerBtnTemplate}\n                </h3>\n                ${this.histogramTemplate}\n              </section>\n            `\n          : nothing}\n        ${this.mergedFacets.map(facetGroup =>\n          this.getFacetGroupTemplate(facetGroup)\n        )}\n      </div>\n    `;\n  }\n\n  /**\n   * Opens a modal dialog containing an enlarged version of the date picker.\n   */\n  private showDatePickerModal(): void {\n    const { fullYearsHistogramAggregation } = this;\n    const minDate = fullYearsHistogramAggregation?.first_bucket_key;\n    const maxDate = fullYearsHistogramAggregation?.last_bucket_key;\n    const buckets = fullYearsHistogramAggregation?.buckets as number[];\n\n    // Because the modal manager does not clear its DOM content after being closed,\n    // it may try to render the exact same date picker template when it is reopened.\n    // And because it isn't actually a descendent of this collection-facets component,\n    // changes to the template defined here may not trigger a reactive update to the date\n    // picker, resulting in it displaying a stale date range.\n    // This ref callback ensures that every time the date picker modal is opened, it will\n    // always propagate the most recent date range into the date picker regardless of\n    // whether Lit thinks the update is necessary.\n    const expandedDatePickerChanged = (elmt?: Element) => {\n      if (elmt && elmt instanceof ExpandedDatePicker) {\n        const expandedDatePicker = elmt as ExpandedDatePicker;\n        expandedDatePicker.minSelectedDate = this.minSelectedDate;\n        expandedDatePicker.maxSelectedDate = this.maxSelectedDate;\n      }\n    };\n\n    const customModalContent = html`\n      <expanded-date-picker\n        ${ref(expandedDatePickerChanged)}\n        .minDate=${minDate}\n        .maxDate=${maxDate}\n        .minSelectedDate=${this.minSelectedDate}\n        .maxSelectedDate=${this.maxSelectedDate}\n        .buckets=${buckets}\n        .modalManager=${this.modalManager}\n        @histogramDateRangeApplied=${this.histogramDateRangeUpdated}\n      ></expanded-date-picker>\n    `;\n\n    const config = new ModalConfig({\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true, // TODO: want to fire analytics\n      title: html`Select a date range`,\n    });\n    this.modalManager?.classList.add('expanded-date-picker');\n    this.modalManager?.showModal({\n      config,\n      customModalContent,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('expanded-date-picker');\n      },\n    });\n  }\n\n  updated(changed: PropertyValues) {\n    if (changed.has('selectedFacets')) {\n      this.dispatchFacetsChangedEvent();\n    }\n  }\n\n  // TODO: want to fire analytics?\n  private dispatchFacetsChangedEvent() {\n    const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n      detail: this.selectedFacets,\n    });\n    this.dispatchEvent(event);\n  }\n\n  /**\n   * Template for the \"Expand\" button to show the date picker modal, or\n   * `nothing` if that button should currently not be shown.\n   */\n  private get expandDatePickerBtnTemplate(): TemplateResult | typeof nothing {\n    return this.allowExpandingDatePicker && !this.facetsLoading\n      ? html`<button\n          class=\"expand-date-picker-btn\"\n          aria-hidden=\"true\"\n          @click=${this.showDatePickerModal}\n        >\n          ${expandIcon}\n        </button>`\n      : nothing;\n  }\n\n  private get histogramTemplate() {\n    const { fullYearsHistogramAggregation } = this;\n    return this.fullYearAggregationLoading\n      ? html`<div class=\"histogram-loading-indicator\">&hellip;</div>` // Ellipsis block\n      : html`\n          <histogram-date-range\n            .minDate=${fullYearsHistogramAggregation?.first_bucket_key}\n            .maxDate=${fullYearsHistogramAggregation?.last_bucket_key}\n            .minSelectedDate=${this.minSelectedDate}\n            .maxSelectedDate=${this.maxSelectedDate}\n            .updateDelay=${100}\n            missingDataMessage=\"...\"\n            .width=${this.collapsableFacets && this.contentWidth\n              ? this.contentWidth\n              : 180}\n            .bins=${fullYearsHistogramAggregation?.buckets as number[]}\n            @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n          ></histogram-date-range>\n        `;\n  }\n\n  /**\n   * Dispatches a `histogramDateRangeUpdated` event with the date range copied from the\n   * input event.\n   *\n   * Arrow function to ensure `this` is always bound to the current component.\n   */\n  private histogramDateRangeUpdated = (\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ): void => {\n    const { minDate, maxDate } = e.detail;\n    const event = new CustomEvent('histogramDateRangeUpdated', {\n      detail: { minDate, maxDate },\n    });\n    this.dispatchEvent(event);\n  };\n\n  /**\n   * Combines the selected facets with the aggregations to create a single list of facets\n   */\n  private get mergedFacets(): FacetGroup[] {\n    const facetGroups: FacetGroup[] = [];\n\n    facetDisplayOrder.forEach(facetKey => {\n      const selectedFacetGroup = this.selectedFacetGroups.find(\n        group => group.key === facetKey\n      );\n      const aggregateFacetGroup = this.aggregationFacetGroups.find(\n        group => group.key === facetKey\n      );\n\n      // if the user selected a facet, but it's not in the aggregation, we add it as-is\n      if (selectedFacetGroup && !aggregateFacetGroup) {\n        facetGroups.push(selectedFacetGroup);\n        return;\n      }\n\n      // if we don't have an aggregate facet group, don't add this to the list\n      if (!aggregateFacetGroup) return;\n\n      // start with either the selected group if we have one, or the aggregate group\n      const facetGroup = selectedFacetGroup ?? aggregateFacetGroup;\n\n      // attach the counts to the selected buckets\n      let bucketsWithCount =\n        selectedFacetGroup?.buckets.map(bucket => {\n          const selectedBucket = aggregateFacetGroup.buckets.find(\n            b => b.key === bucket.key\n          );\n          return selectedBucket\n            ? {\n                ...bucket,\n                count: selectedBucket.count,\n              }\n            : bucket;\n        }) ?? [];\n\n      // append any additional buckets that were not selected\n      aggregateFacetGroup.buckets.forEach(bucket => {\n        const existingBucket = bucketsWithCount.find(b => b.key === bucket.key);\n        if (existingBucket) return;\n        bucketsWithCount.push(bucket);\n      });\n\n      // For lending facets, only include a specific subset of buckets\n      if (facetKey === 'lending') {\n        bucketsWithCount = bucketsWithCount.filter(\n          bucket => lendingFacetKeysVisibility[bucket.key as LendingFacetKey]\n        );\n      }\n\n      /**\n       * render limited facet items on page facet area\n       *\n       * - by-default we are showing 6 items\n       * - additionally want to show all items (selected/suppressed) in page facet area\n       */\n      let allowedFacetCount = Object.keys(\n        (selectedFacetGroup?.buckets as []) || []\n      )?.length;\n      if (allowedFacetCount < this.allowedFacetCount) {\n        allowedFacetCount = this.allowedFacetCount; // splice start index from 0th\n      }\n\n      // splice how many items we want to show in page facet area\n      facetGroup.buckets = bucketsWithCount.splice(0, allowedFacetCount);\n\n      facetGroups.push(facetGroup);\n    });\n\n    return facetGroups;\n  }\n\n  /**\n   * Converts the selected facets to a `FacetGroup` array,\n   * which is easier to work with\n   */\n  private get selectedFacetGroups(): FacetGroup[] {\n    if (!this.selectedFacets) return [];\n\n    const facetGroups: FacetGroup[] = Object.entries(this.selectedFacets).map(\n      ([key, selectedFacets]) => {\n        const option = key as FacetOption;\n        const title = facetTitles[option];\n\n        const buckets: FacetBucket[] = Object.entries(selectedFacets).map(\n          ([value, facetData]) => {\n            let displayText: string = value;\n            // for lending facets, convert the key to a readable format\n            if (option === 'lending') {\n              displayText =\n                lendingFacetDisplayNames[value as LendingFacetKey] ?? value;\n            }\n            return {\n              displayText,\n              key: value,\n              count: facetData.count,\n              state: facetData.state,\n            };\n          }\n        );\n\n        return {\n          title,\n          key: option,\n          buckets,\n        };\n      }\n    );\n\n    return facetGroups;\n  }\n\n  /**\n   * Converts the raw `aggregations` to `FacetGroups`, which are easier to use\n   */\n  private get aggregationFacetGroups(): FacetGroup[] {\n    const facetGroups: FacetGroup[] = [];\n    Object.entries(this.aggregations ?? []).forEach(([key, aggregation]) => {\n      // the year_histogram data is in a different format so can't be handled here\n      if (key === 'year_histogram') return;\n\n      const option = key as FacetOption;\n      const title = facetTitles[option];\n      if (!title) return;\n\n      let castedBuckets = aggregation.getSortedBuckets(\n        defaultFacetSort[option]\n      ) as Bucket[];\n\n      if (option === 'collection') {\n        // we are not showing fav- collections or certain deemphasized collections in facets\n        castedBuckets = castedBuckets?.filter(bucket => {\n          const bucketKey = bucket?.key?.toString();\n          return (\n            !suppressedCollections[bucketKey] && !bucketKey?.startsWith('fav-')\n          );\n        });\n      }\n\n      const facetBuckets: FacetBucket[] = castedBuckets.map(bucket => {\n        const bucketKey = bucket.key;\n        let displayText = `${bucket.key}`;\n        // for lending facets, convert the bucket key to a readable format\n        if (option === 'lending') {\n          displayText =\n            lendingFacetDisplayNames[bucket.key as LendingFacetKey] ??\n            `${bucket.key}`;\n        }\n        return {\n          displayText,\n          key: `${bucketKey}`,\n          count: bucket.doc_count,\n          state: 'none',\n        };\n      });\n      const group: FacetGroup = {\n        title,\n        key: option,\n        buckets: facetBuckets,\n      };\n      facetGroups.push(group);\n    });\n    return facetGroups;\n  }\n\n  /**\n   * Generate the template for a facet group with a header and the collapsible\n   * chevron for the mobile view\n   */\n  private getFacetGroupTemplate(\n    facetGroup: FacetGroup\n  ): TemplateResult | typeof nothing {\n    if (!this.facetsLoading && facetGroup.buckets.length === 0) return nothing;\n\n    const { key } = facetGroup;\n    const isOpen = this.openFacets[key];\n    const collapser = html`\n      <span class=\"collapser ${isOpen ? 'open' : ''}\"> ${chevronIcon} </span>\n    `;\n\n    const toggleCollapsed = () => {\n      const newOpenFacets = { ...this.openFacets };\n      newOpenFacets[key] = !isOpen;\n      this.openFacets = newOpenFacets;\n    };\n\n    const headerId = `facet-group-header-label-${facetGroup.key}`;\n    return html`\n      <section\n        class=\"facet-group ${this.collapsableFacets ? 'mobile' : ''}\"\n        aria-labelledby=${headerId}\n      >\n        <div class=\"facet-group-header\">\n          <h3\n            id=${headerId}\n            @click=${toggleCollapsed}\n            @keyup=${toggleCollapsed}\n          >\n            ${this.collapsableFacets ? collapser : nothing} ${facetGroup.title}\n            <span class=\"sr-only\">filters</span>\n          </h3>\n        </div>\n        <div class=\"facet-group-content ${isOpen ? 'open' : ''}\">\n          ${this.facetsLoading\n            ? this.getTombstoneFacetGroupTemplate()\n            : html`\n                ${this.getFacetTemplate(facetGroup)}\n                ${this.searchMoreFacetsLink(facetGroup)}\n              `}\n        </div>\n      </section>\n    `;\n  }\n\n  private getTombstoneFacetGroupTemplate(): TemplateResult {\n    // Render five tombstone rows\n    return html`\n      ${map(\n        Array(5).fill(null),\n        () => html`<facet-tombstone-row></facet-tombstone-row>`\n      )}\n    `;\n  }\n\n  /**\n   * Generate the More... link button just below the facets group\n   *\n   * TODO: want to fire analytics?\n   */\n  private searchMoreFacetsLink(\n    facetGroup: FacetGroup\n  ): TemplateResult | typeof nothing {\n    // Don't render More... links for FTS searches\n    if (!this.moreLinksVisible) {\n      return nothing;\n    }\n\n    // Don't render More... links for lending facets\n    if (facetGroup.key === 'lending') {\n      return nothing;\n    }\n\n    // Don't render More... link if the number of facets < this.allowedFacetCount\n    if (Object.keys(facetGroup.buckets).length < this.allowedFacetCount) {\n      return nothing;\n    }\n\n    // We sort years in numeric order by default, rather than bucket count\n    const facetSort = defaultFacetSort[facetGroup.key];\n\n    return html`<button\n      class=\"more-link\"\n      @click=${() => {\n        this.showMoreFacetsModal(facetGroup, facetSort);\n        this.analyticsHandler?.sendEvent({\n          category: analyticsCategories.default,\n          action: analyticsActions.showMoreFacetsModal,\n          label: facetGroup.key,\n        });\n        this.dispatchEvent(\n          new CustomEvent('showMoreFacets', { detail: facetGroup.key })\n        );\n      }}\n    >\n      More...\n    </button>`;\n  }\n\n  async showMoreFacetsModal(\n    facetGroup: FacetGroup,\n    sortedBy: AggregationSortType\n  ): Promise<void> {\n    const facetAggrKey = facetGroup.key;\n\n    const customModalContent = html`\n      <more-facets-content\n        .analyticsHandler=${this.analyticsHandler}\n        .facetKey=${facetGroup.key}\n        .facetAggregationKey=${facetAggrKey}\n        .query=${this.query}\n        .filterMap=${this.filterMap}\n        .modalManager=${this.modalManager}\n        .searchService=${this.searchService}\n        .searchType=${this.searchType}\n        .collectionNameCache=${this.collectionNameCache}\n        .selectedFacets=${this.selectedFacets}\n        .sortedBy=${sortedBy}\n        @facetsChanged=${(e: CustomEvent) => {\n          const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n            detail: e.detail,\n            bubbles: true,\n            composed: true,\n          });\n          this.dispatchEvent(event);\n        }}\n      >\n      </more-facets-content>\n    `;\n\n    const config = new ModalConfig({\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true, // TODO: want to fire analytics\n      title: html`Select filters`,\n    });\n    this.modalManager?.classList.add('more-search-facets');\n    this.modalManager?.showModal({\n      config,\n      customModalContent,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('more-search-facets');\n      },\n    });\n  }\n\n  /**\n   * Generate the list template for each bucket in a facet group\n   */\n  private getFacetTemplate(facetGroup: FacetGroup): TemplateResult {\n    return html`\n      <facets-template\n        .facetGroup=${facetGroup}\n        .selectedFacets=${this.selectedFacets}\n        .renderOn=${'page'}\n        .collectionNameCache=${this.collectionNameCache}\n        @selectedFacetsChanged=${(e: CustomEvent) => {\n          const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n            detail: e.detail,\n            bubbles: true,\n            composed: true,\n          });\n          this.dispatchEvent(event);\n        }}\n      ></facets-template>\n    `;\n  }\n\n  static get styles() {\n    return [\n      srOnlyStyle,\n      css`\n        #container.loading {\n          opacity: 0.5;\n        }\n\n        .histogram-loading-indicator {\n          width: 100%;\n          height: 2.25rem;\n          margin-top: 1.75rem;\n          font-size: 1.4rem;\n          text-align: center;\n        }\n\n        .collapser {\n          display: inline-block;\n          cursor: pointer;\n          width: 10px;\n          height: 10px;\n        }\n\n        .collapser svg {\n          transition: transform 0.2s ease-in-out;\n        }\n\n        .collapser.open svg {\n          transform: rotate(90deg);\n        }\n\n        .facet-group:not(:last-child) {\n          margin-bottom: 2rem;\n        }\n\n        .facet-group h3 {\n          margin-bottom: 0.7rem;\n        }\n\n        .facet-group.mobile h3 {\n          cursor: pointer;\n        }\n\n        .facet-group-header {\n          display: flex;\n          margin-bottom: 0.7rem;\n          justify-content: space-between;\n          border-bottom: 1px solid rgb(232, 232, 232);\n        }\n\n        .facet-group-content {\n          transition: max-height 0.2s ease-in-out;\n        }\n\n        .facet-group.mobile .facet-group-content {\n          max-height: 0;\n          overflow: hidden;\n        }\n\n        .facet-group.mobile .facet-group-content.open {\n          max-height: 2000px;\n        }\n\n        h3 {\n          font-size: 1.4rem;\n          font-weight: 200\n          padding-bottom: 3px;\n          margin: 0;\n        }\n\n        .more-link {\n          font-size: 1.2rem;\n          text-decoration: none;\n          padding: 0;\n          background: inherit;\n          border: 0;\n          color: var(--ia-theme-link-color, #4b64ff);\n          cursor: pointer;\n        }\n\n        #date-picker-label {\n          display: flex;\n          justify-content: space-between;\n        }\n\n        .expand-date-picker-btn {\n          margin: 0;\n          padding: 0;\n          border: 0;\n          appearance: none;\n          background: none;\n          cursor: pointer;\n        }\n\n        .expand-date-picker-btn > svg {\n          width: 14px;\n          height: 14px;\n        }\n\n        .sorting-icon {\n          height: 15px;\n          cursor: pointer;\n        }\n      `,\n    ];\n  }\n}\n"]}
+{"version":3,"file":"collection-facets.js","sourceRoot":"","sources":["../../src/collection-facets.ts"],"names":[],"mappings":";AAAA,yCAAyC;AACzC,OAAO,EACL,GAAG,EACH,IAAI,EACJ,UAAU,EAEV,OAAO,GAER,MAAM,KAAK,CAAC;AACb,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAC5C,OAAO,EAAE,GAAG,EAAE,MAAM,uBAAuB,CAAC;AAS5C,OAAO,uCAAuC,CAAC;AAC/C,OAAO,mCAAmC,CAAC;AAC3C,OAAO,wCAAwC,CAAC;AAEhD,OAAO,EACL,WAAW,GAEZ,MAAM,gCAAgC,CAAC;AAKxC,OAAO,WAAW,MAAM,4BAA4B,CAAC;AACrD,OAAO,UAAU,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAKL,iBAAiB,EACjB,WAAW,EACX,wBAAwB,EACxB,0BAA0B,EAE1B,qBAAqB,EACrB,gBAAgB,GACjB,MAAM,UAAU,CAAC;AAClB,OAAO,yCAAyC,CAAC;AACjD,OAAO,qCAAqC,CAAC;AAC7C,OAAO,yCAAyC,CAAC;AACjD,OAAO,wBAAwB,CAAC;AAChC,OAAO,EACL,gBAAgB,EAChB,mBAAmB,GACpB,MAAM,0BAA0B,CAAC;AAClC,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAG5D,IAAa,gBAAgB,GAA7B,MAAa,gBAAiB,SAAQ,UAAU;IAAhD;;QAa+B,qBAAgB,GAAG,IAAI,CAAC;QAExB,kBAAa,GAAG,KAAK,CAAC;QAEtB,+BAA0B,GAAG,KAAK,CAAC;QAInC,sBAAiB,GAAG,KAAK,CAAC;QAI1B,4BAAuB,GAAG,KAAK,CAAC;QAEhC,6BAAwB,GAAG,KAAK,CAAC;QAwBrD,eAAU,GAAiC;YAClD,OAAO,EAAE,KAAK;YACd,OAAO,EAAE,KAAK;YACd,SAAS,EAAE,KAAK;YAChB,QAAQ,EAAE,KAAK;YACf,OAAO,EAAE,KAAK;YACd,UAAU,EAAE,KAAK;YACjB,IAAI,EAAE,KAAK;SACZ,CAAC;QAEF;;WAEG;QACK,sBAAiB,GAAG,CAAC,CAAC;QAuFtB,mCAA8B,GAAG,GAAS,EAAE;;YAClD,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC,MAAM,CAAC,sBAAsB,CAAC,CAAC;QAC9D,CAAC,CAAC;QAqDF;;;;;WAKG;QACK,8BAAyB,GAAG,CAClC,CAGE,EACI,EAAE;YACR,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,GAAG,CAAC,CAAC,MAAM,CAAC;YACtC,MAAM,KAAK,GAAG,IAAI,WAAW,CAAC,2BAA2B,EAAE;gBACzD,MAAM,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;aAC7B,CAAC,CAAC;YACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC,CAAC;IAodJ,CAAC;IAjnBC,MAAM;QACJ,MAAM,iBAAiB,GAAG,mBAAmB,CAAC;QAC9C,OAAO,IAAI,CAAA;mCACoB,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,EAAE;UAC5D,IAAI,CAAC,uBAAuB;YAC9B,CAAC,IAAI,CAAC,6BAA6B,IAAI,IAAI,CAAC,0BAA0B,CAAC;YACrE,CAAC,CAAC,IAAI,CAAA;6DAC6C,iBAAiB;yBACrD,iBAAiB;;oBAEtB,IAAI,CAAC,2BAA2B;;kBAElC,IAAI,CAAC,iBAAiB;;aAE3B;YACH,CAAC,CAAC,OAAO;UACT,IAAI,CAAC,YAAY,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE,CACnC,IAAI,CAAC,qBAAqB,CAAC,UAAU,CAAC,CACvC;;KAEJ,CAAC;IACJ,CAAC;IAED;;OAEG;IACK,mBAAmB;;QACzB,MAAM,EAAE,6BAA6B,EAAE,GAAG,IAAI,CAAC;QAC/C,MAAM,OAAO,GAAG,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,gBAAgB,CAAC;QAChE,MAAM,OAAO,GAAG,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,eAAe,CAAC;QAC/D,MAAM,OAAO,GAAG,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,OAAmB,CAAC;QAEnE,+EAA+E;QAC/E,gFAAgF;QAChF,kFAAkF;QAClF,qFAAqF;QACrF,yDAAyD;QACzD,qFAAqF;QACrF,iFAAiF;QACjF,8CAA8C;QAC9C,MAAM,yBAAyB,GAAG,CAAC,IAAc,EAAE,EAAE;YACnD,IAAI,IAAI,IAAI,IAAI,YAAY,kBAAkB,EAAE;gBAC9C,MAAM,kBAAkB,GAAG,IAA0B,CAAC;gBACtD,kBAAkB,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC;gBAC1D,kBAAkB,CAAC,eAAe,GAAG,IAAI,CAAC,eAAe,CAAC;aAC3D;QACH,CAAC,CAAC;QAEF,MAAM,kBAAkB,GAAG,IAAI,CAAA;;UAEzB,GAAG,CAAC,yBAAyB,CAAC;mBACrB,OAAO;mBACP,OAAO;2BACC,IAAI,CAAC,eAAe;2BACpB,IAAI,CAAC,eAAe;mBAC5B,OAAO;wBACF,IAAI,CAAC,YAAY;4BACb,IAAI,CAAC,gBAAgB;qCACZ,IAAI,CAAC,yBAAyB;uBAC5C,IAAI,CAAC,8BAA8B;;KAErD,CAAC;QAEF,MAAM,MAAM,GAAG,IAAI,WAAW,CAAC;YAC7B,SAAS,EAAE,MAAM;YACjB,WAAW,EAAE,SAAS;YACtB,cAAc,EAAE,KAAK;YACrB,oBAAoB,EAAE,IAAI;YAC1B,KAAK,EAAE,IAAI,CAAA,qBAAqB;SACjC,CAAC,CAAC;QAEH,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC,GAAG,CAAC,sBAAsB,CAAC,CAAC;QACzD,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC;YAC3B,MAAM;YACN,kBAAkB;YAClB,uBAAuB,EAAE,IAAI,CAAC,8BAA8B;SAC7D,CAAC,CAAC;QAEH,MAAA,IAAI,CAAC,gBAAgB,0CAAE,SAAS,CAAC;YAC/B,QAAQ,EAAE,mBAAmB,CAAC,OAAO;YACrC,MAAM,EAAE,gBAAgB,CAAC,iBAAiB;YAC1C,KAAK,EAAE,MAAM,CAAC,QAAQ,CAAC,IAAI;SAC5B,CAAC,CAAC;IACL,CAAC;IAMD,OAAO,CAAC,OAAuB;QAC7B,IAAI,OAAO,CAAC,GAAG,CAAC,gBAAgB,CAAC,EAAE;YACjC,IAAI,CAAC,0BAA0B,EAAE,CAAC;SACnC;IACH,CAAC;IAED,gCAAgC;IACxB,0BAA0B;QAChC,MAAM,KAAK,GAAG,IAAI,WAAW,CAAiB,eAAe,EAAE;YAC7D,MAAM,EAAE,IAAI,CAAC,cAAc;SAC5B,CAAC,CAAC;QACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;IAC5B,CAAC;IAED;;;OAGG;IACH,IAAY,2BAA2B;QACrC,OAAO,IAAI,CAAC,wBAAwB,IAAI,CAAC,IAAI,CAAC,aAAa;YACzD,CAAC,CAAC,IAAI,CAAA;;;mBAGO,IAAI,CAAC,mBAAmB;;YAE/B,UAAU;kBACJ;YACZ,CAAC,CAAC,OAAO,CAAC;IACd,CAAC;IAED,IAAY,iBAAiB;QAC3B,MAAM,EAAE,6BAA6B,EAAE,GAAG,IAAI,CAAC;QAC/C,OAAO,IAAI,CAAC,0BAA0B;YACpC,CAAC,CAAC,IAAI,CAAA,yDAAyD,CAAC,iBAAiB;YACjF,CAAC,CAAC,IAAI,CAAA;;uBAEW,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,gBAAgB;uBAC/C,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,eAAe;+BACtC,IAAI,CAAC,eAAe;+BACpB,IAAI,CAAC,eAAe;2BACxB,GAAG;;qBAET,IAAI,CAAC,iBAAiB,IAAI,IAAI,CAAC,YAAY;gBAClD,CAAC,CAAC,IAAI,CAAC,YAAY;gBACnB,CAAC,CAAC,GAAG;oBACC,6BAA6B,aAA7B,6BAA6B,uBAA7B,6BAA6B,CAAE,OAAmB;yCAC7B,IAAI,CAAC,yBAAyB;;SAE9D,CAAC;IACR,CAAC;IAqBD;;OAEG;IACH,IAAY,YAAY;QACtB,MAAM,WAAW,GAAiB,EAAE,CAAC;QAErC,iBAAiB,CAAC,OAAO,CAAC,QAAQ,CAAC,EAAE;;YACnC,MAAM,kBAAkB,GAAG,IAAI,CAAC,mBAAmB,CAAC,IAAI,CACtD,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,QAAQ,CAChC,CAAC;YACF,MAAM,mBAAmB,GAAG,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAC1D,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,KAAK,QAAQ,CAChC,CAAC;YAEF,iFAAiF;YACjF,IAAI,kBAAkB,IAAI,CAAC,mBAAmB,EAAE;gBAC9C,WAAW,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAC;gBACrC,OAAO;aACR;YAED,wEAAwE;YACxE,IAAI,CAAC,mBAAmB;gBAAE,OAAO;YAEjC,8EAA8E;YAC9E,MAAM,UAAU,GAAG,kBAAkB,aAAlB,kBAAkB,cAAlB,kBAAkB,GAAI,mBAAmB,CAAC;YAE7D,4CAA4C;YAC5C,IAAI,gBAAgB,GAClB,MAAA,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,OAAO,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;gBACvC,MAAM,cAAc,GAAG,mBAAmB,CAAC,OAAO,CAAC,IAAI,CACrD,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,MAAM,CAAC,GAAG,CAC1B,CAAC;gBACF,OAAO,cAAc;oBACnB,CAAC,CAAC;wBACE,GAAG,MAAM;wBACT,KAAK,EAAE,cAAc,CAAC,KAAK;qBAC5B;oBACH,CAAC,CAAC,MAAM,CAAC;YACb,CAAC,CAAC,mCAAI,EAAE,CAAC;YAEX,uDAAuD;YACvD,mBAAmB,CAAC,OAAO,CAAC,OAAO,CAAC,MAAM,CAAC,EAAE;gBAC3C,MAAM,cAAc,GAAG,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,GAAG,KAAK,MAAM,CAAC,GAAG,CAAC,CAAC;gBACxE,IAAI,cAAc;oBAAE,OAAO;gBAC3B,gBAAgB,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;YAChC,CAAC,CAAC,CAAC;YAEH;;;;;eAKG;YACH,IAAI,iBAAiB,GAAG,MAAA,MAAM,CAAC,IAAI,CACjC,CAAC,kBAAkB,aAAlB,kBAAkB,uBAAlB,kBAAkB,CAAE,OAAc,KAAI,EAAE,CAC1C,0CAAE,MAAM,CAAC;YACV,IAAI,iBAAiB,GAAG,IAAI,CAAC,iBAAiB,EAAE;gBAC9C,iBAAiB,GAAG,IAAI,CAAC,iBAAiB,CAAC,CAAC,8BAA8B;aAC3E;YAED,gEAAgE;YAChE,IAAI,QAAQ,KAAK,SAAS,EAAE;gBAC1B,gBAAgB,GAAG,gBAAgB,CAAC,MAAM,CACxC,MAAM,CAAC,EAAE,CAAC,0BAA0B,CAAC,MAAM,CAAC,GAAsB,CAAC,CACpE,CAAC;aACH;YAED,gFAAgF;YAChF,IAAI,QAAQ,KAAK,WAAW,EAAE;gBAC5B,MAAM,eAAe,GAAG,gBAAgB,CAAC,SAAS,CAChD,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,GAAG,KAAK,YAAY,CACtC,CAAC;gBAEF,IAAI,eAAe,IAAI,iBAAiB,EAAE;oBACxC,MAAM,CAAC,gBAAgB,CAAC,GAAG,gBAAgB,CAAC,MAAM,CAChD,eAAe,EACf,CAAC,CACF,CAAC;oBACF,gBAAgB,CAAC,MAAM,CAAC,iBAAiB,GAAG,CAAC,EAAE,CAAC,EAAE,gBAAgB,CAAC,CAAC;oBACpE,sFAAsF;oBACtF,IAAI,iBAAiB,GAAG,IAAI,CAAC,iBAAiB;wBAC5C,iBAAiB,IAAI,CAAC,CAAC;iBAC1B;aACF;YAED,2DAA2D;YAC3D,UAAU,CAAC,OAAO,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC,EAAE,iBAAiB,CAAC,CAAC;YAEnE,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC;QAC/B,CAAC,CAAC,CAAC;QAEH,OAAO,WAAW,CAAC;IACrB,CAAC;IAED;;;OAGG;IACH,IAAY,mBAAmB;QAC7B,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO,EAAE,CAAC;QAEpC,MAAM,WAAW,GAAiB,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,GAAG,CACvE,CAAC,CAAC,GAAG,EAAE,cAAc,CAAC,EAAE,EAAE;YACxB,MAAM,MAAM,GAAG,GAAkB,CAAC;YAClC,MAAM,KAAK,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;YAElC,MAAM,OAAO,GAAkB,MAAM,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,GAAG,CAC/D,CAAC,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,EAAE;;gBACrB,IAAI,WAAW,GAAW,KAAK,CAAC;gBAChC,2DAA2D;gBAC3D,IAAI,MAAM,KAAK,SAAS,EAAE;oBACxB,WAAW;wBACT,MAAA,wBAAwB,CAAC,KAAwB,CAAC,mCAAI,KAAK,CAAC;iBAC/D;gBACD,OAAO;oBACL,WAAW;oBACX,GAAG,EAAE,KAAK;oBACV,KAAK,EAAE,SAAS,CAAC,KAAK;oBACtB,KAAK,EAAE,SAAS,CAAC,KAAK;iBACvB,CAAC;YACJ,CAAC,CACF,CAAC;YAEF,OAAO;gBACL,KAAK;gBACL,GAAG,EAAE,MAAM;gBACX,OAAO;aACR,CAAC;QACJ,CAAC,CACF,CAAC;QAEF,OAAO,WAAW,CAAC;IACrB,CAAC;IAED;;OAEG;IACH,IAAY,sBAAsB;;QAChC,MAAM,WAAW,GAAiB,EAAE,CAAC;QACrC,MAAM,CAAC,OAAO,CAAC,MAAA,IAAI,CAAC,YAAY,mCAAI,EAAE,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,WAAW,CAAC,EAAE,EAAE;YACrE,4EAA4E;YAC5E,IAAI,GAAG,KAAK,gBAAgB;gBAAE,OAAO;YAErC,MAAM,MAAM,GAAG,GAAkB,CAAC;YAClC,MAAM,KAAK,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC;YAClC,IAAI,CAAC,KAAK;gBAAE,OAAO;YAEnB,IAAI,aAAa,GAAG,WAAW,CAAC,gBAAgB,CAC9C,gBAAgB,CAAC,MAAM,CAAC,CACb,CAAC;YAEd,IAAI,MAAM,KAAK,YAAY,EAAE;gBAC3B,oFAAoF;gBACpF,aAAa,GAAG,aAAa,aAAb,aAAa,uBAAb,aAAa,CAAE,MAAM,CAAC,MAAM,CAAC,EAAE;;oBAC7C,MAAM,SAAS,GAAG,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,0CAAE,QAAQ,EAAE,CAAC;oBAC1C,OAAO,CACL,CAAC,qBAAqB,CAAC,SAAS,CAAC,IAAI,CAAC,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,CAAC,MAAM,CAAC,CAAA,CACpE,CAAC;gBACJ,CAAC,CAAC,CAAC;aACJ;YAED,MAAM,YAAY,GAAkB,aAAa,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;;gBAC7D,MAAM,SAAS,GAAG,MAAM,CAAC,GAAG,CAAC;gBAC7B,IAAI,WAAW,GAAG,GAAG,MAAM,CAAC,GAAG,EAAE,CAAC;gBAClC,kEAAkE;gBAClE,IAAI,MAAM,KAAK,SAAS,EAAE;oBACxB,WAAW;wBACT,MAAA,wBAAwB,CAAC,MAAM,CAAC,GAAsB,CAAC,mCACvD,GAAG,MAAM,CAAC,GAAG,EAAE,CAAC;iBACnB;gBACD,OAAO;oBACL,WAAW;oBACX,GAAG,EAAE,GAAG,SAAS,EAAE;oBACnB,KAAK,EAAE,MAAM,CAAC,SAAS;oBACvB,KAAK,EAAE,MAAM;iBACd,CAAC;YACJ,CAAC,CAAC,CAAC;YACH,MAAM,KAAK,GAAe;gBACxB,KAAK;gBACL,GAAG,EAAE,MAAM;gBACX,OAAO,EAAE,YAAY;aACtB,CAAC;YACF,WAAW,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC,CAAC,CAAC;QACH,OAAO,WAAW,CAAC;IACrB,CAAC;IAED;;;OAGG;IACK,qBAAqB,CAC3B,UAAsB;QAEtB,IAAI,CAAC,IAAI,CAAC,aAAa,IAAI,UAAU,CAAC,OAAO,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,OAAO,CAAC;QAE3E,MAAM,EAAE,GAAG,EAAE,GAAG,UAAU,CAAC;QAC3B,MAAM,MAAM,GAAG,IAAI,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;QACpC,MAAM,SAAS,GAAG,IAAI,CAAA;+BACK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,MAAM,WAAW;KAC/D,CAAC;QAEF,MAAM,eAAe,GAAG,GAAG,EAAE;YAC3B,MAAM,aAAa,GAAG,EAAE,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;YAC7C,aAAa,CAAC,GAAG,CAAC,GAAG,CAAC,MAAM,CAAC;YAC7B,IAAI,CAAC,UAAU,GAAG,aAAa,CAAC;QAClC,CAAC,CAAC;QAEF,MAAM,QAAQ,GAAG,4BAA4B,UAAU,CAAC,GAAG,EAAE,CAAC;QAC9D,OAAO,IAAI,CAAA;;6BAEc,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE;0BACzC,QAAQ;;;;iBAIjB,QAAQ;qBACJ,eAAe;qBACf,eAAe;;cAEtB,IAAI,CAAC,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO,IAAI,UAAU,CAAC,KAAK;;;;0CAIpC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE;YAClD,IAAI,CAAC,aAAa;YAClB,CAAC,CAAC,IAAI,CAAC,8BAA8B,EAAE;YACvC,CAAC,CAAC,IAAI,CAAA;kBACA,IAAI,CAAC,gBAAgB,CAAC,UAAU,CAAC;kBACjC,IAAI,CAAC,oBAAoB,CAAC,UAAU,CAAC;eACxC;;;KAGV,CAAC;IACJ,CAAC;IAEO,8BAA8B;QACpC,6BAA6B;QAC7B,OAAO,IAAI,CAAA;QACP,GAAG,CACH,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EACnB,GAAG,EAAE,CAAC,IAAI,CAAA,6CAA6C,CACxD;KACF,CAAC;IACJ,CAAC;IAED;;;;OAIG;IACK,oBAAoB,CAC1B,UAAsB;QAEtB,8CAA8C;QAC9C,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE;YAC1B,OAAO,OAAO,CAAC;SAChB;QAED,gDAAgD;QAChD,IAAI,UAAU,CAAC,GAAG,KAAK,SAAS,EAAE;YAChC,OAAO,OAAO,CAAC;SAChB;QAED,6EAA6E;QAC7E,IAAI,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,IAAI,CAAC,iBAAiB,EAAE;YACnE,OAAO,OAAO,CAAC;SAChB;QAED,sEAAsE;QACtE,MAAM,SAAS,GAAG,gBAAgB,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC;QAEnD,OAAO,IAAI,CAAA;;eAEA,GAAG,EAAE;;YACZ,IAAI,CAAC,mBAAmB,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC;YAChD,MAAA,IAAI,CAAC,gBAAgB,0CAAE,SAAS,CAAC;gBAC/B,QAAQ,EAAE,mBAAmB,CAAC,OAAO;gBACrC,MAAM,EAAE,gBAAgB,CAAC,mBAAmB;gBAC5C,KAAK,EAAE,UAAU,CAAC,GAAG;aACtB,CAAC,CAAC;YACH,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,gBAAgB,EAAE,EAAE,MAAM,EAAE,UAAU,CAAC,GAAG,EAAE,CAAC,CAC9D,CAAC;QACJ,CAAC;;;cAGO,CAAC;IACb,CAAC;IAED,KAAK,CAAC,mBAAmB,CACvB,UAAsB,EACtB,QAA6B;;QAE7B,MAAM,YAAY,GAAG,UAAU,CAAC,GAAG,CAAC;QAEpC,MAAM,kBAAkB,GAAG,IAAI,CAAA;;4BAEP,IAAI,CAAC,gBAAgB;oBAC7B,UAAU,CAAC,GAAG;+BACH,YAAY;iBAC1B,IAAI,CAAC,KAAK;qBACN,IAAI,CAAC,SAAS;wBACX,IAAI,CAAC,YAAY;yBAChB,IAAI,CAAC,aAAa;sBACrB,IAAI,CAAC,UAAU;+BACN,IAAI,CAAC,mBAAmB;0BAC7B,IAAI,CAAC,cAAc;oBACzB,QAAQ;yBACH,CAAC,CAAc,EAAE,EAAE;YAClC,MAAM,KAAK,GAAG,IAAI,WAAW,CAAiB,eAAe,EAAE;gBAC7D,MAAM,EAAE,CAAC,CAAC,MAAM;gBAChB,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CAAC;YACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC;;;KAGJ,CAAC;QAEF,MAAM,MAAM,GAAG,IAAI,WAAW,CAAC;YAC7B,SAAS,EAAE,MAAM;YACjB,WAAW,EAAE,SAAS;YACtB,cAAc,EAAE,KAAK;YACrB,oBAAoB,EAAE,IAAI;YAC1B,KAAK,EAAE,IAAI,CAAA,gBAAgB;SAC5B,CAAC,CAAC;QACH,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC,GAAG,CAAC,oBAAoB,CAAC,CAAC;QACvD,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC;YAC3B,MAAM;YACN,kBAAkB;YAClB,uBAAuB,EAAE,GAAG,EAAE;;gBAC5B,MAAA,IAAI,CAAC,YAAY,0CAAE,SAAS,CAAC,MAAM,CAAC,oBAAoB,CAAC,CAAC;YAC5D,CAAC;SACF,CAAC,CAAC;IACL,CAAC;IAED;;OAEG;IACK,gBAAgB,CAAC,UAAsB;QAC7C,OAAO,IAAI,CAAA;;sBAEO,UAAU;0BACN,IAAI,CAAC,cAAc;oBACzB,MAAM;+BACK,IAAI,CAAC,mBAAmB;iCACtB,CAAC,CAAc,EAAE,EAAE;YAC1C,MAAM,KAAK,GAAG,IAAI,WAAW,CAAiB,eAAe,EAAE;gBAC7D,MAAM,EAAE,CAAC,CAAC,MAAM;gBAChB,OAAO,EAAE,IAAI;gBACb,QAAQ,EAAE,IAAI;aACf,CAAC,CAAC;YACH,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC;QAC5B,CAAC;;KAEJ,CAAC;IACJ,CAAC;IAED,MAAM,KAAK,MAAM;QACf,OAAO;YACL,WAAW;YACX,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;OAoGF;SACF,CAAC;IACJ,CAAC;CACF,CAAA;AAlrB6B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAAwC;AAEvC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;oDAAyB;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAA4C;AAE3C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uEAA6C;AAE5C;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAA0B;AAEzB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;yDAA0B;AAExB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;0DAAyB;AAExB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;uDAAuB;AAEtB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;oEAAoC;AAEpC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;wDAAiC;AAE/B;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;2DAA2B;AAE3B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;sDAAuB;AAErB;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;iEAAiC;AAEhC;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;kEAAkC;AAElC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAgB;AAEf;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;mDAAuB;AAGlD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;sDACR;AAGrC;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;wDACE;AAG/C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;gEACY;AAGzD;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;0DACA;AAG7C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;0DACA;AAG7C;IADC,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;6DACM;AAE1C;IAAR,KAAK,EAAE;oDAQN;AA3DS,gBAAgB;IAD5B,aAAa,CAAC,mBAAmB,CAAC;GACtB,gBAAgB,CAmrB5B;SAnrBY,gBAAgB","sourcesContent":["/* eslint-disable import/no-duplicates */\nimport {\n  css,\n  html,\n  LitElement,\n  PropertyValues,\n  nothing,\n  TemplateResult,\n} from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { map } from 'lit/directives/map.js';\nimport { ref } from 'lit/directives/ref.js';\nimport type {\n  Aggregation,\n  AggregationSortType,\n  Bucket,\n  FilterMap,\n  SearchServiceInterface,\n  SearchType,\n} from '@internetarchive/search-service';\nimport '@internetarchive/histogram-date-range';\nimport '@internetarchive/feature-feedback';\nimport '@internetarchive/collection-name-cache';\nimport type { CollectionNameCacheInterface } from '@internetarchive/collection-name-cache';\nimport {\n  ModalConfig,\n  ModalManagerInterface,\n} from '@internetarchive/modal-manager';\nimport type { FeatureFeedbackServiceInterface } from '@internetarchive/feature-feedback';\nimport type { RecaptchaManagerInterface } from '@internetarchive/recaptcha-manager';\nimport type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';\nimport type { SharedResizeObserverInterface } from '@internetarchive/shared-resize-observer';\nimport chevronIcon from './assets/img/icons/chevron';\nimport expandIcon from './assets/img/icons/expand';\nimport {\n  FacetOption,\n  SelectedFacets,\n  FacetGroup,\n  FacetBucket,\n  facetDisplayOrder,\n  facetTitles,\n  lendingFacetDisplayNames,\n  lendingFacetKeysVisibility,\n  LendingFacetKey,\n  suppressedCollections,\n  defaultFacetSort,\n} from './models';\nimport './collection-facets/more-facets-content';\nimport './collection-facets/facets-template';\nimport './collection-facets/facet-tombstone-row';\nimport './expanded-date-picker';\nimport {\n  analyticsActions,\n  analyticsCategories,\n} from './utils/analytics-events';\nimport { srOnlyStyle } from './styles/sr-only';\nimport { ExpandedDatePicker } from './expanded-date-picker';\n\n@customElement('collection-facets')\nexport class CollectionFacets extends LitElement {\n  @property({ type: Object }) searchService?: SearchServiceInterface;\n\n  @property({ type: String }) searchType?: SearchType;\n\n  @property({ type: Object }) aggregations?: Record<string, Aggregation>;\n\n  @property({ type: Object }) fullYearsHistogramAggregation?: Aggregation;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Boolean }) moreLinksVisible = true;\n\n  @property({ type: Boolean }) facetsLoading = false;\n\n  @property({ type: Boolean }) fullYearAggregationLoading = false;\n\n  @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n  @property({ type: Boolean }) collapsableFacets = false;\n\n  @property({ type: Number }) contentWidth?: number;\n\n  @property({ type: Boolean }) showHistogramDatePicker = false;\n\n  @property({ type: Boolean }) allowExpandingDatePicker = false;\n\n  @property({ type: String }) query?: string;\n\n  @property({ type: Object }) filterMap?: FilterMap;\n\n  @property({ type: Object, attribute: false })\n  modalManager?: ModalManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  resizeObserver?: SharedResizeObserverInterface;\n\n  @property({ type: Object, attribute: false })\n  featureFeedbackService?: FeatureFeedbackServiceInterface;\n\n  @property({ type: Object, attribute: false })\n  recaptchaManager?: RecaptchaManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  analyticsHandler?: AnalyticsManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  collectionNameCache?: CollectionNameCacheInterface;\n\n  @state() openFacets: Record<FacetOption, boolean> = {\n    subject: false,\n    lending: false,\n    mediatype: false,\n    language: false,\n    creator: false,\n    collection: false,\n    year: false,\n  };\n\n  /**\n   * Maximum # of facet buckets to render per facet group\n   */\n  private allowedFacetCount = 6;\n\n  render() {\n    const datePickerLabelId = 'date-picker-label';\n    return html`\n      <div id=\"container\" class=\"${this.facetsLoading ? 'loading' : ''}\">\n        ${this.showHistogramDatePicker &&\n        (this.fullYearsHistogramAggregation || this.fullYearAggregationLoading)\n          ? html`\n              <section class=\"facet-group\" aria-labelledby=${datePickerLabelId}>\n                <h3 id=${datePickerLabelId}>\n                  Year Published <span class=\"sr-only\">range filter</span>\n                  ${this.expandDatePickerBtnTemplate}\n                </h3>\n                ${this.histogramTemplate}\n              </section>\n            `\n          : nothing}\n        ${this.mergedFacets.map(facetGroup =>\n          this.getFacetGroupTemplate(facetGroup)\n        )}\n      </div>\n    `;\n  }\n\n  /**\n   * Opens a modal dialog containing an enlarged version of the date picker.\n   */\n  private showDatePickerModal(): void {\n    const { fullYearsHistogramAggregation } = this;\n    const minDate = fullYearsHistogramAggregation?.first_bucket_key;\n    const maxDate = fullYearsHistogramAggregation?.last_bucket_key;\n    const buckets = fullYearsHistogramAggregation?.buckets as number[];\n\n    // Because the modal manager does not clear its DOM content after being closed,\n    // it may try to render the exact same date picker template when it is reopened.\n    // And because it isn't actually a descendent of this collection-facets component,\n    // changes to the template defined here may not trigger a reactive update to the date\n    // picker, resulting in it displaying a stale date range.\n    // This ref callback ensures that every time the date picker modal is opened, it will\n    // always propagate the most recent date range into the date picker regardless of\n    // whether Lit thinks the update is necessary.\n    const expandedDatePickerChanged = (elmt?: Element) => {\n      if (elmt && elmt instanceof ExpandedDatePicker) {\n        const expandedDatePicker = elmt as ExpandedDatePicker;\n        expandedDatePicker.minSelectedDate = this.minSelectedDate;\n        expandedDatePicker.maxSelectedDate = this.maxSelectedDate;\n      }\n    };\n\n    const customModalContent = html`\n      <expanded-date-picker\n        ${ref(expandedDatePickerChanged)}\n        .minDate=${minDate}\n        .maxDate=${maxDate}\n        .minSelectedDate=${this.minSelectedDate}\n        .maxSelectedDate=${this.maxSelectedDate}\n        .buckets=${buckets}\n        .modalManager=${this.modalManager}\n        .analyticsHandler=${this.analyticsHandler}\n        @histogramDateRangeApplied=${this.histogramDateRangeUpdated}\n        @modalClosed=${this.handleExpandedDatePickerClosed}\n      ></expanded-date-picker>\n    `;\n\n    const config = new ModalConfig({\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true, // TODO: want to fire analytics\n      title: html`Select a date range`,\n    });\n\n    this.modalManager?.classList.add('expanded-date-picker');\n    this.modalManager?.showModal({\n      config,\n      customModalContent,\n      userClosedModalCallback: this.handleExpandedDatePickerClosed,\n    });\n\n    this.analyticsHandler?.sendEvent({\n      category: analyticsCategories.default,\n      action: analyticsActions.histogramExpanded,\n      label: window.location.href,\n    });\n  }\n\n  private handleExpandedDatePickerClosed = (): void => {\n    this.modalManager?.classList.remove('expanded-date-picker');\n  };\n\n  updated(changed: PropertyValues) {\n    if (changed.has('selectedFacets')) {\n      this.dispatchFacetsChangedEvent();\n    }\n  }\n\n  // TODO: want to fire analytics?\n  private dispatchFacetsChangedEvent() {\n    const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n      detail: this.selectedFacets,\n    });\n    this.dispatchEvent(event);\n  }\n\n  /**\n   * Template for the \"Expand\" button to show the date picker modal, or\n   * `nothing` if that button should currently not be shown.\n   */\n  private get expandDatePickerBtnTemplate(): TemplateResult | typeof nothing {\n    return this.allowExpandingDatePicker && !this.facetsLoading\n      ? html`<button\n          class=\"expand-date-picker-btn\"\n          aria-hidden=\"true\"\n          @click=${this.showDatePickerModal}\n        >\n          ${expandIcon}\n        </button>`\n      : nothing;\n  }\n\n  private get histogramTemplate() {\n    const { fullYearsHistogramAggregation } = this;\n    return this.fullYearAggregationLoading\n      ? html`<div class=\"histogram-loading-indicator\">&hellip;</div>` // Ellipsis block\n      : html`\n          <histogram-date-range\n            .minDate=${fullYearsHistogramAggregation?.first_bucket_key}\n            .maxDate=${fullYearsHistogramAggregation?.last_bucket_key}\n            .minSelectedDate=${this.minSelectedDate}\n            .maxSelectedDate=${this.maxSelectedDate}\n            .updateDelay=${100}\n            missingDataMessage=\"...\"\n            .width=${this.collapsableFacets && this.contentWidth\n              ? this.contentWidth\n              : 180}\n            .bins=${fullYearsHistogramAggregation?.buckets as number[]}\n            @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n          ></histogram-date-range>\n        `;\n  }\n\n  /**\n   * Dispatches a `histogramDateRangeUpdated` event with the date range copied from the\n   * input event.\n   *\n   * Arrow function to ensure `this` is always bound to the current component.\n   */\n  private histogramDateRangeUpdated = (\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ): void => {\n    const { minDate, maxDate } = e.detail;\n    const event = new CustomEvent('histogramDateRangeUpdated', {\n      detail: { minDate, maxDate },\n    });\n    this.dispatchEvent(event);\n  };\n\n  /**\n   * Combines the selected facets with the aggregations to create a single list of facets\n   */\n  private get mergedFacets(): FacetGroup[] {\n    const facetGroups: FacetGroup[] = [];\n\n    facetDisplayOrder.forEach(facetKey => {\n      const selectedFacetGroup = this.selectedFacetGroups.find(\n        group => group.key === facetKey\n      );\n      const aggregateFacetGroup = this.aggregationFacetGroups.find(\n        group => group.key === facetKey\n      );\n\n      // if the user selected a facet, but it's not in the aggregation, we add it as-is\n      if (selectedFacetGroup && !aggregateFacetGroup) {\n        facetGroups.push(selectedFacetGroup);\n        return;\n      }\n\n      // if we don't have an aggregate facet group, don't add this to the list\n      if (!aggregateFacetGroup) return;\n\n      // start with either the selected group if we have one, or the aggregate group\n      const facetGroup = selectedFacetGroup ?? aggregateFacetGroup;\n\n      // attach the counts to the selected buckets\n      let bucketsWithCount =\n        selectedFacetGroup?.buckets.map(bucket => {\n          const selectedBucket = aggregateFacetGroup.buckets.find(\n            b => b.key === bucket.key\n          );\n          return selectedBucket\n            ? {\n                ...bucket,\n                count: selectedBucket.count,\n              }\n            : bucket;\n        }) ?? [];\n\n      // append any additional buckets that were not selected\n      aggregateFacetGroup.buckets.forEach(bucket => {\n        const existingBucket = bucketsWithCount.find(b => b.key === bucket.key);\n        if (existingBucket) return;\n        bucketsWithCount.push(bucket);\n      });\n\n      /**\n       * render limited facet items on page facet area\n       *\n       * - by-default we are showing 6 items\n       * - additionally want to show all items (selected/suppressed) in page facet area\n       */\n      let allowedFacetCount = Object.keys(\n        (selectedFacetGroup?.buckets as []) || []\n      )?.length;\n      if (allowedFacetCount < this.allowedFacetCount) {\n        allowedFacetCount = this.allowedFacetCount; // splice start index from 0th\n      }\n\n      // For lending facets, only include a specific subset of buckets\n      if (facetKey === 'lending') {\n        bucketsWithCount = bucketsWithCount.filter(\n          bucket => lendingFacetKeysVisibility[bucket.key as LendingFacetKey]\n        );\n      }\n\n      // For mediatype facets, ensure the collection bucket is always shown if present\n      if (facetKey === 'mediatype') {\n        const collectionIndex = bucketsWithCount.findIndex(\n          bucket => bucket.key === 'collection'\n        );\n\n        if (collectionIndex >= allowedFacetCount) {\n          const [collectionBucket] = bucketsWithCount.splice(\n            collectionIndex,\n            1\n          );\n          bucketsWithCount.splice(allowedFacetCount - 1, 0, collectionBucket);\n          // If we're showing lots of selected facets, ensure we're not cutting off the last one\n          if (allowedFacetCount > this.allowedFacetCount)\n            allowedFacetCount += 1;\n        }\n      }\n\n      // splice how many items we want to show in page facet area\n      facetGroup.buckets = bucketsWithCount.splice(0, allowedFacetCount);\n\n      facetGroups.push(facetGroup);\n    });\n\n    return facetGroups;\n  }\n\n  /**\n   * Converts the selected facets to a `FacetGroup` array,\n   * which is easier to work with\n   */\n  private get selectedFacetGroups(): FacetGroup[] {\n    if (!this.selectedFacets) return [];\n\n    const facetGroups: FacetGroup[] = Object.entries(this.selectedFacets).map(\n      ([key, selectedFacets]) => {\n        const option = key as FacetOption;\n        const title = facetTitles[option];\n\n        const buckets: FacetBucket[] = Object.entries(selectedFacets).map(\n          ([value, facetData]) => {\n            let displayText: string = value;\n            // for lending facets, convert the key to a readable format\n            if (option === 'lending') {\n              displayText =\n                lendingFacetDisplayNames[value as LendingFacetKey] ?? value;\n            }\n            return {\n              displayText,\n              key: value,\n              count: facetData.count,\n              state: facetData.state,\n            };\n          }\n        );\n\n        return {\n          title,\n          key: option,\n          buckets,\n        };\n      }\n    );\n\n    return facetGroups;\n  }\n\n  /**\n   * Converts the raw `aggregations` to `FacetGroups`, which are easier to use\n   */\n  private get aggregationFacetGroups(): FacetGroup[] {\n    const facetGroups: FacetGroup[] = [];\n    Object.entries(this.aggregations ?? []).forEach(([key, aggregation]) => {\n      // the year_histogram data is in a different format so can't be handled here\n      if (key === 'year_histogram') return;\n\n      const option = key as FacetOption;\n      const title = facetTitles[option];\n      if (!title) return;\n\n      let castedBuckets = aggregation.getSortedBuckets(\n        defaultFacetSort[option]\n      ) as Bucket[];\n\n      if (option === 'collection') {\n        // we are not showing fav- collections or certain deemphasized collections in facets\n        castedBuckets = castedBuckets?.filter(bucket => {\n          const bucketKey = bucket?.key?.toString();\n          return (\n            !suppressedCollections[bucketKey] && !bucketKey?.startsWith('fav-')\n          );\n        });\n      }\n\n      const facetBuckets: FacetBucket[] = castedBuckets.map(bucket => {\n        const bucketKey = bucket.key;\n        let displayText = `${bucket.key}`;\n        // for lending facets, convert the bucket key to a readable format\n        if (option === 'lending') {\n          displayText =\n            lendingFacetDisplayNames[bucket.key as LendingFacetKey] ??\n            `${bucket.key}`;\n        }\n        return {\n          displayText,\n          key: `${bucketKey}`,\n          count: bucket.doc_count,\n          state: 'none',\n        };\n      });\n      const group: FacetGroup = {\n        title,\n        key: option,\n        buckets: facetBuckets,\n      };\n      facetGroups.push(group);\n    });\n    return facetGroups;\n  }\n\n  /**\n   * Generate the template for a facet group with a header and the collapsible\n   * chevron for the mobile view\n   */\n  private getFacetGroupTemplate(\n    facetGroup: FacetGroup\n  ): TemplateResult | typeof nothing {\n    if (!this.facetsLoading && facetGroup.buckets.length === 0) return nothing;\n\n    const { key } = facetGroup;\n    const isOpen = this.openFacets[key];\n    const collapser = html`\n      <span class=\"collapser ${isOpen ? 'open' : ''}\"> ${chevronIcon} </span>\n    `;\n\n    const toggleCollapsed = () => {\n      const newOpenFacets = { ...this.openFacets };\n      newOpenFacets[key] = !isOpen;\n      this.openFacets = newOpenFacets;\n    };\n\n    const headerId = `facet-group-header-label-${facetGroup.key}`;\n    return html`\n      <section\n        class=\"facet-group ${this.collapsableFacets ? 'mobile' : ''}\"\n        aria-labelledby=${headerId}\n      >\n        <div class=\"facet-group-header\">\n          <h3\n            id=${headerId}\n            @click=${toggleCollapsed}\n            @keyup=${toggleCollapsed}\n          >\n            ${this.collapsableFacets ? collapser : nothing} ${facetGroup.title}\n            <span class=\"sr-only\">filters</span>\n          </h3>\n        </div>\n        <div class=\"facet-group-content ${isOpen ? 'open' : ''}\">\n          ${this.facetsLoading\n            ? this.getTombstoneFacetGroupTemplate()\n            : html`\n                ${this.getFacetTemplate(facetGroup)}\n                ${this.searchMoreFacetsLink(facetGroup)}\n              `}\n        </div>\n      </section>\n    `;\n  }\n\n  private getTombstoneFacetGroupTemplate(): TemplateResult {\n    // Render five tombstone rows\n    return html`\n      ${map(\n        Array(5).fill(null),\n        () => html`<facet-tombstone-row></facet-tombstone-row>`\n      )}\n    `;\n  }\n\n  /**\n   * Generate the More... link button just below the facets group\n   *\n   * TODO: want to fire analytics?\n   */\n  private searchMoreFacetsLink(\n    facetGroup: FacetGroup\n  ): TemplateResult | typeof nothing {\n    // Don't render More... links for FTS searches\n    if (!this.moreLinksVisible) {\n      return nothing;\n    }\n\n    // Don't render More... links for lending facets\n    if (facetGroup.key === 'lending') {\n      return nothing;\n    }\n\n    // Don't render More... link if the number of facets < this.allowedFacetCount\n    if (Object.keys(facetGroup.buckets).length < this.allowedFacetCount) {\n      return nothing;\n    }\n\n    // We sort years in numeric order by default, rather than bucket count\n    const facetSort = defaultFacetSort[facetGroup.key];\n\n    return html`<button\n      class=\"more-link\"\n      @click=${() => {\n        this.showMoreFacetsModal(facetGroup, facetSort);\n        this.analyticsHandler?.sendEvent({\n          category: analyticsCategories.default,\n          action: analyticsActions.showMoreFacetsModal,\n          label: facetGroup.key,\n        });\n        this.dispatchEvent(\n          new CustomEvent('showMoreFacets', { detail: facetGroup.key })\n        );\n      }}\n    >\n      More...\n    </button>`;\n  }\n\n  async showMoreFacetsModal(\n    facetGroup: FacetGroup,\n    sortedBy: AggregationSortType\n  ): Promise<void> {\n    const facetAggrKey = facetGroup.key;\n\n    const customModalContent = html`\n      <more-facets-content\n        .analyticsHandler=${this.analyticsHandler}\n        .facetKey=${facetGroup.key}\n        .facetAggregationKey=${facetAggrKey}\n        .query=${this.query}\n        .filterMap=${this.filterMap}\n        .modalManager=${this.modalManager}\n        .searchService=${this.searchService}\n        .searchType=${this.searchType}\n        .collectionNameCache=${this.collectionNameCache}\n        .selectedFacets=${this.selectedFacets}\n        .sortedBy=${sortedBy}\n        @facetsChanged=${(e: CustomEvent) => {\n          const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n            detail: e.detail,\n            bubbles: true,\n            composed: true,\n          });\n          this.dispatchEvent(event);\n        }}\n      >\n      </more-facets-content>\n    `;\n\n    const config = new ModalConfig({\n      bodyColor: '#fff',\n      headerColor: '#194880',\n      showHeaderLogo: false,\n      closeOnBackdropClick: true, // TODO: want to fire analytics\n      title: html`Select filters`,\n    });\n    this.modalManager?.classList.add('more-search-facets');\n    this.modalManager?.showModal({\n      config,\n      customModalContent,\n      userClosedModalCallback: () => {\n        this.modalManager?.classList.remove('more-search-facets');\n      },\n    });\n  }\n\n  /**\n   * Generate the list template for each bucket in a facet group\n   */\n  private getFacetTemplate(facetGroup: FacetGroup): TemplateResult {\n    return html`\n      <facets-template\n        .facetGroup=${facetGroup}\n        .selectedFacets=${this.selectedFacets}\n        .renderOn=${'page'}\n        .collectionNameCache=${this.collectionNameCache}\n        @selectedFacetsChanged=${(e: CustomEvent) => {\n          const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n            detail: e.detail,\n            bubbles: true,\n            composed: true,\n          });\n          this.dispatchEvent(event);\n        }}\n      ></facets-template>\n    `;\n  }\n\n  static get styles() {\n    return [\n      srOnlyStyle,\n      css`\n        #container.loading {\n          opacity: 0.5;\n        }\n\n        .histogram-loading-indicator {\n          width: 100%;\n          height: 2.25rem;\n          margin-top: 1.75rem;\n          font-size: 1.4rem;\n          text-align: center;\n        }\n\n        .collapser {\n          display: inline-block;\n          cursor: pointer;\n          width: 10px;\n          height: 10px;\n        }\n\n        .collapser svg {\n          transition: transform 0.2s ease-in-out;\n        }\n\n        .collapser.open svg {\n          transform: rotate(90deg);\n        }\n\n        .facet-group:not(:last-child) {\n          margin-bottom: 2rem;\n        }\n\n        .facet-group h3 {\n          margin-bottom: 0.7rem;\n        }\n\n        .facet-group.mobile h3 {\n          cursor: pointer;\n        }\n\n        .facet-group-header {\n          display: flex;\n          margin-bottom: 0.7rem;\n          justify-content: space-between;\n          border-bottom: 1px solid rgb(232, 232, 232);\n        }\n\n        .facet-group-content {\n          transition: max-height 0.2s ease-in-out;\n        }\n\n        .facet-group.mobile .facet-group-content {\n          max-height: 0;\n          overflow: hidden;\n        }\n\n        .facet-group.mobile .facet-group-content.open {\n          max-height: 2000px;\n        }\n\n        h3 {\n          font-size: 1.4rem;\n          font-weight: 200\n          padding-bottom: 3px;\n          margin: 0;\n        }\n\n        .more-link {\n          font-size: 1.2rem;\n          text-decoration: none;\n          padding: 0;\n          background: inherit;\n          border: 0;\n          color: var(--ia-theme-link-color, #4b64ff);\n          cursor: pointer;\n        }\n\n        #date-picker-label {\n          display: flex;\n          justify-content: space-between;\n        }\n\n        .expand-date-picker-btn {\n          margin: 0;\n          padding: 0;\n          border: 0;\n          appearance: none;\n          background: none;\n          cursor: pointer;\n        }\n\n        .expand-date-picker-btn > svg {\n          width: 14px;\n          height: 14px;\n        }\n\n        .sorting-icon {\n          height: 15px;\n          cursor: pointer;\n        }\n      `,\n    ];\n  }\n}\n"]}

package/dist/src/expanded-date-picker.d.ts

@@ -1,5 +1,6 @@
 import { LitElement, CSSResultGroup, TemplateResult } from 'lit';
 import type { ModalManagerInterface } from '@internetarchive/modal-manager';
+import type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';
 export declare class ExpandedDatePicker extends LitElement {
     minDate?: string;
     maxDate?: string;
@@ -7,6 +8,7 @@ export declare class ExpandedDatePicker extends LitElement {
     maxSelectedDate?: string;
     buckets?: number[];
     modalManager?: ModalManagerInterface;
+    analyticsHandler?: AnalyticsManagerInterface;
     render(): TemplateResult;
     connectedCallback(): void;
     disconnectedCallback(): void;
@@ -33,8 +35,8 @@ export declare class ExpandedDatePicker extends LitElement {
      */
     private applyBtnClicked;
     /**
-     * Closes the modal associated with this component (if it exists) and removes the
-     * corresponding class from it.
+     * Closes the modal associated with this component (if it exists) and dispatches a
+     * modalClosed event.
      */
     private closeModal;
     static get styles(): CSSResultGroup;

package/dist/src/expanded-date-picker.js

@@ -1,6 +1,7 @@
 import { __decorate } from "tslib";
 import { css, html, LitElement } from 'lit';
 import { customElement, property } from 'lit/decorators.js';
+import { analyticsActions, analyticsCategories, } from './utils/analytics-events';
 let ExpandedDatePicker = class ExpandedDatePicker extends LitElement {
     constructor() {
         super(...arguments);
@@ -77,6 +78,7 @@ let ExpandedDatePicker = class ExpandedDatePicker extends LitElement {
      * When the Apply button is clicked, emit the current date range and close the modal.
      */
     applyBtnClicked() {
+        var _a;
         const event = new CustomEvent('histogramDateRangeApplied', {
             detail: {
                 minDate: this.minSelectedDate,
@@ -85,15 +87,21 @@ let ExpandedDatePicker = class ExpandedDatePicker extends LitElement {
         });
         this.dispatchEvent(event);
         this.closeModal();
+        (_a = this.analyticsHandler) === null || _a === void 0 ? void 0 : _a.sendEvent({
+            category: analyticsCategories.default,
+            action: analyticsActions.histogramChangedFromModal,
+            label: window.location.href,
+        });
     }
     /**
-     * Closes the modal associated with this component (if it exists) and removes the
-     * corresponding class from it.
+     * Closes the modal associated with this component (if it exists) and dispatches a
+     * modalClosed event.
      */
     closeModal() {
-        var _a, _b;
-        (_a = this.modalManager) === null || _a === void 0 ? void 0 : _a.closeModal();
-        (_b = this.modalManager) === null || _b === void 0 ? void 0 : _b.classList.remove('expanded-date-picker');
+        if (this.modalManager) {
+            this.modalManager.closeModal();
+            this.dispatchEvent(new CustomEvent('modalClosed'));
+        }
     }
     static get styles() {
         return css `
@@ -137,8 +145,11 @@ __decorate([
     property({ type: Array })
 ], ExpandedDatePicker.prototype, "buckets", void 0);
 __decorate([
-    property({ type: Object })
+    property({ type: Object, attribute: false })
 ], ExpandedDatePicker.prototype, "modalManager", void 0);
+__decorate([
+    property({ type: Object, attribute: false })
+], ExpandedDatePicker.prototype, "analyticsHandler", void 0);
 ExpandedDatePicker = __decorate([
     customElement('expanded-date-picker')
 ], ExpandedDatePicker);

package/dist/src/expanded-date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"expanded-date-picker.js","sourceRoot":"","sources":["../../src/expanded-date-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, CSSResultGroup, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\n\n@customElement('expanded-date-picker')\nexport class ExpandedDatePicker extends LitElement {\n  @property({ type: String }) minDate?: string;\n\n  @property({ type: String }) maxDate?: string;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Array }) buckets?: number[];\n\n  @property({ type: Object }) modalManager?: ModalManagerInterface;\n\n  render(): TemplateResult {\n    return html`\n      <div id=\"container\">\n        <histogram-date-range\n          id=\"date-picker\"\n          .minDate=${this.minDate}\n          .maxDate=${this.maxDate}\n          .minSelectedDate=${this.minSelectedDate ?? this.minDate}\n          .maxSelectedDate=${this.maxSelectedDate ?? this.maxDate}\n          .updateDelay=${0}\n          updateWhileFocused\n          missingDataMessage=\"...\"\n          .width=${560}\n          .height=${120}\n          .bins=${this.buckets}\n          @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n        >\n          <button\n            id=\"apply-btn\"\n            slot=\"inputs-right-side\"\n            @click=${this.applyBtnClicked}\n          >\n            Apply date range\n          </button>\n        </histogram-date-range>\n      </div>\n    `;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback?.();\n    this.setupEscapeListener();\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback?.();\n    this.removeEscapeListener();\n  }\n\n  /**\n   * Add an event listener to close the date picker modal when the Esc key is pressed\n   */\n  private setupEscapeListener() {\n    document.addEventListener('keydown', this.boundEscapeListener);\n  }\n\n  /**\n   * Remove the Esc key listener that was previously added\n   */\n  private removeEscapeListener() {\n    document.removeEventListener('keydown', this.boundEscapeListener);\n  }\n\n  /**\n   * Closes the modal dialog if the given event is pressing the Esc key.\n   * Arrow function to ensure `this` remains bound to the current component.\n   */\n  private boundEscapeListener = (e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      this.closeModal();\n    }\n  };\n\n  /**\n   * When the histogram is updated, keep track of the newly selected date range.\n   * We don't commit to the new range until the apply button is clicked.\n   */\n  private histogramDateRangeUpdated(\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ): void {\n    this.minSelectedDate = e.detail.minDate;\n    this.maxSelectedDate = e.detail.maxDate;\n  }\n\n  /**\n   * When the Apply button is clicked, emit the current date range and close the modal.\n   */\n  private applyBtnClicked(): void {\n    const event = new CustomEvent('histogramDateRangeApplied', {\n      detail: {\n        minDate: this.minSelectedDate,\n        maxDate: this.maxSelectedDate,\n      },\n    });\n    this.dispatchEvent(event);\n    this.closeModal();\n  }\n\n  /**\n   * Closes the modal associated with this component (if it exists) and removes the\n   * corresponding class from it.\n   */\n  private closeModal(): void {\n    this.modalManager?.closeModal();\n    this.modalManager?.classList.remove('expanded-date-picker');\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      #container {\n        display: flex;\n        justify-content: center;\n        padding: 40px 10px 10px;\n        overflow: hidden;\n      }\n\n      #date-picker {\n        --histogramDateRangeInputWidth: 50px;\n        --histogramDateRangeInputRowMargin: 5px 0 0 0;\n      }\n\n      #apply-btn {\n        margin: 0 0 0 5px;\n        padding: 8px 10px;\n        border: 0;\n        border-radius: 4px;\n        background: var(--primaryButtonBGColor, #194880);\n        color: white;\n        cursor: pointer;\n      }\n    `;\n  }\n}\n"]}
+{"version":3,"file":"expanded-date-picker.js","sourceRoot":"","sources":["../../src/expanded-date-picker.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, CSSResultGroup, TemplateResult } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport type { ModalManagerInterface } from '@internetarchive/modal-manager';\nimport type { AnalyticsManagerInterface } from '@internetarchive/analytics-manager';\nimport {\n  analyticsActions,\n  analyticsCategories,\n} from './utils/analytics-events';\n\n@customElement('expanded-date-picker')\nexport class ExpandedDatePicker extends LitElement {\n  @property({ type: String }) minDate?: string;\n\n  @property({ type: String }) maxDate?: string;\n\n  @property({ type: String }) minSelectedDate?: string;\n\n  @property({ type: String }) maxSelectedDate?: string;\n\n  @property({ type: Array }) buckets?: number[];\n\n  @property({ type: Object, attribute: false })\n  modalManager?: ModalManagerInterface;\n\n  @property({ type: Object, attribute: false })\n  analyticsHandler?: AnalyticsManagerInterface;\n\n  render(): TemplateResult {\n    return html`\n      <div id=\"container\">\n        <histogram-date-range\n          id=\"date-picker\"\n          .minDate=${this.minDate}\n          .maxDate=${this.maxDate}\n          .minSelectedDate=${this.minSelectedDate ?? this.minDate}\n          .maxSelectedDate=${this.maxSelectedDate ?? this.maxDate}\n          .updateDelay=${0}\n          updateWhileFocused\n          missingDataMessage=\"...\"\n          .width=${560}\n          .height=${120}\n          .bins=${this.buckets}\n          @histogramDateRangeUpdated=${this.histogramDateRangeUpdated}\n        >\n          <button\n            id=\"apply-btn\"\n            slot=\"inputs-right-side\"\n            @click=${this.applyBtnClicked}\n          >\n            Apply date range\n          </button>\n        </histogram-date-range>\n      </div>\n    `;\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback?.();\n    this.setupEscapeListener();\n  }\n\n  disconnectedCallback(): void {\n    super.disconnectedCallback?.();\n    this.removeEscapeListener();\n  }\n\n  /**\n   * Add an event listener to close the date picker modal when the Esc key is pressed\n   */\n  private setupEscapeListener() {\n    document.addEventListener('keydown', this.boundEscapeListener);\n  }\n\n  /**\n   * Remove the Esc key listener that was previously added\n   */\n  private removeEscapeListener() {\n    document.removeEventListener('keydown', this.boundEscapeListener);\n  }\n\n  /**\n   * Closes the modal dialog if the given event is pressing the Esc key.\n   * Arrow function to ensure `this` remains bound to the current component.\n   */\n  private boundEscapeListener = (e: KeyboardEvent) => {\n    if (e.key === 'Escape') {\n      this.closeModal();\n    }\n  };\n\n  /**\n   * When the histogram is updated, keep track of the newly selected date range.\n   * We don't commit to the new range until the apply button is clicked.\n   */\n  private histogramDateRangeUpdated(\n    e: CustomEvent<{\n      minDate: string;\n      maxDate: string;\n    }>\n  ): void {\n    this.minSelectedDate = e.detail.minDate;\n    this.maxSelectedDate = e.detail.maxDate;\n  }\n\n  /**\n   * When the Apply button is clicked, emit the current date range and close the modal.\n   */\n  private applyBtnClicked(): void {\n    const event = new CustomEvent('histogramDateRangeApplied', {\n      detail: {\n        minDate: this.minSelectedDate,\n        maxDate: this.maxSelectedDate,\n      },\n    });\n    this.dispatchEvent(event);\n    this.closeModal();\n\n    this.analyticsHandler?.sendEvent({\n      category: analyticsCategories.default,\n      action: analyticsActions.histogramChangedFromModal,\n      label: window.location.href,\n    });\n  }\n\n  /**\n   * Closes the modal associated with this component (if it exists) and dispatches a\n   * modalClosed event.\n   */\n  private closeModal(): void {\n    if (this.modalManager) {\n      this.modalManager.closeModal();\n      this.dispatchEvent(new CustomEvent('modalClosed'));\n    }\n  }\n\n  static get styles(): CSSResultGroup {\n    return css`\n      #container {\n        display: flex;\n        justify-content: center;\n        padding: 40px 10px 10px;\n        overflow: hidden;\n      }\n\n      #date-picker {\n        --histogramDateRangeInputWidth: 50px;\n        --histogramDateRangeInputRowMargin: 5px 0 0 0;\n      }\n\n      #apply-btn {\n        margin: 0 0 0 5px;\n        padding: 8px 10px;\n        border: 0;\n        border-radius: 4px;\n        background: var(--primaryButtonBGColor, #194880);\n        color: white;\n        cursor: pointer;\n      }\n    `;\n  }\n}\n"]}

package/dist/src/utils/analytics-events.d.ts

@@ -14,6 +14,8 @@ export declare enum analyticsActions {
     facetNegativeSelected = "facetNegativeSelected",
     facetNegativeDeselected = "facetNegativeDeselected",
     histogramChanged = "histogramChanged",
+    histogramChangedFromModal = "histogramChangedFromModal",
+    histogramExpanded = "histogramExpanded",
     resultSelected = "resultSelected",
     moreFacetsPageChange = "moreFacetsPageChange",
     showMoreFacetsModal = "showMoreFacetsModal",

package/dist/src/utils/analytics-events.js

@@ -16,6 +16,8 @@ export var analyticsActions;
     analyticsActions["facetNegativeSelected"] = "facetNegativeSelected";
     analyticsActions["facetNegativeDeselected"] = "facetNegativeDeselected";
     analyticsActions["histogramChanged"] = "histogramChanged";
+    analyticsActions["histogramChangedFromModal"] = "histogramChangedFromModal";
+    analyticsActions["histogramExpanded"] = "histogramExpanded";
     analyticsActions["resultSelected"] = "resultSelected";
     analyticsActions["moreFacetsPageChange"] = "moreFacetsPageChange";
     analyticsActions["showMoreFacetsModal"] = "showMoreFacetsModal";

package/dist/src/utils/analytics-events.js.map

@@ -1 +1 @@
-{"version":3,"file":"analytics-events.js","sourceRoot":"","sources":["../../../src/utils/analytics-events.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,CAAN,IAAY,mBAEX;AAFD,WAAY,mBAAmB;IAC7B,qDAA8B,CAAA;AAChC,CAAC,EAFW,mBAAmB,KAAnB,mBAAmB,QAE9B;AAED,MAAM,CAAN,IAAY,gBAeX;AAfD,WAAY,gBAAgB;IAC1B,qCAAiB,CAAA;IACjB,uDAAmC,CAAA;IACnC,mDAA+B,CAAA;IAC/B,+CAA2B,CAAA;IAC3B,mDAA+B,CAAA;IAC/B,uDAAmC,CAAA;IACnC,mEAA+C,CAAA;IAC/C,uEAAmD,CAAA;IACnD,yDAAqC,CAAA;IACrC,qDAAiC,CAAA;IACjC,iEAA6C,CAAA;IAC7C,+DAA2C,CAAA;IAC3C,iEAA6C,CAAA;IAC7C,iEAA6C,CAAA;AAC/C,CAAC,EAfW,gBAAgB,KAAhB,gBAAgB,QAe3B","sourcesContent":["/**\n * Analytics categories and events. Used when building actions in\n */\nexport enum analyticsCategories {\n  default = 'collection-browser',\n}\n\nexport enum analyticsActions {\n  sortBy = 'sortBy',\n  filterByCreator = 'filterByCreator',\n  filterByTitle = 'filterByTitle',\n  displayMode = 'displayMode',\n  facetSelected = 'facetSelected',\n  facetDeselected = 'facetDeselected',\n  facetNegativeSelected = 'facetNegativeSelected',\n  facetNegativeDeselected = 'facetNegativeDeselected',\n  histogramChanged = 'histogramChanged',\n  resultSelected = 'resultSelected',\n  moreFacetsPageChange = 'moreFacetsPageChange',\n  showMoreFacetsModal = 'showMoreFacetsModal',\n  closeMoreFacetsModal = 'closeMoreFacetsModal',\n  applyMoreFacetsModal = 'applyMoreFacetsModal',\n}\n"]}
+{"version":3,"file":"analytics-events.js","sourceRoot":"","sources":["../../../src/utils/analytics-events.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,CAAN,IAAY,mBAEX;AAFD,WAAY,mBAAmB;IAC7B,qDAA8B,CAAA;AAChC,CAAC,EAFW,mBAAmB,KAAnB,mBAAmB,QAE9B;AAED,MAAM,CAAN,IAAY,gBAiBX;AAjBD,WAAY,gBAAgB;IAC1B,qCAAiB,CAAA;IACjB,uDAAmC,CAAA;IACnC,mDAA+B,CAAA;IAC/B,+CAA2B,CAAA;IAC3B,mDAA+B,CAAA;IAC/B,uDAAmC,CAAA;IACnC,mEAA+C,CAAA;IAC/C,uEAAmD,CAAA;IACnD,yDAAqC,CAAA;IACrC,2EAAuD,CAAA;IACvD,2DAAuC,CAAA;IACvC,qDAAiC,CAAA;IACjC,iEAA6C,CAAA;IAC7C,+DAA2C,CAAA;IAC3C,iEAA6C,CAAA;IAC7C,iEAA6C,CAAA;AAC/C,CAAC,EAjBW,gBAAgB,KAAhB,gBAAgB,QAiB3B","sourcesContent":["/**\n * Analytics categories and events. Used when building actions in\n */\nexport enum analyticsCategories {\n  default = 'collection-browser',\n}\n\nexport enum analyticsActions {\n  sortBy = 'sortBy',\n  filterByCreator = 'filterByCreator',\n  filterByTitle = 'filterByTitle',\n  displayMode = 'displayMode',\n  facetSelected = 'facetSelected',\n  facetDeselected = 'facetDeselected',\n  facetNegativeSelected = 'facetNegativeSelected',\n  facetNegativeDeselected = 'facetNegativeDeselected',\n  histogramChanged = 'histogramChanged',\n  histogramChangedFromModal = 'histogramChangedFromModal',\n  histogramExpanded = 'histogramExpanded',\n  resultSelected = 'resultSelected',\n  moreFacetsPageChange = 'moreFacetsPageChange',\n  showMoreFacetsModal = 'showMoreFacetsModal',\n  closeMoreFacetsModal = 'closeMoreFacetsModal',\n  applyMoreFacetsModal = 'applyMoreFacetsModal',\n}\n"]}

package/dist/test/collection-facets.test.js

@@ -6,6 +6,7 @@ import { Aggregation } from '@internetarchive/search-service';
 import { ModalManager, } from '@internetarchive/modal-manager';
 import '@internetarchive/modal-manager';
 import '../src/collection-facets';
+import { getDefaultSelectedFacets, } from '../src/models';
 import { MockAnalyticsHandler } from './mocks/mock-analytics-handler';
 describe('Collection Facets', () => {
     it('has loader', async () => {
@@ -389,6 +390,113 @@ describe('Collection Facets', () => {
         const moreLink = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.more-link');
         expect(moreLink).not.to.exist;
     });
+    it('always renders the mediatype:collection facet when present', async () => {
+        var _a, _b, _c;
+        const el = await fixture(html `<collection-facets></collection-facets>`);
+        const aggs = {
+            mediatype: new Aggregation({
+                buckets: [
+                    {
+                        key: 'texts',
+                        doc_count: 10000,
+                    },
+                    {
+                        key: 'image',
+                        doc_count: 9000,
+                    },
+                    {
+                        key: 'audio',
+                        doc_count: 8000,
+                    },
+                    {
+                        key: 'movies',
+                        doc_count: 7000,
+                    },
+                    {
+                        key: 'software',
+                        doc_count: 6000,
+                    },
+                    {
+                        key: 'data',
+                        doc_count: 5000,
+                    },
+                    {
+                        key: 'etree',
+                        doc_count: 4000,
+                    },
+                    {
+                        key: 'collection',
+                        doc_count: 1,
+                    },
+                ],
+            }),
+        };
+        el.aggregations = aggs;
+        await el.updateComplete;
+        const facetsTemplate = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('facets-template');
+        const facetTitles = (_b = facetsTemplate === null || facetsTemplate === void 0 ? void 0 : facetsTemplate.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('.facet-title');
+        expect(facetTitles === null || facetTitles === void 0 ? void 0 : facetTitles.length).to.equal(6);
+        expect((_c = facetTitles === null || facetTitles === void 0 ? void 0 : facetTitles.item(5)) === null || _c === void 0 ? void 0 : _c.textContent).to.equal('collection');
+    });
+    it('renders the mediatype:collection facet even when >=6 other mediatypes are selected', async () => {
+        var _a, _b, _c;
+        const el = await fixture(html `<collection-facets></collection-facets>`);
+        const aggs = {
+            mediatype: new Aggregation({
+                buckets: [
+                    {
+                        key: 'texts',
+                        doc_count: 10000,
+                    },
+                    {
+                        key: 'image',
+                        doc_count: 9000,
+                    },
+                    {
+                        key: 'audio',
+                        doc_count: 8000,
+                    },
+                    {
+                        key: 'movies',
+                        doc_count: 7000,
+                    },
+                    {
+                        key: 'software',
+                        doc_count: 6000,
+                    },
+                    {
+                        key: 'data',
+                        doc_count: 5000,
+                    },
+                    {
+                        key: 'etree',
+                        doc_count: 4000,
+                    },
+                    {
+                        key: 'collection',
+                        doc_count: 1,
+                    },
+                ],
+            }),
+        };
+        const selectedFacets = getDefaultSelectedFacets();
+        selectedFacets.mediatype = {
+            texts: { key: 'texts', count: 10000, state: 'selected' },
+            image: { key: 'image', count: 9000, state: 'selected' },
+            audio: { key: 'audio', count: 8000, state: 'selected' },
+            movies: { key: 'movies', count: 7000, state: 'selected' },
+            software: { key: 'software', count: 6000, state: 'selected' },
+            data: { key: 'data', count: 5000, state: 'selected' },
+            etree: { key: 'etree', count: 4000, state: 'selected' },
+        };
+        el.aggregations = aggs;
+        el.selectedFacets = selectedFacets;
+        await el.updateComplete;
+        const facetsTemplate = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('facets-template');
+        const facetTitles = (_b = facetsTemplate === null || facetsTemplate === void 0 ? void 0 : facetsTemplate.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('.facet-title');
+        expect(facetTitles === null || facetTitles === void 0 ? void 0 : facetTitles.length).to.equal(8);
+        expect((_c = facetTitles === null || facetTitles === void 0 ? void 0 : facetTitles.item(7)) === null || _c === void 0 ? void 0 : _c.textContent).to.equal('collection');
+    });
     describe('More Facets', () => {
         it('Does not render < allowedFacetCount', async () => {
             var _a;
@@ -518,5 +626,29 @@ describe('Collection Facets', () => {
         expect(mockAnalyticsHandler.callAction).to.equal('showMoreFacetsModal');
         expect(mockAnalyticsHandler.callLabel).to.equal('subject');
     });
+    it('fires analytics on expanding date picker', async () => {
+        var _a;
+        const mockAnalyticsHandler = new MockAnalyticsHandler();
+        const el = await fixture(html `<collection-facets
+        .analyticsHandler=${mockAnalyticsHandler}
+      ></collection-facets>`);
+        el.fullYearAggregationLoading = false;
+        el.showHistogramDatePicker = true;
+        el.allowExpandingDatePicker = true;
+        el.fullYearsHistogramAggregation = new Aggregation({
+            buckets: [1, 2, 3],
+            first_bucket_key: 0,
+            last_bucket_key: 2,
+        });
+        await el.updateComplete;
+        const expandBtn = (_a = el.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.expand-date-picker-btn');
+        expect(expandBtn).to.exist;
+        // Click the expand button to open the modal
+        expandBtn === null || expandBtn === void 0 ? void 0 : expandBtn.click();
+        await el.updateComplete;
+        expect(mockAnalyticsHandler.callCategory).to.equal('collection-browser');
+        expect(mockAnalyticsHandler.callAction).to.equal('histogramExpanded');
+        expect(mockAnalyticsHandler.callLabel).to.equal(window.location.href);
+    });
 });
 //# sourceMappingURL=collection-facets.test.js.map