@internetarchive/collection-browser 2.10.1-alpha-webdev7090.0 → 2.10.1-alpha-webdev7090.1

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.
@@ -246,26 +246,28 @@ let SmartFacetBar = class SmartFacetBar extends LitElement {
246
246
  margin: 0;
247
247
  border: 0;
248
248
  padding: 5px 10px;
249
- border-radius: 15px;
249
+ border-radius: 50%;
250
250
  background: #194880;
251
251
  color: white;
252
252
  font-size: 1.6rem;
253
253
  font-family: inherit;
254
254
  text-decoration: none;
255
- box-shadow: 1px 1px rgba(0, 0, 0, 0.4);
256
255
  cursor: pointer;
257
256
  }
258
257
 
259
258
  #filters-toggle.active {
260
259
  background: #09294d;
261
- box-shadow: -1px -1px rgba(0, 0, 0, 0.1);
262
260
  }
263
261
 
264
262
  #filters-toggle > svg {
265
- width: 15px;
266
- filter: invert(1);
263
+ width: 10px;
264
+ filter: invert(0.16667);
267
265
  vertical-align: text-bottom;
268
266
  }
267
+
268
+ #filters-toggle.active > svg {
269
+ filter: invert(1);
270
+ }
269
271
  `;
270
272
  }
271
273
  };
@@ -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 {\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 { FacetOption, SelectedFacets } 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 filterIcon from '../../assets/img/icons/filter';\n\nimport './smart-facet-button';\nimport './smart-facet-dropdown';\nimport { log } from '../../utils/log';\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 }) filterToggleActive = false;\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 return html`\n <div id=\"smart-facets-container\">\n ${this.filtersToggleTemplate}\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 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.facetDropdownClicked}\n @dropdownClick=${this.onDropdownClick}\n ></smart-facet-dropdown>\n `;\n }\n\n private get filtersToggleTemplate(): TemplateResult {\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 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'].includes(key)) 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 facets.push(\n [this.toSmartFacet(facetType, [unusedBuckets[0]])],\n [this.toSmartFacet(facetType, [unusedBuckets[1]])],\n );\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 private facetClicked(e: CustomEvent<SmartFacetEvent>): void {\n if (!e.detail.smartFacet.selected) {\n this.smartFacets = [\n [{ ...e.detail.smartFacet, selected: true }],\n ...this.smartFacets.filter(f => f[0] !== e.detail.smartFacet),\n ];\n }\n\n for (const facet of e.detail.details) {\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 private facetDropdownClicked(e: CustomEvent<SmartFacetEvent>): void {\n if (\n this.smartFacets.find(sf => smartFacetEquals(sf[0], e.detail.smartFacet))\n ) {\n return;\n }\n\n this.smartFacets = [\n [{ ...e.detail.smartFacet, selected: true }],\n ...this.smartFacets,\n ];\n\n for (const facet of e.detail.details) {\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 private onDropdownClick(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 flex-wrap: wrap;\n gap: 5px;\n padding: 10px 0;\n }\n\n #filters-toggle {\n margin: 0;\n border: 0;\n padding: 5px 10px;\n border-radius: 15px;\n background: #194880;\n color: white;\n font-size: 1.6rem;\n font-family: inherit;\n text-decoration: none;\n box-shadow: 1px 1px rgba(0, 0, 0, 0.4);\n cursor: pointer;\n }\n\n #filters-toggle.active {\n background: #09294d;\n box-shadow: -1px -1px rgba(0, 0, 0, 0.1);\n }\n\n #filters-toggle > svg {\n width: 15px;\n filter: invert(1);\n vertical-align: text-bottom;\n }\n `;\n }\n}\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 { FacetOption, SelectedFacets } 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 filterIcon from '../../assets/img/icons/filter';\n\nimport './smart-facet-button';\nimport './smart-facet-dropdown';\nimport { log } from '../../utils/log';\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 }) filterToggleActive = false;\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 return html`\n <div id=\"smart-facets-container\">\n ${this.filtersToggleTemplate}\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 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.facetDropdownClicked}\n @dropdownClick=${this.onDropdownClick}\n ></smart-facet-dropdown>\n `;\n }\n\n private get filtersToggleTemplate(): TemplateResult {\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 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'].includes(key)) 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 facets.push(\n [this.toSmartFacet(facetType, [unusedBuckets[0]])],\n [this.toSmartFacet(facetType, [unusedBuckets[1]])],\n );\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 private facetClicked(e: CustomEvent<SmartFacetEvent>): void {\n if (!e.detail.smartFacet.selected) {\n this.smartFacets = [\n [{ ...e.detail.smartFacet, selected: true }],\n ...this.smartFacets.filter(f => f[0] !== e.detail.smartFacet),\n ];\n }\n\n for (const facet of e.detail.details) {\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 private facetDropdownClicked(e: CustomEvent<SmartFacetEvent>): void {\n if (\n this.smartFacets.find(sf => smartFacetEquals(sf[0], e.detail.smartFacet))\n ) {\n return;\n }\n\n this.smartFacets = [\n [{ ...e.detail.smartFacet, selected: true }],\n ...this.smartFacets,\n ];\n\n for (const facet of e.detail.details) {\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 private onDropdownClick(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 flex-wrap: wrap;\n gap: 5px;\n padding: 10px 0;\n }\n\n #filters-toggle {\n margin: 0;\n border: 0;\n padding: 5px 10px;\n border-radius: 50%;\n background: #194880;\n color: white;\n font-size: 1.6rem;\n font-family: inherit;\n text-decoration: none;\n cursor: pointer;\n }\n\n #filters-toggle.active {\n background: #09294d;\n }\n\n #filters-toggle > svg {\n width: 10px;\n filter: invert(0.16667);\n vertical-align: text-bottom;\n }\n\n #filters-toggle.active > svg {\n filter: invert(1);\n }\n `;\n }\n}\n"]}
@@ -87,7 +87,6 @@ let SmartFacetButton = class SmartFacetButton extends LitElement {
87
87
  font-size: 1.4rem;
88
88
  font-family: inherit;
89
89
  text-decoration: none;
90
- box-shadow: 1px 1px rgba(0, 0, 0, 0.4);
91
90
  }
92
91
 
93
92
  .smart-facet-button.selected {
@@ -96,10 +95,14 @@ let SmartFacetButton = class SmartFacetButton extends LitElement {
96
95
  }
97
96
 
98
97
  .smart-facet-button > svg {
99
- width: 15px;
100
- filter: invert(1);
98
+ width: 10px;
99
+ filter: invert(0.16667);
101
100
  vertical-align: text-top;
102
101
  }
102
+
103
+ .smart-facet-button.selected > svg {
104
+ filter: invert(1);
105
+ }
103
106
  `;
104
107
  }
105
108
  };
@@ -1 +1 @@
1
- {"version":3,"file":"smart-facet-button.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-button.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, CSSResultGroup, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { mediatypeConfig } from '../../mediatype/mediatype-config';\nimport type { SmartFacet, SmartFacetEvent } from './models';\n\nfunction capitalize(str?: string): string | undefined {\n if (!str) return str;\n return str.charAt(0).toLocaleUpperCase() + str.slice(1);\n}\n\n@customElement('smart-facet-button')\nexport class SmartFacetButton extends LitElement {\n @property({ type: Object }) facetInfo?: SmartFacet;\n\n @property({ type: String }) labelPrefix?: string;\n\n @property({ type: Boolean }) selected = false;\n\n //\n // COMPONENT LIFECYCLE METHODS\n //\n\n render() {\n if (!this.facetInfo) return nothing;\n\n const isSingleFacet = this.facetInfo.facets.length === 1;\n const firstFacet = this.facetInfo.facets[0];\n\n const displayText = capitalize(\n (this.labelPrefix ? `${this.labelPrefix} ` : '') +\n (this.facetInfo.label ??\n firstFacet.displayText ??\n firstFacet.bucketKey),\n );\n if (!displayText) return nothing;\n\n const icon =\n isSingleFacet && firstFacet.facetType === 'mediatype'\n ? mediatypeConfig[firstFacet.bucketKey].icon\n : nothing;\n\n return html`\n <a\n class=\"smart-facet-button ${this.selected ? 'selected' : ''}\"\n href=${this.href}\n @click=${this.facetClicked}\n >\n ${icon} ${displayText}\n ${this.selected\n ? html`<span style=\"margin-left: 5px;\">×</span>`\n : nothing}\n </a>\n `;\n }\n\n //\n // OTHER METHODS\n //\n\n private get href(): string {\n const url = new URL(window.location.href);\n if (this.facetInfo) {\n for (const facet of this.facetInfo.facets) {\n url.searchParams.append(\n 'and[]',\n encodeURIComponent(`${facet.facetType}:\"${facet.bucketKey}\"`),\n );\n }\n }\n return url.toString();\n }\n\n private facetClicked(e: Event): void {\n e.preventDefault();\n if (!this.facetInfo) return;\n\n this.selected = !this.selected;\n\n this.dispatchEvent(\n new CustomEvent<SmartFacetEvent>('facetClick', {\n detail: {\n smartFacet: this.facetInfo,\n details: this.facetInfo.facets.map(f => ({\n facetType: f.facetType,\n bucket: {\n key: f.bucketKey,\n count: 0,\n state: this.selected ? 'selected' : 'none',\n },\n negative: false,\n })),\n },\n }),\n );\n }\n\n //\n // STYLES\n //\n\n static get styles(): CSSResultGroup {\n return css`\n .smart-facet-button {\n padding: 5px 10px;\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 box-shadow: 1px 1px rgba(0, 0, 0, 0.4);\n }\n\n .smart-facet-button.selected {\n background: #194880;\n color: white;\n }\n\n .smart-facet-button > svg {\n width: 15px;\n filter: invert(1);\n vertical-align: text-top;\n }\n `;\n }\n}\n"]}
1
+ {"version":3,"file":"smart-facet-button.js","sourceRoot":"","sources":["../../../../src/collection-facets/smart-facets/smart-facet-button.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, CSSResultGroup, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport { mediatypeConfig } from '../../mediatype/mediatype-config';\nimport type { SmartFacet, SmartFacetEvent } from './models';\n\nfunction capitalize(str?: string): string | undefined {\n if (!str) return str;\n return str.charAt(0).toLocaleUpperCase() + str.slice(1);\n}\n\n@customElement('smart-facet-button')\nexport class SmartFacetButton extends LitElement {\n @property({ type: Object }) facetInfo?: SmartFacet;\n\n @property({ type: String }) labelPrefix?: string;\n\n @property({ type: Boolean }) selected = false;\n\n //\n // COMPONENT LIFECYCLE METHODS\n //\n\n render() {\n if (!this.facetInfo) return nothing;\n\n const isSingleFacet = this.facetInfo.facets.length === 1;\n const firstFacet = this.facetInfo.facets[0];\n\n const displayText = capitalize(\n (this.labelPrefix ? `${this.labelPrefix} ` : '') +\n (this.facetInfo.label ??\n firstFacet.displayText ??\n firstFacet.bucketKey),\n );\n if (!displayText) return nothing;\n\n const icon =\n isSingleFacet && firstFacet.facetType === 'mediatype'\n ? mediatypeConfig[firstFacet.bucketKey].icon\n : nothing;\n\n return html`\n <a\n class=\"smart-facet-button ${this.selected ? 'selected' : ''}\"\n href=${this.href}\n @click=${this.facetClicked}\n >\n ${icon} ${displayText}\n ${this.selected\n ? html`<span style=\"margin-left: 5px;\">×</span>`\n : nothing}\n </a>\n `;\n }\n\n //\n // OTHER METHODS\n //\n\n private get href(): string {\n const url = new URL(window.location.href);\n if (this.facetInfo) {\n for (const facet of this.facetInfo.facets) {\n url.searchParams.append(\n 'and[]',\n encodeURIComponent(`${facet.facetType}:\"${facet.bucketKey}\"`),\n );\n }\n }\n return url.toString();\n }\n\n private facetClicked(e: Event): void {\n e.preventDefault();\n if (!this.facetInfo) return;\n\n this.selected = !this.selected;\n\n this.dispatchEvent(\n new CustomEvent<SmartFacetEvent>('facetClick', {\n detail: {\n smartFacet: this.facetInfo,\n details: this.facetInfo.facets.map(f => ({\n facetType: f.facetType,\n bucket: {\n key: f.bucketKey,\n count: 0,\n state: this.selected ? 'selected' : 'none',\n },\n negative: false,\n })),\n },\n }),\n );\n }\n\n //\n // STYLES\n //\n\n static get styles(): CSSResultGroup {\n return css`\n .smart-facet-button {\n padding: 5px 10px;\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 }\n\n .smart-facet-button.selected {\n background: #194880;\n color: white;\n }\n\n .smart-facet-button > svg {\n width: 10px;\n filter: invert(0.16667);\n vertical-align: text-top;\n }\n\n .smart-facet-button.selected > svg {\n filter: invert(1);\n }\n `;\n }\n}\n"]}
@@ -117,6 +117,8 @@ let SmartFacetDropdown = class SmartFacetDropdown extends LitElement {
117
117
  .dropdown {
118
118
  --dropdownBorderWidth: 5px;
119
119
  --dropdownBorderColor: transparent;
120
+ --dropdownTextColor: #2c2c2c;
121
+ --dropdownCaretColor: #2c2c2c;
120
122
  --caretWidth: 14px;
121
123
  --caretHeight: 14px;
122
124
  }
@@ -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';\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 openViaButton\n closeOnSelect\n includeSelectedOption\n .options=${this.dropdownOptions}\n .selectedOption=${this.activeDropdownOption}\n @optionSelected=${this.optionSelected}\n @click=${this.onDropdownClick}\n >\n <span class=\"dropdown-label\" slot=\"dropdown-label\"\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:\n smartFacet.label ?? firstFacet.displayText ?? firstFacet.bucketKey,\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 private optionSelected(e: CustomEvent<{ option: optionInterface }>): void {\n if (!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 === e.detail.option.id,\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 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 box-shadow: 1px 1px rgba(0, 0, 0, 0.4);\n }\n\n .dropdown-label {\n font-size: 1.4rem;\n font-family: inherit;\n }\n\n .dropdown {\n --dropdownBorderWidth: 5px;\n --dropdownBorderColor: transparent;\n --caretWidth: 14px;\n --caretHeight: 14px;\n }\n `;\n }\n}\n"]}
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';\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 openViaButton\n closeOnSelect\n includeSelectedOption\n .options=${this.dropdownOptions}\n .selectedOption=${this.activeDropdownOption}\n @optionSelected=${this.optionSelected}\n @click=${this.onDropdownClick}\n >\n <span class=\"dropdown-label\" slot=\"dropdown-label\"\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:\n smartFacet.label ?? firstFacet.displayText ?? firstFacet.bucketKey,\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 private optionSelected(e: CustomEvent<{ option: optionInterface }>): void {\n if (!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 === e.detail.option.id,\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 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 box-shadow: 1px 1px rgba(0, 0, 0, 0.4);\n }\n\n .dropdown-label {\n font-size: 1.4rem;\n font-family: inherit;\n }\n\n .dropdown {\n --dropdownBorderWidth: 5px;\n --dropdownBorderColor: transparent;\n --dropdownTextColor: #2c2c2c;\n --dropdownCaretColor: #2c2c2c;\n --caretWidth: 14px;\n --caretHeight: 14px;\n }\n `;\n }\n}\n"]}
package/package.json CHANGED
@@ -3,7 +3,7 @@
3
3
  "description": "The Internet Archive Collection Browser.",
4
4
  "license": "AGPL-3.0-only",
5
5
  "author": "Internet Archive",
6
- "version": "2.10.1-alpha-webdev7090.0",
6
+ "version": "2.10.1-alpha-webdev7090.1",
7
7
  "main": "dist/index.js",
8
8
  "module": "dist/index.js",
9
9
  "scripts": {
@@ -328,26 +328,28 @@ export class SmartFacetBar extends LitElement {
328
328
  margin: 0;
329
329
  border: 0;
330
330
  padding: 5px 10px;
331
- border-radius: 15px;
331
+ border-radius: 50%;
332
332
  background: #194880;
333
333
  color: white;
334
334
  font-size: 1.6rem;
335
335
  font-family: inherit;
336
336
  text-decoration: none;
337
- box-shadow: 1px 1px rgba(0, 0, 0, 0.4);
338
337
  cursor: pointer;
339
338
  }
340
339
 
341
340
  #filters-toggle.active {
342
341
  background: #09294d;
343
- box-shadow: -1px -1px rgba(0, 0, 0, 0.1);
344
342
  }
345
343
 
346
344
  #filters-toggle > svg {
347
- width: 15px;
348
- filter: invert(1);
345
+ width: 10px;
346
+ filter: invert(0.16667);
349
347
  vertical-align: text-bottom;
350
348
  }
349
+
350
+ #filters-toggle.active > svg {
351
+ filter: invert(1);
352
+ }
351
353
  `;
352
354
  }
353
355
  }
@@ -109,7 +109,6 @@ export class SmartFacetButton extends LitElement {
109
109
  font-size: 1.4rem;
110
110
  font-family: inherit;
111
111
  text-decoration: none;
112
- box-shadow: 1px 1px rgba(0, 0, 0, 0.4);
113
112
  }
114
113
 
115
114
  .smart-facet-button.selected {
@@ -118,10 +117,14 @@ export class SmartFacetButton extends LitElement {
118
117
  }
119
118
 
120
119
  .smart-facet-button > svg {
121
- width: 15px;
122
- filter: invert(1);
120
+ width: 10px;
121
+ filter: invert(0.16667);
123
122
  vertical-align: text-top;
124
123
  }
124
+
125
+ .smart-facet-button.selected > svg {
126
+ filter: invert(1);
127
+ }
125
128
  `;
126
129
  }
127
130
  }
@@ -145,6 +145,8 @@ export class SmartFacetDropdown extends LitElement {
145
145
  .dropdown {
146
146
  --dropdownBorderWidth: 5px;
147
147
  --dropdownBorderColor: transparent;
148
+ --dropdownTextColor: #2c2c2c;
149
+ --dropdownCaretColor: #2c2c2c;
148
150
  --caretWidth: 14px;
149
151
  --caretHeight: 14px;
150
152
  }