@fluid-topics/ft-search-bar 0.3.1 → 0.3.4
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.
- package/build/ft-search-bar.d.ts +3 -1
- package/build/ft-search-bar.js +42 -35
- package/build/ft-search-bar.light.js +9 -4
- package/build/ft-search-bar.min.js +9 -4
- package/package.json +14 -14
package/build/ft-search-bar.d.ts
CHANGED
|
@@ -113,11 +113,13 @@ export declare class FtSearchBar extends FtLitElement implements FtSearchBarProp
|
|
|
113
113
|
private renderDesktopFacets;
|
|
114
114
|
protected firstUpdated(props: PropertyValues): Promise<void>;
|
|
115
115
|
protected update(props: PropertyValues): void;
|
|
116
|
-
private
|
|
116
|
+
private initDataDebouncer;
|
|
117
|
+
private initSearchData;
|
|
117
118
|
protected contentAvailableCallback(props: PropertyValues): void;
|
|
118
119
|
private initApi;
|
|
119
120
|
private facetsLoaded;
|
|
120
121
|
private updateFacets;
|
|
122
|
+
private retrieveFacetsFromSearch;
|
|
121
123
|
private onFloatingContainerKeyUp;
|
|
122
124
|
setQuery(query: string): void;
|
|
123
125
|
launchSearch(): void;
|
package/build/ft-search-bar.js
CHANGED
|
@@ -93,6 +93,7 @@ export class FtSearchBar extends FtLitElement {
|
|
|
93
93
|
this.selectedFacetsManager = new FacetsChipsManager(this);
|
|
94
94
|
this.desktopSearchBarManager = new DesktopSearchBarManager(this);
|
|
95
95
|
this.mobileSearchBarManager = new MobileSearchBarManager(this);
|
|
96
|
+
this.initDataDebouncer = new Debouncer(10);
|
|
96
97
|
this.facetsLoaded = false;
|
|
97
98
|
this.closeFloatingContainer = (e) => {
|
|
98
99
|
if (!this.isMobile()) {
|
|
@@ -400,13 +401,11 @@ export class FtSearchBar extends FtLitElement {
|
|
|
400
401
|
if (["baseUrl", "apiIntegrationIdentifier"].some(p => props.has(p))) {
|
|
401
402
|
this.api = undefined;
|
|
402
403
|
this.initApi();
|
|
403
|
-
this.availableContentLocalesInitialized = false;
|
|
404
|
-
this.facetsInitialized = false;
|
|
405
404
|
}
|
|
406
|
-
if (props.has("api")) {
|
|
407
|
-
this.
|
|
405
|
+
if (props.has("api") && this.api) {
|
|
406
|
+
this.initSearchData();
|
|
408
407
|
}
|
|
409
|
-
if (["uiLocale", "contentLocale", "searchFilters", "displayedFilters"
|
|
408
|
+
if (["uiLocale", "contentLocale", "searchFilters", "displayedFilters"].some(p => props.has(p))) {
|
|
410
409
|
this.updateFacets();
|
|
411
410
|
}
|
|
412
411
|
if (["query", "uiLocale", "contentLocale", "searchFilters", "displayedFilters", "api"].some(p => props.has(p))) {
|
|
@@ -416,11 +415,18 @@ export class FtSearchBar extends FtLitElement {
|
|
|
416
415
|
this.dispatchEvent(new SearchStateChangeEvent(this.request));
|
|
417
416
|
}
|
|
418
417
|
}
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
418
|
+
initSearchData() {
|
|
419
|
+
this.availableContentLocalesInitialized = false;
|
|
420
|
+
this.facetsInitialized = false;
|
|
421
|
+
this.initDataDebouncer.run(() => {
|
|
422
|
+
var _a;
|
|
423
|
+
(_a = this.api) === null || _a === void 0 ? void 0 : _a.getAvailableSearchLocales().then(result => result.contentLocales).catch(() => []).then(result => {
|
|
424
|
+
this.availableContentLocales = result;
|
|
425
|
+
this.availableContentLocalesInitialized = true;
|
|
426
|
+
});
|
|
427
|
+
this.retrieveFacetsFromSearch()
|
|
428
|
+
.then(() => this.facetsInitialized = true);
|
|
429
|
+
});
|
|
424
430
|
}
|
|
425
431
|
contentAvailableCallback(props) {
|
|
426
432
|
var _a, _b, _c;
|
|
@@ -440,42 +446,43 @@ export class FtSearchBar extends FtLitElement {
|
|
|
440
446
|
initApi() {
|
|
441
447
|
if (this.api == null) {
|
|
442
448
|
this.api = window.fluidtopics ? new window.fluidtopics.FluidTopicsApi(this.baseUrl, this.apiIntegrationIdentifier, true) : undefined;
|
|
443
|
-
setTimeout(() => this.initApi(),
|
|
449
|
+
setTimeout(() => this.initApi(), 10);
|
|
444
450
|
}
|
|
445
451
|
}
|
|
446
452
|
updateFacets() {
|
|
447
|
-
if (this.api) {
|
|
453
|
+
if (this.api && this.facetsInitialized) {
|
|
448
454
|
if (this.facetsRequest.length > 0) {
|
|
449
455
|
this.facetsLoaded = false;
|
|
450
456
|
this.updateFacetsDebouncer.run(async () => {
|
|
451
|
-
|
|
452
|
-
const retrievedFacets = new Map();
|
|
453
|
-
await ((_a = this.api) === null || _a === void 0 ? void 0 : _a.search({ ...this.request, query: "" }).then(r => r.facets.forEach(f => {
|
|
454
|
-
this.knownFacetLabels.set(f.key, f.label);
|
|
455
|
-
retrievedFacets.set(f.key, f);
|
|
456
|
-
})).catch(doNothing));
|
|
457
|
-
this.facets = [];
|
|
458
|
-
for (let r of this.facetsRequest) {
|
|
459
|
-
if (retrievedFacets.has(r.id)) {
|
|
460
|
-
this.facets.push(retrievedFacets.get(r.id));
|
|
461
|
-
}
|
|
462
|
-
else if (this.knownFacetLabels.has(r.id)) {
|
|
463
|
-
this.facets.push({
|
|
464
|
-
key: r.id,
|
|
465
|
-
label: this.knownFacetLabels.get(r.id),
|
|
466
|
-
rootNodes: [],
|
|
467
|
-
multiSelectionable: true,
|
|
468
|
-
hierarchical: false
|
|
469
|
-
});
|
|
470
|
-
}
|
|
471
|
-
}
|
|
457
|
+
await this.retrieveFacetsFromSearch();
|
|
472
458
|
this.facetsLoaded = true;
|
|
473
|
-
this.facetsInitialized = true;
|
|
474
459
|
});
|
|
475
460
|
}
|
|
476
461
|
else {
|
|
477
462
|
this.facets = [];
|
|
478
|
-
|
|
463
|
+
}
|
|
464
|
+
}
|
|
465
|
+
}
|
|
466
|
+
async retrieveFacetsFromSearch() {
|
|
467
|
+
var _a;
|
|
468
|
+
const retrievedFacets = new Map();
|
|
469
|
+
await ((_a = this.api) === null || _a === void 0 ? void 0 : _a.search({ ...this.request, query: "" }).then(r => r.facets.forEach(f => {
|
|
470
|
+
this.knownFacetLabels.set(f.key, f.label);
|
|
471
|
+
retrievedFacets.set(f.key, f);
|
|
472
|
+
})).catch(doNothing));
|
|
473
|
+
this.facets = [];
|
|
474
|
+
for (let r of this.facetsRequest) {
|
|
475
|
+
if (retrievedFacets.has(r.id)) {
|
|
476
|
+
this.facets.push(retrievedFacets.get(r.id));
|
|
477
|
+
}
|
|
478
|
+
else if (this.knownFacetLabels.has(r.id)) {
|
|
479
|
+
this.facets.push({
|
|
480
|
+
key: r.id,
|
|
481
|
+
label: this.knownFacetLabels.get(r.id),
|
|
482
|
+
rootNodes: [],
|
|
483
|
+
multiSelectionable: true,
|
|
484
|
+
hierarchical: false
|
|
485
|
+
});
|
|
479
486
|
}
|
|
480
487
|
}
|
|
481
488
|
}
|
|
@@ -1627,9 +1627,9 @@ const V=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===V)return null==t?void 0:t
|
|
|
1627
1627
|
@keydown=${e=>this.onOptionKeyDown(e,t)}
|
|
1628
1628
|
@click=${()=>this.selectOption(t)}>
|
|
1629
1629
|
<ft-ripple ?primary=${e} ?activated=${e}></ft-ripple>
|
|
1630
|
-
|
|
1630
|
+
<span>${t.label}</span>
|
|
1631
1631
|
</div>
|
|
1632
|
-
`}updated(t){var e;super.updated(t),t.has("options")&&(this.selectedOption=this.options.filter((t=>t.selected))[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1,this.dispatchEvent(new CustomEvent("change",{detail:null===(e=this.selectedOption)||void 0===e?void 0:e.value}))),t.has("optionsDisplayed")&&this.fixedMenuPosition&&this.hasOptionsMenuOpen&&this.positionOptionsMenu()}positionOptionsMenu(){this.optionsMenu.style.top=this.mainPanel.getBoundingClientRect().top+this.mainPanel.getBoundingClientRect().height+"px",this.optionsMenu.style.left=this.mainPanel.getBoundingClientRect().left+"px",this.optionsMenu.style.
|
|
1632
|
+
`}updated(t){var e;super.updated(t),t.has("options")&&(this.selectedOption=this.options.filter((t=>t.selected))[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1,this.dispatchEvent(new CustomEvent("change",{detail:null===(e=this.selectedOption)||void 0===e?void 0:e.value}))),t.has("optionsDisplayed")&&this.fixedMenuPosition&&this.hasOptionsMenuOpen&&this.positionOptionsMenu()}positionOptionsMenu(){this.optionsMenu.style.top=this.mainPanel.getBoundingClientRect().top+this.mainPanel.getBoundingClientRect().height+"px",this.optionsMenu.style.left=this.mainPanel.getBoundingClientRect().left+"px",this.optionsMenu.style.width=this.mainPanel.getBoundingClientRect().width+"px"}contentAvailableCallback(t){var e,i;t.has("focusOptions")&&this.focusOptions&&(null===(i=null!==(e=this.selectedOptionElement)&&void 0!==e?e:this.firstOption)||void 0===i||i.focus(),this.focusOptions=!1)}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(t){var e;t.stopPropagation();let i=null===(e=this.optionsSlot)||void 0===e?void 0:e.assignedElements().map((t=>t));i&&i.length>0&&(this.options=i)}onMainPanelKeyDown(t){switch(t.key){case" ":t.preventDefault(),t.stopPropagation();case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0}}onOptionsKeyDown(t){var e,i,o,s,r;let n;switch(t.key){case"Escape":this.optionsDisplayed=!1,null===(e=this.mainPanel)||void 0===e||e.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":t.preventDefault(),t.stopPropagation(),n=null!==(o=null===(i=this.focusedOption)||void 0===i?void 0:i.previousElementSibling)&&void 0!==o?o:this.lastOption;break;case"ArrowDown":t.preventDefault(),t.stopPropagation(),n=null!==(r=null===(s=this.focusedOption)||void 0===s?void 0:s.nextElementSibling)&&void 0!==r?r:this.firstOption}null==n||n.focus()}onOptionKeyDown(t,e){var i;"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),this.selectOption(e),this.optionsDisplayed=!1,null===(i=this.mainPanel)||void 0===i||i.focus())}selectOption(t){this.selectedOption=t;for(let e of this.options)e.selected=e===t}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}}Mi.elementDefinitions={"ft-input-label":Di,"ft-typography":Yt,"ft-ripple":pe,"ft-icon":Se},Mi.styles=[Kt,qt,i.css`
|
|
1633
1633
|
*:focus {
|
|
1634
1634
|
outline: none;
|
|
1635
1635
|
}
|
|
@@ -1763,6 +1763,11 @@ const V=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===V)return null==t?void 0:t
|
|
|
1763
1763
|
align-items: center;
|
|
1764
1764
|
}
|
|
1765
1765
|
|
|
1766
|
+
.ft-select--option span {
|
|
1767
|
+
text-overflow: ellipsis;
|
|
1768
|
+
overflow: hidden;
|
|
1769
|
+
}
|
|
1770
|
+
|
|
1766
1771
|
.ft-select--helper-text {
|
|
1767
1772
|
padding: 0 12px 0 16px;
|
|
1768
1773
|
color: ${ji.helperColor};
|
|
@@ -2395,7 +2400,7 @@ const V=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===V)return null==t?void 0:t
|
|
|
2395
2400
|
</div>
|
|
2396
2401
|
`}onSearchBarKeyDown(t){var e;switch(t.key){case"Escape":this.searchBar.mobileMenuOpen=!1,null===(e=this.searchBar.input)||void 0===e||e.blur();break;case"ArrowDown":t.stopPropagation(),t.preventDefault(),this.suggestManager.focusFirstSuggestion()}}onSearchBarKeyUp(t){const e=t.composedPath()[0];this.searchBar.query=e.value,"Enter"===t.key&&this.searchBar.launchSearch()}}Hi.styles=i.css`
|
|
2397
2402
|
|
|
2398
|
-
`;var Vi=function(t,e,i,o){for(var s,r=arguments.length,n=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(e,i,n):s(e,i))||n);return r>3&&n&&Object.defineProperty(e,i,n),n};null==window.fluidtopics&&console.warn("Fluid Topics public API was not found. You can find it here: https://www.npmjs.com/package/@fluid-topics/public-api");const Ki={filtersButton:"Filters",inputPlaceHolder:"Search",filterInputPlaceHolder:"Filter {0}",clearInputButton:"Clear",clearFilterButton:"Clear",displayMoreFilterValuesButton:"More",noFilterValuesAvailable:"No values available",searchButton:"Search",clearFilters:"Clear filters",contentLocaleSelector:"Lang",presetsSelector:"Preset",removeRecentSearch:"Remove",back:"Back"};class qi extends CustomEvent{constructor(t){super("launch-search",{detail:t,bubbles:!0,composed:!0})}}class Wi extends CustomEvent{constructor(t){super("change",{detail:t})}}const Gi=()=>{};class Xi extends e.FtLitElement{constructor(){super(...arguments),this.dense=!1,this.mode="auto",this.forceMobileMenuOpen=!1,this.forceMenuOpen=!1,this.baseUrl="",this.apiIntegrationIdentifier="ft-search-bar",this.availableContentLocales=[],this.availableContentLocalesInitialized=!1,this.labels={},this.labelResolver=new e.ParametrizedLabelResolver(Ki,{}),this.displayedFilters=[],this.presets=[],this.priors=[],this.searchRequestSerializer=t=>function(t,e){var i;const o=new URLSearchParams({"content-lang":null!==(i=e.contentLocale)&&void 0!==i?i:"all",query:e.query});if(e.filters.length>0){const t=e.filters.map((t=>{const e=t.values.map((t=>t.replace(/_/g,"\\\\\\\\_").replace(/~/g,"\\\\~").replace(/\*/g,"\\*"))).map((t=>encodeURIComponent(function(t){return`"${t}"`}(t)))).join("_");return`${t.key}~${e}`})).join("*");o.append("filters",t)}return new URL(`${t}/search/all?${o.toString()}`).href}(this.baseUrl,t),this.searchFilters=[],this.sizeCategory=l.M,this.displayFacets=!1,this.mobileMenuOpen=!1,this.facets=[],this.facetsInitialized=!1,this.knownFacetLabels=new Map,this.query="",this.suggestions=[],this.recentSearches=[],this.updateFacetsDebouncer=new e.Debouncer(500),this.suggestManager=new Zi(this),this.selectedFacetsManager=new Ui(this),this.desktopSearchBarManager=new Hi(this),this.mobileSearchBarManager=new _i(this),this.facetsLoaded=!1,this.closeFloatingContainer=t=>{this.isMobile()||(this.displayFacets=this.displayFacets&&t.composedPath().some((t=>t===this.floatingContainer)))},this.compareFilters=(t,e)=>t.key===e.key&&t.negative==e.negative&&t.values.length===e.values.length&&t.values.every((t=>e.values.includes(t))),this.compareRequests=(t,e)=>(null==t.contentLocale||null==e.contentLocale||t.contentLocale===e.contentLocale)&&t.filters.length===e.filters.length&&t.filters.every((t=>e.filters.some((e=>this.compareFilters(t,e)))))}isMobileMenuOpen(){return this.isMobile()&&(this.forceMobileMenuOpen||this.forceMenuOpen||this.mobileMenuOpen)}get request(){return{uiLocale:this.uiLocale,contentLocale:this.contentLocale,query:this.query,facets:this.facetsRequest,priors:this.hasPriors?this.priors:void 0,filters:this.searchFilters,paging:{perPage:0,page:1},sort:[]}}get facetsRequest(){const t=this.searchFilters.filter((t=>t.values.length>0&&!this.displayedFilters.includes(t.key))).map((t=>({id:t.key})));return[...this.displayedFilters.map((t=>({id:t}))),...t]}get suggestRequest(){return{contentLocale:this.contentLocale,input:this.query,filters:this.searchFilters,sort:[]}}isMobile(){switch(this.mode){case"mobile":return!0;case"desktop":return!1;default:return this.sizeCategory===l.S}}hasFacets(){return this.facetsRequest.length>0}get hasPresets(){return null!=this.presets&&this.presets.length>0}get hasPriors(){return null!=this.priors&&this.priors.length>0}hasLocaleSelector(){return this.availableContentLocales.length>1}focus(){var t;null===(t=this.container)||void 0===t||t.focus()}focusInput(){this.input?this.input.focus():setTimeout((()=>this.focusInput()),50)}clear(){this.query="",this.searchFilters=[],this.input&&(this.input.value=""),this.mobileMenuOpen=!1,this.displayFacets=!1}render(){return i.html`
|
|
2403
|
+
`;var Vi=function(t,e,i,o){for(var s,r=arguments.length,n=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(e,i,n):s(e,i))||n);return r>3&&n&&Object.defineProperty(e,i,n),n};null==window.fluidtopics&&console.warn("Fluid Topics public API was not found. You can find it here: https://www.npmjs.com/package/@fluid-topics/public-api");const Ki={filtersButton:"Filters",inputPlaceHolder:"Search",filterInputPlaceHolder:"Filter {0}",clearInputButton:"Clear",clearFilterButton:"Clear",displayMoreFilterValuesButton:"More",noFilterValuesAvailable:"No values available",searchButton:"Search",clearFilters:"Clear filters",contentLocaleSelector:"Lang",presetsSelector:"Preset",removeRecentSearch:"Remove",back:"Back"};class qi extends CustomEvent{constructor(t){super("launch-search",{detail:t,bubbles:!0,composed:!0})}}class Wi extends CustomEvent{constructor(t){super("change",{detail:t})}}const Gi=()=>{};class Xi extends e.FtLitElement{constructor(){super(...arguments),this.dense=!1,this.mode="auto",this.forceMobileMenuOpen=!1,this.forceMenuOpen=!1,this.baseUrl="",this.apiIntegrationIdentifier="ft-search-bar",this.availableContentLocales=[],this.availableContentLocalesInitialized=!1,this.labels={},this.labelResolver=new e.ParametrizedLabelResolver(Ki,{}),this.displayedFilters=[],this.presets=[],this.priors=[],this.searchRequestSerializer=t=>function(t,e){var i;const o=new URLSearchParams({"content-lang":null!==(i=e.contentLocale)&&void 0!==i?i:"all",query:e.query});if(e.filters.length>0){const t=e.filters.map((t=>{const e=t.values.map((t=>t.replace(/_/g,"\\\\\\\\_").replace(/~/g,"\\\\~").replace(/\*/g,"\\*"))).map((t=>encodeURIComponent(function(t){return`"${t}"`}(t)))).join("_");return`${t.key}~${e}`})).join("*");o.append("filters",t)}return new URL(`${t}/search/all?${o.toString()}`).href}(this.baseUrl,t),this.searchFilters=[],this.sizeCategory=l.M,this.displayFacets=!1,this.mobileMenuOpen=!1,this.facets=[],this.facetsInitialized=!1,this.knownFacetLabels=new Map,this.query="",this.suggestions=[],this.recentSearches=[],this.updateFacetsDebouncer=new e.Debouncer(500),this.suggestManager=new Zi(this),this.selectedFacetsManager=new Ui(this),this.desktopSearchBarManager=new Hi(this),this.mobileSearchBarManager=new _i(this),this.initDataDebouncer=new e.Debouncer(10),this.facetsLoaded=!1,this.closeFloatingContainer=t=>{this.isMobile()||(this.displayFacets=this.displayFacets&&t.composedPath().some((t=>t===this.floatingContainer)))},this.compareFilters=(t,e)=>t.key===e.key&&t.negative==e.negative&&t.values.length===e.values.length&&t.values.every((t=>e.values.includes(t))),this.compareRequests=(t,e)=>(null==t.contentLocale||null==e.contentLocale||t.contentLocale===e.contentLocale)&&t.filters.length===e.filters.length&&t.filters.every((t=>e.filters.some((e=>this.compareFilters(t,e)))))}isMobileMenuOpen(){return this.isMobile()&&(this.forceMobileMenuOpen||this.forceMenuOpen||this.mobileMenuOpen)}get request(){return{uiLocale:this.uiLocale,contentLocale:this.contentLocale,query:this.query,facets:this.facetsRequest,priors:this.hasPriors?this.priors:void 0,filters:this.searchFilters,paging:{perPage:0,page:1},sort:[]}}get facetsRequest(){const t=this.searchFilters.filter((t=>t.values.length>0&&!this.displayedFilters.includes(t.key))).map((t=>({id:t.key})));return[...this.displayedFilters.map((t=>({id:t}))),...t]}get suggestRequest(){return{contentLocale:this.contentLocale,input:this.query,filters:this.searchFilters,sort:[]}}isMobile(){switch(this.mode){case"mobile":return!0;case"desktop":return!1;default:return this.sizeCategory===l.S}}hasFacets(){return this.facetsRequest.length>0}get hasPresets(){return null!=this.presets&&this.presets.length>0}get hasPriors(){return null!=this.priors&&this.priors.length>0}hasLocaleSelector(){return this.availableContentLocales.length>1}focus(){var t;null===(t=this.container)||void 0===t||t.focus()}focusInput(){this.input?this.input.focus():setTimeout((()=>this.focusInput()),50)}clear(){this.query="",this.searchFilters=[],this.input&&(this.input.value=""),this.mobileMenuOpen=!1,this.displayFacets=!1}render(){return i.html`
|
|
2399
2404
|
<ft-size-watcher @change=${this.updateSize}></ft-size-watcher>
|
|
2400
2405
|
${this.renderSearchBar()}
|
|
2401
2406
|
`}renderSearchBar(){return this.facetsInitialized&&this.availableContentLocalesInitialized?this.isMobile()?this.mobileSearchBarManager.render():this.desktopSearchBarManager.render():i.html`
|
|
@@ -2523,7 +2528,7 @@ const V=Symbol.for(""),K=t=>{if((null==t?void 0:t.r)===V)return null==t?void 0:t
|
|
|
2523
2528
|
></ft-filter>
|
|
2524
2529
|
`}))}
|
|
2525
2530
|
</ft-snap-scroll>
|
|
2526
|
-
`:i.nothing}async firstUpdated(t){super.firstUpdated(t),this.initApi(),window.addEventListener("storage",(t=>{t.key===this.recentSearchesStorageKey&&this.initRecentSearches()}))}update(t){var i,o,s,r,n;if(t.has("labels")&&(this.labelResolver=new e.ParametrizedLabelResolver(Ki,this.labels)),t.has("sizeCategory")&&(this.mobileMenuOpen=!1,this.displayFacets=this.displayFacets&&!this.isMobile()),super.update(t),(t.has("availableContentLocales")||t.has("contentLocale"))&&this.availableContentLocales.length>0){const e=t=>this.availableContentLocales.some((e=>e.lang===t));e(this.contentLocale)||(this.contentLocale=t.has("contentLocale")&&e(t.get("contentLocale"))?t.get("contentLocale"):null===(i=this.availableContentLocales[0])||void 0===i?void 0:i.lang)}if(t.has("baseUrl")&&this.baseUrl&&(this.baseUrl.endsWith("/")&&(this.baseUrl=this.baseUrl.replace(/\/$/,"")),this.initRecentSearches()),t.has("presets")&&(null!==(o=this.presets)&&void 0!==o?o:[]).forEach((t=>t.filters.forEach((t=>t.values=t.values.map((t=>Qt(t))))))),t.has("selectedPreset")){const t=(null!==(s=this.presets)&&void 0!==s?s:[]).find((t=>t.name===this.selectedPreset));t&&!this.compareRequests(this.request,t)&&this.setFiltersFromPreset(t)}t.has("contentLocale")&&null!=this.contentLocale&&(this.knownFacetLabels=new Map),["contentLocale","searchFilters"].some((e=>t.has(e)))&&(this.selectedPreset=null===(n=(null!==(r=this.presets)&&void 0!==r?r:[]).find((t=>this.compareRequests(t,this.request))))||void 0===n?void 0:n.name),["baseUrl","apiIntegrationIdentifier"].some((e=>t.has(e)))&&(this.api=void 0,this.initApi()
|
|
2531
|
+
`:i.nothing}async firstUpdated(t){super.firstUpdated(t),this.initApi(),window.addEventListener("storage",(t=>{t.key===this.recentSearchesStorageKey&&this.initRecentSearches()}))}update(t){var i,o,s,r,n;if(t.has("labels")&&(this.labelResolver=new e.ParametrizedLabelResolver(Ki,this.labels)),t.has("sizeCategory")&&(this.mobileMenuOpen=!1,this.displayFacets=this.displayFacets&&!this.isMobile()),super.update(t),(t.has("availableContentLocales")||t.has("contentLocale"))&&this.availableContentLocales.length>0){const e=t=>this.availableContentLocales.some((e=>e.lang===t));e(this.contentLocale)||(this.contentLocale=t.has("contentLocale")&&e(t.get("contentLocale"))?t.get("contentLocale"):null===(i=this.availableContentLocales[0])||void 0===i?void 0:i.lang)}if(t.has("baseUrl")&&this.baseUrl&&(this.baseUrl.endsWith("/")&&(this.baseUrl=this.baseUrl.replace(/\/$/,"")),this.initRecentSearches()),t.has("presets")&&(null!==(o=this.presets)&&void 0!==o?o:[]).forEach((t=>t.filters.forEach((t=>t.values=t.values.map((t=>Qt(t))))))),t.has("selectedPreset")){const t=(null!==(s=this.presets)&&void 0!==s?s:[]).find((t=>t.name===this.selectedPreset));t&&!this.compareRequests(this.request,t)&&this.setFiltersFromPreset(t)}t.has("contentLocale")&&null!=this.contentLocale&&(this.knownFacetLabels=new Map),["contentLocale","searchFilters"].some((e=>t.has(e)))&&(this.selectedPreset=null===(n=(null!==(r=this.presets)&&void 0!==r?r:[]).find((t=>this.compareRequests(t,this.request))))||void 0===n?void 0:n.name),["baseUrl","apiIntegrationIdentifier"].some((e=>t.has(e)))&&(this.api=void 0,this.initApi()),t.has("api")&&this.api&&this.initSearchData(),["uiLocale","contentLocale","searchFilters","displayedFilters"].some((e=>t.has(e)))&&this.updateFacets(),["query","uiLocale","contentLocale","searchFilters","displayedFilters","api"].some((e=>t.has(e)))&&this.suggestManager.update(),["query","uiLocale","contentLocale","searchFilters"].some((e=>t.has(e)))&&this.dispatchEvent(new Wi(this.request))}initSearchData(){this.availableContentLocalesInitialized=!1,this.facetsInitialized=!1,this.initDataDebouncer.run((()=>{var t;null===(t=this.api)||void 0===t||t.getAvailableSearchLocales().then((t=>t.contentLocales)).catch((()=>[])).then((t=>{this.availableContentLocales=t,this.availableContentLocalesInitialized=!0})),this.retrieveFacetsFromSearch().then((()=>this.facetsInitialized=!0))}))}contentAvailableCallback(t){var e,i,o;if(super.contentAvailableCallback(t),t.has("displayFacets")&&this.displayFacets&&(null===(e=this.floatingContainer)||void 0===e||e.focus()),null!=this.scrollToFacet&&this.facetsLoaded){null===(i=this.scrollingFiltersContainer)||void 0===i||i.scrollIndexIntoView(this.facets.findIndex((t=>t.key===this.scrollToFacet)));const t=null===(o=this.shadowRoot)||void 0===o?void 0:o.querySelector(`ft-accordion-item[data-facet-key="${this.scrollToFacet}"]`);t&&(t.active=!0),this.scrollToFacet=void 0}}initApi(){null==this.api&&(this.api=window.fluidtopics?new window.fluidtopics.FluidTopicsApi(this.baseUrl,this.apiIntegrationIdentifier,!0):void 0,setTimeout((()=>this.initApi()),10))}updateFacets(){this.api&&this.facetsInitialized&&(this.facetsRequest.length>0?(this.facetsLoaded=!1,this.updateFacetsDebouncer.run((async()=>{await this.retrieveFacetsFromSearch(),this.facetsLoaded=!0}))):this.facets=[])}async retrieveFacetsFromSearch(){var t;const e=new Map;await(null===(t=this.api)||void 0===t?void 0:t.search({...this.request,query:""}).then((t=>t.facets.forEach((t=>{this.knownFacetLabels.set(t.key,t.label),e.set(t.key,t)})))).catch(Gi)),this.facets=[];for(let t of this.facetsRequest)e.has(t.id)?this.facets.push(e.get(t.id)):this.knownFacetLabels.has(t.id)&&this.facets.push({key:t.id,label:this.knownFacetLabels.get(t.id),rootNodes:[],multiSelectionable:!0,hierarchical:!1})}onFloatingContainerKeyUp(t){var e;"Escape"===t.key&&(this.displayFacets=!1,null===(e=this.filtersOpener)||void 0===e||e.focus())}setQuery(t){this.input&&(this.input.value=t),this.query=t}launchSearch(){if(this.query){let t=this.recentSearches.filter((t=>t.toLowerCase()!==this.query.toLowerCase())).filter(((t,e)=>e<20));this.recentSearches=[this.query,...t],this.saveRecentSearches()}this.dispatchEvent(new qi(this.request)),this.mobileMenuOpen=!1,this.displayFacets=!1,this.focus()}get recentSearchesStorageKey(){return this.baseUrl+":ft:recent-search-queries"}initRecentSearches(){var t;this.recentSearches=JSON.parse(null!==(t=window.localStorage.getItem(this.recentSearchesStorageKey))&&void 0!==t?t:"[]")}saveRecentSearches(){const t=JSON.stringify(this.recentSearches);window.localStorage.setItem(this.recentSearchesStorageKey,t),window.dispatchEvent(new StorageEvent("storage",{key:this.recentSearchesStorageKey,newValue:t,storageArea:window.localStorage,url:window.location.href}))}connectedCallback(){super.connectedCallback(),document.addEventListener("focusin",this.closeFloatingContainer),document.addEventListener("click",this.closeFloatingContainer)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("focusin",this.closeFloatingContainer),document.addEventListener("click",this.closeFloatingContainer)}updateSize(t){this.sizeCategory=t.detail.category}setFilter(t,e){let i=this.searchFilters.filter((e=>e.key!==t));this.facets.forEach((i=>{i.key===t&&Jt(i.rootNodes,(t=>t.childNodes)).forEach((t=>t.selected=e.includes(t.value)))})),e.length&&i.push({key:t,negative:!1,values:e}),this.searchFilters=i,this.scrollToFacet=t}setFiltersFromPreset(t){null!=t&&(null!=t.contentLocale&&(this.contentLocale=t.contentLocale),this.searchFilters=t.filters)}clearFilters(){this.facets.forEach((t=>Jt(t.rootNodes,(t=>t.childNodes)).forEach((t=>t.selected=!1)))),this.searchFilters=[];const t=this.facets[0];this.scrollToFacet=null==t?void 0:t.key}querySelector(t){return this.shadowRoot.querySelector(t)}querySelectorAll(t){return this.shadowRoot.querySelectorAll(t)}renderDesktopFloatingMenu(){return this.forceMenuOpen?i.nothing:i.html`
|
|
2527
2532
|
<div class="ft-search-bar--floating-panel"
|
|
2528
2533
|
@keyup=${this.onFloatingContainerKeyUp}
|
|
2529
2534
|
part="floating-panel"
|
|
@@ -1747,9 +1747,9 @@ class ui extends zt{constructor(t){if(super(t),this.it=q,t.type!==Ct)throw Error
|
|
|
1747
1747
|
@keydown=${e=>this.onOptionKeyDown(e,t)}
|
|
1748
1748
|
@click=${()=>this.selectOption(t)}>
|
|
1749
1749
|
<ft-ripple ?primary=${e} ?activated=${e}></ft-ripple>
|
|
1750
|
-
|
|
1750
|
+
<span>${t.label}</span>
|
|
1751
1751
|
</div>
|
|
1752
|
-
`}updated(t){var e;super.updated(t),t.has("options")&&(this.selectedOption=this.options.filter((t=>t.selected))[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1,this.dispatchEvent(new CustomEvent("change",{detail:null===(e=this.selectedOption)||void 0===e?void 0:e.value}))),t.has("optionsDisplayed")&&this.fixedMenuPosition&&this.hasOptionsMenuOpen&&this.positionOptionsMenu()}positionOptionsMenu(){this.optionsMenu.style.top=this.mainPanel.getBoundingClientRect().top+this.mainPanel.getBoundingClientRect().height+"px",this.optionsMenu.style.left=this.mainPanel.getBoundingClientRect().left+"px",this.optionsMenu.style.
|
|
1752
|
+
`}updated(t){var e;super.updated(t),t.has("options")&&(this.selectedOption=this.options.filter((t=>t.selected))[0]),t.has("selectedOption")&&(this.optionsDisplayed=!1,this.dispatchEvent(new CustomEvent("change",{detail:null===(e=this.selectedOption)||void 0===e?void 0:e.value}))),t.has("optionsDisplayed")&&this.fixedMenuPosition&&this.hasOptionsMenuOpen&&this.positionOptionsMenu()}positionOptionsMenu(){this.optionsMenu.style.top=this.mainPanel.getBoundingClientRect().top+this.mainPanel.getBoundingClientRect().height+"px",this.optionsMenu.style.left=this.mainPanel.getBoundingClientRect().left+"px",this.optionsMenu.style.width=this.mainPanel.getBoundingClientRect().width+"px"}contentAvailableCallback(t){var e,i;t.has("focusOptions")&&this.focusOptions&&(null===(i=null!==(e=this.selectedOptionElement)&&void 0!==e?e:this.firstOption)||void 0===i||i.focus(),this.focusOptions=!1)}get hasOptionsMenuOpen(){return!this.disabled&&this.optionsDisplayed&&this.hasOptions}get hasOptions(){return this.options.length>0}updateOptionsFromSlot(t){var e;t.stopPropagation();let i=null===(e=this.optionsSlot)||void 0===e?void 0:e.assignedElements().map((t=>t));i&&i.length>0&&(this.options=i)}onMainPanelKeyDown(t){switch(t.key){case" ":t.preventDefault(),t.stopPropagation();case"Enter":this.optionsDisplayed=!this.optionsDisplayed,this.focusOptions=!0;break;case"ArrowUp":case"ArrowDown":t.preventDefault(),t.stopPropagation(),this.optionsDisplayed=!0,this.focusOptions=!0}}onOptionsKeyDown(t){var e,i,o,s,n;let r;switch(t.key){case"Escape":this.optionsDisplayed=!1,null===(e=this.mainPanel)||void 0===e||e.focus();break;case"Tab":this.optionsDisplayed=!1;break;case"ArrowUp":t.preventDefault(),t.stopPropagation(),r=null!==(o=null===(i=this.focusedOption)||void 0===i?void 0:i.previousElementSibling)&&void 0!==o?o:this.lastOption;break;case"ArrowDown":t.preventDefault(),t.stopPropagation(),r=null!==(n=null===(s=this.focusedOption)||void 0===s?void 0:s.nextElementSibling)&&void 0!==n?n:this.firstOption}null==r||r.focus()}onOptionKeyDown(t,e){var i;"Enter"!==t.key&&" "!==t.key||(t.preventDefault(),t.stopPropagation(),this.selectOption(e),this.optionsDisplayed=!1,null===(i=this.mainPanel)||void 0===i||i.focus())}selectOption(t){this.selectedOption=t;for(let e of this.options)e.selected=e===t}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.hideOptions)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.hideOptions)}}Do.elementDefinitions={"ft-input-label":Fo,"ft-typography":Ve,"ft-ripple":ai,"ft-icon":ki},Do.styles=[_e,He,g`
|
|
1753
1753
|
*:focus {
|
|
1754
1754
|
outline: none;
|
|
1755
1755
|
}
|
|
@@ -1883,6 +1883,11 @@ class ui extends zt{constructor(t){if(super(t),this.it=q,t.type!==Ct)throw Error
|
|
|
1883
1883
|
align-items: center;
|
|
1884
1884
|
}
|
|
1885
1885
|
|
|
1886
|
+
.ft-select--option span {
|
|
1887
|
+
text-overflow: ellipsis;
|
|
1888
|
+
overflow: hidden;
|
|
1889
|
+
}
|
|
1890
|
+
|
|
1886
1891
|
.ft-select--helper-text {
|
|
1887
1892
|
padding: 0 12px 0 16px;
|
|
1888
1893
|
color: ${Lo.helperColor};
|
|
@@ -2515,7 +2520,7 @@ class ui extends zt{constructor(t){if(super(t),this.it=q,t.type!==Ct)throw Error
|
|
|
2515
2520
|
</div>
|
|
2516
2521
|
`}onSearchBarKeyDown(t){var e;switch(t.key){case"Escape":this.searchBar.mobileMenuOpen=!1,null===(e=this.searchBar.input)||void 0===e||e.blur();break;case"ArrowDown":t.stopPropagation(),t.preventDefault(),this.suggestManager.focusFirstSuggestion()}}onSearchBarKeyUp(t){const e=t.composedPath()[0];this.searchBar.query=e.value,"Enter"===t.key&&this.searchBar.launchSearch()}}Zo.styles=g`
|
|
2517
2522
|
|
|
2518
|
-
`;var Ko=function(t,e,i,o){for(var s,n=arguments.length,r=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,l=t.length-1;l>=0;l--)(s=t[l])&&(r=(n<3?s(r):n>3?s(e,i,r):s(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};null==window.fluidtopics&&console.warn("Fluid Topics public API was not found. You can find it here: https://www.npmjs.com/package/@fluid-topics/public-api");const Wo={filtersButton:"Filters",inputPlaceHolder:"Search",filterInputPlaceHolder:"Filter {0}",clearInputButton:"Clear",clearFilterButton:"Clear",displayMoreFilterValuesButton:"More",noFilterValuesAvailable:"No values available",searchButton:"Search",clearFilters:"Clear filters",contentLocaleSelector:"Lang",presetsSelector:"Preset",removeRecentSearch:"Remove",back:"Back"};class Vo extends CustomEvent{constructor(t){super("launch-search",{detail:t,bubbles:!0,composed:!0})}}class qo extends CustomEvent{constructor(t){super("change",{detail:t})}}const Jo=()=>{};class Xo extends xt{constructor(){super(...arguments),this.dense=!1,this.mode="auto",this.forceMobileMenuOpen=!1,this.forceMenuOpen=!1,this.baseUrl="",this.apiIntegrationIdentifier="ft-search-bar",this.availableContentLocales=[],this.availableContentLocalesInitialized=!1,this.labels={},this.labelResolver=new mt(Wo,{}),this.displayedFilters=[],this.presets=[],this.priors=[],this.searchRequestSerializer=t=>function(t,e){var i;const o=new URLSearchParams({"content-lang":null!==(i=e.contentLocale)&&void 0!==i?i:"all",query:e.query});if(e.filters.length>0){const t=e.filters.map((t=>{const e=t.values.map((t=>t.replace(/_/g,"\\\\\\\\_").replace(/~/g,"\\\\~").replace(/\*/g,"\\*"))).map((t=>encodeURIComponent(function(t){return`"${t}"`}(t)))).join("_");return`${t.key}~${e}`})).join("*");o.append("filters",t)}return new URL(`${t}/search/all?${o.toString()}`).href}(this.baseUrl,t),this.searchFilters=[],this.sizeCategory=It.M,this.displayFacets=!1,this.mobileMenuOpen=!1,this.facets=[],this.facetsInitialized=!1,this.knownFacetLabels=new Map,this.query="",this.suggestions=[],this.recentSearches=[],this.updateFacetsDebouncer=new e(500),this.suggestManager=new To(this),this.selectedFacetsManager=new _o(this),this.desktopSearchBarManager=new Zo(this),this.mobileSearchBarManager=new Ho(this),this.facetsLoaded=!1,this.closeFloatingContainer=t=>{this.isMobile()||(this.displayFacets=this.displayFacets&&t.composedPath().some((t=>t===this.floatingContainer)))},this.compareFilters=(t,e)=>t.key===e.key&&t.negative==e.negative&&t.values.length===e.values.length&&t.values.every((t=>e.values.includes(t))),this.compareRequests=(t,e)=>(null==t.contentLocale||null==e.contentLocale||t.contentLocale===e.contentLocale)&&t.filters.length===e.filters.length&&t.filters.every((t=>e.filters.some((e=>this.compareFilters(t,e)))))}isMobileMenuOpen(){return this.isMobile()&&(this.forceMobileMenuOpen||this.forceMenuOpen||this.mobileMenuOpen)}get request(){return{uiLocale:this.uiLocale,contentLocale:this.contentLocale,query:this.query,facets:this.facetsRequest,priors:this.hasPriors?this.priors:void 0,filters:this.searchFilters,paging:{perPage:0,page:1},sort:[]}}get facetsRequest(){const t=this.searchFilters.filter((t=>t.values.length>0&&!this.displayedFilters.includes(t.key))).map((t=>({id:t.key})));return[...this.displayedFilters.map((t=>({id:t}))),...t]}get suggestRequest(){return{contentLocale:this.contentLocale,input:this.query,filters:this.searchFilters,sort:[]}}isMobile(){switch(this.mode){case"mobile":return!0;case"desktop":return!1;default:return this.sizeCategory===It.S}}hasFacets(){return this.facetsRequest.length>0}get hasPresets(){return null!=this.presets&&this.presets.length>0}get hasPriors(){return null!=this.priors&&this.priors.length>0}hasLocaleSelector(){return this.availableContentLocales.length>1}focus(){var t;null===(t=this.container)||void 0===t||t.focus()}focusInput(){this.input?this.input.focus():setTimeout((()=>this.focusInput()),50)}clear(){this.query="",this.searchFilters=[],this.input&&(this.input.value=""),this.mobileMenuOpen=!1,this.displayFacets=!1}render(){return W`
|
|
2523
|
+
`;var Ko=function(t,e,i,o){for(var s,n=arguments.length,r=n<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o,l=t.length-1;l>=0;l--)(s=t[l])&&(r=(n<3?s(r):n>3?s(e,i,r):s(e,i))||r);return n>3&&r&&Object.defineProperty(e,i,r),r};null==window.fluidtopics&&console.warn("Fluid Topics public API was not found. You can find it here: https://www.npmjs.com/package/@fluid-topics/public-api");const Wo={filtersButton:"Filters",inputPlaceHolder:"Search",filterInputPlaceHolder:"Filter {0}",clearInputButton:"Clear",clearFilterButton:"Clear",displayMoreFilterValuesButton:"More",noFilterValuesAvailable:"No values available",searchButton:"Search",clearFilters:"Clear filters",contentLocaleSelector:"Lang",presetsSelector:"Preset",removeRecentSearch:"Remove",back:"Back"};class Vo extends CustomEvent{constructor(t){super("launch-search",{detail:t,bubbles:!0,composed:!0})}}class qo extends CustomEvent{constructor(t){super("change",{detail:t})}}const Jo=()=>{};class Xo extends xt{constructor(){super(...arguments),this.dense=!1,this.mode="auto",this.forceMobileMenuOpen=!1,this.forceMenuOpen=!1,this.baseUrl="",this.apiIntegrationIdentifier="ft-search-bar",this.availableContentLocales=[],this.availableContentLocalesInitialized=!1,this.labels={},this.labelResolver=new mt(Wo,{}),this.displayedFilters=[],this.presets=[],this.priors=[],this.searchRequestSerializer=t=>function(t,e){var i;const o=new URLSearchParams({"content-lang":null!==(i=e.contentLocale)&&void 0!==i?i:"all",query:e.query});if(e.filters.length>0){const t=e.filters.map((t=>{const e=t.values.map((t=>t.replace(/_/g,"\\\\\\\\_").replace(/~/g,"\\\\~").replace(/\*/g,"\\*"))).map((t=>encodeURIComponent(function(t){return`"${t}"`}(t)))).join("_");return`${t.key}~${e}`})).join("*");o.append("filters",t)}return new URL(`${t}/search/all?${o.toString()}`).href}(this.baseUrl,t),this.searchFilters=[],this.sizeCategory=It.M,this.displayFacets=!1,this.mobileMenuOpen=!1,this.facets=[],this.facetsInitialized=!1,this.knownFacetLabels=new Map,this.query="",this.suggestions=[],this.recentSearches=[],this.updateFacetsDebouncer=new e(500),this.suggestManager=new To(this),this.selectedFacetsManager=new _o(this),this.desktopSearchBarManager=new Zo(this),this.mobileSearchBarManager=new Ho(this),this.initDataDebouncer=new e(10),this.facetsLoaded=!1,this.closeFloatingContainer=t=>{this.isMobile()||(this.displayFacets=this.displayFacets&&t.composedPath().some((t=>t===this.floatingContainer)))},this.compareFilters=(t,e)=>t.key===e.key&&t.negative==e.negative&&t.values.length===e.values.length&&t.values.every((t=>e.values.includes(t))),this.compareRequests=(t,e)=>(null==t.contentLocale||null==e.contentLocale||t.contentLocale===e.contentLocale)&&t.filters.length===e.filters.length&&t.filters.every((t=>e.filters.some((e=>this.compareFilters(t,e)))))}isMobileMenuOpen(){return this.isMobile()&&(this.forceMobileMenuOpen||this.forceMenuOpen||this.mobileMenuOpen)}get request(){return{uiLocale:this.uiLocale,contentLocale:this.contentLocale,query:this.query,facets:this.facetsRequest,priors:this.hasPriors?this.priors:void 0,filters:this.searchFilters,paging:{perPage:0,page:1},sort:[]}}get facetsRequest(){const t=this.searchFilters.filter((t=>t.values.length>0&&!this.displayedFilters.includes(t.key))).map((t=>({id:t.key})));return[...this.displayedFilters.map((t=>({id:t}))),...t]}get suggestRequest(){return{contentLocale:this.contentLocale,input:this.query,filters:this.searchFilters,sort:[]}}isMobile(){switch(this.mode){case"mobile":return!0;case"desktop":return!1;default:return this.sizeCategory===It.S}}hasFacets(){return this.facetsRequest.length>0}get hasPresets(){return null!=this.presets&&this.presets.length>0}get hasPriors(){return null!=this.priors&&this.priors.length>0}hasLocaleSelector(){return this.availableContentLocales.length>1}focus(){var t;null===(t=this.container)||void 0===t||t.focus()}focusInput(){this.input?this.input.focus():setTimeout((()=>this.focusInput()),50)}clear(){this.query="",this.searchFilters=[],this.input&&(this.input.value=""),this.mobileMenuOpen=!1,this.displayFacets=!1}render(){return W`
|
|
2519
2524
|
<ft-size-watcher @change=${this.updateSize}></ft-size-watcher>
|
|
2520
2525
|
${this.renderSearchBar()}
|
|
2521
2526
|
`}renderSearchBar(){return this.facetsInitialized&&this.availableContentLocalesInitialized?this.isMobile()?this.mobileSearchBarManager.render():this.desktopSearchBarManager.render():W`
|
|
@@ -2643,7 +2648,7 @@ class ui extends zt{constructor(t){if(super(t),this.it=q,t.type!==Ct)throw Error
|
|
|
2643
2648
|
></ft-filter>
|
|
2644
2649
|
`}))}
|
|
2645
2650
|
</ft-snap-scroll>
|
|
2646
|
-
`:q}async firstUpdated(t){super.firstUpdated(t),this.initApi(),window.addEventListener("storage",(t=>{t.key===this.recentSearchesStorageKey&&this.initRecentSearches()}))}update(t){var e,i,o,s,n;if(t.has("labels")&&(this.labelResolver=new mt(Wo,this.labels)),t.has("sizeCategory")&&(this.mobileMenuOpen=!1,this.displayFacets=this.displayFacets&&!this.isMobile()),super.update(t),(t.has("availableContentLocales")||t.has("contentLocale"))&&this.availableContentLocales.length>0){const i=t=>this.availableContentLocales.some((e=>e.lang===t));i(this.contentLocale)||(this.contentLocale=t.has("contentLocale")&&i(t.get("contentLocale"))?t.get("contentLocale"):null===(e=this.availableContentLocales[0])||void 0===e?void 0:e.lang)}if(t.has("baseUrl")&&this.baseUrl&&(this.baseUrl.endsWith("/")&&(this.baseUrl=this.baseUrl.replace(/\/$/,"")),this.initRecentSearches()),t.has("presets")&&(null!==(i=this.presets)&&void 0!==i?i:[]).forEach((t=>t.filters.forEach((t=>t.values=t.values.map((t=>Je(t))))))),t.has("selectedPreset")){const t=(null!==(o=this.presets)&&void 0!==o?o:[]).find((t=>t.name===this.selectedPreset));t&&!this.compareRequests(this.request,t)&&this.setFiltersFromPreset(t)}t.has("contentLocale")&&null!=this.contentLocale&&(this.knownFacetLabels=new Map),["contentLocale","searchFilters"].some((e=>t.has(e)))&&(this.selectedPreset=null===(n=(null!==(s=this.presets)&&void 0!==s?s:[]).find((t=>this.compareRequests(t,this.request))))||void 0===n?void 0:n.name),["baseUrl","apiIntegrationIdentifier"].some((e=>t.has(e)))&&(this.api=void 0,this.initApi()
|
|
2651
|
+
`:q}async firstUpdated(t){super.firstUpdated(t),this.initApi(),window.addEventListener("storage",(t=>{t.key===this.recentSearchesStorageKey&&this.initRecentSearches()}))}update(t){var e,i,o,s,n;if(t.has("labels")&&(this.labelResolver=new mt(Wo,this.labels)),t.has("sizeCategory")&&(this.mobileMenuOpen=!1,this.displayFacets=this.displayFacets&&!this.isMobile()),super.update(t),(t.has("availableContentLocales")||t.has("contentLocale"))&&this.availableContentLocales.length>0){const i=t=>this.availableContentLocales.some((e=>e.lang===t));i(this.contentLocale)||(this.contentLocale=t.has("contentLocale")&&i(t.get("contentLocale"))?t.get("contentLocale"):null===(e=this.availableContentLocales[0])||void 0===e?void 0:e.lang)}if(t.has("baseUrl")&&this.baseUrl&&(this.baseUrl.endsWith("/")&&(this.baseUrl=this.baseUrl.replace(/\/$/,"")),this.initRecentSearches()),t.has("presets")&&(null!==(i=this.presets)&&void 0!==i?i:[]).forEach((t=>t.filters.forEach((t=>t.values=t.values.map((t=>Je(t))))))),t.has("selectedPreset")){const t=(null!==(o=this.presets)&&void 0!==o?o:[]).find((t=>t.name===this.selectedPreset));t&&!this.compareRequests(this.request,t)&&this.setFiltersFromPreset(t)}t.has("contentLocale")&&null!=this.contentLocale&&(this.knownFacetLabels=new Map),["contentLocale","searchFilters"].some((e=>t.has(e)))&&(this.selectedPreset=null===(n=(null!==(s=this.presets)&&void 0!==s?s:[]).find((t=>this.compareRequests(t,this.request))))||void 0===n?void 0:n.name),["baseUrl","apiIntegrationIdentifier"].some((e=>t.has(e)))&&(this.api=void 0,this.initApi()),t.has("api")&&this.api&&this.initSearchData(),["uiLocale","contentLocale","searchFilters","displayedFilters"].some((e=>t.has(e)))&&this.updateFacets(),["query","uiLocale","contentLocale","searchFilters","displayedFilters","api"].some((e=>t.has(e)))&&this.suggestManager.update(),["query","uiLocale","contentLocale","searchFilters"].some((e=>t.has(e)))&&this.dispatchEvent(new qo(this.request))}initSearchData(){this.availableContentLocalesInitialized=!1,this.facetsInitialized=!1,this.initDataDebouncer.run((()=>{var t;null===(t=this.api)||void 0===t||t.getAvailableSearchLocales().then((t=>t.contentLocales)).catch((()=>[])).then((t=>{this.availableContentLocales=t,this.availableContentLocalesInitialized=!0})),this.retrieveFacetsFromSearch().then((()=>this.facetsInitialized=!0))}))}contentAvailableCallback(t){var e,i,o;if(super.contentAvailableCallback(t),t.has("displayFacets")&&this.displayFacets&&(null===(e=this.floatingContainer)||void 0===e||e.focus()),null!=this.scrollToFacet&&this.facetsLoaded){null===(i=this.scrollingFiltersContainer)||void 0===i||i.scrollIndexIntoView(this.facets.findIndex((t=>t.key===this.scrollToFacet)));const t=null===(o=this.shadowRoot)||void 0===o?void 0:o.querySelector(`ft-accordion-item[data-facet-key="${this.scrollToFacet}"]`);t&&(t.active=!0),this.scrollToFacet=void 0}}initApi(){null==this.api&&(this.api=window.fluidtopics?new window.fluidtopics.FluidTopicsApi(this.baseUrl,this.apiIntegrationIdentifier,!0):void 0,setTimeout((()=>this.initApi()),10))}updateFacets(){this.api&&this.facetsInitialized&&(this.facetsRequest.length>0?(this.facetsLoaded=!1,this.updateFacetsDebouncer.run((async()=>{await this.retrieveFacetsFromSearch(),this.facetsLoaded=!0}))):this.facets=[])}async retrieveFacetsFromSearch(){var t;const e=new Map;await(null===(t=this.api)||void 0===t?void 0:t.search({...this.request,query:""}).then((t=>t.facets.forEach((t=>{this.knownFacetLabels.set(t.key,t.label),e.set(t.key,t)})))).catch(Jo)),this.facets=[];for(let t of this.facetsRequest)e.has(t.id)?this.facets.push(e.get(t.id)):this.knownFacetLabels.has(t.id)&&this.facets.push({key:t.id,label:this.knownFacetLabels.get(t.id),rootNodes:[],multiSelectionable:!0,hierarchical:!1})}onFloatingContainerKeyUp(t){var e;"Escape"===t.key&&(this.displayFacets=!1,null===(e=this.filtersOpener)||void 0===e||e.focus())}setQuery(t){this.input&&(this.input.value=t),this.query=t}launchSearch(){if(this.query){let t=this.recentSearches.filter((t=>t.toLowerCase()!==this.query.toLowerCase())).filter(((t,e)=>e<20));this.recentSearches=[this.query,...t],this.saveRecentSearches()}this.dispatchEvent(new Vo(this.request)),this.mobileMenuOpen=!1,this.displayFacets=!1,this.focus()}get recentSearchesStorageKey(){return this.baseUrl+":ft:recent-search-queries"}initRecentSearches(){var t;this.recentSearches=JSON.parse(null!==(t=window.localStorage.getItem(this.recentSearchesStorageKey))&&void 0!==t?t:"[]")}saveRecentSearches(){const t=JSON.stringify(this.recentSearches);window.localStorage.setItem(this.recentSearchesStorageKey,t),window.dispatchEvent(new StorageEvent("storage",{key:this.recentSearchesStorageKey,newValue:t,storageArea:window.localStorage,url:window.location.href}))}connectedCallback(){super.connectedCallback(),document.addEventListener("focusin",this.closeFloatingContainer),document.addEventListener("click",this.closeFloatingContainer)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("focusin",this.closeFloatingContainer),document.addEventListener("click",this.closeFloatingContainer)}updateSize(t){this.sizeCategory=t.detail.category}setFilter(t,e){let i=this.searchFilters.filter((e=>e.key!==t));this.facets.forEach((i=>{i.key===t&&qe(i.rootNodes,(t=>t.childNodes)).forEach((t=>t.selected=e.includes(t.value)))})),e.length&&i.push({key:t,negative:!1,values:e}),this.searchFilters=i,this.scrollToFacet=t}setFiltersFromPreset(t){null!=t&&(null!=t.contentLocale&&(this.contentLocale=t.contentLocale),this.searchFilters=t.filters)}clearFilters(){this.facets.forEach((t=>qe(t.rootNodes,(t=>t.childNodes)).forEach((t=>t.selected=!1)))),this.searchFilters=[];const t=this.facets[0];this.scrollToFacet=null==t?void 0:t.key}querySelector(t){return this.shadowRoot.querySelector(t)}querySelectorAll(t){return this.shadowRoot.querySelectorAll(t)}renderDesktopFloatingMenu(){return this.forceMenuOpen?q:W`
|
|
2647
2652
|
<div class="ft-search-bar--floating-panel"
|
|
2648
2653
|
@keyup=${this.onFloatingContainerKeyUp}
|
|
2649
2654
|
part="floating-panel"
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluid-topics/ft-search-bar",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.4",
|
|
4
4
|
"description": "Search bar component using Fluid Topics public API",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Lit"
|
|
@@ -19,18 +19,18 @@
|
|
|
19
19
|
"url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@fluid-topics/ft-accordion": "0.3.
|
|
23
|
-
"@fluid-topics/ft-button": "0.3.
|
|
24
|
-
"@fluid-topics/ft-chip": "0.3.
|
|
25
|
-
"@fluid-topics/ft-filter": "0.3.
|
|
26
|
-
"@fluid-topics/ft-icon": "0.3.
|
|
27
|
-
"@fluid-topics/ft-select": "0.3.
|
|
28
|
-
"@fluid-topics/ft-size-watcher": "0.3.
|
|
29
|
-
"@fluid-topics/ft-skeleton": "0.3.
|
|
30
|
-
"@fluid-topics/ft-snap-scroll": "0.3.
|
|
31
|
-
"@fluid-topics/ft-tooltip": "0.3.
|
|
32
|
-
"@fluid-topics/ft-typography": "0.3.
|
|
33
|
-
"@fluid-topics/ft-wc-utils": "0.3.
|
|
22
|
+
"@fluid-topics/ft-accordion": "0.3.4",
|
|
23
|
+
"@fluid-topics/ft-button": "0.3.4",
|
|
24
|
+
"@fluid-topics/ft-chip": "0.3.4",
|
|
25
|
+
"@fluid-topics/ft-filter": "0.3.4",
|
|
26
|
+
"@fluid-topics/ft-icon": "0.3.4",
|
|
27
|
+
"@fluid-topics/ft-select": "0.3.4",
|
|
28
|
+
"@fluid-topics/ft-size-watcher": "0.3.4",
|
|
29
|
+
"@fluid-topics/ft-skeleton": "0.3.4",
|
|
30
|
+
"@fluid-topics/ft-snap-scroll": "0.3.4",
|
|
31
|
+
"@fluid-topics/ft-tooltip": "0.3.4",
|
|
32
|
+
"@fluid-topics/ft-typography": "0.3.4",
|
|
33
|
+
"@fluid-topics/ft-wc-utils": "0.3.4",
|
|
34
34
|
"lit": "2.2.8"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"peerDependencies": {
|
|
40
40
|
"@fluid-topics/public-api": "1.0.18"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "3179cf74226f9447314e09a6b16a816871c0e15f"
|
|
43
43
|
}
|