@internetarchive/collection-browser 2.19.1-alpha-webdev7818.0 → 2.20.1-alpha-webdev7822.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/dist/src/app-root.js +606 -605
  2. package/dist/src/app-root.js.map +1 -1
  3. package/dist/src/collection-browser.d.ts +5 -0
  4. package/dist/src/collection-browser.js +36 -11
  5. package/dist/src/collection-browser.js.map +1 -1
  6. package/dist/src/collection-facets/smart-facets/smart-facet-bar.js +75 -75
  7. package/dist/src/collection-facets/smart-facets/smart-facet-bar.js.map +1 -1
  8. package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js +54 -54
  9. package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js.map +1 -1
  10. package/dist/src/collection-facets.js +263 -263
  11. package/dist/src/collection-facets.js.map +1 -1
  12. package/dist/src/expanded-date-picker.js +52 -52
  13. package/dist/src/expanded-date-picker.js.map +1 -1
  14. package/dist/src/models.d.ts +13 -0
  15. package/dist/src/models.js +41 -0
  16. package/dist/src/models.js.map +1 -1
  17. package/dist/src/sort-filter-bar/sort-filter-bar.d.ts +79 -24
  18. package/dist/src/sort-filter-bar/sort-filter-bar.js +201 -119
  19. package/dist/src/sort-filter-bar/sort-filter-bar.js.map +1 -1
  20. package/dist/src/tiles/grid/item-tile.js +139 -139
  21. package/dist/src/tiles/grid/item-tile.js.map +1 -1
  22. package/dist/src/tiles/grid/styles/tile-grid-shared-styles.js +118 -118
  23. package/dist/src/tiles/grid/styles/tile-grid-shared-styles.js.map +1 -1
  24. package/dist/src/tiles/list/tile-list.js +289 -289
  25. package/dist/src/tiles/list/tile-list.js.map +1 -1
  26. package/dist/src/tiles/tile-dispatcher.js +200 -200
  27. package/dist/src/tiles/tile-dispatcher.js.map +1 -1
  28. package/dist/test/sort-filter-bar/sort-filter-bar.test.js +157 -11
  29. package/dist/test/sort-filter-bar/sort-filter-bar.test.js.map +1 -1
  30. package/package.json +1 -1
  31. package/src/app-root.ts +1140 -1140
  32. package/src/collection-browser.ts +38 -10
  33. package/src/collection-facets/smart-facets/smart-facet-bar.ts +437 -437
  34. package/src/collection-facets/smart-facets/smart-facet-dropdown.ts +185 -185
  35. package/src/collection-facets.ts +990 -990
  36. package/src/expanded-date-picker.ts +191 -191
  37. package/src/models.ts +48 -0
  38. package/src/sort-filter-bar/sort-filter-bar.ts +220 -126
  39. package/src/tiles/grid/item-tile.ts +339 -339
  40. package/src/tiles/grid/styles/tile-grid-shared-styles.ts +129 -129
  41. package/src/tiles/list/tile-list.ts +688 -688
  42. package/src/tiles/tile-dispatcher.ts +486 -486
  43. package/test/sort-filter-bar/sort-filter-bar.test.ts +205 -12
  44. package/tsconfig.json +1 -1
package/dist/src/collection-facets/smart-facets/smart-facet-bar.js CHANGED
@@ -33,14 +33,14 @@ let SmartFacetBar = class SmartFacetBar extends LitElement {
33
33
  if (!this.query)
34
34
  return nothing;
35
35
  const shouldShowLabel = !!this.label && this.smartFacets.length > 0;
36
- return html `
37
- <div id="smart-facets-container">
38
- ${this.filtersToggleTemplate}
36
+ return html `
37
+ <div id="smart-facets-container">
38
+ ${this.filtersToggleTemplate}
39
39
  ${shouldShowLabel
40
40
  ? html `<p id="filters-label">${this.label}</p>`
41
- : nothing}
42
- ${repeat(this.smartFacets, f => `${f[0].label}|${f[0].facets[0].facetType}|${f[0].facets[0].bucketKey}`, facet => this.makeSmartFacet(facet))}
43
- </div>
41
+ : nothing}
42
+ ${repeat(this.smartFacets, f => `${f[0].label}|${f[0].facets[0].facetType}|${f[0].facets[0].bucketKey}`, facet => this.makeSmartFacet(facet))}
43
+ </div>
44
44
  `;
45
45
  }
46
46
  willUpdate(changed) {
@@ -99,38 +99,38 @@ let SmartFacetBar = class SmartFacetBar extends LitElement {
99
99
  }
100
100
  smartFacetButton(facet) {
101
101
  var _a;
102
- return html `
103
- <smart-facet-button
104
- .facetInfo=${facet}
105
- .labelPrefix=${fieldPrefixes[facet.facets[0].facetType]}
106
- .selected=${(_a = facet.selected) !== null && _a !== void 0 ? _a : false}
107
- @facetClick=${this.facetClicked}
108
- ></smart-facet-button>
102
+ return html `
103
+ <smart-facet-button
104
+ .facetInfo=${facet}
105
+ .labelPrefix=${fieldPrefixes[facet.facets[0].facetType]}
106
+ .selected=${(_a = facet.selected) !== null && _a !== void 0 ? _a : false}
107
+ @facetClick=${this.facetClicked}
108
+ ></smart-facet-button>
109
109
  `;
110
110
  }
111
111
  smartFacetDropdown(facets) {
112
- return html `
113
- <smart-facet-dropdown
114
- .facetInfo=${facets}
115
- .labelPrefix=${fieldPrefixes[facets[0].facets[0].facetType]}
116
- .activeFacetRef=${facets[0].facets[0]}
117
- @facetClick=${this.dropdownOptionClicked}
118
- @dropdownClick=${this.dropdownClicked}
119
- ></smart-facet-dropdown>
112
+ return html `
113
+ <smart-facet-dropdown
114
+ .facetInfo=${facets}
115
+ .labelPrefix=${fieldPrefixes[facets[0].facets[0].facetType]}
116
+ .activeFacetRef=${facets[0].facets[0]}
117
+ @facetClick=${this.dropdownOptionClicked}
118
+ @dropdownClick=${this.dropdownClicked}
119
+ ></smart-facet-dropdown>
120
120
  `;
121
121
  }
122
122
  get filtersToggleTemplate() {
123
123
  if (!this.filterToggleShown)
124
124
  return nothing;
125
- return html `
126
- <button
127
- id="filters-toggle"
128
- class=${this.filterToggleActive ? 'active' : ''}
129
- title="${this.filterToggleActive ? 'Hide' : 'Show'} filters pane"
130
- @click=${this.filterToggleClicked}
131
- >
132
- ${filterIcon}
133
- </button>
125
+ return html `
126
+ <button
127
+ id="filters-toggle"
128
+ class=${this.filterToggleActive ? 'active' : ''}
129
+ title="${this.filterToggleActive ? 'Hide' : 'Show'} filters pane"
130
+ @click=${this.filterToggleClicked}
131
+ >
132
+ ${filterIcon}
133
+ </button>
134
134
  `;
135
135
  }
136
136
  get facetsToDisplay() {
@@ -298,51 +298,51 @@ let SmartFacetBar = class SmartFacetBar extends LitElement {
298
298
  // STYLES
299
299
  //
300
300
  static get styles() {
301
- return css `
302
- #smart-facets-container {
303
- display: flex;
304
- align-items: center;
305
- gap: 5px 10px;
306
- padding: 10px 0;
307
- white-space: nowrap;
308
- overflow: scroll hidden;
309
- scrollbar-width: none;
310
- }
311
-
312
- #filters-toggle {
313
- margin: 0;
314
- border: 0;
315
- padding: 5px 8px;
316
- border-radius: 5px;
317
- background: white;
318
- color: #2c2c2c;
319
- border: 1px solid #194880;
320
- font-size: 1.4rem;
321
- font-family: inherit;
322
- text-decoration: none;
323
- cursor: pointer;
324
- }
325
-
326
- #filters-toggle.active {
327
- background: #194880;
328
- color: white;
329
- }
330
-
331
- #filters-toggle > svg {
332
- width: 12px;
333
- filter: invert(0.16667);
334
- vertical-align: -1px;
335
- }
336
-
337
- #filters-toggle.active > svg {
338
- filter: invert(1);
339
- }
340
-
341
- #filters-label {
342
- font-size: 1.4rem;
343
- font-weight: var(--smartFacetLabelFontWeight, normal);
344
- margin: 0 -5px 0 0;
345
- }
301
+ return css `
302
+ #smart-facets-container {
303
+ display: flex;
304
+ align-items: center;
305
+ gap: 5px 10px;
306
+ padding: 10px 0;
307
+ white-space: nowrap;
308
+ overflow: scroll hidden;
309
+ scrollbar-width: none;
310
+ }
311
+
312
+ #filters-toggle {
313
+ margin: 0;
314
+ border: 0;
315
+ padding: 5px 8px;
316
+ border-radius: 5px;
317
+ background: white;
318
+ color: #2c2c2c;
319
+ border: 1px solid #194880;
320
+ font-size: 1.4rem;
321
+ font-family: inherit;
322
+ text-decoration: none;
323
+ cursor: pointer;
324
+ }
325
+
326
+ #filters-toggle.active {
327
+ background: #194880;
328
+ color: white;
329
+ }
330
+
331
+ #filters-toggle > svg {
332
+ width: 12px;
333
+ filter: invert(0.16667);
334
+ vertical-align: -1px;
335
+ }
336
+
337
+ #filters-toggle.active > svg {
338
+ filter: invert(1);
339
+ }
340
+
341
+ #filters-label {
342
+ font-size: 1.4rem;
343
+ font-weight: var(--smartFacetLabelFontWeight, normal);
344
+ margin: 0 -5px 0 0;
345
+ }
346
346
  `;
347
347
  }
348
348
  };
package/dist/src/collection-facets/smart-facets/smart-facet-bar.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"smart-facet-bar.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import {\r\n css,\r\n html,\r\n LitElement,\r\n TemplateResult,\r\n CSSResultGroup,\r\n nothing,\r\n PropertyValues,\r\n} from 'lit';\r\nimport { repeat } from 'lit/directives/repeat.js';\r\nimport { customElement, property, state } from 'lit/decorators.js';\r\nimport type { Aggregation, Bucket } from '@internetarchive/search-service';\r\nimport type { CollectionTitles } from '../../data-source/models';\r\nimport type {\r\n FacetEventDetails,\r\n FacetOption,\r\n FacetState,\r\n SelectedFacets,\r\n} from '../../models';\r\nimport { updateSelectedFacetBucket } from '../../utils/facet-utils';\r\nimport { SmartQueryHeuristicGroup } from './smart-facet-heuristics';\r\nimport type { SmartFacetDropdown } from './smart-facet-dropdown';\r\nimport type { SmartFacet, SmartFacetEvent } from './models';\r\nimport { smartFacetEquals } from './smart-facet-equals';\r\nimport { dedupe } from './dedupe';\r\nimport { log } from '../../utils/log';\r\nimport filterIcon from '../../assets/img/icons/filter';\r\n\r\nimport './smart-facet-button';\r\nimport './smart-facet-dropdown';\r\n\r\nconst fieldPrefixes: Partial<Record<FacetOption, string>> = {\r\n collection: 'Collection: ',\r\n creator: 'By: ',\r\n subject: 'About: ',\r\n};\r\n\r\nfunction capitalize(str: string) {\r\n return str.charAt(0).toUpperCase() + str.slice(1);\r\n}\r\n\r\n@customElement('smart-facet-bar')\r\nexport class SmartFacetBar extends LitElement {\r\n @property({ type: String }) query?: string;\r\n\r\n @property({ type: Object }) aggregations?: Record<string, Aggregation>;\r\n\r\n @property({ type: Object }) selectedFacets?: SelectedFacets;\r\n\r\n /** The map from collection identifiers to their titles */\r\n @property({ type: Object })\r\n collectionTitles?: CollectionTitles;\r\n\r\n @property({ type: Boolean }) filterToggleShown = false;\r\n\r\n @property({ type: Boolean }) filterToggleActive = false;\r\n\r\n @property({ type: String }) label?: string;\r\n\r\n @state() private heuristicRecs: SmartFacet[] = [];\r\n\r\n @state() private smartFacets: SmartFacet[][] = [];\r\n\r\n @state() private lastAggregations?: Record<string, Aggregation>;\r\n\r\n //\r\n // COMPONENT LIFECYCLE METHODS\r\n //\r\n\r\n render() {\r\n if (!this.query) return nothing;\r\n\r\n const shouldShowLabel = !!this.label && this.smartFacets.length > 0;\r\n return html`\r\n <div id=\"smart-facets-container\">\r\n ${this.filtersToggleTemplate}\r\n ${shouldShowLabel\r\n ? html`<p id=\"filters-label\">${this.label}</p>`\r\n : nothing}\r\n ${repeat(\r\n this.smartFacets,\r\n f =>\r\n `${f[0].label}|${f[0].facets[0].facetType}|${f[0].facets[0].bucketKey}`,\r\n facet => this.makeSmartFacet(facet),\r\n )}\r\n </div>\r\n `;\r\n }\r\n\r\n protected willUpdate(changed: PropertyValues): void {\r\n let shouldUpdateSmartFacets = false;\r\n\r\n if (changed.has('query')) {\r\n log('query change', changed.get('query'), this.query);\r\n this.lastAggregations = undefined;\r\n shouldUpdateSmartFacets = true;\r\n }\r\n\r\n if (\r\n changed.has('aggregations') &&\r\n !this.lastAggregations &&\r\n this.aggregations &&\r\n Object.keys(this.aggregations).length > 0\r\n ) {\r\n log('aggs change', changed.get('aggregations'), this.aggregations);\r\n this.lastAggregations = this.aggregations;\r\n shouldUpdateSmartFacets = true;\r\n }\r\n\r\n if (shouldUpdateSmartFacets) {\r\n log('should update smart facets, doing so...');\r\n this.updateSmartFacets();\r\n }\r\n }\r\n\r\n refresh(): void {\r\n this.lastAggregations = this.aggregations;\r\n this.updateSmartFacets();\r\n }\r\n\r\n deselectAll(): void {\r\n for (const sf of this.smartFacets) {\r\n for (const facet of sf) {\r\n facet.selected = false;\r\n }\r\n }\r\n this.requestUpdate();\r\n }\r\n\r\n private async updateSmartFacets(): Promise<void> {\r\n log('updating smart facets');\r\n if (this.query) {\r\n this.heuristicRecs =\r\n await new SmartQueryHeuristicGroup().getRecommendedFacets(this.query);\r\n log('heuristic recs are', this.heuristicRecs);\r\n this.smartFacets = dedupe(this.facetsToDisplay);\r\n log('smart facets are', this.smartFacets);\r\n }\r\n }\r\n\r\n //\r\n // OTHER METHODS\r\n //\r\n\r\n private makeSmartFacet(facets: SmartFacet[]) {\r\n if (facets.length === 0) {\r\n return nothing;\r\n }\r\n if (facets.length === 1) {\r\n return this.smartFacetButton(facets[0]);\r\n }\r\n return this.smartFacetDropdown(facets);\r\n }\r\n\r\n private smartFacetButton(facet: SmartFacet) {\r\n return html`\r\n <smart-facet-button\r\n .facetInfo=${facet}\r\n .labelPrefix=${fieldPrefixes[facet.facets[0].facetType]}\r\n .selected=${facet.selected ?? false}\r\n @facetClick=${this.facetClicked}\r\n ></smart-facet-button>\r\n `;\r\n }\r\n\r\n private smartFacetDropdown(facets: SmartFacet[]) {\r\n return html`\r\n <smart-facet-dropdown\r\n .facetInfo=${facets}\r\n .labelPrefix=${fieldPrefixes[facets[0].facets[0].facetType]}\r\n .activeFacetRef=${facets[0].facets[0]}\r\n @facetClick=${this.dropdownOptionClicked}\r\n @dropdownClick=${this.dropdownClicked}\r\n ></smart-facet-dropdown>\r\n `;\r\n }\r\n\r\n private get filtersToggleTemplate(): TemplateResult | typeof nothing {\r\n if (!this.filterToggleShown) return nothing;\r\n\r\n return html`\r\n <button\r\n id=\"filters-toggle\"\r\n class=${this.filterToggleActive ? 'active' : ''}\r\n title=\"${this.filterToggleActive ? 'Hide' : 'Show'} filters pane\"\r\n @click=${this.filterToggleClicked}\r\n >\r\n ${filterIcon}\r\n </button>\r\n `;\r\n }\r\n\r\n private get facetsToDisplay(): SmartFacet[][] {\r\n const facets: SmartFacet[][] = [];\r\n\r\n if (this.heuristicRecs.length > 0) {\r\n for (const rec of this.heuristicRecs) {\r\n // Suppress mediatype-only facets for now.\r\n if (rec.facets.length === 1 && rec.facets[0].facetType === 'mediatype')\r\n continue;\r\n\r\n facets.push([rec]);\r\n }\r\n }\r\n\r\n if (this.lastAggregations) {\r\n const keys = [\r\n 'mediatype',\r\n 'year',\r\n 'language',\r\n 'creator',\r\n 'subject',\r\n 'collection',\r\n ];\r\n for (const key of keys) {\r\n const agg = this.lastAggregations[key];\r\n if (!agg) continue;\r\n if (agg.buckets.length === 0) continue;\r\n if (['lending', 'year_histogram', 'date_histogram'].includes(key))\r\n continue;\r\n if (typeof agg.buckets[0] === 'number') continue;\r\n\r\n if (\r\n key === 'mediatype' &&\r\n this.selectedFacets &&\r\n Object.values(this.selectedFacets.mediatype ?? {}).some(\r\n bucket => bucket.state !== 'none',\r\n )\r\n ) {\r\n continue;\r\n }\r\n\r\n const facetType = key as FacetOption;\r\n const buckets = agg.buckets as Bucket[];\r\n\r\n const unusedBuckets = buckets.filter(b => {\r\n const selectedFacetBucket = this.selectedFacets?.[facetType]?.[b.key];\r\n if (selectedFacetBucket && selectedFacetBucket.state !== 'none') {\r\n return false;\r\n }\r\n return true;\r\n });\r\n\r\n if (facetType === 'mediatype') {\r\n continue;\r\n // Don't include mediatype bubbles\r\n } else if (facetType === 'collection' || facetType === 'subject') {\r\n const topBuckets = unusedBuckets.slice(0, 5);\r\n facets.push(topBuckets.map(b => this.toSmartFacet(facetType, [b])));\r\n } else {\r\n facets.push([this.toSmartFacet(facetType, [unusedBuckets[0]])]);\r\n }\r\n }\r\n }\r\n\r\n return facets;\r\n }\r\n\r\n private toSmartFacet(\r\n facetType: FacetOption,\r\n buckets: Bucket[],\r\n // prefix = true\r\n ): SmartFacet {\r\n return {\r\n facets: buckets.map(bucket => {\r\n let displayText = capitalize(bucket.key.toString());\r\n if (facetType === 'collection') {\r\n const title = this.collectionTitles?.get(bucket.key.toString());\r\n if (title) displayText = title;\r\n }\r\n\r\n return {\r\n facetType,\r\n bucketKey: bucket.key.toString(),\r\n displayText,\r\n };\r\n }),\r\n } as SmartFacet;\r\n }\r\n\r\n /**\r\n * Toggles the state of the given smart facet, and updates the selected facets accordingly.\r\n */\r\n private toggleSmartFacet(\r\n facet: SmartFacet,\r\n details: FacetEventDetails[],\r\n ): void {\r\n let newState: FacetState;\r\n if (facet.selected) {\r\n // When deselected, leave the smart facet where it is\r\n newState = 'none';\r\n this.smartFacets = this.smartFacets.map(f => {\r\n if (f[0] === facet) return [{ ...facet, selected: false }];\r\n return f;\r\n });\r\n } else {\r\n // When selected, move the toggled smart facet to the front of the list\r\n newState = 'selected';\r\n this.smartFacets = [\r\n [{ ...facet, selected: true }],\r\n ...this.smartFacets.filter(f => f[0] !== facet),\r\n ];\r\n }\r\n\r\n this.updateSelectedFacets(\r\n details.map(facet => ({\r\n ...facet,\r\n bucket: {\r\n ...facet.bucket,\r\n state: newState,\r\n },\r\n })),\r\n );\r\n }\r\n\r\n /**\r\n * Updates the selected facet buckets for each of the given facets,\r\n * and emits a `facetsChanged` event to notify parent components of\r\n * the new state.\r\n */\r\n private updateSelectedFacets(facets: FacetEventDetails[]): void {\r\n for (const facet of facets) {\r\n this.selectedFacets = updateSelectedFacetBucket(\r\n this.selectedFacets,\r\n facet.facetType,\r\n facet.bucket,\r\n true,\r\n );\r\n }\r\n\r\n const event = new CustomEvent<SelectedFacets>('facetsChanged', {\r\n detail: this.selectedFacets,\r\n });\r\n this.dispatchEvent(event);\r\n }\r\n\r\n /**\r\n * Handler for when a smart facet button is clicked\r\n */\r\n private facetClicked(e: CustomEvent<SmartFacetEvent>): void {\r\n this.toggleSmartFacet(e.detail.smartFacet, e.detail.details);\r\n }\r\n\r\n /**\r\n * Handler for when an option in a smart facet dropdown menu is selected\r\n */\r\n private dropdownOptionClicked(e: CustomEvent<SmartFacetEvent>): void {\r\n const existingFacet = this.smartFacets.find(\r\n sf => sf.length === 1 && smartFacetEquals(sf[0], e.detail.smartFacet),\r\n );\r\n if (existingFacet) {\r\n // The facet already exists outside the dropdown, so just select it there\r\n this.toggleSmartFacet(existingFacet[0], e.detail.details);\r\n return;\r\n }\r\n\r\n // Otherwise, prepend a new smart facet for the selected option\r\n this.smartFacets = [\r\n [{ ...e.detail.smartFacet, selected: true }],\r\n ...this.smartFacets,\r\n ];\r\n\r\n this.updateSelectedFacets(e.detail.details);\r\n }\r\n\r\n /**\r\n * Handler for when any dropdown is clicked (whether button, caret, or menu item)\r\n */\r\n private dropdownClicked(e: CustomEvent<SmartFacetDropdown>): void {\r\n log('smart bar: onDropdownClick', e.detail);\r\n this.shadowRoot\r\n ?.querySelectorAll('smart-facet-dropdown')\r\n .forEach(dropdown => {\r\n if (dropdown !== e.detail) {\r\n log('closing', dropdown);\r\n (dropdown as SmartFacetDropdown).close();\r\n }\r\n });\r\n }\r\n\r\n private filterToggleClicked(): void {\r\n this.dispatchEvent(new CustomEvent('filtersToggled'));\r\n }\r\n\r\n //\r\n // STYLES\r\n //\r\n\r\n static get styles(): CSSResultGroup {\r\n return css`\r\n #smart-facets-container {\r\n display: flex;\r\n align-items: center;\r\n gap: 5px 10px;\r\n padding: 10px 0;\r\n white-space: nowrap;\r\n overflow: scroll hidden;\r\n scrollbar-width: none;\r\n }\r\n\r\n #filters-toggle {\r\n margin: 0;\r\n border: 0;\r\n padding: 5px 8px;\r\n border-radius: 5px;\r\n background: white;\r\n color: #2c2c2c;\r\n border: 1px solid #194880;\r\n font-size: 1.4rem;\r\n font-family: inherit;\r\n text-decoration: none;\r\n cursor: pointer;\r\n }\r\n\r\n #filters-toggle.active {\r\n background: #194880;\r\n color: white;\r\n }\r\n\r\n #filters-toggle > svg {\r\n width: 12px;\r\n filter: invert(0.16667);\r\n vertical-align: -1px;\r\n }\r\n\r\n #filters-toggle.active > svg {\r\n filter: invert(1);\r\n }\r\n\r\n #filters-label {\r\n font-size: 1.4rem;\r\n font-weight: var(--smartFacetLabelFontWeight, normal);\r\n margin: 0 -5px 0 0;\r\n }\r\n `;\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"smart-facet-bar.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-bar.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n css,\n html,\n LitElement,\n TemplateResult,\n CSSResultGroup,\n nothing,\n PropertyValues,\n} from 'lit';\nimport { repeat } from 'lit/directives/repeat.js';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport type { Aggregation, Bucket } from '@internetarchive/search-service';\nimport type { CollectionTitles } from '../../data-source/models';\nimport type {\n FacetEventDetails,\n FacetOption,\n FacetState,\n SelectedFacets,\n} from '../../models';\nimport { updateSelectedFacetBucket } from '../../utils/facet-utils';\nimport { SmartQueryHeuristicGroup } from './smart-facet-heuristics';\nimport type { SmartFacetDropdown } from './smart-facet-dropdown';\nimport type { SmartFacet, SmartFacetEvent } from './models';\nimport { smartFacetEquals } from './smart-facet-equals';\nimport { dedupe } from './dedupe';\nimport { log } from '../../utils/log';\nimport filterIcon from '../../assets/img/icons/filter';\n\nimport './smart-facet-button';\nimport './smart-facet-dropdown';\n\nconst fieldPrefixes: Partial<Record<FacetOption, string>> = {\n collection: 'Collection: ',\n creator: 'By: ',\n subject: 'About: ',\n};\n\nfunction capitalize(str: string) {\n return str.charAt(0).toUpperCase() + str.slice(1);\n}\n\n@customElement('smart-facet-bar')\nexport class SmartFacetBar extends LitElement {\n @property({ type: String }) query?: string;\n\n @property({ type: Object }) aggregations?: Record<string, Aggregation>;\n\n @property({ type: Object }) selectedFacets?: SelectedFacets;\n\n /** The map from collection identifiers to their titles */\n @property({ type: Object })\n collectionTitles?: CollectionTitles;\n\n @property({ type: Boolean }) filterToggleShown = false;\n\n @property({ type: Boolean }) filterToggleActive = false;\n\n @property({ type: String }) label?: string;\n\n @state() private heuristicRecs: SmartFacet[] = [];\n\n @state() private smartFacets: SmartFacet[][] = [];\n\n @state() private lastAggregations?: Record<string, Aggregation>;\n\n //\n // COMPONENT LIFECYCLE METHODS\n //\n\n render() {\n if (!this.query) return nothing;\n\n const shouldShowLabel = !!this.label && this.smartFacets.length > 0;\n return html`\n <div id=\"smart-facets-container\">\n ${this.filtersToggleTemplate}\n ${shouldShowLabel\n ? html`<p id=\"filters-label\">${this.label}</p>`\n : nothing}\n ${repeat(\n this.smartFacets,\n f =>\n `${f[0].label}|${f[0].facets[0].facetType}|${f[0].facets[0].bucketKey}`,\n facet => this.makeSmartFacet(facet),\n )}\n </div>\n `;\n }\n\n protected willUpdate(changed: PropertyValues): void {\n let shouldUpdateSmartFacets = false;\n\n if (changed.has('query')) {\n log('query change', changed.get('query'), this.query);\n this.lastAggregations = undefined;\n shouldUpdateSmartFacets = true;\n }\n\n if (\n changed.has('aggregations') &&\n !this.lastAggregations &&\n this.aggregations &&\n Object.keys(this.aggregations).length > 0\n ) {\n log('aggs change', changed.get('aggregations'), this.aggregations);\n this.lastAggregations = this.aggregations;\n shouldUpdateSmartFacets = true;\n }\n\n if (shouldUpdateSmartFacets) {\n log('should update smart facets, doing so...');\n this.updateSmartFacets();\n }\n }\n\n refresh(): void {\n this.lastAggregations = this.aggregations;\n this.updateSmartFacets();\n }\n\n deselectAll(): void {\n for (const sf of this.smartFacets) {\n for (const facet of sf) {\n facet.selected = false;\n }\n }\n this.requestUpdate();\n }\n\n private async updateSmartFacets(): Promise<void> {\n log('updating smart facets');\n if (this.query) {\n this.heuristicRecs =\n await new SmartQueryHeuristicGroup().getRecommendedFacets(this.query);\n log('heuristic recs are', this.heuristicRecs);\n this.smartFacets = dedupe(this.facetsToDisplay);\n log('smart facets are', this.smartFacets);\n }\n }\n\n //\n // OTHER METHODS\n //\n\n private makeSmartFacet(facets: SmartFacet[]) {\n if (facets.length === 0) {\n return nothing;\n }\n if (facets.length === 1) {\n return this.smartFacetButton(facets[0]);\n }\n return this.smartFacetDropdown(facets);\n }\n\n private smartFacetButton(facet: SmartFacet) {\n return html`\n <smart-facet-button\n .facetInfo=${facet}\n .labelPrefix=${fieldPrefixes[facet.facets[0].facetType]}\n .selected=${facet.selected ?? false}\n @facetClick=${this.facetClicked}\n ></smart-facet-button>\n `;\n }\n\n private smartFacetDropdown(facets: SmartFacet[]) {\n return html`\n <smart-facet-dropdown\n .facetInfo=${facets}\n .labelPrefix=${fieldPrefixes[facets[0].facets[0].facetType]}\n .activeFacetRef=${facets[0].facets[0]}\n @facetClick=${this.dropdownOptionClicked}\n @dropdownClick=${this.dropdownClicked}\n ></smart-facet-dropdown>\n `;\n }\n\n private get filtersToggleTemplate(): TemplateResult | typeof nothing {\n if (!this.filterToggleShown) return nothing;\n\n return html`\n <button\n id=\"filters-toggle\"\n class=${this.filterToggleActive ? 'active' : ''}\n title=\"${this.filterToggleActive ? 'Hide' : 'Show'} filters pane\"\n @click=${this.filterToggleClicked}\n >\n ${filterIcon}\n </button>\n `;\n }\n\n private get facetsToDisplay(): SmartFacet[][] {\n const facets: SmartFacet[][] = [];\n\n if (this.heuristicRecs.length > 0) {\n for (const rec of this.heuristicRecs) {\n // Suppress mediatype-only facets for now.\n if (rec.facets.length === 1 && rec.facets[0].facetType === 'mediatype')\n continue;\n\n facets.push([rec]);\n }\n }\n\n if (this.lastAggregations) {\n const keys = [\n 'mediatype',\n 'year',\n 'language',\n 'creator',\n 'subject',\n 'collection',\n ];\n for (const key of keys) {\n const agg = this.lastAggregations[key];\n if (!agg) continue;\n if (agg.buckets.length === 0) continue;\n if (['lending', 'year_histogram', 'date_histogram'].includes(key))\n continue;\n if (typeof agg.buckets[0] === 'number') continue;\n\n if (\n key === 'mediatype' &&\n this.selectedFacets &&\n Object.values(this.selectedFacets.mediatype ?? {}).some(\n bucket => bucket.state !== 'none',\n )\n ) {\n continue;\n }\n\n const facetType = key as FacetOption;\n const buckets = agg.buckets as Bucket[];\n\n const unusedBuckets = buckets.filter(b => {\n const selectedFacetBucket = this.selectedFacets?.[facetType]?.[b.key];\n if (selectedFacetBucket && selectedFacetBucket.state !== 'none') {\n return false;\n }\n return true;\n });\n\n if (facetType === 'mediatype') {\n continue;\n // Don't include mediatype bubbles\n } else if (facetType === 'collection' || facetType === 'subject') {\n const topBuckets = unusedBuckets.slice(0, 5);\n facets.push(topBuckets.map(b => this.toSmartFacet(facetType, [b])));\n } else {\n facets.push([this.toSmartFacet(facetType, [unusedBuckets[0]])]);\n }\n }\n }\n\n return facets;\n }\n\n private toSmartFacet(\n facetType: FacetOption,\n buckets: Bucket[],\n // prefix = true\n ): SmartFacet {\n return {\n facets: buckets.map(bucket => {\n let displayText = capitalize(bucket.key.toString());\n if (facetType === 'collection') {\n const title = this.collectionTitles?.get(bucket.key.toString());\n if (title) displayText = title;\n }\n\n return {\n facetType,\n bucketKey: bucket.key.toString(),\n displayText,\n };\n }),\n } as SmartFacet;\n }\n\n /**\n * Toggles the state of the given smart facet, and updates the selected facets accordingly.\n */\n private toggleSmartFacet(\n facet: SmartFacet,\n details: FacetEventDetails[],\n ): void {\n let newState: FacetState;\n if (facet.selected) {\n // When deselected, leave the smart facet where it is\n newState = 'none';\n this.smartFacets = this.smartFacets.map(f => {\n if (f[0] === facet) return [{ ...facet, selected: false }];\n return f;\n });\n } else {\n // When selected, move the toggled smart facet to the front of the list\n newState = 'selected';\n this.smartFacets = [\n [{ ...facet, selected: true }],\n ...this.smartFacets.filter(f => f[0] !== facet),\n ];\n }\n\n this.updateSelectedFacets(\n details.map(facet => ({\n ...facet,\n bucket: {\n ...facet.bucket,\n state: newState,\n },\n })),\n );\n }\n\n /**\n * Updates the selected facet buckets for each of the given facets,\n * and emits a `facetsChanged` event to notify parent components of\n * the new state.\n */\n private updateSelectedFacets(facets: FacetEventDetails[]): void {\n for (const facet of facets) {\n this.selectedFacets = updateSelectedFacetBucket(\n this.selectedFacets,\n facet.facetType,\n facet.bucket,\n true,\n );\n }\n\n const event = new CustomEvent<SelectedFacets>('facetsChanged', {\n detail: this.selectedFacets,\n });\n this.dispatchEvent(event);\n }\n\n /**\n * Handler for when a smart facet button is clicked\n */\n private facetClicked(e: CustomEvent<SmartFacetEvent>): void {\n this.toggleSmartFacet(e.detail.smartFacet, e.detail.details);\n }\n\n /**\n * Handler for when an option in a smart facet dropdown menu is selected\n */\n private dropdownOptionClicked(e: CustomEvent<SmartFacetEvent>): void {\n const existingFacet = this.smartFacets.find(\n sf => sf.length === 1 && smartFacetEquals(sf[0], e.detail.smartFacet),\n );\n if (existingFacet) {\n // The facet already exists outside the dropdown, so just select it there\n this.toggleSmartFacet(existingFacet[0], e.detail.details);\n return;\n }\n\n // Otherwise, prepend a new smart facet for the selected option\n this.smartFacets = [\n [{ ...e.detail.smartFacet, selected: true }],\n ...this.smartFacets,\n ];\n\n this.updateSelectedFacets(e.detail.details);\n }\n\n /**\n * Handler for when any dropdown is clicked (whether button, caret, or menu item)\n */\n private dropdownClicked(e: CustomEvent<SmartFacetDropdown>): void {\n log('smart bar: onDropdownClick', e.detail);\n this.shadowRoot\n ?.querySelectorAll('smart-facet-dropdown')\n .forEach(dropdown => {\n if (dropdown !== e.detail) {\n log('closing', dropdown);\n (dropdown as SmartFacetDropdown).close();\n }\n });\n }\n\n private filterToggleClicked(): void {\n this.dispatchEvent(new CustomEvent('filtersToggled'));\n }\n\n //\n // STYLES\n //\n\n static get styles(): CSSResultGroup {\n return css`\n #smart-facets-container {\n display: flex;\n align-items: center;\n gap: 5px 10px;\n padding: 10px 0;\n white-space: nowrap;\n overflow: scroll hidden;\n scrollbar-width: none;\n }\n\n #filters-toggle {\n margin: 0;\n border: 0;\n padding: 5px 8px;\n border-radius: 5px;\n background: white;\n color: #2c2c2c;\n border: 1px solid #194880;\n font-size: 1.4rem;\n font-family: inherit;\n text-decoration: none;\n cursor: pointer;\n }\n\n #filters-toggle.active {\n background: #194880;\n color: white;\n }\n\n #filters-toggle > svg {\n width: 12px;\n filter: invert(0.16667);\n vertical-align: -1px;\n }\n\n #filters-toggle.active > svg {\n filter: invert(1);\n }\n\n #filters-label {\n font-size: 1.4rem;\n font-weight: var(--smartFacetLabelFontWeight, normal);\n margin: 0 -5px 0 0;\n }\n `;\n }\n}\n"]}
package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js CHANGED
@@ -15,30 +15,30 @@ let SmartFacetDropdown = class SmartFacetDropdown extends LitElement {
15
15
  const displayText = (_a = this.activeFacetRef.displayText) !== null && _a !== void 0 ? _a : this.activeFacetRef.bucketKey;
16
16
  if (!displayText)
17
17
  return nothing;
18
- return html `
19
- <div class="dropdown-container">
20
- <ia-dropdown
21
- class="dropdown"
22
- displayCaret
23
- closeOnSelect
24
- closeOnEscape
25
- closeOnBackdropClick
26
- includeSelectedOption
27
- usePopover
28
- .options=${this.dropdownOptions}
29
- .selectedOption=${this.activeDropdownOption}
30
- .openViaButton=${false}
31
- @optionSelected=${this.optionSelected}
32
- @click=${this.onDropdownClick}
33
- >
34
- <span
35
- class="dropdown-label"
36
- slot="dropdown-label"
37
- @click=${this.defaultOptionSelected}
38
- >${(_b = this.labelPrefix) !== null && _b !== void 0 ? _b : nothing} ${displayText}</span
39
- >
40
- </ia-dropdown>
41
- </div>
18
+ return html `
19
+ <div class="dropdown-container">
20
+ <ia-dropdown
21
+ class="dropdown"
22
+ displayCaret
23
+ closeOnSelect
24
+ closeOnEscape
25
+ closeOnBackdropClick
26
+ includeSelectedOption
27
+ usePopover
28
+ .options=${this.dropdownOptions}
29
+ .selectedOption=${this.activeDropdownOption}
30
+ .openViaButton=${false}
31
+ @optionSelected=${this.optionSelected}
32
+ @click=${this.onDropdownClick}
33
+ >
34
+ <span
35
+ class="dropdown-label"
36
+ slot="dropdown-label"
37
+ @click=${this.defaultOptionSelected}
38
+ >${(_b = this.labelPrefix) !== null && _b !== void 0 ? _b : nothing} ${displayText}</span
39
+ >
40
+ </ia-dropdown>
41
+ </div>
42
42
  `;
43
43
  }
44
44
  //
@@ -51,8 +51,8 @@ let SmartFacetDropdown = class SmartFacetDropdown extends LitElement {
51
51
  const firstFacet = smartFacet.facets[0];
52
52
  return {
53
53
  id: firstFacet.bucketKey,
54
- label: html `<span>
55
- ${(_b = (_a = smartFacet.label) !== null && _a !== void 0 ? _a : firstFacet.displayText) !== null && _b !== void 0 ? _b : firstFacet.bucketKey}
54
+ label: html `<span>
55
+ ${(_b = (_a = smartFacet.label) !== null && _a !== void 0 ? _a : firstFacet.displayText) !== null && _b !== void 0 ? _b : firstFacet.bucketKey}
56
56
  </span>`,
57
57
  };
58
58
  })) !== null && _b !== void 0 ? _b : []);
@@ -122,34 +122,34 @@ let SmartFacetDropdown = class SmartFacetDropdown extends LitElement {
122
122
  // STYLES
123
123
  //
124
124
  static get styles() {
125
- return css `
126
- .dropdown-container {
127
- padding: 5px 5px;
128
- border-radius: 5px;
129
- background: white;
130
- color: #2c2c2c;
131
- border: 1px solid #194880;
132
- font-size: 1.4rem;
133
- font-family: inherit;
134
- }
135
-
136
- .dropdown-label {
137
- font-size: 1.4rem;
138
- font-family: inherit;
139
- }
140
-
141
- .dropdown {
142
- --dropdownBorderColor: #194880;
143
- --dropdownBorderWidth: 1px;
144
- --dropdownBgColor: white;
145
- --dropdownHoverBgColor: #f8f8f8;
146
- --dropdownTextColor: #2c2c2c;
147
- --dropdownHoverTextColor: #2c2c2c;
148
- --dropdownCaretColor: #2c2c2c;
149
- --dropdownWhiteSpace: nowrap;
150
- --caretWidth: 14px;
151
- --caretHeight: 14px;
152
- }
125
+ return css `
126
+ .dropdown-container {
127
+ padding: 5px 5px;
128
+ border-radius: 5px;
129
+ background: white;
130
+ color: #2c2c2c;
131
+ border: 1px solid #194880;
132
+ font-size: 1.4rem;
133
+ font-family: inherit;
134
+ }
135
+
136
+ .dropdown-label {
137
+ font-size: 1.4rem;
138
+ font-family: inherit;
139
+ }
140
+
141
+ .dropdown {
142
+ --dropdownBorderColor: #194880;
143
+ --dropdownBorderWidth: 1px;
144
+ --dropdownBgColor: white;
145
+ --dropdownHoverBgColor: #f8f8f8;
146
+ --dropdownTextColor: #2c2c2c;
147
+ --dropdownHoverTextColor: #2c2c2c;
148
+ --dropdownCaretColor: #2c2c2c;
149
+ --dropdownWhiteSpace: nowrap;
150
+ --caretWidth: 14px;
151
+ --caretHeight: 14px;
152
+ }
153
153
  `;
154
154
  }
155
155
  };
package/dist/src/collection-facets/smart-facets/smart-facet-dropdown.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"smart-facet-dropdown.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-dropdown.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, CSSResultGroup, nothing } from 'lit';\r\nimport { customElement, property, query } from 'lit/decorators.js';\r\nimport type { IaDropdown, optionInterface } from '@internetarchive/ia-dropdown';\r\nimport type { FacetRef, SmartFacet, SmartFacetEvent } from './models';\r\nimport { log } from '../../utils/log';\r\n\r\n@customElement('smart-facet-dropdown')\r\nexport class SmartFacetDropdown extends LitElement {\r\n @property({ type: Array }) facetInfo?: SmartFacet[];\r\n\r\n @property({ type: String }) labelPrefix?: string;\r\n\r\n @property({ type: Object }) activeFacetRef?: FacetRef;\r\n\r\n @query('ia-dropdown') dropdown?: IaDropdown;\r\n\r\n //\r\n // COMPONENT LIFECYCLE METHODS\r\n //\r\n\r\n render() {\r\n if (!this.facetInfo || !this.activeFacetRef) return nothing;\r\n if (this.facetInfo.length === 0) return nothing;\r\n\r\n const displayText =\r\n this.activeFacetRef.displayText ?? this.activeFacetRef.bucketKey;\r\n if (!displayText) return nothing;\r\n\r\n return html`\r\n <div class=\"dropdown-container\">\r\n <ia-dropdown\r\n class=\"dropdown\"\r\n displayCaret\r\n closeOnSelect\r\n closeOnEscape\r\n closeOnBackdropClick\r\n includeSelectedOption\r\n usePopover\r\n .options=${this.dropdownOptions}\r\n .selectedOption=${this.activeDropdownOption}\r\n .openViaButton=${false}\r\n @optionSelected=${this.optionSelected}\r\n @click=${this.onDropdownClick}\r\n >\r\n <span\r\n class=\"dropdown-label\"\r\n slot=\"dropdown-label\"\r\n @click=${this.defaultOptionSelected}\r\n >${this.labelPrefix ?? nothing} ${displayText}</span\r\n >\r\n </ia-dropdown>\r\n </div>\r\n `;\r\n }\r\n\r\n //\r\n // OTHER METHODS\r\n //\r\n\r\n private get dropdownOptions(): optionInterface[] {\r\n return (\r\n this.facetInfo?.map(smartFacet => {\r\n const firstFacet = smartFacet.facets[0];\r\n return {\r\n id: firstFacet.bucketKey,\r\n label: html`<span>\r\n ${smartFacet.label ??\r\n firstFacet.displayText ??\r\n firstFacet.bucketKey}\r\n </span>`,\r\n };\r\n }) ?? []\r\n );\r\n }\r\n\r\n private get activeDropdownOption(): optionInterface | undefined {\r\n if (!this.activeFacetRef) return undefined;\r\n return this.dropdownOptions.find(\r\n opt => opt.id === this.activeFacetRef?.bucketKey,\r\n );\r\n }\r\n\r\n /**\r\n * Handler for when the default option on the dropdown button is clicked\r\n */\r\n private defaultOptionSelected(): void {\r\n this.handleSelection(this.activeFacetRef?.bucketKey);\r\n }\r\n\r\n /**\r\n * Handler for when an option in the dropdown menu is selected\r\n */\r\n private optionSelected(e: CustomEvent<{ option: optionInterface }>): void {\r\n this.handleSelection(e.detail.option.id);\r\n }\r\n\r\n /**\r\n * Responds to a dropdown selection by emitting a `facetClick` event with\r\n * the appropriate facet details.\r\n */\r\n private handleSelection(bucketKey?: string): void {\r\n if (!bucketKey || !this.facetInfo || !this.activeFacetRef) return;\r\n\r\n let selectedSmartFacet;\r\n for (const smartFacet of this.facetInfo) {\r\n const selectedRef = smartFacet.facets.find(\r\n b => b.bucketKey === bucketKey,\r\n );\r\n if (selectedRef) {\r\n this.activeFacetRef = selectedRef;\r\n selectedSmartFacet = smartFacet;\r\n }\r\n }\r\n\r\n if (!selectedSmartFacet) return;\r\n\r\n this.dispatchEvent(\r\n new CustomEvent<SmartFacetEvent>('facetClick', {\r\n detail: {\r\n smartFacet: selectedSmartFacet,\r\n details: [\r\n {\r\n facetType: this.activeFacetRef.facetType,\r\n bucket: {\r\n key: this.activeFacetRef.bucketKey,\r\n count: 0,\r\n state: 'selected',\r\n },\r\n negative: false,\r\n },\r\n ],\r\n },\r\n }),\r\n );\r\n }\r\n\r\n private onDropdownClick(): void {\r\n log('smart dropdown: onDropdownClick', this);\r\n this.dispatchEvent(\r\n new CustomEvent<SmartFacetDropdown>('dropdownClick', { detail: this }),\r\n );\r\n }\r\n\r\n close(): void {\r\n if (this.dropdown) {\r\n this.dropdown.open = false;\r\n }\r\n }\r\n\r\n //\r\n // STYLES\r\n //\r\n\r\n static get styles(): CSSResultGroup {\r\n return css`\r\n .dropdown-container {\r\n padding: 5px 5px;\r\n border-radius: 5px;\r\n background: white;\r\n color: #2c2c2c;\r\n border: 1px solid #194880;\r\n font-size: 1.4rem;\r\n font-family: inherit;\r\n }\r\n\r\n .dropdown-label {\r\n font-size: 1.4rem;\r\n font-family: inherit;\r\n }\r\n\r\n .dropdown {\r\n --dropdownBorderColor: #194880;\r\n --dropdownBorderWidth: 1px;\r\n --dropdownBgColor: white;\r\n --dropdownHoverBgColor: #f8f8f8;\r\n --dropdownTextColor: #2c2c2c;\r\n --dropdownHoverTextColor: #2c2c2c;\r\n --dropdownCaretColor: #2c2c2c;\r\n --dropdownWhiteSpace: nowrap;\r\n --caretWidth: 14px;\r\n --caretHeight: 14px;\r\n }\r\n `;\r\n }\r\n}\r\n"]}
1
+ {"version":3,"file":"smart-facet-dropdown.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-dropdown.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,OAAO,EAAE,MAAM,KAAK,CAAC;AACrE,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAGnE,OAAO,EAAE,GAAG,EAAE,MAAM,iBAAiB,CAAC;AAG/B,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAShD,EAAE;IACF,8BAA8B;IAC9B,EAAE;IAEF,MAAM;;QACJ,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO,OAAO,CAAC;QAC5D,IAAI,IAAI,CAAC,SAAS,CAAC,MAAM,KAAK,CAAC;YAAE,OAAO,OAAO,CAAC;QAEhD,MAAM,WAAW,GACf,MAAA,IAAI,CAAC,cAAc,CAAC,WAAW,mCAAI,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC;QACnE,IAAI,CAAC,WAAW;YAAE,OAAO,OAAO,CAAC;QAEjC,OAAO,IAAI,CAAA;;;;;;;;;;qBAUM,IAAI,CAAC,eAAe;4BACb,IAAI,CAAC,oBAAoB;2BAC1B,KAAK;4BACJ,IAAI,CAAC,cAAc;mBAC5B,IAAI,CAAC,eAAe;;;;;qBAKlB,IAAI,CAAC,qBAAqB;eAChC,MAAA,IAAI,CAAC,WAAW,mCAAI,OAAO,IAAI,WAAW;;;;KAIpD,CAAC;IACJ,CAAC;IAED,EAAE;IACF,gBAAgB;IAChB,EAAE;IAEF,IAAY,eAAe;;QACzB,OAAO,CACL,MAAA,MAAA,IAAI,CAAC,SAAS,0CAAE,GAAG,CAAC,UAAU,CAAC,EAAE;;YAC/B,MAAM,UAAU,GAAG,UAAU,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;YACxC,OAAO;gBACL,EAAE,EAAE,UAAU,CAAC,SAAS;gBACxB,KAAK,EAAE,IAAI,CAAA;cACP,MAAA,MAAA,UAAU,CAAC,KAAK,mCAClB,UAAU,CAAC,WAAW,mCACtB,UAAU,CAAC,SAAS;kBACd;aACT,CAAC;QACJ,CAAC,CAAC,mCAAI,EAAE,CACT,CAAC;IACJ,CAAC;IAED,IAAY,oBAAoB;QAC9B,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO,SAAS,CAAC;QAC3C,OAAO,IAAI,CAAC,eAAe,CAAC,IAAI,CAC9B,GAAG,CAAC,EAAE,WAAC,OAAA,GAAG,CAAC,EAAE,MAAK,MAAA,IAAI,CAAC,cAAc,0CAAE,SAAS,CAAA,CAAA,EAAA,CACjD,CAAC;IACJ,CAAC;IAED;;OAEG;IACK,qBAAqB;;QAC3B,IAAI,CAAC,eAAe,CAAC,MAAA,IAAI,CAAC,cAAc,0CAAE,SAAS,CAAC,CAAC;IACvD,CAAC;IAED;;OAEG;IACK,cAAc,CAAC,CAA2C;QAChE,IAAI,CAAC,eAAe,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IAC3C,CAAC;IAED;;;OAGG;IACK,eAAe,CAAC,SAAkB;QACxC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,SAAS,IAAI,CAAC,IAAI,CAAC,cAAc;YAAE,OAAO;QAElE,IAAI,kBAAkB,CAAC;QACvB,KAAK,MAAM,UAAU,IAAI,IAAI,CAAC,SAAS,EAAE,CAAC;YACxC,MAAM,WAAW,GAAG,UAAU,CAAC,MAAM,CAAC,IAAI,CACxC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,KAAK,SAAS,CAC/B,CAAC;YACF,IAAI,WAAW,EAAE,CAAC;gBAChB,IAAI,CAAC,cAAc,GAAG,WAAW,CAAC;gBAClC,kBAAkB,GAAG,UAAU,CAAC;YAClC,CAAC;QACH,CAAC;QAED,IAAI,CAAC,kBAAkB;YAAE,OAAO;QAEhC,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAkB,YAAY,EAAE;YAC7C,MAAM,EAAE;gBACN,UAAU,EAAE,kBAAkB;gBAC9B,OAAO,EAAE;oBACP;wBACE,SAAS,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS;wBACxC,MAAM,EAAE;4BACN,GAAG,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS;4BAClC,KAAK,EAAE,CAAC;4BACR,KAAK,EAAE,UAAU;yBAClB;wBACD,QAAQ,EAAE,KAAK;qBAChB;iBACF;aACF;SACF,CAAC,CACH,CAAC;IACJ,CAAC;IAEO,eAAe;QACrB,GAAG,CAAC,iCAAiC,EAAE,IAAI,CAAC,CAAC;QAC7C,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAqB,eAAe,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CACvE,CAAC;IACJ,CAAC;IAED,KAAK;QACH,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,IAAI,CAAC,QAAQ,CAAC,IAAI,GAAG,KAAK,CAAC;QAC7B,CAAC;IACH,CAAC;IAED,EAAE;IACF,SAAS;IACT,EAAE;IAEF,MAAM,KAAK,MAAM;QACf,OAAO,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA4BT,CAAC;IACJ,CAAC;CACF,CAAA;AAhL4B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;qDAA0B;AAExB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;uDAAsB;AAErB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;0DAA2B;AAEhC;IAArB,KAAK,CAAC,aAAa,CAAC;oDAAuB;AAPjC,kBAAkB;IAD9B,aAAa,CAAC,sBAAsB,CAAC;GACzB,kBAAkB,CAiL9B","sourcesContent":["import { css, html, LitElement, CSSResultGroup, nothing } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport type { IaDropdown, optionInterface } from '@internetarchive/ia-dropdown';\nimport type { FacetRef, SmartFacet, SmartFacetEvent } from './models';\nimport { log } from '../../utils/log';\n\n@customElement('smart-facet-dropdown')\nexport class SmartFacetDropdown extends LitElement {\n @property({ type: Array }) facetInfo?: SmartFacet[];\n\n @property({ type: String }) labelPrefix?: string;\n\n @property({ type: Object }) activeFacetRef?: FacetRef;\n\n @query('ia-dropdown') dropdown?: IaDropdown;\n\n //\n // COMPONENT LIFECYCLE METHODS\n //\n\n render() {\n if (!this.facetInfo || !this.activeFacetRef) return nothing;\n if (this.facetInfo.length === 0) return nothing;\n\n const displayText =\n this.activeFacetRef.displayText ?? this.activeFacetRef.bucketKey;\n if (!displayText) return nothing;\n\n return html`\n <div class=\"dropdown-container\">\n <ia-dropdown\n class=\"dropdown\"\n displayCaret\n closeOnSelect\n closeOnEscape\n closeOnBackdropClick\n includeSelectedOption\n usePopover\n .options=${this.dropdownOptions}\n .selectedOption=${this.activeDropdownOption}\n .openViaButton=${false}\n @optionSelected=${this.optionSelected}\n @click=${this.onDropdownClick}\n >\n <span\n class=\"dropdown-label\"\n slot=\"dropdown-label\"\n @click=${this.defaultOptionSelected}\n >${this.labelPrefix ?? nothing} ${displayText}</span\n >\n </ia-dropdown>\n </div>\n `;\n }\n\n //\n // OTHER METHODS\n //\n\n private get dropdownOptions(): optionInterface[] {\n return (\n this.facetInfo?.map(smartFacet => {\n const firstFacet = smartFacet.facets[0];\n return {\n id: firstFacet.bucketKey,\n label: html`<span>\n ${smartFacet.label ??\n firstFacet.displayText ??\n firstFacet.bucketKey}\n </span>`,\n };\n }) ?? []\n );\n }\n\n private get activeDropdownOption(): optionInterface | undefined {\n if (!this.activeFacetRef) return undefined;\n return this.dropdownOptions.find(\n opt => opt.id === this.activeFacetRef?.bucketKey,\n );\n }\n\n /**\n * Handler for when the default option on the dropdown button is clicked\n */\n private defaultOptionSelected(): void {\n this.handleSelection(this.activeFacetRef?.bucketKey);\n }\n\n /**\n * Handler for when an option in the dropdown menu is selected\n */\n private optionSelected(e: CustomEvent<{ option: optionInterface }>): void {\n this.handleSelection(e.detail.option.id);\n }\n\n /**\n * Responds to a dropdown selection by emitting a `facetClick` event with\n * the appropriate facet details.\n */\n private handleSelection(bucketKey?: string): void {\n if (!bucketKey || !this.facetInfo || !this.activeFacetRef) return;\n\n let selectedSmartFacet;\n for (const smartFacet of this.facetInfo) {\n const selectedRef = smartFacet.facets.find(\n b => b.bucketKey === bucketKey,\n );\n if (selectedRef) {\n this.activeFacetRef = selectedRef;\n selectedSmartFacet = smartFacet;\n }\n }\n\n if (!selectedSmartFacet) return;\n\n this.dispatchEvent(\n new CustomEvent<SmartFacetEvent>('facetClick', {\n detail: {\n smartFacet: selectedSmartFacet,\n details: [\n {\n facetType: this.activeFacetRef.facetType,\n bucket: {\n key: this.activeFacetRef.bucketKey,\n count: 0,\n state: 'selected',\n },\n negative: false,\n },\n ],\n },\n }),\n );\n }\n\n private onDropdownClick(): void {\n log('smart dropdown: onDropdownClick', this);\n this.dispatchEvent(\n new CustomEvent<SmartFacetDropdown>('dropdownClick', { detail: this }),\n );\n }\n\n close(): void {\n if (this.dropdown) {\n this.dropdown.open = false;\n }\n }\n\n //\n // STYLES\n //\n\n static get styles(): CSSResultGroup {\n return css`\n .dropdown-container {\n padding: 5px 5px;\n border-radius: 5px;\n background: white;\n color: #2c2c2c;\n border: 1px solid #194880;\n font-size: 1.4rem;\n font-family: inherit;\n }\n\n .dropdown-label {\n font-size: 1.4rem;\n font-family: inherit;\n }\n\n .dropdown {\n --dropdownBorderColor: #194880;\n --dropdownBorderWidth: 1px;\n --dropdownBgColor: white;\n --dropdownHoverBgColor: #f8f8f8;\n --dropdownTextColor: #2c2c2c;\n --dropdownHoverTextColor: #2c2c2c;\n --dropdownCaretColor: #2c2c2c;\n --dropdownWhiteSpace: nowrap;\n --caretWidth: 14px;\n --caretHeight: 14px;\n }\n `;\n }\n}\n"]}