@fluid-topics/ft-search-selected-facets 1.1.107 → 1.1.109
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.
|
@@ -2,15 +2,15 @@ import { nothing } from "lit";
|
|
|
2
2
|
import { ElementDefinitionsMap } from "@fluid-topics/ft-wc-utils";
|
|
3
3
|
import { FtSearchSelectedFacetsProperties } from "./ft-search-selected-facets.properties";
|
|
4
4
|
import { FtSearchComponent } from "@fluid-topics/ft-search-context/build/registration";
|
|
5
|
-
import {
|
|
5
|
+
import { FtMetadataFilter, FtSearchFacet } from "@fluid-topics/public-api";
|
|
6
6
|
declare const FtSearchSelectedFacets_base: typeof FtSearchComponent & import("@fluid-topics/ft-wc-utils").Constructor<import("@fluid-topics/ft-i18n").FtLitElementWithI18nInterface>;
|
|
7
7
|
export declare class FtSearchSelectedFacets extends FtSearchSelectedFacets_base implements FtSearchSelectedFacetsProperties {
|
|
8
8
|
static elementDefinitions: ElementDefinitionsMap;
|
|
9
9
|
static styles: import("lit").CSSResult;
|
|
10
10
|
facets?: Array<FtSearchFacet>;
|
|
11
11
|
searchInDocumentTitlesOnly?: boolean;
|
|
12
|
-
|
|
13
|
-
get hasSomethingToDisplay():
|
|
12
|
+
filters?: FtMetadataFilter[];
|
|
13
|
+
get hasSomethingToDisplay(): boolean | undefined;
|
|
14
14
|
constructor();
|
|
15
15
|
protected render(): typeof nothing | import("lit").TemplateResult<1>;
|
|
16
16
|
private renderFacet;
|
|
@@ -20,5 +20,7 @@ export declare class FtSearchSelectedFacets extends FtSearchSelectedFacets_base
|
|
|
20
20
|
private unquote;
|
|
21
21
|
private renderSearchInDocumentTitlesOnly;
|
|
22
22
|
private renderPeriodFilter;
|
|
23
|
+
private renderDateFilter;
|
|
24
|
+
private renderRangeFilter;
|
|
23
25
|
}
|
|
24
26
|
export {};
|
|
@@ -17,8 +17,10 @@ import { searchTypeContext, searchTypeDefaultMessages } from "@fluid-topics/ft-s
|
|
|
17
17
|
import { periodFilterContext, periodFilterDefaultMessages } from "@fluid-topics/ft-search-period-filter";
|
|
18
18
|
class FtSearchSelectedFacets extends withI18n(FtSearchComponent) {
|
|
19
19
|
get hasSomethingToDisplay() {
|
|
20
|
-
var _a;
|
|
21
|
-
return this.searchInDocumentTitlesOnly
|
|
20
|
+
var _a, _b;
|
|
21
|
+
return this.searchInDocumentTitlesOnly
|
|
22
|
+
|| ((_a = this.facets) === null || _a === void 0 ? void 0 : _a.some(facet => this.getSelectedValues(facet).length > 0))
|
|
23
|
+
|| ((_b = this.filters) === null || _b === void 0 ? void 0 : _b.some(f => f.dateFilter || f.rangeFilter));
|
|
22
24
|
}
|
|
23
25
|
constructor() {
|
|
24
26
|
super();
|
|
@@ -26,6 +28,7 @@ class FtSearchSelectedFacets extends withI18n(FtSearchComponent) {
|
|
|
26
28
|
this.addI18nContext(periodFilterContext, periodFilterDefaultMessages);
|
|
27
29
|
}
|
|
28
30
|
render() {
|
|
31
|
+
var _a, _b;
|
|
29
32
|
if (!this.hasSomethingToDisplay) {
|
|
30
33
|
return nothing;
|
|
31
34
|
}
|
|
@@ -36,7 +39,7 @@ class FtSearchSelectedFacets extends withI18n(FtSearchComponent) {
|
|
|
36
39
|
return repeat(values, value => facet.key + "-" + value, value => this.renderFacet(facet.key, facet.label, values, value));
|
|
37
40
|
})}
|
|
38
41
|
${this.renderSearchInDocumentTitlesOnly()}
|
|
39
|
-
${this.renderPeriodFilter()}
|
|
42
|
+
${repeat((_b = (_a = this.filters) === null || _a === void 0 ? void 0 : _a.filter(f => f.dateFilter || f.rangeFilter)) !== null && _b !== void 0 ? _b : [], f => f.key, f => this.renderPeriodFilter(f))}
|
|
40
43
|
</div>
|
|
41
44
|
`;
|
|
42
45
|
}
|
|
@@ -51,7 +54,7 @@ class FtSearchSelectedFacets extends withI18n(FtSearchComponent) {
|
|
|
51
54
|
removable
|
|
52
55
|
label="${label}"
|
|
53
56
|
iconLabel=${"Remove " + label}
|
|
54
|
-
@icon-click=${() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.
|
|
57
|
+
@icon-click=${() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.setValueFilter(facetKey, selectedValues.filter(v => v !== value)); }}
|
|
55
58
|
data-key="${facetKey}"
|
|
56
59
|
data-value="${value}">
|
|
57
60
|
${this.getLabelFromValue(value)}
|
|
@@ -89,21 +92,37 @@ class FtSearchSelectedFacets extends withI18n(FtSearchComponent) {
|
|
|
89
92
|
</ft-tooltip>
|
|
90
93
|
` : nothing;
|
|
91
94
|
}
|
|
92
|
-
renderPeriodFilter() {
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
95
|
+
renderPeriodFilter(filter) {
|
|
96
|
+
if (filter.dateFilter) {
|
|
97
|
+
return this.renderDateFilter(filter.key, filter.dateFilter);
|
|
98
|
+
}
|
|
99
|
+
if (filter.rangeFilter) {
|
|
100
|
+
return this.renderRangeFilter(filter.key, filter.rangeFilter);
|
|
101
|
+
}
|
|
102
|
+
return nothing;
|
|
103
|
+
}
|
|
104
|
+
renderDateFilter(key, dateFilter) {
|
|
105
|
+
return html `
|
|
106
|
+
<ft-tooltip inline text="${periodFilterContext.messages.period(periodFilterContext.messages[dateFilter.type]())}"
|
|
98
107
|
part=" tooltips tooltip-search-period-filter">
|
|
99
108
|
<ft-chip
|
|
100
109
|
part="ft-search-selected-facets ft-search-selected-facet-period-filter"
|
|
101
110
|
removable
|
|
102
|
-
@icon-click=${() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.
|
|
103
|
-
${periodFilterContext.messages[
|
|
111
|
+
@icon-click=${() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.removeDateFilter(key); }}>
|
|
112
|
+
${periodFilterContext.messages[dateFilter.type]()}
|
|
104
113
|
</ft-chip>
|
|
105
|
-
</ft-tooltip
|
|
106
|
-
|
|
114
|
+
</ft-tooltip>`;
|
|
115
|
+
}
|
|
116
|
+
renderRangeFilter(key, rangeFilter) {
|
|
117
|
+
return html `
|
|
118
|
+
<ft-tooltip inline text="${periodFilterContext.messages.period(periodFilterContext.messages.customPeriod(rangeFilter.from, rangeFilter.to))}" part=" tooltips tooltip-search-period-filter">
|
|
119
|
+
<ft-chip
|
|
120
|
+
part="ft-search-selected-facets ft-search-selected-facet-period-filter"
|
|
121
|
+
removable
|
|
122
|
+
@icon-click=${() => { var _a; return (_a = this.stateManager) === null || _a === void 0 ? void 0 : _a.removeRangeFilter(key); }}>
|
|
123
|
+
${periodFilterContext.messages["CUSTOM"]()}
|
|
124
|
+
</ft-chip>
|
|
125
|
+
</ft-tooltip>`;
|
|
107
126
|
}
|
|
108
127
|
}
|
|
109
128
|
FtSearchSelectedFacets.elementDefinitions = {
|
|
@@ -118,6 +137,6 @@ __decorate([
|
|
|
118
137
|
redux({ store: "search", selector: searchInDocumentTitlesOnlySelector })
|
|
119
138
|
], FtSearchSelectedFacets.prototype, "searchInDocumentTitlesOnly", void 0);
|
|
120
139
|
__decorate([
|
|
121
|
-
redux({ store: "search", selector: (state) => state.request.
|
|
122
|
-
], FtSearchSelectedFacets.prototype, "
|
|
140
|
+
redux({ store: "search", selector: (state) => state.request.metadataFilters })
|
|
141
|
+
], FtSearchSelectedFacets.prototype, "filters", void 0);
|
|
123
142
|
export { FtSearchSelectedFacets };
|