@fluid-topics/ft-search-bar 0.3.15 → 0.3.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/build/ft-search-bar.d.ts +1 -1
  2. package/build/ft-search-bar.light.js +63 -63
  3. package/build/ft-search-bar.min.js +417 -405
  4. package/build/managers/SuggestManager.d.ts +1 -1
  5. package/build/managers/SuggestManager.js +67 -64
  6. package/package.json +14 -14
package/build/ft-search-bar.d.ts CHANGED
@@ -22,7 +22,7 @@ export declare class SearchStateChangeEvent extends CustomEvent<FtSearchRequest>
22
22
  }
23
23
  export declare class FtSearchBar extends FtLitElement implements FtSearchBarProperties {
24
24
  static elementDefinitions: ElementDefinitionsMap;
25
- static styles: import("lit").CSSResult[];
25
+ static styles: (import("lit").CSSResult | import("lit").CSSResult[])[];
26
26
  dense: boolean;
27
27
  mode?: DisplayMode;
28
28
  forceMobileMenuOpen: boolean;
package/build/ft-search-bar.light.js CHANGED
@@ -2094,7 +2094,7 @@ const K=Symbol.for(""),q=t=>{if((null==t?void 0:t.r)===K)return null==t?void 0:t
2094
2094
  }
2095
2095
  `;class ro extends e.FtLitElement{render(){return i.html`
2096
2096
  `}}ro.elementDefinitions={},ro.styles=eo,e.customElement("ft-skeleton")(ro);class no{constructor(t,i=300){this.searchBar=t,this.updateDebouncer=new e.Debouncer(i)}render(){const t=this.searchBar.recentSearches.filter((t=>t.toLowerCase().includes(this.searchBar.query.toLowerCase()))),e=this.searchBar.suggestions.length>0||t.length>0;return i.html`
2097
- <div class="ft-search-bar--suggestions ${e?"ft-search-bar--suggestions-not-empty":""}"
2097
+ <div class="ft-search-bar--suggestions ft-word-wrap ${e?"ft-search-bar--suggestions-not-empty":""}"
2098
2098
  part="suggestions-container"
2099
2099
  @keydown=${t=>this.onSuggestKeyDown(t)}>
2100
2100
  ${s.repeat(t.slice(0,5),(t=>t),(t=>i.html`
@@ -2131,79 +2131,79 @@ const K=Symbol.for(""),q=t=>{if((null==t?void 0:t.r)===K)return null==t?void 0:t
2131
2131
  <ft-icon variant="${e}" part="suggestion-icon">
2132
2132
  ${o}
2133
2133
  </ft-icon>
2134
- `}getFocusedSuggestionElement(){return this.searchBar.querySelector(".ft-search-bar--suggestion:focus-within")}getLastSuggestionElement(){let t=this.searchBar.querySelectorAll(".ft-search-bar--suggestion");return t.length>0?t[t.length-1]:null}getFirstSuggestionElement(){return this.searchBar.querySelector(".ft-search-bar--suggestion")}focusFirstSuggestion(){var t;null===(t=this.getFirstSuggestionElement())||void 0===t||t.focus()}}no.styles=i.css`
2135
- .ft-search-bar--mobile .ft-search-bar--suggestions {
2136
- flex-grow: 1;
2137
- flex-shrink: 1;
2138
- overflow-y: auto;
2139
- height: 0;
2140
- }
2134
+ `}getFocusedSuggestionElement(){return this.searchBar.querySelector(".ft-search-bar--suggestion:focus-within")}getLastSuggestionElement(){let t=this.searchBar.querySelectorAll(".ft-search-bar--suggestion");return t.length>0?t[t.length-1]:null}getFirstSuggestionElement(){return this.searchBar.querySelector(".ft-search-bar--suggestion")}focusFirstSuggestion(){var t;null===(t=this.getFirstSuggestionElement())||void 0===t||t.focus()}}no.styles=[e.wordWrap,i.css`
2135
+ .ft-search-bar--mobile .ft-search-bar--suggestions {
2136
+ flex-grow: 1;
2137
+ flex-shrink: 1;
2138
+ overflow-y: auto;
2139
+ height: 0;
2140
+ }
2141
2141
 
2142
- .ft-search-bar--mobile-menu-open .ft-search-bar--suggestions {
2143
- border-top: 1px solid ${io.colorOutline};
2144
- }
2142
+ .ft-search-bar--mobile-menu-open .ft-search-bar--suggestions {
2143
+ border-top: 1px solid ${io.colorOutline};
2144
+ }
2145
2145
 
2146
- .ft-search-bar--mobile-menu-open .ft-search-bar--suggestions {
2147
- height: initial;
2148
- }
2146
+ .ft-search-bar--mobile-menu-open .ft-search-bar--suggestions {
2147
+ height: initial;
2148
+ }
2149
2149
 
2150
- .ft-search-bar--floating-panel,
2151
- .ft-search-bar--desktop .ft-search-bar--suggestions {
2152
- position: absolute;
2153
- z-index: ${io.floatingZIndex};
2154
- top: 100%;
2155
- left: -1px;
2156
- right: -1px;
2157
- display: none;
2158
- background: ${io.colorSurface};
2159
- border: 1px solid ${io.colorOutline};
2160
- border-radius: 0 0 ${io.borderRadius} ${io.borderRadius};
2161
- box-shadow: ${io.elevation02};
2162
- outline: none;
2163
- }
2150
+ .ft-search-bar--floating-panel,
2151
+ .ft-search-bar--desktop .ft-search-bar--suggestions {
2152
+ position: absolute;
2153
+ z-index: ${io.floatingZIndex};
2154
+ top: 100%;
2155
+ left: -1px;
2156
+ right: -1px;
2157
+ display: none;
2158
+ background: ${io.colorSurface};
2159
+ border: 1px solid ${io.colorOutline};
2160
+ border-radius: 0 0 ${io.borderRadius} ${io.borderRadius};
2161
+ box-shadow: ${io.elevation02};
2162
+ outline: none;
2163
+ }
2164
2164
 
2165
- .ft-search-bar--desktop .ft-search-bar--suggestions {
2166
- top: calc(100% + 2px);
2167
- }
2165
+ .ft-search-bar--desktop .ft-search-bar--suggestions {
2166
+ top: calc(100% + 2px);
2167
+ }
2168
2168
 
2169
- .ft-search-bar--input-container:focus-within .ft-search-bar--suggestions-not-empty {
2170
- display: block;
2171
- }
2169
+ .ft-search-bar--input-container:focus-within .ft-search-bar--suggestions-not-empty {
2170
+ display: block;
2171
+ }
2172
2172
 
2173
- .ft-search-bar--suggestion {
2174
- text-decoration: none;
2175
- position: relative;
2176
- display: flex;
2177
- align-items: center;
2178
- padding: 8px;
2179
- gap: 8px;
2180
- cursor: pointer;
2181
- color: ${io.colorOnSurface};
2182
- min-height: 52px;
2183
- }
2173
+ .ft-search-bar--suggestion {
2174
+ text-decoration: none;
2175
+ position: relative;
2176
+ display: flex;
2177
+ align-items: center;
2178
+ padding: 8px;
2179
+ gap: 8px;
2180
+ cursor: pointer;
2181
+ color: ${io.colorOnSurface};
2182
+ min-height: 52px;
2183
+ }
2184
2184
 
2185
- .ft-search-bar--suggestion > *:not(ft-ripple) {
2186
- position: relative;
2187
- }
2185
+ .ft-search-bar--suggestion > *:not(ft-ripple) {
2186
+ position: relative;
2187
+ }
2188
2188
 
2189
- .ft-search-bar--desktop .ft-search-bar--suggestion {
2190
- min-height: 44px;
2191
- }
2189
+ .ft-search-bar--desktop .ft-search-bar--suggestion {
2190
+ min-height: 44px;
2191
+ }
2192
2192
 
2193
- .ft-search-bar--suggestion:focus {
2194
- outline: none;
2195
- }
2193
+ .ft-search-bar--suggestion:focus {
2194
+ outline: none;
2195
+ }
2196
2196
 
2197
- .ft-search-bar--recent-search + .ft-search-bar--suggestion:not(.ft-search-bar--recent-search) {
2198
- border-top: 1px solid ${io.colorOutline};
2199
- }
2197
+ .ft-search-bar--recent-search + .ft-search-bar--suggestion:not(.ft-search-bar--recent-search) {
2198
+ border-top: 1px solid ${io.colorOutline};
2199
+ }
2200
2200
 
2201
- .ft-search-bar--suggestion ft-typography {
2202
- display: block;
2203
- flex-grow: 1;
2204
- flex-shrink: 1;
2205
- }
2206
- `;class lo{constructor(t){this.searchBar=t}render(){if(!this.searchBar.hasLocaleSelector()&&!this.searchBar.hasFacets())return i.html``;const t=this.searchBar.isMobile(),e=!t&&this.searchBar.dense||t&&this.searchBar.isMobileMenuOpen(),o=i.html`
2201
+ .ft-search-bar--suggestion ft-typography {
2202
+ display: block;
2203
+ flex-grow: 1;
2204
+ flex-shrink: 1;
2205
+ }
2206
+ `];class lo{constructor(t){this.searchBar=t}render(){if(!this.searchBar.hasLocaleSelector()&&!this.searchBar.hasFacets())return i.html``;const t=this.searchBar.isMobile(),e=!t&&this.searchBar.dense||t&&this.searchBar.isMobileMenuOpen(),o=i.html`
2207
2207
  ${this.searchBar.hasLocaleSelector()&&(this.searchBar.hasFacets()||t)?i.html`
2208
2208
  <ft-chip part="selected-filters selected-filter-ft-locale"
2209
2209
  ?dense=${this.searchBar.dense&&!t}