@fluid-topics/ft-search-bar 0.3.61 → 0.3.63

package/build/ft-search-bar.js

@@ -598,6 +598,7 @@ export class FtSearchBar extends FtLitElement {
     renderDesktopFloatingMenu() {
         return this.forceMenuOpen ? nothing : html `
             <div class="ft-search-bar--floating-panel"
+                 id="ft-search-bar-floating-panel"
                  @keyup=${this.onFloatingContainerKeyUp}
                  part="floating-panel"
                  tabindex="-1">

package/build/ft-search-bar.light.js

@@ -536,7 +536,7 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
             ${e.setVariable(me.size,Le.iconSize)};
             ${e.setVariable(me.color,"var(--ft-button-internal-color)")};
         }
-    `];var Ne=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};class Te extends e.FtLitElement{constructor(){super(...arguments),this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.iconVariant=Ee.material,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.hideTooltip=!1,this.forceTooltip=!1,this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}render(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0};return this.addTooltipIfNeeded(i.html`
+    `];var Ne=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};class Te extends e.FtLitElement{constructor(){super(...arguments),this.role="button",this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.iconVariant=Ee.material,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.hideTooltip=!1,this.forceTooltip=!1,this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}render(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0};return this.addTooltipIfNeeded(i.html`
             <button part="button"
                     class="${r.classMap(t)}"
                     aria-label="${this.getLabel()}"
@@ -559,7 +559,7 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
                     </ft-tooltip>
                 `:t}resolveIcon(){return this.loading?i.html`
                 <ft-loader></ft-loader> `:this.icon?i.html`
-                        <ft-icon variant="${this.iconVariant}" value="${this.icon}"></ft-icon> `:i.nothing}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Te.elementDefinitions={"ft-ripple":be,"ft-tooltip":ye,"ft-typography":te,"ft-icon":De,"ft-loader":we},Te.styles=[e.safariEllipsisFix,Ae],Ne([o.property({type:Boolean})],Te.prototype,"primary",void 0),Ne([o.property({type:Boolean})],Te.prototype,"outlined",void 0),Ne([o.property({type:Boolean})],Te.prototype,"disabled",void 0),Ne([o.property({type:Boolean})],Te.prototype,"dense",void 0),Ne([o.property({type:Boolean})],Te.prototype,"round",void 0),Ne([o.property({type:String})],Te.prototype,"label",void 0),Ne([o.property({type:String})],Te.prototype,"icon",void 0),Ne([o.property({type:String})],Te.prototype,"iconVariant",void 0),Ne([o.property({type:Boolean})],Te.prototype,"trailingIcon",void 0),Ne([o.property({type:Boolean})],Te.prototype,"loading",void 0),Ne([o.property({type:String})],Te.prototype,"tooltipPosition",void 0),Ne([o.property({type:Boolean})],Te.prototype,"hideTooltip",void 0),Ne([o.property({type:Boolean})],Te.prototype,"forceTooltip",void 0),Ne([o.query(".ft-button")],Te.prototype,"button",void 0),Ne([o.query(".ft-button--label slot")],Te.prototype,"slottedContent",void 0),e.customElement("ft-button")(Te);const Re=e.FtCssVariableFactory.extend("--ft-checkbox-text-color",e.designSystemVariables.colorOnSurfaceHigh),Ze=e.FtCssVariableFactory.external(e.designSystemVariables.colorPrimary,"Design system"),Ue=e.FtCssVariableFactory.external(e.designSystemVariables.colorOnPrimary,"Design system"),_e=e.FtCssVariableFactory.extend("--ft-checkbox-border-color",e.designSystemVariables.colorOnSurfaceMedium),He=e.FtCssVariableFactory.external(e.designSystemVariables.colorOnSurfaceDisabled,"Design system"),Ve=i.css`
+                        <ft-icon variant="${this.iconVariant}" value="${this.icon}"></ft-icon> `:i.nothing}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Te.elementDefinitions={"ft-ripple":be,"ft-tooltip":ye,"ft-typography":te,"ft-icon":De,"ft-loader":we},Te.styles=[e.safariEllipsisFix,Ae],Ne([o.property({type:String,reflect:!0})],Te.prototype,"role",void 0),Ne([o.property({type:Boolean})],Te.prototype,"primary",void 0),Ne([o.property({type:Boolean})],Te.prototype,"outlined",void 0),Ne([o.property({type:Boolean})],Te.prototype,"disabled",void 0),Ne([o.property({type:Boolean})],Te.prototype,"dense",void 0),Ne([o.property({type:Boolean})],Te.prototype,"round",void 0),Ne([o.property({type:String})],Te.prototype,"label",void 0),Ne([o.property({type:String})],Te.prototype,"icon",void 0),Ne([o.property({type:String})],Te.prototype,"iconVariant",void 0),Ne([o.property({type:Boolean})],Te.prototype,"trailingIcon",void 0),Ne([o.property({type:Boolean})],Te.prototype,"loading",void 0),Ne([o.property({type:String})],Te.prototype,"tooltipPosition",void 0),Ne([o.property({type:Boolean})],Te.prototype,"hideTooltip",void 0),Ne([o.property({type:Boolean})],Te.prototype,"forceTooltip",void 0),Ne([o.query(".ft-button")],Te.prototype,"button",void 0),Ne([o.query(".ft-button--label slot")],Te.prototype,"slottedContent",void 0),e.customElement("ft-button")(Te);const Re=e.FtCssVariableFactory.extend("--ft-checkbox-text-color",e.designSystemVariables.colorOnSurfaceHigh),Ze=e.FtCssVariableFactory.external(e.designSystemVariables.colorPrimary,"Design system"),Ue=e.FtCssVariableFactory.external(e.designSystemVariables.colorOnPrimary,"Design system"),_e=e.FtCssVariableFactory.extend("--ft-checkbox-border-color",e.designSystemVariables.colorOnSurfaceMedium),He=e.FtCssVariableFactory.external(e.designSystemVariables.colorOnSurfaceDisabled,"Design system"),Ve=i.css`
     * {
         box-sizing: border-box;
     }
@@ -1296,9 +1296,12 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
             <div class="ft-accordion-item ${this.active?"ft-accordion-item--active":""}">
                 <div class="ft-accordion-item--toggle"
                      part="toggle"
+                     role="button"
                      @click=${()=>this.active=!this.active}
                      @keydown=${this.onToggleKeyDown}
-                     tabindex="0">
+                     tabindex="0"
+                     aria-controls="ft-accordion-item-content"
+                     aria-expanded="${this.active}">
                     <ft-ripple part="toggle-ripple"></ft-ripple>
                     ${this.icon?i.html`
                         <ft-icon variant="material">${this.icon}</ft-icon>
@@ -1311,7 +1314,10 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
                     `}
                     <ft-icon variant="material">${this.active?"expand_less":"expand_more"}</ft-icon>
                 </div>
-                <div class="ft-accordion-item--content" part="content" @focusin=${()=>this.active=!0}>
+                <div id="ft-accordion-item-content"
+                     class="ft-accordion-item--content"
+                     part="content"
+                     @focusin=${()=>this.active=!0}>
                     <slot></slot>
                 </div>
                 <div class="ft-accordion-item--separator" part="separator"></div>
@@ -2410,7 +2416,9 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
                            trailingIcon
                            icon="${this.searchBar.displayFacets?"expand_less":"expand_more"}"
                            @click=${t=>{t.stopPropagation(),this.searchBar.displayFacets=!this.searchBar.displayFacets}}
-                           @focusin=${t=>t.stopPropagation()}>
+                           @focusin=${t=>t.stopPropagation()}
+                           aria-controls="ft-search-bar-floating-panel"
+                           aria-expanded="${this.searchBar.displayFacets}">
                     ${this.searchBar.labelResolver.resolve("filtersButton")}
                 </ft-button>
             `:this.searchBar.hasLocaleSelector()?i.html`
@@ -2584,6 +2592,7 @@ const q=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===q)return null==t?void 0:t
             </ft-snap-scroll>
         `: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(fo,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=>ie(t))))))),t.has("presets")||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.dispatchStateChangeEvent()}dispatchStateChangeEvent(){this.stateChangeEventDebouncer.run((()=>this.dispatchEvent(new bo(this.request))))}initSearchData(){this.availableContentLocalesInitialized=!1,this.facetsLoaded=!1,this.facetsInitialized=!1,this.updateLocalesDebouncer.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.updateFacetsDebouncer.run((()=>{this.retrieveFacetsFromSearch().then((()=>{this.facetsLoaded=!0,this.facetsInitialized=!0}))}),this.facetsInitialized?500:10)}updateFacets(){this.api&&(this.facetsRequest.length>0?(this.facetsLoaded=!1,this.updateFacetsDebouncer.run((async()=>{await this.retrieveFacetsFromSearch(),this.facetsLoaded=!0,this.facetsInitialized=!0}),this.facetsInitialized?500:10)):this.facets=[])}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))}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(vo)),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 uo(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&&ee(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=>ee(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`
             <div class="ft-search-bar--floating-panel"
+                 id="ft-search-bar-floating-panel"
                  @keyup=${this.onFloatingContainerKeyUp}
                  part="floating-panel"
                  tabindex="-1">

package/build/ft-search-bar.min.js

@@ -679,7 +679,7 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
             ${yt(wi.size,Ii.iconSize)};
             ${yt(wi.color,"var(--ft-button-internal-color)")};
         }
-    `];var _i=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};class Hi extends wt{constructor(){super(...arguments),this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.iconVariant=Ri.material,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.hideTooltip=!1,this.forceTooltip=!1,this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}render(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0};return this.addTooltipIfNeeded(X`
+    `];var _i=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};class Hi extends wt{constructor(){super(...arguments),this.role="button",this.primary=!1,this.outlined=!1,this.disabled=!1,this.dense=!1,this.round=!1,this.label="",this.icon=void 0,this.iconVariant=Ri.material,this.trailingIcon=!1,this.loading=!1,this.tooltipPosition="bottom",this.hideTooltip=!1,this.forceTooltip=!1,this.onclick=t=>{this.isDisabled()&&(t.preventDefault(),t.stopPropagation(),t.stopImmediatePropagation())}}render(){const t={"ft-button":!0,"ft-button--primary":this.primary,"ft-button--outlined":this.outlined,"ft-button--dense":this.dense,"ft-button--round":this.round,"ft-button--trailing-icon":this.trailingIcon,"ft-button--loading":this.trailingIcon,"ft-no-text-select":!0};return this.addTooltipIfNeeded(X`
             <button part="button"
                     class="${ni(t)}"
                     aria-label="${this.getLabel()}"
@@ -702,7 +702,7 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
                     </ft-tooltip>
                 `:t}resolveIcon(){return this.loading?X`
                 <ft-loader></ft-loader> `:this.icon?X`
-                        <ft-icon variant="${this.iconVariant}" value="${this.icon}"></ft-icon> `:Q}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Hi.elementDefinitions={"ft-ripple":gi,"ft-tooltip":$i,"ft-typography":ei,"ft-icon":Di,"ft-loader":Si},Hi.styles=[Ot,Ti],_i([o({type:Boolean})],Hi.prototype,"primary",void 0),_i([o({type:Boolean})],Hi.prototype,"outlined",void 0),_i([o({type:Boolean})],Hi.prototype,"disabled",void 0),_i([o({type:Boolean})],Hi.prototype,"dense",void 0),_i([o({type:Boolean})],Hi.prototype,"round",void 0),_i([o({type:String})],Hi.prototype,"label",void 0),_i([o({type:String})],Hi.prototype,"icon",void 0),_i([o({type:String})],Hi.prototype,"iconVariant",void 0),_i([o({type:Boolean})],Hi.prototype,"trailingIcon",void 0),_i([o({type:Boolean})],Hi.prototype,"loading",void 0),_i([o({type:String})],Hi.prototype,"tooltipPosition",void 0),_i([o({type:Boolean})],Hi.prototype,"hideTooltip",void 0),_i([o({type:Boolean})],Hi.prototype,"forceTooltip",void 0),_i([n(".ft-button")],Hi.prototype,"button",void 0),_i([n(".ft-button--label slot")],Hi.prototype,"slottedContent",void 0),p("ft-button")(Hi);const Zi=xt.extend("--ft-checkbox-text-color",mt.colorOnSurfaceHigh),Ki=xt.external(mt.colorPrimary,"Design system"),Wi=xt.external(mt.colorOnPrimary,"Design system"),Vi=xt.extend("--ft-checkbox-border-color",mt.colorOnSurfaceMedium),qi=xt.external(mt.colorOnSurfaceDisabled,"Design system"),Ji=y`
+                        <ft-icon variant="${this.iconVariant}" value="${this.icon}"></ft-icon> `:Q}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}getLabel(){return this.label||this.textContent}get textContent(){return this.unslotText(this.slottedContent).trim()}unslotText(t){return t instanceof HTMLSlotElement?t.assignedNodes().map((t=>this.unslotText(t))).join(""):(null==t?void 0:t.textContent)||""}hasTextContent(){return this.textContent.length>0}onSlotchange(){this.requestUpdate()}isDisabled(){return this.disabled||this.loading}}Hi.elementDefinitions={"ft-ripple":gi,"ft-tooltip":$i,"ft-typography":ei,"ft-icon":Di,"ft-loader":Si},Hi.styles=[Ot,Ti],_i([o({type:String,reflect:!0})],Hi.prototype,"role",void 0),_i([o({type:Boolean})],Hi.prototype,"primary",void 0),_i([o({type:Boolean})],Hi.prototype,"outlined",void 0),_i([o({type:Boolean})],Hi.prototype,"disabled",void 0),_i([o({type:Boolean})],Hi.prototype,"dense",void 0),_i([o({type:Boolean})],Hi.prototype,"round",void 0),_i([o({type:String})],Hi.prototype,"label",void 0),_i([o({type:String})],Hi.prototype,"icon",void 0),_i([o({type:String})],Hi.prototype,"iconVariant",void 0),_i([o({type:Boolean})],Hi.prototype,"trailingIcon",void 0),_i([o({type:Boolean})],Hi.prototype,"loading",void 0),_i([o({type:String})],Hi.prototype,"tooltipPosition",void 0),_i([o({type:Boolean})],Hi.prototype,"hideTooltip",void 0),_i([o({type:Boolean})],Hi.prototype,"forceTooltip",void 0),_i([n(".ft-button")],Hi.prototype,"button",void 0),_i([n(".ft-button--label slot")],Hi.prototype,"slottedContent",void 0),p("ft-button")(Hi);const Zi=xt.extend("--ft-checkbox-text-color",mt.colorOnSurfaceHigh),Ki=xt.external(mt.colorPrimary,"Design system"),Wi=xt.external(mt.colorOnPrimary,"Design system"),Vi=xt.extend("--ft-checkbox-border-color",mt.colorOnSurfaceMedium),qi=xt.external(mt.colorOnSurfaceDisabled,"Design system"),Ji=y`
     * {
         box-sizing: border-box;
     }
@@ -1439,9 +1439,12 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
             <div class="ft-accordion-item ${this.active?"ft-accordion-item--active":""}">
                 <div class="ft-accordion-item--toggle"
                      part="toggle"
+                     role="button"
                      @click=${()=>this.active=!this.active}
                      @keydown=${this.onToggleKeyDown}
-                     tabindex="0">
+                     tabindex="0"
+                     aria-controls="ft-accordion-item-content"
+                     aria-expanded="${this.active}">
                     <ft-ripple part="toggle-ripple"></ft-ripple>
                     ${this.icon?X`
                         <ft-icon variant="material">${this.icon}</ft-icon>
@@ -1454,7 +1457,10 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
                     `}
                     <ft-icon variant="material">${this.active?"expand_less":"expand_more"}</ft-icon>
                 </div>
-                <div class="ft-accordion-item--content" part="content" @focusin=${()=>this.active=!0}>
+                <div id="ft-accordion-item-content"
+                     class="ft-accordion-item--content"
+                     part="content"
+                     @focusin=${()=>this.active=!0}>
                     <slot></slot>
                 </div>
                 <div class="ft-accordion-item--separator" part="separator"></div>
@@ -2553,7 +2559,9 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
                            trailingIcon
                            icon="${this.searchBar.displayFacets?"expand_less":"expand_more"}"
                            @click=${t=>{t.stopPropagation(),this.searchBar.displayFacets=!this.searchBar.displayFacets}}
-                           @focusin=${t=>t.stopPropagation()}>
+                           @focusin=${t=>t.stopPropagation()}
+                           aria-controls="ft-search-bar-floating-panel"
+                           aria-expanded="${this.searchBar.displayFacets}">
                     ${this.searchBar.labelResolver.resolve("filtersButton")}
                 </ft-button>
             `:this.searchBar.hasLocaleSelector()?X`
@@ -2727,6 +2735,7 @@ class Oi extends Lt{constructor(t){if(super(t),this.it=Q,t.type!==Ft)throw Error
             </ft-snap-scroll>
         `: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,r;if(t.has("labels")&&(this.labelResolver=new Ct(gs,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=>oi(t))))))),t.has("presets")||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===(r=(null!==(s=this.presets)&&void 0!==s?s:[]).find((t=>this.compareRequests(t,this.request))))||void 0===r?void 0:r.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.dispatchStateChangeEvent()}dispatchStateChangeEvent(){this.stateChangeEventDebouncer.run((()=>this.dispatchEvent(new ys(this.request))))}initSearchData(){this.availableContentLocalesInitialized=!1,this.facetsLoaded=!1,this.facetsInitialized=!1,this.updateLocalesDebouncer.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.updateFacetsDebouncer.run((()=>{this.retrieveFacetsFromSearch().then((()=>{this.facetsLoaded=!0,this.facetsInitialized=!0}))}),this.facetsInitialized?500:10)}updateFacets(){this.api&&(this.facetsRequest.length>0?(this.facetsLoaded=!1,this.updateFacetsDebouncer.run((async()=>{await this.retrieveFacetsFromSearch(),this.facetsLoaded=!0,this.facetsInitialized=!0}),this.facetsInitialized?500:10)):this.facets=[])}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))}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(ms)),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 xs(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&&ii(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=>ii(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:X`
             <div class="ft-search-bar--floating-panel"
+                 id="ft-search-bar-floating-panel"
                  @keyup=${this.onFloatingContainerKeyUp}
                  part="floating-panel"
                  tabindex="-1">

package/build/managers/DesktopSearchBarManager.js

@@ -55,7 +55,9 @@ export class DesktopSearchBarManager {
                 e.stopPropagation();
                 this.searchBar.displayFacets = !this.searchBar.displayFacets;
             }}
-                           @focusin=${(e) => e.stopPropagation()}>
+                           @focusin=${(e) => e.stopPropagation()}
+                           aria-controls="ft-search-bar-floating-panel"
+                           aria-expanded="${this.searchBar.displayFacets}">
                     ${this.searchBar.labelResolver.resolve("filtersButton")}
                 </ft-button>
             `;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-search-bar",
-  "version": "0.3.61",
+  "version": "0.3.63",
   "description": "Search bar component using Fluid Topics public API",
   "keywords": [
     "Lit"
@@ -19,18 +19,18 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-accordion": "0.3.61",
-    "@fluid-topics/ft-button": "0.3.61",
-    "@fluid-topics/ft-chip": "0.3.61",
-    "@fluid-topics/ft-filter": "0.3.61",
-    "@fluid-topics/ft-icon": "0.3.61",
-    "@fluid-topics/ft-select": "0.3.61",
-    "@fluid-topics/ft-size-watcher": "0.3.61",
-    "@fluid-topics/ft-skeleton": "0.3.61",
-    "@fluid-topics/ft-snap-scroll": "0.3.61",
-    "@fluid-topics/ft-tooltip": "0.3.61",
-    "@fluid-topics/ft-typography": "0.3.61",
-    "@fluid-topics/ft-wc-utils": "0.3.61",
+    "@fluid-topics/ft-accordion": "0.3.63",
+    "@fluid-topics/ft-button": "0.3.63",
+    "@fluid-topics/ft-chip": "0.3.63",
+    "@fluid-topics/ft-filter": "0.3.63",
+    "@fluid-topics/ft-icon": "0.3.63",
+    "@fluid-topics/ft-select": "0.3.63",
+    "@fluid-topics/ft-size-watcher": "0.3.63",
+    "@fluid-topics/ft-skeleton": "0.3.63",
+    "@fluid-topics/ft-snap-scroll": "0.3.63",
+    "@fluid-topics/ft-tooltip": "0.3.63",
+    "@fluid-topics/ft-typography": "0.3.63",
+    "@fluid-topics/ft-wc-utils": "0.3.63",
     "lit": "2.2.8"
   },
   "devDependencies": {
@@ -39,5 +39,5 @@
   "peerDependencies": {
     "@fluid-topics/public-api": "1.0.32"
   },
-  "gitHead": "12a4024fb3084b17772a3aef10723d22ae56c877"
+  "gitHead": "0f9703a51261fa203c190b1852718e829ae31b7c"
 }