@fluid-topics/ft-filter 1.0.1 → 1.0.4

package/build/ft-filter-level.d.ts

@@ -3,7 +3,7 @@ import { FtFilterOptionProperties } from "./ft-filter-option.properties";
 export declare class FtFilterLevel extends FtLitElement {
     static elementDefinitions: ElementDefinitionsMap;
     static styles: import("lit").CSSResult;
-    id: string;
+    filterId: string;
     parent?: FtFilterOptionProperties;
     options: Array<FtFilterOptionProperties>;
     multivalued: boolean;

package/build/ft-filter-level.js

@@ -19,7 +19,7 @@ import { levelStyles } from "./ft-filter-level.css";
 class FtFilterLevel extends FtLitElement {
     constructor() {
         super(...arguments);
-        this.id = "";
+        this.filterId = "";
         this.options = [];
         this.multivalued = false;
         this.disabled = false;
@@ -114,7 +114,7 @@ class FtFilterLevel extends FtLitElement {
     buildMultiValuedOption(option) {
         var _a;
         return html `
-            <ft-checkbox name="${this.id}"
+            <ft-checkbox name="${this.filterId}"
                          part="multivalued-option"
                          data-value="${option.value}"
                          .checked=${option.selected}
@@ -127,7 +127,7 @@ class FtFilterLevel extends FtLitElement {
     }
     buildMonoValuedOption(option) {
         return html `
-            <ft-radio name="${this.id + Math.round(Math.random() * 1000000)}"
+            <ft-radio name="${this.filterId + Math.round(Math.random() * 1000000)}"
                       part="monovalued-option"
                       data-value="${option.value}"
                       .checked=${option.selected}
@@ -164,7 +164,7 @@ FtFilterLevel.elementDefinitions = {
 FtFilterLevel.styles = levelStyles;
 __decorate([
     property({ type: String })
-], FtFilterLevel.prototype, "id", void 0);
+], FtFilterLevel.prototype, "filterId", void 0);
 __decorate([
     property({ type: Object })
 ], FtFilterLevel.prototype, "parent", void 0);

package/build/ft-filter.css.js

@@ -123,7 +123,7 @@ export const styles = [
             height: 0;
         }
 
-        slot {
+        slot:not([name]) {
             display: none;
         }
     `

package/build/ft-filter.d.ts

@@ -24,7 +24,7 @@ export declare class FtFilter extends FtLitElement implements FtFilterProperties
     private container?;
     private valuesContainer?;
     private levelsContainer?;
-    private lastLevel?;
+    private lastLevelHasHiddenvalues;
     private filterInput?;
     private levels?;
     private withScroll;
@@ -47,6 +47,8 @@ export declare class FtFilter extends FtLitElement implements FtFilterProperties
     private onChange;
     private changeDebouncer;
     private optionsChanged;
+    private lastDispatchedValues;
+    private sendEventIfValuesChanged;
     private updateOptionsFromSlot;
     private onFilterChange;
     private updateScroll;

package/build/ft-filter.js

@@ -6,7 +6,7 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
 };
 import { html } from "lit";
 import { property, query, queryAll, state } from "lit/decorators.js";
-import { Debouncer, FtLitElement, jsonProperty } from "@fluid-topics/ft-wc-utils";
+import { Debouncer, deepEqual, FtLitElement, jsonProperty } from "@fluid-topics/ft-wc-utils";
 import { FtTypography } from "@fluid-topics/ft-typography";
 import { flatDeep } from "./utils";
 import { FtFilterLevel } from "./ft-filter-level";
@@ -33,12 +33,14 @@ class FtFilter extends FtLitElement {
         this.raiseSelectedOptions = false;
         this.displayedValuesLimit = 0;
         this.hideClearButton = false;
+        this.lastLevelHasHiddenvalues = false;
         this.withScroll = false;
         this.filter = "";
         this.displayedLevels = [];
         this.scrollResizeObserver = new ResizeObserver(() => this.updateScroll());
         this.levelsScrollDebouncer = new Debouncer(300);
         this.changeDebouncer = new Debouncer(10);
+        this.lastDispatchedValues = [];
     }
     get flatOptions() {
         return flatDeep(this.options, o => { var _a; return (_a = o.subOptions) !== null && _a !== void 0 ? _a : []; });
@@ -47,17 +49,18 @@ class FtFilter extends FtLitElement {
         return this.flatOptions.filter(o => o.selected).map(o => o.value);
     }
     render() {
-        var _a, _b;
         const valuesSelected = this.flatOptions.some(o => o.selected);
-        const showFilter = this.withScroll || this.filter || ((_b = (_a = this.lastLevel) === null || _a === void 0 ? void 0 : _a.hasHiddenValues) !== null && _b !== void 0 ? _b : false);
+        const showFilter = this.withScroll || this.filter || this.lastLevelHasHiddenvalues;
         const placeholder = this.filterPlaceHolder.replace("{0}", this.label);
         return html `
             <div class="ft-filter--container ${this.disabled ? "ft-filter--disabled" : ""}"
                  part="container">
                 ${!this.label && !valuesSelected ? null : html `
                     <div class="ft-filter--header" part="header">
-                        <ft-typography class="ft-filter--label" variant="overline" part="label">${this.label}
+                        <ft-typography class="ft-filter--label" variant="overline" part="label">
+                            ${this.label}
                         </ft-typography>
+                        <slot name="label"></slot>
                         ${valuesSelected && !this.hideClearButton ? html `
                             <ft-button icon="close" dense @click=${this.clear} part="clear-button">
                                 ${this.clearButtonLabel}
@@ -92,7 +95,7 @@ class FtFilter extends FtLitElement {
         }
     }
     contentAvailableCallback(props) {
-        var _a, _b;
+        var _a, _b, _c, _d, _e;
         super.contentAvailableCallback(props);
         if (this.valuesContainer) {
             this.scrollResizeObserver.observe(this.valuesContainer);
@@ -118,6 +121,7 @@ class FtFilter extends FtLitElement {
                 this.slideOut = undefined;
             }, 300);
         }
+        this.lastLevelHasHiddenvalues = (_e = (_d = (_c = this.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector(".ft-filter--levels ft-filter-level:last-child")) === null || _d === void 0 ? void 0 : _d.hasHiddenValues) !== null && _e !== void 0 ? _e : false;
     }
     renderLevels() {
         const allOptions = this.flatOptions;
@@ -127,7 +131,7 @@ class FtFilter extends FtLitElement {
         return html `
             ${this.raiseSelectedOptions && selectedOptions.length > 0 ? html `
                 <ft-filter-level
-                        id="${this.id}"
+                        filterId="${this.id}"
                         ?multivalued=${this.multivalued}
                         ?disabled=${this.disabled}
                         preventNavigation
@@ -165,7 +169,7 @@ class FtFilter extends FtLitElement {
         return html `
             <ft-filter-level
                     class="${className}"
-                    id="${this.id}"
+                    filterId="${this.id}"
                     .filter="${this.filter}"
                     moreValuesButtonLabel="${this.moreValuesButtonLabel}"
                     ?multivalued=${this.multivalued}
@@ -222,11 +226,18 @@ class FtFilter extends FtLitElement {
     optionsChanged() {
         this.changeDebouncer.run(() => {
             var _a;
-            this.dispatchEvent(new FtFilterChangeEvent(this.selectedValues));
+            this.sendEventIfValuesChanged();
             this.requestUpdate();
             (_a = this.levels) === null || _a === void 0 ? void 0 : _a.forEach(l => l.requestUpdate());
         });
     }
+    sendEventIfValuesChanged() {
+        const newValues = this.selectedValues;
+        if (!deepEqual(this.lastDispatchedValues, newValues)) {
+            this.dispatchEvent(new FtFilterChangeEvent(newValues));
+            this.lastDispatchedValues = newValues;
+        }
+    }
     updateOptionsFromSlot(e) {
         e.stopPropagation();
         this.options = this.slotElement.assignedElements().map(n => n);
@@ -299,8 +310,8 @@ __decorate([
     query(".ft-filter--levels")
 ], FtFilter.prototype, "levelsContainer", void 0);
 __decorate([
-    query(".ft-filter--levels ft-filter-level:last-child")
-], FtFilter.prototype, "lastLevel", void 0);
+    state()
+], FtFilter.prototype, "lastLevelHasHiddenvalues", void 0);
 __decorate([
     query(".ft-filter--filter input")
 ], FtFilter.prototype, "filterInput", void 0);

package/build/ft-filter.light.js

@@ -10,7 +10,7 @@ var l;const a=window,h=a.trustedTypes,p=h?h.createPolicy("lit-html",{createHTML:
      * Copyright 2020 Google LLC
      * SPDX-License-Identifier: BSD-3-Clause
      */
-const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t._$litStatic$},V=t=>({_$litStatic$:t,r:W}),K=new Map,G=(t=>(i,...e)=>{const o=e.length;let s,r;const n=[],l=[];let a,h=0,p=!1;for(;h<o;){for(a=i[h];h<o&&void 0!==(r=e[h],s=P(r));)a+=s+i[++h],p=!0;h!==o&&l.push(r),n.push(a),h++}if(h===o&&n.push(i[o]),p){const t=n.join("$$lit$$");void 0===(i=K.get(t))&&(n.raw=n,K.set(t,i=n)),e=l}return t(i,...e)})(C);var q;!function(t){t.title="title",t.title_dense="title-dense",t.subtitle1="subtitle1",t.subtitle2="subtitle2",t.body1="body1",t.body2="body2",t.caption="caption",t.breadcrumb="breadcrumb",t.overline="overline",t.button="button"}(q||(q={}));const X=i.FtCssVariableFactory.extend("--ft-typography-font-family",i.designSystemVariables.titleFont),Y=i.FtCssVariableFactory.extend("--ft-typography-font-family",i.designSystemVariables.contentFont),J={fontFamily:Y,fontSize:i.FtCssVariableFactory.create("--ft-typography-font-size","SIZE","16px"),fontWeight:i.FtCssVariableFactory.create("--ft-typography-font-weight","UNKNOWN","normal"),letterSpacing:i.FtCssVariableFactory.create("--ft-typography-letter-spacing","SIZE","0.496px"),lineHeight:i.FtCssVariableFactory.create("--ft-typography-line-height","NUMBER","1.5"),textTransform:i.FtCssVariableFactory.create("--ft-typography-text-transform","UNKNOWN","inherit")},Q=i.FtCssVariableFactory.extend("--ft-typography-title-font-family",X),tt=i.FtCssVariableFactory.extend("--ft-typography-title-font-size",J.fontSize,"20px"),it=i.FtCssVariableFactory.extend("--ft-typography-title-font-weight",J.fontWeight,"normal"),et=i.FtCssVariableFactory.extend("--ft-typography-title-letter-spacing",J.letterSpacing,"0.15px"),ot=i.FtCssVariableFactory.extend("--ft-typography-title-line-height",J.lineHeight,"1.2"),st=i.FtCssVariableFactory.extend("--ft-typography-title-text-transform",J.textTransform,"inherit"),rt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-family",X),nt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-size",J.fontSize,"14px"),lt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-weight",J.fontWeight,"normal"),at=i.FtCssVariableFactory.extend("--ft-typography-title-dense-letter-spacing",J.letterSpacing,"0.105px"),ht=i.FtCssVariableFactory.extend("--ft-typography-title-dense-line-height",J.lineHeight,"1.7"),pt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-text-transform",J.textTransform,"inherit"),ft=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-family",Y),ct=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-size",J.fontSize,"16px"),dt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-weight",J.fontWeight,"600"),ut=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-letter-spacing",J.letterSpacing,"0.144px"),vt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-line-height",J.lineHeight,"1.5"),bt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-text-transform",J.textTransform,"inherit"),xt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-family",Y),gt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-size",J.fontSize,"14px"),yt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-weight",J.fontWeight,"normal"),mt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-letter-spacing",J.letterSpacing,"0.098px"),$t=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-line-height",J.lineHeight,"1.7"),kt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-text-transform",J.textTransform,"inherit"),wt=i.FtCssVariableFactory.extend("--ft-typography-body1-font-family",Y),zt=i.FtCssVariableFactory.extend("--ft-typography-body1-font-size",J.fontSize,"16px"),St=i.FtCssVariableFactory.extend("--ft-typography-body1-font-weight",J.fontWeight,"normal"),Ot=i.FtCssVariableFactory.extend("--ft-typography-body1-letter-spacing",J.letterSpacing,"0.496px"),Ct=i.FtCssVariableFactory.extend("--ft-typography-body1-line-height",J.lineHeight,"1.5"),Bt=i.FtCssVariableFactory.extend("--ft-typography-body1-text-transform",J.textTransform,"inherit"),jt={fontFamily:i.FtCssVariableFactory.extend("--ft-typography-body2-font-family",Y),fontSize:i.FtCssVariableFactory.extend("--ft-typography-body2-font-size",J.fontSize,"14px"),fontWeight:i.FtCssVariableFactory.extend("--ft-typography-body2-font-weight",J.fontWeight,"normal"),letterSpacing:i.FtCssVariableFactory.extend("--ft-typography-body2-letter-spacing",J.letterSpacing,"0.252px"),lineHeight:i.FtCssVariableFactory.extend("--ft-typography-body2-line-height",J.lineHeight,"1.4"),textTransform:i.FtCssVariableFactory.extend("--ft-typography-body2-text-transform",J.textTransform,"inherit")},Et=i.FtCssVariableFactory.extend("--ft-typography-caption-font-family",Y),It=i.FtCssVariableFactory.extend("--ft-typography-caption-font-size",J.fontSize,"12px"),Nt=i.FtCssVariableFactory.extend("--ft-typography-caption-font-weight",J.fontWeight,"normal"),Tt=i.FtCssVariableFactory.extend("--ft-typography-caption-letter-spacing",J.letterSpacing,"0.396px"),Dt=i.FtCssVariableFactory.extend("--ft-typography-caption-line-height",J.lineHeight,"1.33"),At=i.FtCssVariableFactory.extend("--ft-typography-caption-text-transform",J.textTransform,"inherit"),Rt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-family",Y),Ft=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-size",J.fontSize,"10px"),Mt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-weight",J.fontWeight,"normal"),_t=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-letter-spacing",J.letterSpacing,"0.33px"),Lt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-line-height",J.lineHeight,"1.6"),Ht=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-text-transform",J.textTransform,"inherit"),Ut=i.FtCssVariableFactory.extend("--ft-typography-overline-font-family",Y),Zt=i.FtCssVariableFactory.extend("--ft-typography-overline-font-size",J.fontSize,"10px"),Wt=i.FtCssVariableFactory.extend("--ft-typography-overline-font-weight",J.fontWeight,"normal"),Pt=i.FtCssVariableFactory.extend("--ft-typography-overline-letter-spacing",J.letterSpacing,"1.5px"),Vt=i.FtCssVariableFactory.extend("--ft-typography-overline-line-height",J.lineHeight,"1.6"),Kt=i.FtCssVariableFactory.extend("--ft-typography-overline-text-transform",J.textTransform,"uppercase"),Gt={fontFamily:i.FtCssVariableFactory.extend("--ft-typography-button-font-family",Y),fontSize:i.FtCssVariableFactory.extend("--ft-typography-button-font-size",J.fontSize,"14px"),fontWeight:i.FtCssVariableFactory.extend("--ft-typography-button-font-weight",J.fontWeight,"600"),letterSpacing:i.FtCssVariableFactory.extend("--ft-typography-button-letter-spacing",J.letterSpacing,"1.246px"),lineHeight:i.FtCssVariableFactory.extend("--ft-typography-button-line-height",J.lineHeight,"1.15"),textTransform:i.FtCssVariableFactory.extend("--ft-typography-button-text-transform",J.textTransform,"uppercase")},qt=e.css`
+const V=Symbol.for(""),W=t=>{if((null==t?void 0:t.r)===V)return null==t?void 0:t._$litStatic$},P=t=>({_$litStatic$:t,r:V}),K=new Map,G=(t=>(i,...e)=>{const o=e.length;let s,r;const n=[],l=[];let a,h=0,p=!1;for(;h<o;){for(a=i[h];h<o&&void 0!==(r=e[h],s=W(r));)a+=s+i[++h],p=!0;h!==o&&l.push(r),n.push(a),h++}if(h===o&&n.push(i[o]),p){const t=n.join("$$lit$$");void 0===(i=K.get(t))&&(n.raw=n,K.set(t,i=n)),e=l}return t(i,...e)})(C);var q;!function(t){t.title="title",t.title_dense="title-dense",t.subtitle1="subtitle1",t.subtitle2="subtitle2",t.body1="body1",t.body2="body2",t.caption="caption",t.breadcrumb="breadcrumb",t.overline="overline",t.button="button"}(q||(q={}));const X=i.FtCssVariableFactory.extend("--ft-typography-font-family",i.designSystemVariables.titleFont),Y=i.FtCssVariableFactory.extend("--ft-typography-font-family",i.designSystemVariables.contentFont),J={fontFamily:Y,fontSize:i.FtCssVariableFactory.create("--ft-typography-font-size","SIZE","16px"),fontWeight:i.FtCssVariableFactory.create("--ft-typography-font-weight","UNKNOWN","normal"),letterSpacing:i.FtCssVariableFactory.create("--ft-typography-letter-spacing","SIZE","0.496px"),lineHeight:i.FtCssVariableFactory.create("--ft-typography-line-height","NUMBER","1.5"),textTransform:i.FtCssVariableFactory.create("--ft-typography-text-transform","UNKNOWN","inherit")},Q=i.FtCssVariableFactory.extend("--ft-typography-title-font-family",X),tt=i.FtCssVariableFactory.extend("--ft-typography-title-font-size",J.fontSize,"20px"),it=i.FtCssVariableFactory.extend("--ft-typography-title-font-weight",J.fontWeight,"normal"),et=i.FtCssVariableFactory.extend("--ft-typography-title-letter-spacing",J.letterSpacing,"0.15px"),ot=i.FtCssVariableFactory.extend("--ft-typography-title-line-height",J.lineHeight,"1.2"),st=i.FtCssVariableFactory.extend("--ft-typography-title-text-transform",J.textTransform,"inherit"),rt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-family",X),nt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-size",J.fontSize,"14px"),lt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-font-weight",J.fontWeight,"normal"),at=i.FtCssVariableFactory.extend("--ft-typography-title-dense-letter-spacing",J.letterSpacing,"0.105px"),ht=i.FtCssVariableFactory.extend("--ft-typography-title-dense-line-height",J.lineHeight,"1.7"),pt=i.FtCssVariableFactory.extend("--ft-typography-title-dense-text-transform",J.textTransform,"inherit"),ft=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-family",Y),ct=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-size",J.fontSize,"16px"),dt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-font-weight",J.fontWeight,"600"),ut=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-letter-spacing",J.letterSpacing,"0.144px"),vt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-line-height",J.lineHeight,"1.5"),bt=i.FtCssVariableFactory.extend("--ft-typography-subtitle1-text-transform",J.textTransform,"inherit"),xt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-family",Y),gt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-size",J.fontSize,"14px"),yt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-font-weight",J.fontWeight,"normal"),mt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-letter-spacing",J.letterSpacing,"0.098px"),$t=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-line-height",J.lineHeight,"1.7"),kt=i.FtCssVariableFactory.extend("--ft-typography-subtitle2-text-transform",J.textTransform,"inherit"),wt=i.FtCssVariableFactory.extend("--ft-typography-body1-font-family",Y),zt=i.FtCssVariableFactory.extend("--ft-typography-body1-font-size",J.fontSize,"16px"),St=i.FtCssVariableFactory.extend("--ft-typography-body1-font-weight",J.fontWeight,"normal"),Ot=i.FtCssVariableFactory.extend("--ft-typography-body1-letter-spacing",J.letterSpacing,"0.496px"),Ct=i.FtCssVariableFactory.extend("--ft-typography-body1-line-height",J.lineHeight,"1.5"),Bt=i.FtCssVariableFactory.extend("--ft-typography-body1-text-transform",J.textTransform,"inherit"),jt={fontFamily:i.FtCssVariableFactory.extend("--ft-typography-body2-font-family",Y),fontSize:i.FtCssVariableFactory.extend("--ft-typography-body2-font-size",J.fontSize,"14px"),fontWeight:i.FtCssVariableFactory.extend("--ft-typography-body2-font-weight",J.fontWeight,"normal"),letterSpacing:i.FtCssVariableFactory.extend("--ft-typography-body2-letter-spacing",J.letterSpacing,"0.252px"),lineHeight:i.FtCssVariableFactory.extend("--ft-typography-body2-line-height",J.lineHeight,"1.4"),textTransform:i.FtCssVariableFactory.extend("--ft-typography-body2-text-transform",J.textTransform,"inherit")},Et=i.FtCssVariableFactory.extend("--ft-typography-caption-font-family",Y),It=i.FtCssVariableFactory.extend("--ft-typography-caption-font-size",J.fontSize,"12px"),Nt=i.FtCssVariableFactory.extend("--ft-typography-caption-font-weight",J.fontWeight,"normal"),Tt=i.FtCssVariableFactory.extend("--ft-typography-caption-letter-spacing",J.letterSpacing,"0.396px"),Dt=i.FtCssVariableFactory.extend("--ft-typography-caption-line-height",J.lineHeight,"1.33"),At=i.FtCssVariableFactory.extend("--ft-typography-caption-text-transform",J.textTransform,"inherit"),Rt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-family",Y),Ft=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-size",J.fontSize,"10px"),Mt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-font-weight",J.fontWeight,"normal"),_t=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-letter-spacing",J.letterSpacing,"0.33px"),Lt=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-line-height",J.lineHeight,"1.6"),Ht=i.FtCssVariableFactory.extend("--ft-typography-breadcrumb-text-transform",J.textTransform,"inherit"),Ut=i.FtCssVariableFactory.extend("--ft-typography-overline-font-family",Y),Zt=i.FtCssVariableFactory.extend("--ft-typography-overline-font-size",J.fontSize,"10px"),Vt=i.FtCssVariableFactory.extend("--ft-typography-overline-font-weight",J.fontWeight,"normal"),Wt=i.FtCssVariableFactory.extend("--ft-typography-overline-letter-spacing",J.letterSpacing,"1.5px"),Pt=i.FtCssVariableFactory.extend("--ft-typography-overline-line-height",J.lineHeight,"1.6"),Kt=i.FtCssVariableFactory.extend("--ft-typography-overline-text-transform",J.textTransform,"uppercase"),Gt={fontFamily:i.FtCssVariableFactory.extend("--ft-typography-button-font-family",Y),fontSize:i.FtCssVariableFactory.extend("--ft-typography-button-font-size",J.fontSize,"14px"),fontWeight:i.FtCssVariableFactory.extend("--ft-typography-button-font-weight",J.fontWeight,"600"),letterSpacing:i.FtCssVariableFactory.extend("--ft-typography-button-letter-spacing",J.letterSpacing,"1.246px"),lineHeight:i.FtCssVariableFactory.extend("--ft-typography-button-line-height",J.lineHeight,"1.15"),textTransform:i.FtCssVariableFactory.extend("--ft-typography-button-text-transform",J.textTransform,"uppercase")},qt=e.css`
     .ft-typography--title {
         font-family: ${Q};
         font-size: ${tt};
@@ -87,9 +87,9 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
     .ft-typography--overline {
         font-family: ${Ut};
         font-size: ${Zt};
-        font-weight: ${Wt};
-        letter-spacing: ${Pt};
-        line-height: ${Vt};
+        font-weight: ${Vt};
+        letter-spacing: ${Wt};
+        line-height: ${Pt};
         text-transform: ${Kt};
     }
 `,si=e.css`
@@ -106,10 +106,10 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         vertical-align: inherit;
     }
 `;var ni=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class li extends i.FtLitElement{constructor(){super(...arguments),this.variant=q.body1}render(){return this.element?G`
-                <${V(this.element)}
+                <${P(this.element)}
                         class="ft-typography ft-typography--${this.variant}">
                     <slot></slot>
-                </${V(this.element)}>
+                </${P(this.element)}>
             `:G`
             <slot class="ft-typography ft-typography--${this.variant}"></slot>
         `}}function ai(t,i){return t.flatMap((t=>[t,...ai(i(t),i)]))}li.styles=[qt,Xt,Yt,Jt,Qt,ti,ii,ei,oi,si,ri],ni([o.property()],li.prototype,"element",void 0),ni([o.property()],li.prototype,"variant",void 0),i.customElement("ft-typography")(li);const hi=i.FtCssVariableFactory.extend("--ft-ripple-color",i.designSystemVariables.colorContent),pi={color:hi,backgroundColor:i.FtCssVariableFactory.extend("--ft-ripple-background-color",hi),opacityContentOnSurfacePressed:i.FtCssVariableFactory.external(i.designSystemVariables.opacityContentOnSurfacePressed,"Design system"),opacityContentOnSurfaceHover:i.FtCssVariableFactory.external(i.designSystemVariables.opacityContentOnSurfaceHover,"Design system"),opacityContentOnSurfaceFocused:i.FtCssVariableFactory.external(i.designSystemVariables.opacityContentOnSurfaceFocused,"Design system"),opacityContentOnSurfaceSelected:i.FtCssVariableFactory.external(i.designSystemVariables.opacityContentOnSurfaceSelected,"Design system"),borderRadius:i.FtCssVariableFactory.create("--ft-ripple-border-radius","SIZE","0px")},fi=i.FtCssVariableFactory.extend("--ft-ripple-color",i.designSystemVariables.colorPrimary),ci=fi,di=i.FtCssVariableFactory.extend("--ft-ripple-background-color",fi),ui=i.FtCssVariableFactory.extend("--ft-ripple-color",i.designSystemVariables.colorSecondary),vi=ui,bi=i.FtCssVariableFactory.extend("--ft-ripple-background-color",ui),xi=e.css`
@@ -219,7 +219,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                 <div class="ft-ripple--background"></div>
                 <div class="ft-ripple--effect"></div>
             </div>
-        `}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var i,e;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(i=this.target)||void 0===i||i.removeAttribute("data-is-ft-ripple-target")):null===(e=this.target)||void 0===e||e.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>{var t;const i=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;i&&this.setupFor(i),this.setRippleSize()}))}setupFor(t){if(this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const i=(...t)=>i=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(i)},e=i("mouseup","contextmenu"),o=i("touchend","touchcancel"),s=t=>{["Enter"," "].includes(t.key)&&i("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",e),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",s),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",e),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",s),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const i=t,e=t;let o,s;return null!=i.x?({x:o,y:s}=i):null!=e.touches&&(o=e.touches[0].clientX,s=e.touches[0].clientY),{x:o,y:s}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let i of t.composedPath()){if(i===this.target)break;if("hasAttribute"in i&&i.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}yi.elementDefinitions={},yi.styles=xi,gi([o.property({type:Boolean})],yi.prototype,"primary",void 0),gi([o.property({type:Boolean})],yi.prototype,"secondary",void 0),gi([o.property({type:Boolean})],yi.prototype,"unbounded",void 0),gi([o.property({type:Boolean})],yi.prototype,"activated",void 0),gi([o.property({type:Boolean})],yi.prototype,"selected",void 0),gi([o.property({type:Boolean})],yi.prototype,"disabled",void 0),gi([o.state()],yi.prototype,"hovered",void 0),gi([o.state()],yi.prototype,"focused",void 0),gi([o.state()],yi.prototype,"pressed",void 0),gi([o.state()],yi.prototype,"rippling",void 0),gi([o.state()],yi.prototype,"rippleSize",void 0),gi([o.state()],yi.prototype,"originX",void 0),gi([o.state()],yi.prototype,"originY",void 0),gi([o.query(".ft-ripple")],yi.prototype,"ripple",void 0),gi([o.query(".ft-ripple--effect")],yi.prototype,"rippleEffect",void 0),i.customElement("ft-ripple")(yi);const mi=i.FtCssVariableFactory.create("--ft-tooltip-distance","SIZE","4px"),$i=i.FtCssVariableFactory.create("--ft-tooltip-color","COLOR","#FFFFFF"),ki=i.FtCssVariableFactory.create("--ft-tooltip-background-color","COLOR","#666666"),wi=i.FtCssVariableFactory.create("--ft-tooltip-z-index","NUMBER","1"),zi=i.FtCssVariableFactory.external(i.designSystemVariables.borderRadiusS,"Design system"),Si=i.FtCssVariableFactory.create("--ft-tooltip-max-width","SIZE","150px"),Oi=e.css`
+        `}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var i,e;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(i=this.target)||void 0===i||i.removeAttribute("data-is-ft-ripple-target")):null===(e=this.target)||void 0===e||e.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>this.defaultSetup()))}defaultSetup(){var t,i;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;e&&this.setupFor(null!==(i=this.target)&&void 0!==i?i:e),this.setRippleSize()}setupFor(t){if(this.setupDebouncer.cancel(),this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const i=(...t)=>i=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(i)},e=i("mouseup","contextmenu"),o=i("touchend","touchcancel"),s=t=>{["Enter"," "].includes(t.key)&&i("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",e),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",s),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",e),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",s),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const i=t,e=t;let o,s;return null!=i.x?({x:o,y:s}=i):null!=e.touches&&(o=e.touches[0].clientX,s=e.touches[0].clientY),{x:o,y:s}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let i of t.composedPath()){if(i===this.target)break;if("hasAttribute"in i&&i.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}yi.elementDefinitions={},yi.styles=xi,gi([o.property({type:Boolean})],yi.prototype,"primary",void 0),gi([o.property({type:Boolean})],yi.prototype,"secondary",void 0),gi([o.property({type:Boolean})],yi.prototype,"unbounded",void 0),gi([o.property({type:Boolean})],yi.prototype,"activated",void 0),gi([o.property({type:Boolean})],yi.prototype,"selected",void 0),gi([o.property({type:Boolean})],yi.prototype,"disabled",void 0),gi([o.state()],yi.prototype,"hovered",void 0),gi([o.state()],yi.prototype,"focused",void 0),gi([o.state()],yi.prototype,"pressed",void 0),gi([o.state()],yi.prototype,"rippling",void 0),gi([o.state()],yi.prototype,"rippleSize",void 0),gi([o.state()],yi.prototype,"originX",void 0),gi([o.state()],yi.prototype,"originY",void 0),gi([o.query(".ft-ripple")],yi.prototype,"ripple",void 0),gi([o.query(".ft-ripple--effect")],yi.prototype,"rippleEffect",void 0),i.customElement("ft-ripple")(yi);const mi=i.FtCssVariableFactory.create("--ft-tooltip-distance","SIZE","4px"),$i=i.FtCssVariableFactory.create("--ft-tooltip-color","COLOR","#FFFFFF"),ki=i.FtCssVariableFactory.create("--ft-tooltip-background-color","COLOR","#666666"),wi=i.FtCssVariableFactory.create("--ft-tooltip-z-index","NUMBER","1"),zi=i.FtCssVariableFactory.external(i.designSystemVariables.borderRadiusS,"Design system"),Si=i.FtCssVariableFactory.create("--ft-tooltip-max-width","SIZE","150px"),Oi=e.css`
     .ft-tooltip--container {
         display: block;
         position: relative;
@@ -269,7 +269,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                     </div>
                 </div>
             </div>
-        `}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){["visible","text"].some((i=>t.has(i)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const i=t.getBoundingClientRect(),e=(i.height-this.tooltip.clientHeight)/2,o=(i.width-this.tooltip.clientWidth)/2;let s=0,r=0;switch(this.validPosition){case"top":r=-this.tooltip.clientHeight,s=o;break;case"bottom":r=i.height,s=o;break;case"left":r=e,s=-this.tooltip.clientWidth;break;case"right":r=e,s=i.width}i.left+s+this.tooltip.clientWidth>window.innerWidth&&(s=window.innerWidth-this.tooltip.clientWidth-i.left),i.left+s<0&&(s=0);const n=this.tooltip.style;n.left=s+"px",n.top=r+"px",n.maxWidth=`max(${i.width}px, ${Si})`}this.revealDebouncer.run((()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")}),this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout((()=>window.addEventListener("touchstart",(t=>{t.composedPath().includes(this.container)||this.onOut()}),{once:!0})),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}}Bi.elementDefinitions={"ft-typography":li},Bi.styles=Oi,Ci([o.property()],Bi.prototype,"text",void 0),Ci([o.property({type:Boolean})],Bi.prototype,"manual",void 0),Ci([o.property({type:Boolean})],Bi.prototype,"inline",void 0),Ci([o.property({type:Number})],Bi.prototype,"delay",void 0),Ci([o.property()],Bi.prototype,"position",void 0),Ci([o.queryAssignedNodes("",!0)],Bi.prototype,"slotNodes",void 0),Ci([o.query(".ft-tooltip--container")],Bi.prototype,"container",void 0),Ci([o.query("slot")],Bi.prototype,"target",void 0),Ci([o.query(".ft-tooltip")],Bi.prototype,"tooltip",void 0),Ci([o.query(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),Ci([o.state()],Bi.prototype,"visible",void 0),i.customElement("ft-tooltip")(Bi);const ji={color:i.FtCssVariableFactory.extend("--ft-loader-color",i.designSystemVariables.colorPrimary),size:i.FtCssVariableFactory.create("--ft-loader-size","SIZE","80px")},Ei=e.css`
+        `}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((i=>t.has(i)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const i=t.getBoundingClientRect(),e=(i.height-this.tooltip.clientHeight)/2,o=(i.width-this.tooltip.clientWidth)/2;let s=0,r=0;switch(this.validPosition){case"top":r=-this.tooltip.clientHeight,s=o;break;case"bottom":r=i.height,s=o;break;case"left":r=e,s=-this.tooltip.clientWidth;break;case"right":r=e,s=i.width}i.left+s+this.tooltip.clientWidth>window.innerWidth&&(s=window.innerWidth-this.tooltip.clientWidth-i.left),i.left+s<0&&(s=0);const n=this.tooltip.style;n.left=s+"px",n.top=r+"px",n.maxWidth=`max(${i.width}px, ${Si})`}this.revealDebouncer.run((()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")}),this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout((()=>window.addEventListener("touchstart",(t=>{t.composedPath().includes(this.container)||this.onOut()}),{once:!0})),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}}Bi.elementDefinitions={"ft-typography":li},Bi.styles=Oi,Ci([o.property()],Bi.prototype,"text",void 0),Ci([o.property({type:Boolean})],Bi.prototype,"manual",void 0),Ci([o.property({type:Boolean})],Bi.prototype,"inline",void 0),Ci([o.property({type:Number})],Bi.prototype,"delay",void 0),Ci([o.property()],Bi.prototype,"position",void 0),Ci([o.queryAssignedNodes("",!0)],Bi.prototype,"slotNodes",void 0),Ci([o.query(".ft-tooltip--container")],Bi.prototype,"container",void 0),Ci([o.query("slot")],Bi.prototype,"target",void 0),Ci([o.query(".ft-tooltip")],Bi.prototype,"tooltip",void 0),Ci([o.query(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),Ci([o.state()],Bi.prototype,"visible",void 0),i.customElement("ft-tooltip")(Bi);const ji={color:i.FtCssVariableFactory.extend("--ft-loader-color",i.designSystemVariables.colorPrimary),size:i.FtCssVariableFactory.create("--ft-loader-size","SIZE","80px")},Ei=e.css`
     :host {
         line-height: 0;
     }
@@ -398,7 +398,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                 ${n.unsafeHTML(this.resolvedIcon)}
                 <slot ?hidden=${i}></slot>
             </i>
-        `}get textContent(){var t,i;return null!==(i=null===(t=this.slottedContent)||void 0===t?void 0:t.assignedNodes().map((t=>t.textContent)).join("").trim())&&void 0!==i?i:""}update(t){super.update(t),["value","variant"].some((i=>t.has(i)))&&this.resolveIcon()}resolveIcon(){var t,i;let o=this.value||this.textContent;switch(this.variant){case Ri.file_format:this.resolvedIcon=null!==(t=Ti[o.replace("-","_").toUpperCase()])&&void 0!==t?t:o;break;case Ri.material:this.resolvedIcon=this.value||e.nothing;break;default:this.resolvedIcon=null!==(i=Ni[o.replace("-","_").toUpperCase()])&&void 0!==i?i:o}}firstUpdated(t){super.firstUpdated(t),setTimeout((()=>this.resolveIcon()))}}Mi.elementDefinitions={},Mi.styles=Ai,Fi([o.property()],Mi.prototype,"variant",void 0),Fi([o.property()],Mi.prototype,"value",void 0),Fi([o.state()],Mi.prototype,"resolvedIcon",void 0),Fi([o.query("slot")],Mi.prototype,"slottedContent",void 0),i.customElement("ft-icon")(Mi);const _i=i.FtCssVariableFactory.extend("--ft-button-color",i.designSystemVariables.colorPrimary),Li={backgroundColor:i.FtCssVariableFactory.extend("--ft-button-background-color",i.designSystemVariables.colorSurface),borderRadius:i.FtCssVariableFactory.extend("--ft-button-border-radius",i.designSystemVariables.borderRadiusL),color:_i,fontSize:i.FtCssVariableFactory.extend("--ft-button-font-size",Gt.fontSize),iconSize:i.FtCssVariableFactory.create("--ft-button-icon-size","SIZE","24px"),rippleColor:i.FtCssVariableFactory.extend("--ft-button-ripple-color",_i),verticalPadding:i.FtCssVariableFactory.create("--ft-button-vertical-padding","SIZE","6px"),horizontalPadding:i.FtCssVariableFactory.create("--ft-button-horizontal-padding","SIZE","8px"),iconPadding:i.FtCssVariableFactory.create("--ft-button-icon-padding","SIZE","8px"),opacityDisabled:i.FtCssVariableFactory.external(i.designSystemVariables.colorOpacityDisabled,"Design system")},Hi=i.FtCssVariableFactory.extend("--ft-button-primary-color",i.FtCssVariableFactory.extend("--ft-button-color",i.designSystemVariables.colorOnPrimary)),Ui={backgroundColor:i.FtCssVariableFactory.extend("--ft-button-primary-background-color",i.FtCssVariableFactory.extend("--ft-button-background-color",i.designSystemVariables.colorPrimary)),color:Hi,rippleColor:i.FtCssVariableFactory.extend("--ft-button-primary-ripple-color",Hi)},Zi=i.FtCssVariableFactory.extend("--ft-button-dense-border-radius",i.FtCssVariableFactory.extend("--ft-button-border-radius",i.designSystemVariables.borderRadiusM)),Wi=i.FtCssVariableFactory.create("--ft-button-dense-vertical-padding","SIZE","2px"),Pi=i.FtCssVariableFactory.create("--ft-button-dense-horizontal-padding","SIZE","4px"),Vi=i.FtCssVariableFactory.create("--ft-button-dense-icon-padding","SIZE","4px"),Ki=[e.css`
+        `}get textContent(){var t,i;return null!==(i=null===(t=this.slottedContent)||void 0===t?void 0:t.assignedNodes().map((t=>t.textContent)).join("").trim())&&void 0!==i?i:""}update(t){super.update(t),["value","variant"].some((i=>t.has(i)))&&this.resolveIcon()}resolveIcon(){var t,i;let o=this.value||this.textContent;switch(this.variant){case Ri.file_format:this.resolvedIcon=null!==(t=Ti[o.replace("-","_").toUpperCase()])&&void 0!==t?t:o;break;case Ri.material:this.resolvedIcon=this.value||e.nothing;break;default:this.resolvedIcon=null!==(i=Ni[o.replace("-","_").toUpperCase()])&&void 0!==i?i:o}}firstUpdated(t){super.firstUpdated(t),setTimeout((()=>this.resolveIcon()))}}Mi.elementDefinitions={},Mi.styles=Ai,Fi([o.property()],Mi.prototype,"variant",void 0),Fi([o.property()],Mi.prototype,"value",void 0),Fi([o.state()],Mi.prototype,"resolvedIcon",void 0),Fi([o.query("slot")],Mi.prototype,"slottedContent",void 0),i.customElement("ft-icon")(Mi);const _i=i.FtCssVariableFactory.extend("--ft-button-color",i.designSystemVariables.colorPrimary),Li={backgroundColor:i.FtCssVariableFactory.extend("--ft-button-background-color",i.designSystemVariables.colorSurface),borderRadius:i.FtCssVariableFactory.extend("--ft-button-border-radius",i.designSystemVariables.borderRadiusL),color:_i,fontSize:i.FtCssVariableFactory.extend("--ft-button-font-size",Gt.fontSize),iconSize:i.FtCssVariableFactory.create("--ft-button-icon-size","SIZE","24px"),rippleColor:i.FtCssVariableFactory.extend("--ft-button-ripple-color",_i),verticalPadding:i.FtCssVariableFactory.create("--ft-button-vertical-padding","SIZE","6px"),horizontalPadding:i.FtCssVariableFactory.create("--ft-button-horizontal-padding","SIZE","8px"),iconPadding:i.FtCssVariableFactory.create("--ft-button-icon-padding","SIZE","8px"),opacityDisabled:i.FtCssVariableFactory.external(i.designSystemVariables.colorOpacityDisabled,"Design system")},Hi=i.FtCssVariableFactory.extend("--ft-button-primary-color",i.FtCssVariableFactory.extend("--ft-button-color",i.designSystemVariables.colorOnPrimary)),Ui={backgroundColor:i.FtCssVariableFactory.extend("--ft-button-primary-background-color",i.FtCssVariableFactory.extend("--ft-button-background-color",i.designSystemVariables.colorPrimary)),color:Hi,rippleColor:i.FtCssVariableFactory.extend("--ft-button-primary-ripple-color",Hi)},Zi=i.FtCssVariableFactory.extend("--ft-button-dense-border-radius",i.FtCssVariableFactory.extend("--ft-button-border-radius",i.designSystemVariables.borderRadiusM)),Vi=i.FtCssVariableFactory.create("--ft-button-dense-vertical-padding","SIZE","2px"),Wi=i.FtCssVariableFactory.create("--ft-button-dense-horizontal-padding","SIZE","4px"),Pi=i.FtCssVariableFactory.create("--ft-button-dense-icon-padding","SIZE","4px"),Ki=[e.css`
         :host {
             display: inline-block;
             max-width: 100%;
@@ -456,13 +456,13 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         }
         
         .ft-button.ft-button--dense {
-            padding: ${Wi} ${Pi};
+            padding: ${Vi} ${Wi};
             border-radius: ${Zi};
-            gap: ${Vi};
+            gap: ${Pi};
         }
 
         .ft-button.ft-button--dense.ft-button--outlined {
-            padding: calc(${Wi} - 1px) calc(${Pi} - 1px);
+            padding: calc(${Vi} - 1px) calc(${Wi} - 1px);
         }
         
         .ft-button:not([disabled]):hover {
@@ -474,7 +474,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         }
 
         .ft-button--round.ft-button--dense {
-            border-radius: calc(var(--ft-button-internal-line-height) / 2 + ${Wi});
+            border-radius: calc(var(--ft-button-internal-line-height) / 2 + ${Vi});
         }
 
         .ft-button[disabled] {
@@ -504,7 +504,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         }
 
         .ft-button--dense .ft-button--label {
-            margin: 0 ${Vi};
+            margin: 0 ${Pi};
         }
 
         .ft-button--label[hidden] {
@@ -522,8 +522,8 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         }
 
         .ft-button--dense .ft-button--label[hidden] + ft-icon {
-            margin: 0 calc(${Pi} * -1);
-            padding: 0 ${Wi};
+            margin: 0 calc(${Wi} * -1);
+            padding: 0 ${Vi};
         }
 
         .ft-button:not(.ft-button--trailing-icon) ft-icon,
@@ -841,7 +841,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         margin: 10px 0;
         color: ${ve.colorOnSurfaceMedium};
     }
-`;var xe=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class ge extends i.FtLitElement{constructor(){super(...arguments),this.id="",this.options=[],this.multivalued=!1,this.disabled=!1,this.hideSelectedOptions=!1,this.preventNavigation=!1,this.filter="",this.moreValuesButtonLabel="More",this.displayedValuesLimit=0,this.displayedPages=1}get hasHiddenValues(){let t=this.limit;return null!=t&&t<this.options.length}get limit(){return this.displayedValuesLimit>0?this.displayedPages*this.displayedValuesLimit:void 0}get height(){var t,i;return null!==(i=null===(t=this.container)||void 0===t?void 0:t.scrollHeight)&&void 0!==i?i:0}render(){let t=[...this.options];this.hideSelectedOptions&&(t=t.filter((t=>!t.selected))),this.filter&&(t=t.filter((t=>t.label.toLowerCase().includes(this.filter.toLowerCase()))));const i=t.slice(0,this.limit);return e.html`
+`;var xe=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class ge extends i.FtLitElement{constructor(){super(...arguments),this.filterId="",this.options=[],this.multivalued=!1,this.disabled=!1,this.hideSelectedOptions=!1,this.preventNavigation=!1,this.filter="",this.moreValuesButtonLabel="More",this.displayedValuesLimit=0,this.displayedPages=1}get hasHiddenValues(){let t=this.limit;return null!=t&&t<this.options.length}get limit(){return this.displayedValuesLimit>0?this.displayedPages*this.displayedValuesLimit:void 0}get height(){var t,i;return null!==(i=null===(t=this.container)||void 0===t?void 0:t.scrollHeight)&&void 0!==i?i:0}render(){let t=[...this.options];this.hideSelectedOptions&&(t=t.filter((t=>!t.selected))),this.filter&&(t=t.filter((t=>t.label.toLowerCase().includes(this.filter.toLowerCase()))));const i=t.slice(0,this.limit);return e.html`
             <div class="ft-filter-level--container ${this.disabled?"ft-filter--disabled":""}">
                 ${null==this.parent?null:e.html`
                     <div tabindex="0"
@@ -885,7 +885,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                 `:e.nothing}
             </div>
         `}goBackOnKeyPress(t){"Enter"!==t.key&&" "!==t.key||this.dispatchEvent(new CustomEvent("go-back",{detail:this.parent}))}goBackOnClick(t){t.stopPropagation(),t.preventDefault(),this.dispatchEvent(new CustomEvent("go-back",{detail:this.parent}))}displayMore(){this.displayedPages++}buildMultiValuedOption(t){var i;return e.html`
-            <ft-checkbox name="${this.id}"
+            <ft-checkbox name="${this.filterId}"
                          part="multivalued-option"
                          data-value="${t.value}"
                          .checked=${t.selected}
@@ -895,7 +895,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                 ${t.renderOption?t.renderOption:t.label}
             </ft-checkbox>
         `}buildMonoValuedOption(t){return e.html`
-            <ft-radio name="${this.id+Math.round(1e6*Math.random())}"
+            <ft-radio name="${this.filterId+Math.round(1e6*Math.random())}"
                       part="monovalued-option"
                       data-value="${t.value}"
                       .checked=${t.selected}
@@ -905,7 +905,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                       @change=${t=>t.stopPropagation()}>
                 ${t.renderOption?t.renderOption:t.label}
             </ft-radio>
-        `}onRadioKeyUp(t,i){i.selected&&" "===t.key&&this.optionsChanged(t,i)}optionsChanged(t,i){t.stopPropagation(),this.dispatchEvent(new CustomEvent("change",{detail:i}))}displayLevel(t){this.dispatchEvent(new CustomEvent("display-level",{detail:t}))}}ge.elementDefinitions={"ft-button":qi,"ft-ripple":yi,"ft-typography":li,"ft-checkbox":oe,"ft-icon":Mi,"ft-radio":fe},ge.styles=be,xe([o.property({type:String})],ge.prototype,"id",void 0),xe([o.property({type:Object})],ge.prototype,"parent",void 0),xe([o.property({type:Array})],ge.prototype,"options",void 0),xe([o.property({type:Boolean})],ge.prototype,"multivalued",void 0),xe([o.property({type:Boolean})],ge.prototype,"disabled",void 0),xe([o.property({type:Boolean})],ge.prototype,"hideSelectedOptions",void 0),xe([o.property({type:Boolean})],ge.prototype,"preventNavigation",void 0),xe([o.property({type:String})],ge.prototype,"filter",void 0),xe([o.property({type:String})],ge.prototype,"moreValuesButtonLabel",void 0),xe([o.property({type:String})],ge.prototype,"noValuesLabel",void 0),xe([o.property({type:Number})],ge.prototype,"displayedValuesLimit",void 0),xe([o.query(".ft-filter-level--container")],ge.prototype,"container",void 0),xe([o.state()],ge.prototype,"displayedPages",void 0);const ye={buttonsColor:i.FtCssVariableFactory.extend("--ft-snap-scroll-buttons-color",i.designSystemVariables.colorPrimary),buttonsZIndex:i.FtCssVariableFactory.create("--ft-snap-scroll-buttons-z-index","COLOR","1"),gap:i.FtCssVariableFactory.create("--ft-snap-scroll-gap","SIZE","0"),colorSurface:i.FtCssVariableFactory.external(i.designSystemVariables.colorSurface,"Design system")},me=e.css`
+        `}onRadioKeyUp(t,i){i.selected&&" "===t.key&&this.optionsChanged(t,i)}optionsChanged(t,i){t.stopPropagation(),this.dispatchEvent(new CustomEvent("change",{detail:i}))}displayLevel(t){this.dispatchEvent(new CustomEvent("display-level",{detail:t}))}}ge.elementDefinitions={"ft-button":qi,"ft-ripple":yi,"ft-typography":li,"ft-checkbox":oe,"ft-icon":Mi,"ft-radio":fe},ge.styles=be,xe([o.property({type:String})],ge.prototype,"filterId",void 0),xe([o.property({type:Object})],ge.prototype,"parent",void 0),xe([o.property({type:Array})],ge.prototype,"options",void 0),xe([o.property({type:Boolean})],ge.prototype,"multivalued",void 0),xe([o.property({type:Boolean})],ge.prototype,"disabled",void 0),xe([o.property({type:Boolean})],ge.prototype,"hideSelectedOptions",void 0),xe([o.property({type:Boolean})],ge.prototype,"preventNavigation",void 0),xe([o.property({type:String})],ge.prototype,"filter",void 0),xe([o.property({type:String})],ge.prototype,"moreValuesButtonLabel",void 0),xe([o.property({type:String})],ge.prototype,"noValuesLabel",void 0),xe([o.property({type:Number})],ge.prototype,"displayedValuesLimit",void 0),xe([o.query(".ft-filter-level--container")],ge.prototype,"container",void 0),xe([o.state()],ge.prototype,"displayedPages",void 0);const ye={buttonsColor:i.FtCssVariableFactory.extend("--ft-snap-scroll-buttons-color",i.designSystemVariables.colorPrimary),buttonsZIndex:i.FtCssVariableFactory.create("--ft-snap-scroll-buttons-z-index","COLOR","1"),gap:i.FtCssVariableFactory.create("--ft-snap-scroll-gap","SIZE","0"),colorSurface:i.FtCssVariableFactory.external(i.designSystemVariables.colorSurface,"Design system")},me=e.css`
     .ft-snap-scroll {
         box-sizing: border-box;
         position: relative;
@@ -1163,30 +1163,32 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
             height: 0;
         }
 
-        slot {
+        slot:not([name]) {
             display: none;
         }
-    `];var Oe=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class Ce extends CustomEvent{constructor(t){super("change",{detail:t})}}class Be extends i.FtLitElement{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.noValuesLabel="No values available",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.hideClearButton=!1,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new i.Debouncer(300),this.changeDebouncer=new i.Debouncer(10)}get flatOptions(){return ai(this.options,(t=>{var i;return null!==(i=t.subOptions)&&void 0!==i?i:[]}))}get selectedValues(){return this.flatOptions.filter((t=>t.selected)).map((t=>t.value))}render(){var t,i;const o=this.flatOptions.some((t=>t.selected)),s=this.withScroll||this.filter||null!==(i=null===(t=this.lastLevel)||void 0===t?void 0:t.hasHiddenValues)&&void 0!==i&&i,r=this.filterPlaceHolder.replace("{0}",this.label);return e.html`
+    `];var Oe=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class Ce extends CustomEvent{constructor(t){super("change",{detail:t})}}class Be extends i.FtLitElement{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.noValuesLabel="No values available",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.hideClearButton=!1,this.lastLevelHasHiddenvalues=!1,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new i.Debouncer(300),this.changeDebouncer=new i.Debouncer(10),this.lastDispatchedValues=[]}get flatOptions(){return ai(this.options,(t=>{var i;return null!==(i=t.subOptions)&&void 0!==i?i:[]}))}get selectedValues(){return this.flatOptions.filter((t=>t.selected)).map((t=>t.value))}render(){const t=this.flatOptions.some((t=>t.selected)),i=this.withScroll||this.filter||this.lastLevelHasHiddenvalues,o=this.filterPlaceHolder.replace("{0}",this.label);return e.html`
             <div class="ft-filter--container ${this.disabled?"ft-filter--disabled":""}"
                  part="container">
-                ${this.label||o?e.html`
+                ${this.label||t?e.html`
                     <div class="ft-filter--header" part="header">
-                        <ft-typography class="ft-filter--label" variant="overline" part="label">${this.label}
+                        <ft-typography class="ft-filter--label" variant="overline" part="label">
+                            ${this.label}
                         </ft-typography>
-                        ${o&&!this.hideClearButton?e.html`
+                        <slot name="label"></slot>
+                        ${t&&!this.hideClearButton?e.html`
                             <ft-button icon="close" dense @click=${this.clear} part="clear-button">
                                 ${this.clearButtonLabel}
                             </ft-button>
                         `:null}
                     </div>
                 `:null}
-                <div class="ft-filter--filter" ?hidden=${!s}>
+                <div class="ft-filter--filter" ?hidden=${!i}>
                     <input type="search"
                            part="input"
                            class="ft-typography--caption"
-                           ?disabled=${!s}
-                           placeholder="${r}"
-                           size="${s?r.length:0}"
+                           ?disabled=${!i}
+                           placeholder="${o}"
+                           size="${i?o.length:0}"
                            @search=${this.onFilterChange}
                            @keyup=${this.onFilterChange}>
                 </div>
@@ -1197,10 +1199,10 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                       @slotchange=${this.updateOptionsFromSlot}
                       @option-change=${this.optionsChanged}></slot>
             </div>
-        `}update(t){if(super.update(t),t.has("options")){const t=new Set(this.flatOptions.map((t=>t.value)));this.displayedLevels=this.displayedLevels.filter((i=>t.has(i)))}}contentAvailableCallback(t){var i,e;super.contentAvailableCallback(t),this.valuesContainer&&this.scrollResizeObserver.observe(this.valuesContainer),this.container&&this.scrollResizeObserver.observe(this.container),t.has("options")&&(this.updateScroll(),null===(i=this.levelsContainer)||void 0===i||i.scrollToIndex(this.displayedLevels.length)),t.has("slideIn")&&this.slideIn&&setTimeout((()=>{var t;null===(t=this.levelsContainer)||void 0===t||t.next(),this.slideIn=void 0}),0),t.has("slideOut")&&this.slideOut&&(null===(e=this.levelsContainer)||void 0===e||e.previous(),setTimeout((()=>{this.displayedLevels.pop(),this.slideOut=void 0}),300))}renderLevels(){const t=this.flatOptions,i=t.filter((t=>t.selected)),o=this.slideIn||this.slideOut?this.displayedLevels.length-2:this.displayedLevels.length-1,s=o<0?"ft-filter--level-center":"ft-filter--level-left";return e.html`
+        `}update(t){if(super.update(t),t.has("options")){const t=new Set(this.flatOptions.map((t=>t.value)));this.displayedLevels=this.displayedLevels.filter((i=>t.has(i)))}}contentAvailableCallback(t){var i,e,o,s,r;super.contentAvailableCallback(t),this.valuesContainer&&this.scrollResizeObserver.observe(this.valuesContainer),this.container&&this.scrollResizeObserver.observe(this.container),t.has("options")&&(this.updateScroll(),null===(i=this.levelsContainer)||void 0===i||i.scrollToIndex(this.displayedLevels.length)),t.has("slideIn")&&this.slideIn&&setTimeout((()=>{var t;null===(t=this.levelsContainer)||void 0===t||t.next(),this.slideIn=void 0}),0),t.has("slideOut")&&this.slideOut&&(null===(e=this.levelsContainer)||void 0===e||e.previous(),setTimeout((()=>{this.displayedLevels.pop(),this.slideOut=void 0}),300)),this.lastLevelHasHiddenvalues=null!==(r=null===(s=null===(o=this.shadowRoot)||void 0===o?void 0:o.querySelector(".ft-filter--levels ft-filter-level:last-child"))||void 0===s?void 0:s.hasHiddenValues)&&void 0!==r&&r}renderLevels(){const t=this.flatOptions,i=t.filter((t=>t.selected)),o=this.slideIn||this.slideOut?this.displayedLevels.length-2:this.displayedLevels.length-1,s=o<0?"ft-filter--level-center":"ft-filter--level-left";return e.html`
             ${this.raiseSelectedOptions&&i.length>0?e.html`
                 <ft-filter-level
-                        id="${this.id}"
+                        filterId="${this.id}"
                         ?multivalued=${this.multivalued}
                         ?disabled=${this.disabled}
                         preventNavigation
@@ -1220,7 +1222,7 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
         `}renderLevel(t,i,o){return e.html`
             <ft-filter-level
                     class="${t}"
-                    id="${this.id}"
+                    filterId="${this.id}"
                     .filter="${this.filter}"
                     moreValuesButtonLabel="${this.moreValuesButtonLabel}"
                     ?multivalued=${this.multivalued}
@@ -1236,6 +1238,6 @@ const W=Symbol.for(""),P=t=>{if((null==t?void 0:t.r)===W)return null==t?void 0:t
                     .exportpartsPrefixes=${["values","available-values"]}
                     noValuesLabel="${this.noValuesLabel}"
             ></ft-filter-level>
-        `}goBack(t){this.slideOut=t.detail.value}onDisplayLevel(t){this.displayedLevels.push(t.detail.value),this.slideIn=t.detail.value}clear(){if(this.flatOptions.forEach((t=>t.selected=!1)),this.displayedLevels.length>0){let t=this.displayedLevels[this.displayedLevels.length-1];this.displayedLevels=[t],this.slideOut=t}this.optionsChanged()}onChange(t){var i;t.stopPropagation();const e=this.flatOptions.find((i=>i.value===t.detail.value));e.selected=!e.selected;const o=t=>{var i;t!==e&&(t.selected=!1),null===(i=t.subOptions)||void 0===i||i.forEach(o)};this.multivalued?null===(i=e.subOptions)||void 0===i||i.forEach(o):this.options.forEach(o),this.optionsChanged()}optionsChanged(){this.changeDebouncer.run((()=>{var t;this.dispatchEvent(new Ce(this.selectedValues)),this.requestUpdate(),null===(t=this.levels)||void 0===t||t.forEach((t=>t.requestUpdate()))}))}updateOptionsFromSlot(t){t.stopPropagation(),this.options=this.slotElement.assignedElements().map((t=>t)),this.optionsChanged()}onFilterChange(){var t,i;this.filter=null!==(i=null===(t=this.filterInput)||void 0===t?void 0:t.value)&&void 0!==i?i:""}updateScroll(){this.valuesContainer&&(this.withScroll=this.valuesContainer.scrollHeight>this.valuesContainer.clientHeight)}}Be.elementDefinitions={"ft-button":qi,"ft-filter-level":ge,"ft-snap-scroll":we,"ft-typography":li},Be.styles=Se,Oe([o.property({type:String})],Be.prototype,"id",void 0),Oe([o.property({type:String})],Be.prototype,"label",void 0),Oe([o.property({type:String})],Be.prototype,"filterPlaceHolder",void 0),Oe([o.property({type:String})],Be.prototype,"clearButtonLabel",void 0),Oe([o.property({type:String})],Be.prototype,"moreValuesButtonLabel",void 0),Oe([o.property({type:String})],Be.prototype,"noValuesLabel",void 0),Oe([i.jsonProperty([])],Be.prototype,"options",void 0),Oe([o.property({type:Boolean})],Be.prototype,"multivalued",void 0),Oe([o.property({type:Boolean})],Be.prototype,"disabled",void 0),Oe([o.property({type:Boolean})],Be.prototype,"raiseSelectedOptions",void 0),Oe([o.property({type:Number})],Be.prototype,"displayedValuesLimit",void 0),Oe([o.property({type:Boolean})],Be.prototype,"hideClearButton",void 0),Oe([o.query(".ft-filter--slot")],Be.prototype,"slotElement",void 0),Oe([o.query(".ft-filter--container")],Be.prototype,"container",void 0),Oe([o.query(".ft-filter--values")],Be.prototype,"valuesContainer",void 0),Oe([o.query(".ft-filter--levels")],Be.prototype,"levelsContainer",void 0),Oe([o.query(".ft-filter--levels ft-filter-level:last-child")],Be.prototype,"lastLevel",void 0),Oe([o.query(".ft-filter--filter input")],Be.prototype,"filterInput",void 0),Oe([o.queryAll(".ft-filter--levels ft-filter-level")],Be.prototype,"levels",void 0),Oe([o.state()],Be.prototype,"withScroll",void 0),Oe([o.state()],Be.prototype,"filter",void 0),Oe([o.state()],Be.prototype,"slideIn",void 0),Oe([o.state()],Be.prototype,"slideOut",void 0);var je=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class Ee extends i.FtLitElement{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}render(){return e.html`
+        `}goBack(t){this.slideOut=t.detail.value}onDisplayLevel(t){this.displayedLevels.push(t.detail.value),this.slideIn=t.detail.value}clear(){if(this.flatOptions.forEach((t=>t.selected=!1)),this.displayedLevels.length>0){let t=this.displayedLevels[this.displayedLevels.length-1];this.displayedLevels=[t],this.slideOut=t}this.optionsChanged()}onChange(t){var i;t.stopPropagation();const e=this.flatOptions.find((i=>i.value===t.detail.value));e.selected=!e.selected;const o=t=>{var i;t!==e&&(t.selected=!1),null===(i=t.subOptions)||void 0===i||i.forEach(o)};this.multivalued?null===(i=e.subOptions)||void 0===i||i.forEach(o):this.options.forEach(o),this.optionsChanged()}optionsChanged(){this.changeDebouncer.run((()=>{var t;this.sendEventIfValuesChanged(),this.requestUpdate(),null===(t=this.levels)||void 0===t||t.forEach((t=>t.requestUpdate()))}))}sendEventIfValuesChanged(){const t=this.selectedValues;i.deepEqual(this.lastDispatchedValues,t)||(this.dispatchEvent(new Ce(t)),this.lastDispatchedValues=t)}updateOptionsFromSlot(t){t.stopPropagation(),this.options=this.slotElement.assignedElements().map((t=>t)),this.optionsChanged()}onFilterChange(){var t,i;this.filter=null!==(i=null===(t=this.filterInput)||void 0===t?void 0:t.value)&&void 0!==i?i:""}updateScroll(){this.valuesContainer&&(this.withScroll=this.valuesContainer.scrollHeight>this.valuesContainer.clientHeight)}}Be.elementDefinitions={"ft-button":qi,"ft-filter-level":ge,"ft-snap-scroll":we,"ft-typography":li},Be.styles=Se,Oe([o.property({type:String})],Be.prototype,"id",void 0),Oe([o.property({type:String})],Be.prototype,"label",void 0),Oe([o.property({type:String})],Be.prototype,"filterPlaceHolder",void 0),Oe([o.property({type:String})],Be.prototype,"clearButtonLabel",void 0),Oe([o.property({type:String})],Be.prototype,"moreValuesButtonLabel",void 0),Oe([o.property({type:String})],Be.prototype,"noValuesLabel",void 0),Oe([i.jsonProperty([])],Be.prototype,"options",void 0),Oe([o.property({type:Boolean})],Be.prototype,"multivalued",void 0),Oe([o.property({type:Boolean})],Be.prototype,"disabled",void 0),Oe([o.property({type:Boolean})],Be.prototype,"raiseSelectedOptions",void 0),Oe([o.property({type:Number})],Be.prototype,"displayedValuesLimit",void 0),Oe([o.property({type:Boolean})],Be.prototype,"hideClearButton",void 0),Oe([o.query(".ft-filter--slot")],Be.prototype,"slotElement",void 0),Oe([o.query(".ft-filter--container")],Be.prototype,"container",void 0),Oe([o.query(".ft-filter--values")],Be.prototype,"valuesContainer",void 0),Oe([o.query(".ft-filter--levels")],Be.prototype,"levelsContainer",void 0),Oe([o.state()],Be.prototype,"lastLevelHasHiddenvalues",void 0),Oe([o.query(".ft-filter--filter input")],Be.prototype,"filterInput",void 0),Oe([o.queryAll(".ft-filter--levels ft-filter-level")],Be.prototype,"levels",void 0),Oe([o.state()],Be.prototype,"withScroll",void 0),Oe([o.state()],Be.prototype,"filter",void 0),Oe([o.state()],Be.prototype,"slideIn",void 0),Oe([o.state()],Be.prototype,"slideOut",void 0);var je=function(t,i,e,o){for(var s,r=arguments.length,n=r<3?i:null===o?o=Object.getOwnPropertyDescriptor(i,e):o,l=t.length-1;l>=0;l--)(s=t[l])&&(n=(r<3?s(n):r>3?s(i,e,n):s(i,e))||n);return r>3&&n&&Object.defineProperty(i,e,n),n};class Ee extends i.FtLitElement{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}render(){return e.html`
             <slot class="ft-filter-option--slot" @slotchange=${this.updateSubOptionsFromSlot}></slot>
         `}updateSubOptionsFromSlot(t){t.stopPropagation(),this.subOptions=this.slotElement.assignedElements().map((t=>t))}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}}Ee.elementDefinitions={},je([o.property({type:String})],Ee.prototype,"label",void 0),je([o.property({type:Object,converter:t=>t})],Ee.prototype,"value",void 0),je([o.property({type:Boolean,reflect:!0})],Ee.prototype,"selected",void 0),je([o.property({type:Object})],Ee.prototype,"subOptions",void 0),je([i.jsonProperty({})],Ee.prototype,"renderOption",void 0),je([o.query(".ft-filter-option--slot")],Ee.prototype,"slotElement",void 0),i.customElement("ft-filter")(Be),i.customElement("ft-filter-option")(Ee),t.FtFilter=Be,t.FtFilterChangeEvent=Ce,t.FtFilterCssVariables=ze,t.FtFilterLevelCssVariables=ve,t.FtFilterOption=Ee,t.levelStyles=be,t.styles=Se}({},ftGlobals.wcUtils,ftGlobals.lit,ftGlobals.litDecorators,ftGlobals.litRepeat,ftGlobals.litClassMap,ftGlobals.litUnsafeHTML);

package/build/ft-filter.min.js

@@ -333,7 +333,7 @@ var bt,xt;let yt=class extends z{constructor(){super(...arguments),this.renderOp
                 <div class="ft-ripple--background"></div>
                 <div class="ft-ripple--effect"></div>
             </div>
-        `}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var e,i;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(e=this.target)||void 0===e||e.removeAttribute("data-is-ft-ripple-target")):null===(i=this.target)||void 0===i||i.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>{var t;const e=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;e&&this.setupFor(e),this.setRippleSize()}))}setupFor(t){if(this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const e=(...t)=>e=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(e)},i=e("mouseup","contextmenu"),o=e("touchend","touchcancel"),s=t=>{["Enter"," "].includes(t.key)&&e("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",i),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",s),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",i),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",s),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const e=t,i=t;let o,s;return null!=e.x?({x:o,y:s}=e):null!=i.touches&&(o=i.touches[0].clientX,s=i.touches[0].clientY),{x:o,y:s}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let e of t.composedPath()){if(e===this.target)break;if("hasAttribute"in e&&e.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}Oi.elementDefinitions={},Oi.styles=wi,ki([o({type:Boolean})],Oi.prototype,"primary",void 0),ki([o({type:Boolean})],Oi.prototype,"secondary",void 0),ki([o({type:Boolean})],Oi.prototype,"unbounded",void 0),ki([o({type:Boolean})],Oi.prototype,"activated",void 0),ki([o({type:Boolean})],Oi.prototype,"selected",void 0),ki([o({type:Boolean})],Oi.prototype,"disabled",void 0),ki([s()],Oi.prototype,"hovered",void 0),ki([s()],Oi.prototype,"focused",void 0),ki([s()],Oi.prototype,"pressed",void 0),ki([s()],Oi.prototype,"rippling",void 0),ki([s()],Oi.prototype,"rippleSize",void 0),ki([s()],Oi.prototype,"originX",void 0),ki([s()],Oi.prototype,"originY",void 0),ki([n(".ft-ripple")],Oi.prototype,"ripple",void 0),ki([n(".ft-ripple--effect")],Oi.prototype,"rippleEffect",void 0),p("ft-ripple")(Oi);const Si=mt.create("--ft-tooltip-distance","SIZE","4px"),Ci=mt.create("--ft-tooltip-color","COLOR","#FFFFFF"),Ei=mt.create("--ft-tooltip-background-color","COLOR","#666666"),Ni=mt.create("--ft-tooltip-z-index","NUMBER","1"),Ri=mt.external(wt.borderRadiusS,"Design system"),zi=mt.create("--ft-tooltip-max-width","SIZE","150px"),Mi=g`
+        `}contentAvailableCallback(t){super.contentAvailableCallback(t),this.ripple&&this.resizeObserver.observe(this.ripple),this.rippleEffect&&this.rippleEffect.ontransitionstart!==this.onTransitionStart&&(this.rippleEffect.ontransitionstart=this.onTransitionStart,this.rippleEffect.ontransitionend=this.onTransitionEnd)}updated(t){var e,i;super.updated(t),t.has("disabled")&&(this.disabled?(this.endRipple(),null===(e=this.target)||void 0===e||e.removeAttribute("data-is-ft-ripple-target")):null===(i=this.target)||void 0===i||i.setAttribute("data-is-ft-ripple-target","true")),t.has("unbounded")&&this.setRippleSize()}endRipple(){this.endHover(),this.endFocus(),this.endPress(),this.rippling=!1}setRippleSize(){if(this.ripple){const t=this.ripple.getBoundingClientRect();this.rippleSize=(this.unbounded?1:1.7)*Math.max(t.width,t.height)}}connectedCallback(){super.connectedCallback(),this.setupDebouncer.run((()=>this.defaultSetup()))}defaultSetup(){var t,e;const i=null===(t=this.shadowRoot)||void 0===t?void 0:t.host.parentElement;i&&this.setupFor(null!==(e=this.target)&&void 0!==e?e:i),this.setRippleSize()}setupFor(t){if(this.setupDebouncer.cancel(),this.target===t)return;this.onDisconnect&&this.onDisconnect(),this.target=t,t.setAttribute("data-is-ft-ripple-target","true");const e=(...t)=>e=>{t.forEach((t=>window.addEventListener(t,this.endPress,{once:!0}))),this.startPress(e)},i=e("mouseup","contextmenu"),o=e("touchend","touchcancel"),s=t=>{["Enter"," "].includes(t.key)&&e("keyup")(t)};t.addEventListener("mouseover",this.startHover),t.addEventListener("mousemove",this.moveRipple),t.addEventListener("mouseleave",this.endHover),t.addEventListener("mousedown",i),t.addEventListener("touchstart",o),t.addEventListener("touchmove",this.moveRipple),t.addEventListener("keydown",s),t.addEventListener("focus",this.startFocus),t.addEventListener("blur",this.endFocus),t.addEventListener("focusin",this.startFocus),t.addEventListener("focusout",this.endFocus),this.onDisconnect=()=>{t.removeAttribute("data-is-ft-ripple-target"),t.removeEventListener("mouseover",this.startHover),t.removeEventListener("mousemove",this.moveRipple),t.removeEventListener("mouseleave",this.endHover),t.removeEventListener("mousedown",i),t.removeEventListener("touchstart",o),t.removeEventListener("touchmove",this.moveRipple),t.removeEventListener("keydown",s),t.removeEventListener("focus",this.startFocus),t.removeEventListener("blur",this.endFocus),t.removeEventListener("focusin",this.startFocus),t.removeEventListener("focusout",this.endFocus),this.onDisconnect=void 0,this.target=void 0}}getCoordinates(t){const e=t,i=t;let o,s;return null!=e.x?({x:o,y:s}=e):null!=i.touches&&(o=i.touches[0].clientX,s=i.touches[0].clientY),{x:o,y:s}}isIgnored(t){if(this.disabled)return!0;if(null!=t)for(let e of t.composedPath()){if(e===this.target)break;if("hasAttribute"in e&&e.hasAttribute("data-is-ft-ripple-target"))return!0}return!1}disconnectedCallback(){super.disconnectedCallback(),this.onDisconnect&&this.onDisconnect(),this.resizeObserver.disconnect(),this.endRipple()}}Oi.elementDefinitions={},Oi.styles=wi,ki([o({type:Boolean})],Oi.prototype,"primary",void 0),ki([o({type:Boolean})],Oi.prototype,"secondary",void 0),ki([o({type:Boolean})],Oi.prototype,"unbounded",void 0),ki([o({type:Boolean})],Oi.prototype,"activated",void 0),ki([o({type:Boolean})],Oi.prototype,"selected",void 0),ki([o({type:Boolean})],Oi.prototype,"disabled",void 0),ki([s()],Oi.prototype,"hovered",void 0),ki([s()],Oi.prototype,"focused",void 0),ki([s()],Oi.prototype,"pressed",void 0),ki([s()],Oi.prototype,"rippling",void 0),ki([s()],Oi.prototype,"rippleSize",void 0),ki([s()],Oi.prototype,"originX",void 0),ki([s()],Oi.prototype,"originY",void 0),ki([n(".ft-ripple")],Oi.prototype,"ripple",void 0),ki([n(".ft-ripple--effect")],Oi.prototype,"rippleEffect",void 0),p("ft-ripple")(Oi);const Si=mt.create("--ft-tooltip-distance","SIZE","4px"),Ci=mt.create("--ft-tooltip-color","COLOR","#FFFFFF"),Ei=mt.create("--ft-tooltip-background-color","COLOR","#666666"),Ni=mt.create("--ft-tooltip-z-index","NUMBER","1"),Ri=mt.external(wt.borderRadiusS,"Design system"),zi=mt.create("--ft-tooltip-max-width","SIZE","150px"),Mi=g`
     .ft-tooltip--container {
         display: block;
         position: relative;
@@ -383,7 +383,7 @@ var bt,xt;let yt=class extends z{constructor(){super(...arguments),this.renderOp
                     </div>
                 </div>
             </div>
-        `}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){["visible","text"].some((e=>t.has(e)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const e=t.getBoundingClientRect(),i=(e.height-this.tooltip.clientHeight)/2,o=(e.width-this.tooltip.clientWidth)/2;let s=0,r=0;switch(this.validPosition){case"top":r=-this.tooltip.clientHeight,s=o;break;case"bottom":r=e.height,s=o;break;case"left":r=i,s=-this.tooltip.clientWidth;break;case"right":r=i,s=e.width}e.left+s+this.tooltip.clientWidth>window.innerWidth&&(s=window.innerWidth-this.tooltip.clientWidth-e.left),e.left+s<0&&(s=0);const n=this.tooltip.style;n.left=s+"px",n.top=r+"px",n.maxWidth=`max(${e.width}px, ${zi})`}this.revealDebouncer.run((()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")}),this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout((()=>window.addEventListener("touchstart",(t=>{t.composedPath().includes(this.container)||this.onOut()}),{once:!0})),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}}Bi.elementDefinitions={"ft-typography":Qe},Bi.styles=Mi,ji([o()],Bi.prototype,"text",void 0),ji([o({type:Boolean})],Bi.prototype,"manual",void 0),ji([o({type:Boolean})],Bi.prototype,"inline",void 0),ji([o({type:Number})],Bi.prototype,"delay",void 0),ji([o()],Bi.prototype,"position",void 0),ji([function(t,e,i){let o,s=t;return"object"==typeof t?(s=t.slot,o=t):o={flatten:e},i?h({slot:s,flatten:e,selector:i}):r({descriptor:t=>({get(){var t,e;const i="slot"+(s?`[name=${s}]`:":not([name])"),r=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==r?void 0:r.assignedNodes(o))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],Bi.prototype,"slotNodes",void 0),ji([n(".ft-tooltip--container")],Bi.prototype,"container",void 0),ji([n("slot")],Bi.prototype,"target",void 0),ji([n(".ft-tooltip")],Bi.prototype,"tooltip",void 0),ji([n(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),ji([s()],Bi.prototype,"visible",void 0),p("ft-tooltip")(Bi);const Fi={color:mt.extend("--ft-loader-color",wt.colorPrimary),size:mt.create("--ft-loader-size","SIZE","80px")},Ui=g`
+        `}update(t){t.has("visible")&&!this.visible&&this.resetTooltipContent(),super.update(t)}contentAvailableCallback(t){super.contentAvailableCallback(t),["visible","text"].some((e=>t.has(e)))&&this.visible&&this.positionTooltip()}show(t){this.visible=!0,null!=t&&this.hideDebounce.run((()=>this.hide()),t)}hide(){this.visible=!1}toggle(){this.visible=!this.visible}get slottedElement(){var t;return(null!==(t=this.slotNodes)&&void 0!==t?t:[]).filter((t=>t.nodeType==Node.ELEMENT_NODE))[0]}resetTooltipContent(){if(this.tooltip&&this.tooltipContent){const t=this.tooltipContent.style;switch(t.transition="none",this.validPosition){case"top":t.top=this.tooltip.clientHeight+"px",t.left="0";break;case"bottom":t.top=-this.tooltip.clientHeight+"px",t.left="0";break;case"left":t.top="0",t.left=this.tooltip.clientWidth+"px";break;case"right":t.top="0",t.left=-this.tooltip.clientWidth+"px"}}}positionTooltip(){this.resetTooltipContent();const t=this.slottedElement;if(this.tooltip&&t){const e=t.getBoundingClientRect(),i=(e.height-this.tooltip.clientHeight)/2,o=(e.width-this.tooltip.clientWidth)/2;let s=0,r=0;switch(this.validPosition){case"top":r=-this.tooltip.clientHeight,s=o;break;case"bottom":r=e.height,s=o;break;case"left":r=i,s=-this.tooltip.clientWidth;break;case"right":r=i,s=e.width}e.left+s+this.tooltip.clientWidth>window.innerWidth&&(s=window.innerWidth-this.tooltip.clientWidth-e.left),e.left+s<0&&(s=0);const n=this.tooltip.style;n.left=s+"px",n.top=r+"px",n.maxWidth=`max(${e.width}px, ${zi})`}this.revealDebouncer.run((()=>{this.tooltipContent&&(this.tooltipContent.style.transition="top var(--ft-transition-duration, 250ms), left var(--ft-transition-duration, 250ms)",this.tooltipContent.style.top="0",this.tooltipContent.style.left="0")}),this.manual?0:this.delay)}onTouch(){this.manual||(this.show(),setTimeout((()=>window.addEventListener("touchstart",(t=>{t.composedPath().includes(this.container)||this.onOut()}),{once:!0})),100))}onHover(){this.manual||this.show()}onOut(){this.manual||(this.revealDebouncer.cancel(),this.hide())}}Bi.elementDefinitions={"ft-typography":Qe},Bi.styles=Mi,ji([o()],Bi.prototype,"text",void 0),ji([o({type:Boolean})],Bi.prototype,"manual",void 0),ji([o({type:Boolean})],Bi.prototype,"inline",void 0),ji([o({type:Number})],Bi.prototype,"delay",void 0),ji([o()],Bi.prototype,"position",void 0),ji([function(t,e,i){let o,s=t;return"object"==typeof t?(s=t.slot,o=t):o={flatten:e},i?h({slot:s,flatten:e,selector:i}):r({descriptor:t=>({get(){var t,e;const i="slot"+(s?`[name=${s}]`:":not([name])"),r=null===(t=this.renderRoot)||void 0===t?void 0:t.querySelector(i);return null!==(e=null==r?void 0:r.assignedNodes(o))&&void 0!==e?e:[]},enumerable:!0,configurable:!0})})}("",!0)],Bi.prototype,"slotNodes",void 0),ji([n(".ft-tooltip--container")],Bi.prototype,"container",void 0),ji([n("slot")],Bi.prototype,"target",void 0),ji([n(".ft-tooltip")],Bi.prototype,"tooltip",void 0),ji([n(".ft-tooltip--content")],Bi.prototype,"tooltipContent",void 0),ji([s()],Bi.prototype,"visible",void 0),p("ft-tooltip")(Bi);const Fi={color:mt.extend("--ft-loader-color",wt.colorPrimary),size:mt.create("--ft-loader-size","SIZE","80px")},Ui=g`
     :host {
         line-height: 0;
     }
@@ -961,7 +961,7 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
         margin: 10px 0;
         color: ${ko.colorOnSurfaceMedium};
     }
-`;var So=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 Co extends Rt{constructor(){super(...arguments),this.id="",this.options=[],this.multivalued=!1,this.disabled=!1,this.hideSelectedOptions=!1,this.preventNavigation=!1,this.filter="",this.moreValuesButtonLabel="More",this.displayedValuesLimit=0,this.displayedPages=1}get hasHiddenValues(){let t=this.limit;return null!=t&&t<this.options.length}get limit(){return this.displayedValuesLimit>0?this.displayedPages*this.displayedValuesLimit:void 0}get height(){var t,e;return null!==(e=null===(t=this.container)||void 0===t?void 0:t.scrollHeight)&&void 0!==e?e:0}render(){let t=[...this.options];this.hideSelectedOptions&&(t=t.filter((t=>!t.selected))),this.filter&&(t=t.filter((t=>t.label.toLowerCase().includes(this.filter.toLowerCase()))));const e=t.slice(0,this.limit);return Y`
+`;var So=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 Co extends Rt{constructor(){super(...arguments),this.filterId="",this.options=[],this.multivalued=!1,this.disabled=!1,this.hideSelectedOptions=!1,this.preventNavigation=!1,this.filter="",this.moreValuesButtonLabel="More",this.displayedValuesLimit=0,this.displayedPages=1}get hasHiddenValues(){let t=this.limit;return null!=t&&t<this.options.length}get limit(){return this.displayedValuesLimit>0?this.displayedPages*this.displayedValuesLimit:void 0}get height(){var t,e;return null!==(e=null===(t=this.container)||void 0===t?void 0:t.scrollHeight)&&void 0!==e?e:0}render(){let t=[...this.options];this.hideSelectedOptions&&(t=t.filter((t=>!t.selected))),this.filter&&(t=t.filter((t=>t.label.toLowerCase().includes(this.filter.toLowerCase()))));const e=t.slice(0,this.limit);return Y`
             <div class="ft-filter-level--container ${this.disabled?"ft-filter--disabled":""}">
                 ${null==this.parent?null:Y`
                     <div tabindex="0"
@@ -1005,7 +1005,7 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
                 `:tt}
             </div>
         `}goBackOnKeyPress(t){"Enter"!==t.key&&" "!==t.key||this.dispatchEvent(new CustomEvent("go-back",{detail:this.parent}))}goBackOnClick(t){t.stopPropagation(),t.preventDefault(),this.dispatchEvent(new CustomEvent("go-back",{detail:this.parent}))}displayMore(){this.displayedPages++}buildMultiValuedOption(t){var e;return Y`
-            <ft-checkbox name="${this.id}"
+            <ft-checkbox name="${this.filterId}"
                          part="multivalued-option"
                          data-value="${t.value}"
                          .checked=${t.selected}
@@ -1015,7 +1015,7 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
                 ${t.renderOption?t.renderOption:t.label}
             </ft-checkbox>
         `}buildMonoValuedOption(t){return Y`
-            <ft-radio name="${this.id+Math.round(1e6*Math.random())}"
+            <ft-radio name="${this.filterId+Math.round(1e6*Math.random())}"
                       part="monovalued-option"
                       data-value="${t.value}"
                       .checked=${t.selected}
@@ -1025,7 +1025,7 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
                       @change=${t=>t.stopPropagation()}>
                 ${t.renderOption?t.renderOption:t.label}
             </ft-radio>
-        `}onRadioKeyUp(t,e){e.selected&&" "===t.key&&this.optionsChanged(t,e)}optionsChanged(t,e){t.stopPropagation(),this.dispatchEvent(new CustomEvent("change",{detail:e}))}displayLevel(t){this.dispatchEvent(new CustomEvent("display-level",{detail:t}))}}Co.elementDefinitions={"ft-button":io,"ft-ripple":Oi,"ft-typography":Qe,"ft-checkbox":co,"ft-icon":Ki,"ft-radio":go},Co.styles=Oo,So([o({type:String})],Co.prototype,"id",void 0),So([o({type:Object})],Co.prototype,"parent",void 0),So([o({type:Array})],Co.prototype,"options",void 0),So([o({type:Boolean})],Co.prototype,"multivalued",void 0),So([o({type:Boolean})],Co.prototype,"disabled",void 0),So([o({type:Boolean})],Co.prototype,"hideSelectedOptions",void 0),So([o({type:Boolean})],Co.prototype,"preventNavigation",void 0),So([o({type:String})],Co.prototype,"filter",void 0),So([o({type:String})],Co.prototype,"moreValuesButtonLabel",void 0),So([o({type:String})],Co.prototype,"noValuesLabel",void 0),So([o({type:Number})],Co.prototype,"displayedValuesLimit",void 0),So([n(".ft-filter-level--container")],Co.prototype,"container",void 0),So([s()],Co.prototype,"displayedPages",void 0);const Eo={buttonsColor:mt.extend("--ft-snap-scroll-buttons-color",wt.colorPrimary),buttonsZIndex:mt.create("--ft-snap-scroll-buttons-z-index","COLOR","1"),gap:mt.create("--ft-snap-scroll-gap","SIZE","0"),colorSurface:mt.external(wt.colorSurface,"Design system")},No=g`
+        `}onRadioKeyUp(t,e){e.selected&&" "===t.key&&this.optionsChanged(t,e)}optionsChanged(t,e){t.stopPropagation(),this.dispatchEvent(new CustomEvent("change",{detail:e}))}displayLevel(t){this.dispatchEvent(new CustomEvent("display-level",{detail:t}))}}Co.elementDefinitions={"ft-button":io,"ft-ripple":Oi,"ft-typography":Qe,"ft-checkbox":co,"ft-icon":Ki,"ft-radio":go},Co.styles=Oo,So([o({type:String})],Co.prototype,"filterId",void 0),So([o({type:Object})],Co.prototype,"parent",void 0),So([o({type:Array})],Co.prototype,"options",void 0),So([o({type:Boolean})],Co.prototype,"multivalued",void 0),So([o({type:Boolean})],Co.prototype,"disabled",void 0),So([o({type:Boolean})],Co.prototype,"hideSelectedOptions",void 0),So([o({type:Boolean})],Co.prototype,"preventNavigation",void 0),So([o({type:String})],Co.prototype,"filter",void 0),So([o({type:String})],Co.prototype,"moreValuesButtonLabel",void 0),So([o({type:String})],Co.prototype,"noValuesLabel",void 0),So([o({type:Number})],Co.prototype,"displayedValuesLimit",void 0),So([n(".ft-filter-level--container")],Co.prototype,"container",void 0),So([s()],Co.prototype,"displayedPages",void 0);const Eo={buttonsColor:mt.extend("--ft-snap-scroll-buttons-color",wt.colorPrimary),buttonsZIndex:mt.create("--ft-snap-scroll-buttons-z-index","COLOR","1"),gap:mt.create("--ft-snap-scroll-gap","SIZE","0"),colorSurface:mt.external(wt.colorSurface,"Design system")},No=g`
     .ft-snap-scroll {
         box-sizing: border-box;
         position: relative;
@@ -1283,30 +1283,32 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
             height: 0;
         }
 
-        slot {
+        slot:not([name]) {
             display: none;
         }
-    `];var Fo=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 Uo extends CustomEvent{constructor(t){super("change",{detail:t})}}class Lo extends Rt{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.noValuesLabel="No values available",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.hideClearButton=!1,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new e(300),this.changeDebouncer=new e(10)}get flatOptions(){return ti(this.options,(t=>{var e;return null!==(e=t.subOptions)&&void 0!==e?e:[]}))}get selectedValues(){return this.flatOptions.filter((t=>t.selected)).map((t=>t.value))}render(){var t,e;const i=this.flatOptions.some((t=>t.selected)),o=this.withScroll||this.filter||null!==(e=null===(t=this.lastLevel)||void 0===t?void 0:t.hasHiddenValues)&&void 0!==e&&e,s=this.filterPlaceHolder.replace("{0}",this.label);return Y`
+    `];var Fo=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 Uo extends CustomEvent{constructor(t){super("change",{detail:t})}}class Lo extends Rt{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.noValuesLabel="No values available",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.hideClearButton=!1,this.lastLevelHasHiddenvalues=!1,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new e(300),this.changeDebouncer=new e(10),this.lastDispatchedValues=[]}get flatOptions(){return ti(this.options,(t=>{var e;return null!==(e=t.subOptions)&&void 0!==e?e:[]}))}get selectedValues(){return this.flatOptions.filter((t=>t.selected)).map((t=>t.value))}render(){const t=this.flatOptions.some((t=>t.selected)),e=this.withScroll||this.filter||this.lastLevelHasHiddenvalues,i=this.filterPlaceHolder.replace("{0}",this.label);return Y`
             <div class="ft-filter--container ${this.disabled?"ft-filter--disabled":""}"
                  part="container">
-                ${this.label||i?Y`
+                ${this.label||t?Y`
                     <div class="ft-filter--header" part="header">
-                        <ft-typography class="ft-filter--label" variant="overline" part="label">${this.label}
+                        <ft-typography class="ft-filter--label" variant="overline" part="label">
+                            ${this.label}
                         </ft-typography>
-                        ${i&&!this.hideClearButton?Y`
+                        <slot name="label"></slot>
+                        ${t&&!this.hideClearButton?Y`
                             <ft-button icon="close" dense @click=${this.clear} part="clear-button">
                                 ${this.clearButtonLabel}
                             </ft-button>
                         `:null}
                     </div>
                 `:null}
-                <div class="ft-filter--filter" ?hidden=${!o}>
+                <div class="ft-filter--filter" ?hidden=${!e}>
                     <input type="search"
                            part="input"
                            class="ft-typography--caption"
-                           ?disabled=${!o}
-                           placeholder="${s}"
-                           size="${o?s.length:0}"
+                           ?disabled=${!e}
+                           placeholder="${i}"
+                           size="${e?i.length:0}"
                            @search=${this.onFilterChange}
                            @keyup=${this.onFilterChange}>
                 </div>
@@ -1317,10 +1319,10 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
                       @slotchange=${this.updateOptionsFromSlot}
                       @option-change=${this.optionsChanged}></slot>
             </div>
-        `}update(t){if(super.update(t),t.has("options")){const t=new Set(this.flatOptions.map((t=>t.value)));this.displayedLevels=this.displayedLevels.filter((e=>t.has(e)))}}contentAvailableCallback(t){var e,i;super.contentAvailableCallback(t),this.valuesContainer&&this.scrollResizeObserver.observe(this.valuesContainer),this.container&&this.scrollResizeObserver.observe(this.container),t.has("options")&&(this.updateScroll(),null===(e=this.levelsContainer)||void 0===e||e.scrollToIndex(this.displayedLevels.length)),t.has("slideIn")&&this.slideIn&&setTimeout((()=>{var t;null===(t=this.levelsContainer)||void 0===t||t.next(),this.slideIn=void 0}),0),t.has("slideOut")&&this.slideOut&&(null===(i=this.levelsContainer)||void 0===i||i.previous(),setTimeout((()=>{this.displayedLevels.pop(),this.slideOut=void 0}),300))}renderLevels(){const t=this.flatOptions,e=t.filter((t=>t.selected)),i=this.slideIn||this.slideOut?this.displayedLevels.length-2:this.displayedLevels.length-1,o=i<0?"ft-filter--level-center":"ft-filter--level-left";return Y`
+        `}update(t){if(super.update(t),t.has("options")){const t=new Set(this.flatOptions.map((t=>t.value)));this.displayedLevels=this.displayedLevels.filter((e=>t.has(e)))}}contentAvailableCallback(t){var e,i,o,s,r;super.contentAvailableCallback(t),this.valuesContainer&&this.scrollResizeObserver.observe(this.valuesContainer),this.container&&this.scrollResizeObserver.observe(this.container),t.has("options")&&(this.updateScroll(),null===(e=this.levelsContainer)||void 0===e||e.scrollToIndex(this.displayedLevels.length)),t.has("slideIn")&&this.slideIn&&setTimeout((()=>{var t;null===(t=this.levelsContainer)||void 0===t||t.next(),this.slideIn=void 0}),0),t.has("slideOut")&&this.slideOut&&(null===(i=this.levelsContainer)||void 0===i||i.previous(),setTimeout((()=>{this.displayedLevels.pop(),this.slideOut=void 0}),300)),this.lastLevelHasHiddenvalues=null!==(r=null===(s=null===(o=this.shadowRoot)||void 0===o?void 0:o.querySelector(".ft-filter--levels ft-filter-level:last-child"))||void 0===s?void 0:s.hasHiddenValues)&&void 0!==r&&r}renderLevels(){const t=this.flatOptions,e=t.filter((t=>t.selected)),i=this.slideIn||this.slideOut?this.displayedLevels.length-2:this.displayedLevels.length-1,o=i<0?"ft-filter--level-center":"ft-filter--level-left";return Y`
             ${this.raiseSelectedOptions&&e.length>0?Y`
                 <ft-filter-level
-                        id="${this.id}"
+                        filterId="${this.id}"
                         ?multivalued=${this.multivalued}
                         ?disabled=${this.disabled}
                         preventNavigation
@@ -1340,7 +1342,7 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
         `}renderLevel(t,e,i){return Y`
             <ft-filter-level
                     class="${t}"
-                    id="${this.id}"
+                    filterId="${this.id}"
                     .filter="${this.filter}"
                     moreValuesButtonLabel="${this.moreValuesButtonLabel}"
                     ?multivalued=${this.multivalued}
@@ -1356,6 +1358,6 @@ class Di extends si{constructor(t){if(super(t),this.et=tt,t.type!==ii)throw Erro
                     .exportpartsPrefixes=${["values","available-values"]}
                     noValuesLabel="${this.noValuesLabel}"
             ></ft-filter-level>
-        `}goBack(t){this.slideOut=t.detail.value}onDisplayLevel(t){this.displayedLevels.push(t.detail.value),this.slideIn=t.detail.value}clear(){if(this.flatOptions.forEach((t=>t.selected=!1)),this.displayedLevels.length>0){let t=this.displayedLevels[this.displayedLevels.length-1];this.displayedLevels=[t],this.slideOut=t}this.optionsChanged()}onChange(t){var e;t.stopPropagation();const i=this.flatOptions.find((e=>e.value===t.detail.value));i.selected=!i.selected;const o=t=>{var e;t!==i&&(t.selected=!1),null===(e=t.subOptions)||void 0===e||e.forEach(o)};this.multivalued?null===(e=i.subOptions)||void 0===e||e.forEach(o):this.options.forEach(o),this.optionsChanged()}optionsChanged(){this.changeDebouncer.run((()=>{var t;this.dispatchEvent(new Uo(this.selectedValues)),this.requestUpdate(),null===(t=this.levels)||void 0===t||t.forEach((t=>t.requestUpdate()))}))}updateOptionsFromSlot(t){t.stopPropagation(),this.options=this.slotElement.assignedElements().map((t=>t)),this.optionsChanged()}onFilterChange(){var t,e;this.filter=null!==(e=null===(t=this.filterInput)||void 0===t?void 0:t.value)&&void 0!==e?e:""}updateScroll(){this.valuesContainer&&(this.withScroll=this.valuesContainer.scrollHeight>this.valuesContainer.clientHeight)}}Lo.elementDefinitions={"ft-button":io,"ft-filter-level":Co,"ft-snap-scroll":Mo,"ft-typography":Qe},Lo.styles=Bo,Fo([o({type:String})],Lo.prototype,"id",void 0),Fo([o({type:String})],Lo.prototype,"label",void 0),Fo([o({type:String})],Lo.prototype,"filterPlaceHolder",void 0),Fo([o({type:String})],Lo.prototype,"clearButtonLabel",void 0),Fo([o({type:String})],Lo.prototype,"moreValuesButtonLabel",void 0),Fo([o({type:String})],Lo.prototype,"noValuesLabel",void 0),Fo([d([])],Lo.prototype,"options",void 0),Fo([o({type:Boolean})],Lo.prototype,"multivalued",void 0),Fo([o({type:Boolean})],Lo.prototype,"disabled",void 0),Fo([o({type:Boolean})],Lo.prototype,"raiseSelectedOptions",void 0),Fo([o({type:Number})],Lo.prototype,"displayedValuesLimit",void 0),Fo([o({type:Boolean})],Lo.prototype,"hideClearButton",void 0),Fo([n(".ft-filter--slot")],Lo.prototype,"slotElement",void 0),Fo([n(".ft-filter--container")],Lo.prototype,"container",void 0),Fo([n(".ft-filter--values")],Lo.prototype,"valuesContainer",void 0),Fo([n(".ft-filter--levels")],Lo.prototype,"levelsContainer",void 0),Fo([n(".ft-filter--levels ft-filter-level:last-child")],Lo.prototype,"lastLevel",void 0),Fo([n(".ft-filter--filter input")],Lo.prototype,"filterInput",void 0),Fo([function(t){return r({descriptor:e=>({get(){var e,i;return null!==(i=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelectorAll(t))&&void 0!==i?i:[]},enumerable:!0,configurable:!0})})}(".ft-filter--levels ft-filter-level")],Lo.prototype,"levels",void 0),Fo([s()],Lo.prototype,"withScroll",void 0),Fo([s()],Lo.prototype,"filter",void 0),Fo([s()],Lo.prototype,"slideIn",void 0),Fo([s()],Lo.prototype,"slideOut",void 0);var Do=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 To extends Rt{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}render(){return Y`
+        `}goBack(t){this.slideOut=t.detail.value}onDisplayLevel(t){this.displayedLevels.push(t.detail.value),this.slideIn=t.detail.value}clear(){if(this.flatOptions.forEach((t=>t.selected=!1)),this.displayedLevels.length>0){let t=this.displayedLevels[this.displayedLevels.length-1];this.displayedLevels=[t],this.slideOut=t}this.optionsChanged()}onChange(t){var e;t.stopPropagation();const i=this.flatOptions.find((e=>e.value===t.detail.value));i.selected=!i.selected;const o=t=>{var e;t!==i&&(t.selected=!1),null===(e=t.subOptions)||void 0===e||e.forEach(o)};this.multivalued?null===(e=i.subOptions)||void 0===e||e.forEach(o):this.options.forEach(o),this.optionsChanged()}optionsChanged(){this.changeDebouncer.run((()=>{var t;this.sendEventIfValuesChanged(),this.requestUpdate(),null===(t=this.levels)||void 0===t||t.forEach((t=>t.requestUpdate()))}))}sendEventIfValuesChanged(){const t=this.selectedValues;c(this.lastDispatchedValues,t)||(this.dispatchEvent(new Uo(t)),this.lastDispatchedValues=t)}updateOptionsFromSlot(t){t.stopPropagation(),this.options=this.slotElement.assignedElements().map((t=>t)),this.optionsChanged()}onFilterChange(){var t,e;this.filter=null!==(e=null===(t=this.filterInput)||void 0===t?void 0:t.value)&&void 0!==e?e:""}updateScroll(){this.valuesContainer&&(this.withScroll=this.valuesContainer.scrollHeight>this.valuesContainer.clientHeight)}}Lo.elementDefinitions={"ft-button":io,"ft-filter-level":Co,"ft-snap-scroll":Mo,"ft-typography":Qe},Lo.styles=Bo,Fo([o({type:String})],Lo.prototype,"id",void 0),Fo([o({type:String})],Lo.prototype,"label",void 0),Fo([o({type:String})],Lo.prototype,"filterPlaceHolder",void 0),Fo([o({type:String})],Lo.prototype,"clearButtonLabel",void 0),Fo([o({type:String})],Lo.prototype,"moreValuesButtonLabel",void 0),Fo([o({type:String})],Lo.prototype,"noValuesLabel",void 0),Fo([d([])],Lo.prototype,"options",void 0),Fo([o({type:Boolean})],Lo.prototype,"multivalued",void 0),Fo([o({type:Boolean})],Lo.prototype,"disabled",void 0),Fo([o({type:Boolean})],Lo.prototype,"raiseSelectedOptions",void 0),Fo([o({type:Number})],Lo.prototype,"displayedValuesLimit",void 0),Fo([o({type:Boolean})],Lo.prototype,"hideClearButton",void 0),Fo([n(".ft-filter--slot")],Lo.prototype,"slotElement",void 0),Fo([n(".ft-filter--container")],Lo.prototype,"container",void 0),Fo([n(".ft-filter--values")],Lo.prototype,"valuesContainer",void 0),Fo([n(".ft-filter--levels")],Lo.prototype,"levelsContainer",void 0),Fo([s()],Lo.prototype,"lastLevelHasHiddenvalues",void 0),Fo([n(".ft-filter--filter input")],Lo.prototype,"filterInput",void 0),Fo([function(t){return r({descriptor:e=>({get(){var e,i;return null!==(i=null===(e=this.renderRoot)||void 0===e?void 0:e.querySelectorAll(t))&&void 0!==i?i:[]},enumerable:!0,configurable:!0})})}(".ft-filter--levels ft-filter-level")],Lo.prototype,"levels",void 0),Fo([s()],Lo.prototype,"withScroll",void 0),Fo([s()],Lo.prototype,"filter",void 0),Fo([s()],Lo.prototype,"slideIn",void 0),Fo([s()],Lo.prototype,"slideOut",void 0);var Do=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 To extends Rt{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}render(){return Y`
             <slot class="ft-filter-option--slot" @slotchange=${this.updateSubOptionsFromSlot}></slot>
         `}updateSubOptionsFromSlot(t){t.stopPropagation(),this.subOptions=this.slotElement.assignedElements().map((t=>t))}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}}To.elementDefinitions={},Do([o({type:String})],To.prototype,"label",void 0),Do([o({type:Object,converter:t=>t})],To.prototype,"value",void 0),Do([o({type:Boolean,reflect:!0})],To.prototype,"selected",void 0),Do([o({type:Object})],To.prototype,"subOptions",void 0),Do([d({})],To.prototype,"renderOption",void 0),Do([n(".ft-filter-option--slot")],To.prototype,"slotElement",void 0),p("ft-filter")(Lo),p("ft-filter-option")(To),t.FtFilter=Lo,t.FtFilterChangeEvent=Uo,t.FtFilterCssVariables=jo,t.FtFilterLevelCssVariables=ko,t.FtFilterOption=To,t.levelStyles=Oo,t.styles=Bo}({});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluid-topics/ft-filter",
-  "version": "1.0.1",
+  "version": "1.0.4",
   "description": "Flat selector for multivalued or monovalued filters",
   "keywords": [
     "Lit"
@@ -19,15 +19,15 @@
     "url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
   },
   "dependencies": {
-    "@fluid-topics/ft-button": "1.0.1",
-    "@fluid-topics/ft-checkbox": "1.0.1",
-    "@fluid-topics/ft-icon": "1.0.1",
-    "@fluid-topics/ft-radio": "1.0.1",
-    "@fluid-topics/ft-ripple": "1.0.1",
-    "@fluid-topics/ft-snap-scroll": "1.0.1",
-    "@fluid-topics/ft-typography": "1.0.1",
-    "@fluid-topics/ft-wc-utils": "1.0.1",
+    "@fluid-topics/ft-button": "1.0.4",
+    "@fluid-topics/ft-checkbox": "1.0.4",
+    "@fluid-topics/ft-icon": "1.0.4",
+    "@fluid-topics/ft-radio": "1.0.4",
+    "@fluid-topics/ft-ripple": "1.0.4",
+    "@fluid-topics/ft-snap-scroll": "1.0.4",
+    "@fluid-topics/ft-typography": "1.0.4",
+    "@fluid-topics/ft-wc-utils": "1.0.4",
     "lit": "2.7.2"
   },
-  "gitHead": "8e883d50248d276ce48981f8a1a0407e46400bd1"
+  "gitHead": "73efa63448237c9b05c59823cd70ee3bc019995e"
 }