@fluid-topics/ft-search-bar 1.3.49 → 1.3.50
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.light.js +74 -74
- package/build/ft-search-bar.min.js +156 -156
- package/build/managers/SuggestManager.js +17 -11
- package/package.json +16 -16
|
@@ -18,9 +18,9 @@ class SuggestManager {
|
|
|
18
18
|
role="listbox"
|
|
19
19
|
aria-label="${this.searchBar.labelResolver.resolve("suggestionsAriaLabel")}"
|
|
20
20
|
part="suggestions-container">
|
|
21
|
-
${repeat(filteredRecentSearches.slice(0, 5), query => query, (query, index) => html `
|
|
21
|
+
${repeat(filteredRecentSearches.slice(0, 5), (query) => query, (query, index) => html `
|
|
22
22
|
<div part="suggestion-container"
|
|
23
|
-
class
|
|
23
|
+
class="${this.searchBar.selectedSuggestOptionId === this.recentSearchId(index) ? "ft-search-bar--suggestions-selected" : nothing}">
|
|
24
24
|
<a href="${this.getRequestWithQuery(query)}"
|
|
25
25
|
part="suggestions"
|
|
26
26
|
class="ft-search-bar--suggestion ft-search-bar--recent-search"
|
|
@@ -49,9 +49,9 @@ class SuggestManager {
|
|
|
49
49
|
</ft-button>
|
|
50
50
|
</div>
|
|
51
51
|
`)}
|
|
52
|
-
${repeat(this.searchBar.suggestions, suggest => suggest.value, (suggest, index) => html `
|
|
52
|
+
${repeat(this.searchBar.suggestions, (suggest) => suggest.value, (suggest, index) => html `
|
|
53
53
|
<div part="suggestion-container"
|
|
54
|
-
class
|
|
54
|
+
class="${this.searchBar.selectedSuggestOptionId === this.suggestionId(index) ? "ft-search-bar--suggestions-selected" : nothing}">
|
|
55
55
|
<a href="${(this.getRequestWithQuery(suggest.value))}"
|
|
56
56
|
part="suggestions"
|
|
57
57
|
class="ft-search-bar--suggestion"
|
|
@@ -79,14 +79,14 @@ class SuggestManager {
|
|
|
79
79
|
return this.searchBar.searchRequestSerializer({
|
|
80
80
|
...this.searchBar.request,
|
|
81
81
|
paging: { page: 1 },
|
|
82
|
-
query
|
|
82
|
+
query,
|
|
83
83
|
});
|
|
84
84
|
}
|
|
85
85
|
update() {
|
|
86
86
|
return new Promise((accept, reject) => {
|
|
87
87
|
this.updateDebouncer.run(async () => {
|
|
88
88
|
this.searchBar.suggestions = this.searchBar.api && this.searchBar.query.length > 2
|
|
89
|
-
? await this.searchBar.api.getSuggestions(this.searchBar.suggestRequest).then(r => r.suggestions).catch(() => [])
|
|
89
|
+
? await this.searchBar.api.getSuggestions(this.searchBar.suggestRequest).then((r) => r.suggestions).catch(() => [])
|
|
90
90
|
: [];
|
|
91
91
|
accept();
|
|
92
92
|
});
|
|
@@ -100,7 +100,7 @@ class SuggestManager {
|
|
|
100
100
|
e.preventDefault();
|
|
101
101
|
e.stopPropagation();
|
|
102
102
|
this.selectSuggestion(null);
|
|
103
|
-
this.searchBar.recentSearches = this.searchBar.recentSearches.filter(q => q.toLowerCase() !== query.toLowerCase());
|
|
103
|
+
this.searchBar.recentSearches = this.searchBar.recentSearches.filter((q) => q.toLowerCase() !== query.toLowerCase());
|
|
104
104
|
this.searchBar.saveRecentSearches();
|
|
105
105
|
}
|
|
106
106
|
getIcon(suggest) {
|
|
@@ -116,9 +116,15 @@ class SuggestManager {
|
|
|
116
116
|
case "TOPIC":
|
|
117
117
|
icon = FtIcons.TOPICS;
|
|
118
118
|
break;
|
|
119
|
+
case "HTML_PACKAGE":
|
|
120
|
+
icon = FtIcons.BOX_CODE;
|
|
121
|
+
break;
|
|
122
|
+
case "HTML_PACKAGE_PAGE":
|
|
123
|
+
icon = FtIcons.FILE_CODE;
|
|
124
|
+
break;
|
|
119
125
|
}
|
|
120
126
|
return html `
|
|
121
|
-
<ft-icon .variant
|
|
127
|
+
<ft-icon .variant=${iconVariant} .value=${icon} part="suggestion-icon"></ft-icon>
|
|
122
128
|
`;
|
|
123
129
|
}
|
|
124
130
|
focusNextSuggestion() {
|
|
@@ -156,7 +162,7 @@ class SuggestManager {
|
|
|
156
162
|
return (_a = this.selectedSuggestOption) === null || _a === void 0 ? void 0 : _a.querySelector("[part=remove-suggestion]");
|
|
157
163
|
}
|
|
158
164
|
getLastSuggestionElement() {
|
|
159
|
-
|
|
165
|
+
const suggestions = this.searchBar.querySelectorAll("[part=suggestion-container]");
|
|
160
166
|
return suggestions.length > 0 ? suggestions[suggestions.length - 1] : null;
|
|
161
167
|
}
|
|
162
168
|
selectSuggestion(element) {
|
|
@@ -189,10 +195,10 @@ class SuggestManager {
|
|
|
189
195
|
return this.searchBar.displaySuggestListbox && (this.searchBar.suggestions.length > 0 || this.recentSearchesMatchingQuery.length > 0);
|
|
190
196
|
}
|
|
191
197
|
get recentSearchesMatchingQuery() {
|
|
192
|
-
return this.searchBar.recentSearches.filter(q => q.toLowerCase().includes(this.searchBar.query.toLowerCase()));
|
|
198
|
+
return this.searchBar.recentSearches.filter((q) => q.toLowerCase().includes(this.searchBar.query.toLowerCase()));
|
|
193
199
|
}
|
|
194
200
|
}
|
|
195
|
-
//language=css
|
|
201
|
+
// language=css
|
|
196
202
|
SuggestManager.styles = [
|
|
197
203
|
wordWrap,
|
|
198
204
|
css `
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluid-topics/ft-search-bar",
|
|
3
|
-
"version": "1.3.
|
|
3
|
+
"version": "1.3.50",
|
|
4
4
|
"description": "Search bar component using Fluid Topics public API",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Lit"
|
|
@@ -19,23 +19,23 @@
|
|
|
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": "1.3.
|
|
23
|
-
"@fluid-topics/ft-app-context": "1.3.
|
|
24
|
-
"@fluid-topics/ft-button": "1.3.
|
|
25
|
-
"@fluid-topics/ft-chip": "1.3.
|
|
26
|
-
"@fluid-topics/ft-filter": "1.3.
|
|
27
|
-
"@fluid-topics/ft-icon": "1.3.
|
|
28
|
-
"@fluid-topics/ft-select": "1.3.
|
|
29
|
-
"@fluid-topics/ft-size-watcher": "1.3.
|
|
30
|
-
"@fluid-topics/ft-skeleton": "1.3.
|
|
31
|
-
"@fluid-topics/ft-snap-scroll": "1.3.
|
|
32
|
-
"@fluid-topics/ft-tooltip": "1.3.
|
|
33
|
-
"@fluid-topics/ft-typography": "1.3.
|
|
34
|
-
"@fluid-topics/ft-wc-utils": "1.3.
|
|
22
|
+
"@fluid-topics/ft-accordion": "1.3.50",
|
|
23
|
+
"@fluid-topics/ft-app-context": "1.3.50",
|
|
24
|
+
"@fluid-topics/ft-button": "1.3.50",
|
|
25
|
+
"@fluid-topics/ft-chip": "1.3.50",
|
|
26
|
+
"@fluid-topics/ft-filter": "1.3.50",
|
|
27
|
+
"@fluid-topics/ft-icon": "1.3.50",
|
|
28
|
+
"@fluid-topics/ft-select": "1.3.50",
|
|
29
|
+
"@fluid-topics/ft-size-watcher": "1.3.50",
|
|
30
|
+
"@fluid-topics/ft-skeleton": "1.3.50",
|
|
31
|
+
"@fluid-topics/ft-snap-scroll": "1.3.50",
|
|
32
|
+
"@fluid-topics/ft-tooltip": "1.3.50",
|
|
33
|
+
"@fluid-topics/ft-typography": "1.3.50",
|
|
34
|
+
"@fluid-topics/ft-wc-utils": "1.3.50",
|
|
35
35
|
"lit": "3.1.0"
|
|
36
36
|
},
|
|
37
37
|
"devDependencies": {
|
|
38
|
-
"@fluid-topics/public-api": "1.0.110"
|
|
38
|
+
"@fluid-topics/public-api": "1.0.110-alpha"
|
|
39
39
|
},
|
|
40
|
-
"gitHead": "
|
|
40
|
+
"gitHead": "8624905b03e700cf33965e24ed75f491d5d39141"
|
|
41
41
|
}
|