@fluid-topics/ft-filter 0.1.7 → 0.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { ElementDefinitionsMap, FtLitElement } from "@fluid-topics/ft-wc-utils";
|
|
2
|
+
import { PropertyValues } from "lit";
|
|
2
3
|
export interface FtFilterOptionProperties {
|
|
3
4
|
label: string;
|
|
4
5
|
value: any;
|
|
@@ -13,5 +14,6 @@ export declare class FtFilterOption extends FtLitElement implements FtFilterOpti
|
|
|
13
14
|
subOptions: Array<FtFilterOptionProperties>;
|
|
14
15
|
protected getTemplate(): import("lit-html").TemplateResult<1>;
|
|
15
16
|
private updateSubOptionsFromSlot;
|
|
17
|
+
protected updated(changedProperties: PropertyValues): void;
|
|
16
18
|
}
|
|
17
19
|
//# sourceMappingURL=ft-filter-option.d.ts.map
|
|
@@ -24,6 +24,10 @@ let FtFilterOption = class FtFilterOption extends FtLitElement {
|
|
|
24
24
|
const slot = e.composedPath()[0];
|
|
25
25
|
this.subOptions = slot.assignedElements().map(n => n);
|
|
26
26
|
}
|
|
27
|
+
updated(changedProperties) {
|
|
28
|
+
super.updated(changedProperties);
|
|
29
|
+
this.dispatchEvent(new CustomEvent("option-change", { detail: this, bubbles: true }));
|
|
30
|
+
}
|
|
27
31
|
};
|
|
28
32
|
FtFilterOption.elementDefinitions = {};
|
|
29
33
|
__decorate([
|
package/build/ft-filter.js
CHANGED
|
@@ -190,7 +190,8 @@ let FtFilter = class FtFilter extends FtLitElement {
|
|
|
190
190
|
<div class="ft-filter--values">
|
|
191
191
|
${this.renderLevels()}
|
|
192
192
|
</div>
|
|
193
|
-
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
193
|
+
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
194
|
+
@option-change=${this.updateOptionsFromSlot}></slot>
|
|
194
195
|
</div>
|
|
195
196
|
`;
|
|
196
197
|
}
|
package/build/ft-filter.light.js
CHANGED
|
@@ -1041,7 +1041,7 @@ const bi=e.css`.mdc-touch-target-wrapper{display:inline}.mdc-radio{padding:calc(
|
|
|
1041
1041
|
</div>
|
|
1042
1042
|
`}updated(t){var e;super.updated(t),this.contentSlot&&(this.resizeObserver.observe(this.contentSlot),this.listenedContainer!==this.contentSlot&&(this.listenedContainer&&this.listenedContainer.removeEventListener("scroll",this.updateScrollCallback),this.listenedContainer=this.contentSlot,null===(e=this.listenedContainer)||void 0===e||e.addEventListener("scroll",this.updateScrollCallback))),t.has("horizontal")&&(this.horizontal?(this.offsetAttribute="offsetLeft",this.scrollAttribute="scrollLeft",this.sizeAttribute="clientWidth",this.scrollSizeAttribute="scrollWidth"):(this.offsetAttribute="offsetTop",this.scrollAttribute="scrollTop",this.sizeAttribute="clientHeight",this.scrollSizeAttribute="scrollHeight")),t.has("currentElement")&&this.dispatchEvent(new wi(this.currentElement,this.elements[this.currentElement]))}onScroll(){this.scrollDebouncer.run((()=>this.snap())),this.scheduleUpdateScroll()}snap(){let t=this.closestElementFromStart();if(null!=t){const e=this.getDistanceFromStart(t);Math.abs(this.contentSlot[this.scrollAttribute]+this.contentSlot[this.sizeAttribute]-this.contentSlot[this.scrollSizeAttribute])<e&&(t=this.lastElement),this.scrollToElement(t)}}scrollToElement(t){var e,i;t&&(this.horizontal?null===(e=this.contentSlot)||void 0===e||e.scrollTo({left:this.getOffset(t)-this.controlsSize,behavior:"smooth"}):null===(i=this.contentSlot)||void 0===i||i.scrollTo({top:this.getOffset(t)-this.controlsSize,behavior:"smooth"}),this.currentElement=this.elements.indexOf(t))}onSlotChange(){var t,e;this.elements=null!==(e=null===(t=this.contentSlot)||void 0===t?void 0:t.assignedElements().map((t=>t)))&&void 0!==e?e:[],this.scheduleUpdateScroll()}closestElementFromStart(){return this.elements[this.closestIndexFromStart()]}closestIndexFromStart(){let t=-1;for(let e=0;e<this.elements.length;e++)(t<0||this.getDistanceFromStart(this.elements[e])<this.getDistanceFromStart(this.elements[t]))&&(t=e);return t}scheduleUpdateScroll(){this.updateScrollDebouncer.run((()=>this.updateScroll()))}updateScroll(){null!=this.contentSlot?(this.withScroll=this.contentSlot[this.scrollSizeAttribute]>this.contentSlot[this.sizeAttribute],this.startReached=0===this.contentSlot[this.scrollAttribute],this.endReached=this.contentSlot[this.scrollAttribute]+this.contentSlot[this.sizeAttribute]+1>=this.contentSlot[this.scrollSizeAttribute]):(this.withScroll=!1,this.startReached=!0,this.endReached=!0)}get lastElement(){return this.elements[this.elements.length-1]}get firstElementOffset(){let t=this.elements[0];return t?t[this.offsetAttribute]:0}get controlsSize(){return this.controls?36:0}get nextSize(){return this.endReached?0:this.controlsSize}get prevSize(){return this.startReached?0:this.controlsSize}getOffset(t){return t[this.offsetAttribute]-this.firstElementOffset}getDistanceFromStart(t){const e=t===this.elements[0]?0:this.controlsSize;return Math.abs(this.getOffset(t)-this.contentSlot[this.scrollAttribute]-e)}};$i.elementDefinitions={"ft-button":ei},xi([i.property({type:Boolean})],$i.prototype,"horizontal",void 0),xi([i.property({type:Boolean})],$i.prototype,"hideScrollbar",void 0),xi([i.property({type:Boolean})],$i.prototype,"controls",void 0),xi([i.property({type:Boolean})],$i.prototype,"limitSize",void 0),xi([i.state()],$i.prototype,"elements",void 0),xi([i.state()],$i.prototype,"currentElement",void 0),xi([i.state()],$i.prototype,"withScroll",void 0),xi([i.state()],$i.prototype,"startReached",void 0),xi([i.state()],$i.prototype,"endReached",void 0),xi([i.query(".ft-snap-scroll--content")],$i.prototype,"contentSlot",void 0),$i=xi([r.customElement("ft-snap-scroll")],$i);var zi=function(t,e,i,r){for(var o,c=arguments.length,a=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,n=t.length-1;n>=0;n--)(o=t[n])&&(a=(c<3?o(a):c>3?o(e,i,a):o(e,i))||a);return c>3&&a&&Object.defineProperty(e,i,a),a};t.FtFilterOption=class extends r.FtLitElement{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}getTemplate(){return e.html`
|
|
1043
1043
|
<slot @slotchange=${this.updateSubOptionsFromSlot}></slot>
|
|
1044
|
-
`}updateSubOptionsFromSlot(t){const e=t.composedPath()[0];this.subOptions=e.assignedElements().map((t=>t))}},t.FtFilterOption.elementDefinitions={},zi([i.property({type:String})],t.FtFilterOption.prototype,"label",void 0),zi([i.property({type:Object,converter:t=>t})],t.FtFilterOption.prototype,"value",void 0),zi([i.property({type:Boolean,reflect:!0})],t.FtFilterOption.prototype,"selected",void 0),zi([i.property({type:Object})],t.FtFilterOption.prototype,"subOptions",void 0),t.FtFilterOption=zi([r.customElement("ft-filter-option")],t.FtFilterOption);var Si=function(t,e,i,r){for(var o,c=arguments.length,a=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,n=t.length-1;n>=0;n--)(o=t[n])&&(a=(c<3?o(a):c>3?o(e,i,a):o(e,i))||a);return c>3&&a&&Object.defineProperty(e,i,a),a};const Oi={colorOutline:r.FtCssVariable.external(r.designSystemVariables.colorOutline,"Design system"),colorOnSurface:r.FtCssVariable.external(r.designSystemVariables.colorOnSurface,"Design system"),colorOnSurfaceMedium:r.FtCssVariable.external(r.designSystemVariables.colorOnSurfaceMedium,"Design system"),colorPrimary:r.FtCssVariable.external(r.designSystemVariables.colorPrimary,"Design system"),colorSurface:r.FtCssVariable.external(r.designSystemVariables.colorSurface,"Design system"),transitionDuration:r.FtCssVariable.external(r.designSystemVariables.transitionDuration,"Design system"),transitionTimingFunction:r.FtCssVariable.external(r.designSystemVariables.transitionTimingFunction,"Design system")};class Ti extends CustomEvent{constructor(t){super("change",{detail:t})}}t.FtFilter=class extends r.FtLitElement{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new r.Debouncer(300)}getStyles(){return[Yt,e.css`
|
|
1044
|
+
`}updateSubOptionsFromSlot(t){const e=t.composedPath()[0];this.subOptions=e.assignedElements().map((t=>t))}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}},t.FtFilterOption.elementDefinitions={},zi([i.property({type:String})],t.FtFilterOption.prototype,"label",void 0),zi([i.property({type:Object,converter:t=>t})],t.FtFilterOption.prototype,"value",void 0),zi([i.property({type:Boolean,reflect:!0})],t.FtFilterOption.prototype,"selected",void 0),zi([i.property({type:Object})],t.FtFilterOption.prototype,"subOptions",void 0),t.FtFilterOption=zi([r.customElement("ft-filter-option")],t.FtFilterOption);var Si=function(t,e,i,r){for(var o,c=arguments.length,a=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,n=t.length-1;n>=0;n--)(o=t[n])&&(a=(c<3?o(a):c>3?o(e,i,a):o(e,i))||a);return c>3&&a&&Object.defineProperty(e,i,a),a};const Oi={colorOutline:r.FtCssVariable.external(r.designSystemVariables.colorOutline,"Design system"),colorOnSurface:r.FtCssVariable.external(r.designSystemVariables.colorOnSurface,"Design system"),colorOnSurfaceMedium:r.FtCssVariable.external(r.designSystemVariables.colorOnSurfaceMedium,"Design system"),colorPrimary:r.FtCssVariable.external(r.designSystemVariables.colorPrimary,"Design system"),colorSurface:r.FtCssVariable.external(r.designSystemVariables.colorSurface,"Design system"),transitionDuration:r.FtCssVariable.external(r.designSystemVariables.transitionDuration,"Design system"),transitionTimingFunction:r.FtCssVariable.external(r.designSystemVariables.transitionTimingFunction,"Design system")};class Ti extends CustomEvent{constructor(t){super("change",{detail:t})}}t.FtFilter=class extends r.FtLitElement{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new r.Debouncer(300)}getStyles(){return[Yt,e.css`
|
|
1045
1045
|
:host {
|
|
1046
1046
|
display: flex;
|
|
1047
1047
|
max-height: 100%;
|
|
@@ -1171,7 +1171,8 @@ const bi=e.css`.mdc-touch-target-wrapper{display:inline}.mdc-radio{padding:calc(
|
|
|
1171
1171
|
<div class="ft-filter--values">
|
|
1172
1172
|
${this.renderLevels()}
|
|
1173
1173
|
</div>
|
|
1174
|
-
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
1174
|
+
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
1175
|
+
@option-change=${this.updateOptionsFromSlot}></slot>
|
|
1175
1176
|
</div>
|
|
1176
1177
|
`}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,i=t.filter((t=>t.selected)),r=this.slideIn||this.slideOut?this.displayedLevels.length-2:this.displayedLevels.length-1,o=r<0?"ft-filter--level-center":"ft-filter--level-left";return e.html`
|
|
1177
1178
|
${this.raiseSelectedOptions&&i.length>0?e.html`
|
package/build/ft-filter.min.js
CHANGED
|
@@ -1156,7 +1156,7 @@ const fr=n`.mdc-touch-target-wrapper{display:inline}.mdc-radio{padding:calc((40p
|
|
|
1156
1156
|
</div>
|
|
1157
1157
|
`}updated(t){var e;super.updated(t),this.contentSlot&&(this.resizeObserver.observe(this.contentSlot),this.listenedContainer!==this.contentSlot&&(this.listenedContainer&&this.listenedContainer.removeEventListener("scroll",this.updateScrollCallback),this.listenedContainer=this.contentSlot,null===(e=this.listenedContainer)||void 0===e||e.addEventListener("scroll",this.updateScrollCallback))),t.has("horizontal")&&(this.horizontal?(this.offsetAttribute="offsetLeft",this.scrollAttribute="scrollLeft",this.sizeAttribute="clientWidth",this.scrollSizeAttribute="scrollWidth"):(this.offsetAttribute="offsetTop",this.scrollAttribute="scrollTop",this.sizeAttribute="clientHeight",this.scrollSizeAttribute="scrollHeight")),t.has("currentElement")&&this.dispatchEvent(new kr(this.currentElement,this.elements[this.currentElement]))}onScroll(){this.scrollDebouncer.run((()=>this.snap())),this.scheduleUpdateScroll()}snap(){let t=this.closestElementFromStart();if(null!=t){const e=this.getDistanceFromStart(t);Math.abs(this.contentSlot[this.scrollAttribute]+this.contentSlot[this.sizeAttribute]-this.contentSlot[this.scrollSizeAttribute])<e&&(t=this.lastElement),this.scrollToElement(t)}}scrollToElement(t){var e,i;t&&(this.horizontal?null===(e=this.contentSlot)||void 0===e||e.scrollTo({left:this.getOffset(t)-this.controlsSize,behavior:"smooth"}):null===(i=this.contentSlot)||void 0===i||i.scrollTo({top:this.getOffset(t)-this.controlsSize,behavior:"smooth"}),this.currentElement=this.elements.indexOf(t))}onSlotChange(){var t,e;this.elements=null!==(e=null===(t=this.contentSlot)||void 0===t?void 0:t.assignedElements().map((t=>t)))&&void 0!==e?e:[],this.scheduleUpdateScroll()}closestElementFromStart(){return this.elements[this.closestIndexFromStart()]}closestIndexFromStart(){let t=-1;for(let e=0;e<this.elements.length;e++)(t<0||this.getDistanceFromStart(this.elements[e])<this.getDistanceFromStart(this.elements[t]))&&(t=e);return t}scheduleUpdateScroll(){this.updateScrollDebouncer.run((()=>this.updateScroll()))}updateScroll(){null!=this.contentSlot?(this.withScroll=this.contentSlot[this.scrollSizeAttribute]>this.contentSlot[this.sizeAttribute],this.startReached=0===this.contentSlot[this.scrollAttribute],this.endReached=this.contentSlot[this.scrollAttribute]+this.contentSlot[this.sizeAttribute]+1>=this.contentSlot[this.scrollSizeAttribute]):(this.withScroll=!1,this.startReached=!0,this.endReached=!0)}get lastElement(){return this.elements[this.elements.length-1]}get firstElementOffset(){let t=this.elements[0];return t?t[this.offsetAttribute]:0}get controlsSize(){return this.controls?36:0}get nextSize(){return this.endReached?0:this.controlsSize}get prevSize(){return this.startReached?0:this.controlsSize}getOffset(t){return t[this.offsetAttribute]-this.firstElementOffset}getDistanceFromStart(t){const e=t===this.elements[0]?0:this.controlsSize;return Math.abs(this.getOffset(t)-this.contentSlot[this.scrollAttribute]-e)}};_r.elementDefinitions={"ft-button":Qi},yr([ct({type:Boolean})],_r.prototype,"horizontal",void 0),yr([ct({type:Boolean})],_r.prototype,"hideScrollbar",void 0),yr([ct({type:Boolean})],_r.prototype,"controls",void 0),yr([ct({type:Boolean})],_r.prototype,"limitSize",void 0),yr([nt()],_r.prototype,"elements",void 0),yr([nt()],_r.prototype,"currentElement",void 0),yr([nt()],_r.prototype,"withScroll",void 0),yr([nt()],_r.prototype,"startReached",void 0),yr([nt()],_r.prototype,"endReached",void 0),yr([dt(".ft-snap-scroll--content")],_r.prototype,"contentSlot",void 0),_r=yr([mt("ft-snap-scroll")],_r);var wr=function(t,e,i,r){for(var o,c=arguments.length,n=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(n=(c<3?o(n):c>3?o(e,i,n):o(e,i))||n);return c>3&&n&&Object.defineProperty(e,i,n),n};t.FtFilterOption=class extends yt{constructor(){super(...arguments),this.label="",this.value=null,this.selected=!1,this.subOptions=[]}getTemplate(){return M`
|
|
1158
1158
|
<slot @slotchange=${this.updateSubOptionsFromSlot}></slot>
|
|
1159
|
-
`}updateSubOptionsFromSlot(t){const e=t.composedPath()[0];this.subOptions=e.assignedElements().map((t=>t))}},t.FtFilterOption.elementDefinitions={},wr([ct({type:String})],t.FtFilterOption.prototype,"label",void 0),wr([ct({type:Object,converter:t=>t})],t.FtFilterOption.prototype,"value",void 0),wr([ct({type:Boolean,reflect:!0})],t.FtFilterOption.prototype,"selected",void 0),wr([ct({type:Object})],t.FtFilterOption.prototype,"subOptions",void 0),t.FtFilterOption=wr([mt("ft-filter-option")],t.FtFilterOption);var $r=function(t,e,i,r){for(var o,c=arguments.length,n=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(n=(c<3?o(n):c>3?o(e,i,n):o(e,i))||n);return c>3&&n&&Object.defineProperty(e,i,n),n};const Or={colorOutline:bt.external(gt.colorOutline,"Design system"),colorOnSurface:bt.external(gt.colorOnSurface,"Design system"),colorOnSurfaceMedium:bt.external(gt.colorOnSurfaceMedium,"Design system"),colorPrimary:bt.external(gt.colorPrimary,"Design system"),colorSurface:bt.external(gt.colorSurface,"Design system"),transitionDuration:bt.external(gt.transitionDuration,"Design system"),transitionTimingFunction:bt.external(gt.transitionTimingFunction,"Design system")};class Sr extends CustomEvent{constructor(t){super("change",{detail:t})}}t.FtFilter=class extends yt{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new ft(300)}getStyles(){return[Me,n`
|
|
1159
|
+
`}updateSubOptionsFromSlot(t){const e=t.composedPath()[0];this.subOptions=e.assignedElements().map((t=>t))}updated(t){super.updated(t),this.dispatchEvent(new CustomEvent("option-change",{detail:this,bubbles:!0}))}},t.FtFilterOption.elementDefinitions={},wr([ct({type:String})],t.FtFilterOption.prototype,"label",void 0),wr([ct({type:Object,converter:t=>t})],t.FtFilterOption.prototype,"value",void 0),wr([ct({type:Boolean,reflect:!0})],t.FtFilterOption.prototype,"selected",void 0),wr([ct({type:Object})],t.FtFilterOption.prototype,"subOptions",void 0),t.FtFilterOption=wr([mt("ft-filter-option")],t.FtFilterOption);var $r=function(t,e,i,r){for(var o,c=arguments.length,n=c<3?e:null===r?r=Object.getOwnPropertyDescriptor(e,i):r,a=t.length-1;a>=0;a--)(o=t[a])&&(n=(c<3?o(n):c>3?o(e,i,n):o(e,i))||n);return c>3&&n&&Object.defineProperty(e,i,n),n};const Or={colorOutline:bt.external(gt.colorOutline,"Design system"),colorOnSurface:bt.external(gt.colorOnSurface,"Design system"),colorOnSurfaceMedium:bt.external(gt.colorOnSurfaceMedium,"Design system"),colorPrimary:bt.external(gt.colorPrimary,"Design system"),colorSurface:bt.external(gt.colorSurface,"Design system"),transitionDuration:bt.external(gt.transitionDuration,"Design system"),transitionTimingFunction:bt.external(gt.transitionTimingFunction,"Design system")};class Sr extends CustomEvent{constructor(t){super("change",{detail:t})}}t.FtFilter=class extends yt{constructor(){super(...arguments),this.id="",this.label="",this.filterPlaceHolder="Filter {0}",this.clearButtonLabel="Clear",this.moreValuesButtonLabel="More",this.options=[],this.multivalued=!1,this.disabled=!1,this.raiseSelectedOptions=!1,this.displayedValuesLimit=0,this.withScroll=!1,this.filter="",this.displayedLevels=[],this.scrollResizeObserver=new ResizeObserver((()=>this.updateScroll())),this.levelsScrollDebouncer=new ft(300)}getStyles(){return[Me,n`
|
|
1160
1160
|
:host {
|
|
1161
1161
|
display: flex;
|
|
1162
1162
|
max-height: 100%;
|
|
@@ -1286,7 +1286,8 @@ const fr=n`.mdc-touch-target-wrapper{display:inline}.mdc-radio{padding:calc((40p
|
|
|
1286
1286
|
<div class="ft-filter--values">
|
|
1287
1287
|
${this.renderLevels()}
|
|
1288
1288
|
</div>
|
|
1289
|
-
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
1289
|
+
<slot @slotchange=${this.updateOptionsFromSlot}
|
|
1290
|
+
@option-change=${this.updateOptionsFromSlot}></slot>
|
|
1290
1291
|
</div>
|
|
1291
1292
|
`}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,r=i<0?"ft-filter--level-center":"ft-filter--level-left";return M`
|
|
1292
1293
|
${this.raiseSelectedOptions&&e.length>0?M`
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluid-topics/ft-filter",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.8",
|
|
4
4
|
"description": "Flat selector for multivalued or monovalued filters",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"Lit"
|
|
@@ -19,16 +19,16 @@
|
|
|
19
19
|
"url": "ssh://git@scm.mrs.antidot.net:2222/fluidtopics/ft-web-components.git"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@fluid-topics/ft-button": "^0.1.
|
|
23
|
-
"@fluid-topics/ft-ripple": "^0.1.
|
|
24
|
-
"@fluid-topics/ft-snap-scroll": "^0.1.
|
|
25
|
-
"@fluid-topics/ft-typography": "^0.1.
|
|
26
|
-
"@fluid-topics/ft-wc-utils": "^0.1.
|
|
22
|
+
"@fluid-topics/ft-button": "^0.1.8",
|
|
23
|
+
"@fluid-topics/ft-ripple": "^0.1.8",
|
|
24
|
+
"@fluid-topics/ft-snap-scroll": "^0.1.8",
|
|
25
|
+
"@fluid-topics/ft-typography": "^0.1.8",
|
|
26
|
+
"@fluid-topics/ft-wc-utils": "^0.1.8",
|
|
27
27
|
"@material/mwc-checkbox": "^0.25.3",
|
|
28
28
|
"@material/mwc-formfield": "^0.25.3",
|
|
29
29
|
"@material/mwc-icon": "^0.25.3",
|
|
30
30
|
"@material/mwc-radio": "^0.25.3",
|
|
31
31
|
"lit": "^2.0.2"
|
|
32
32
|
},
|
|
33
|
-
"gitHead": "
|
|
33
|
+
"gitHead": "45fdf008556920bbd5fcc2e766c273aed959178d"
|
|
34
34
|
}
|