@fluid-topics/ft-search-bar 0.2.19 → 0.2.22

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.
@@ -195,7 +195,8 @@ export class FtSearchBar extends FtLitElement {
195
195
  ${this.isMobile ? this.renderMobileSearchBar() : this.renderDesktopSearchBar()}
196
196
  </div>
197
197
  ` : html `
198
- <ft-skeleton class="ft-search-bar--container ft-search-bar--skeleton" part="loader" tabindex="-1"></ft-skeleton>
198
+ <ft-skeleton class="ft-search-bar--container ft-search-bar--skeleton" part="loader"
199
+ tabindex="-1"></ft-skeleton>
199
200
  `;
200
201
  }
201
202
  renderMobileSearchBar() {
@@ -277,6 +278,7 @@ export class FtSearchBar extends FtLitElement {
277
278
  </ft-typography>
278
279
  </div>
279
280
  <ft-filter
281
+ id="ft:locale"
280
282
  part="filters filter-ft-locale"
281
283
  .exportpartsPrefixes=${["filter", "filter-ft-locale"]}
282
284
  class="ft-search-bar--content-locale"
@@ -469,13 +471,15 @@ export class FtSearchBar extends FtLitElement {
469
471
  part="filters-container"
470
472
  exportpartsPrefix="filters-container">
471
473
  ${this.hasLocaleSelector ? html `
472
- <ft-filter class="ft-search-bar--content-locale"
473
- part="filters filter-ft-locale"
474
- .exportpartsPrefixes=${["filter", "filter-ft-locale"]}
475
- label="${this.labelResolver.resolve("contentLocaleSelector")}"
476
- filterPlaceHolder="${this.labelResolver.resolve("filterInputPlaceHolder", this.labelResolver.resolve("contentLocaleSelector"))}"
477
- .options=${(this.contentLocalesAsFilterOptions())}
478
- @change=${(e) => this.contentLocale = e.detail[0]}
474
+ <ft-filter
475
+ id="ft:locale"
476
+ class="ft-search-bar--content-locale"
477
+ part="filters filter-ft-locale"
478
+ .exportpartsPrefixes=${["filter", "filter-ft-locale"]}
479
+ label="${this.labelResolver.resolve("contentLocaleSelector")}"
480
+ filterPlaceHolder="${this.labelResolver.resolve("filterInputPlaceHolder", this.labelResolver.resolve("contentLocaleSelector"))}"
481
+ .options=${(this.contentLocalesAsFilterOptions())}
482
+ @change=${(e) => this.contentLocale = e.detail[0]}
479
483
  ></ft-filter>
480
484
  ` : nothing}
481
485
  ${repeat(this.facets, facet => facet.key, facet => {
@@ -514,7 +518,9 @@ export class FtSearchBar extends FtLitElement {
514
518
  <ft-chip part="selected-filters selected-filter-ft-locale"
515
519
  ?dense=${this.dense && !this.isMobile}
516
520
  ?clickable=${this.isMobile}
517
- @click=${() => this.openMobileFilters("ft:contentLocale")}>
521
+ @click=${() => this.openMobileFilters("ft:contentLocale")}
522
+ data-key="ft:locale"
523
+ data-value="${this.contentLocale}">
518
524
  ${(this.getLocaleLabel(this.contentLocale))}
519
525
  </ft-chip>
520
526
  ` : null}
@@ -533,7 +539,9 @@ export class FtSearchBar extends FtLitElement {
533
539
  label="${label}"
534
540
  title=${useSnapScroll ? label : nothing}
535
541
  @click=${() => this.openMobileFilters(facet.key)}
536
- @icon-click=${() => this.setFilter(facet.key, values.filter(v => v !== value))}>
542
+ @icon-click=${() => this.setFilter(facet.key, values.filter(v => v !== value))}
543
+ data-key="${facet.key}"
544
+ data-value="${value}">
537
545
  ${getLabelFromValue(value)}
538
546
  </ft-chip>
539
547
  `;