jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-31 13:07:49 +00:00
Code Issues Packages Projects Releases Wiki Activity

Save height and width when you start filtering to make timing less fragile

Browse Source
This commit is contained in:
Bram Kragten 2022-02-11 17:10:56 +01:00
parent 737f7ba6b9
commit 21e441b682
No known key found for this signature in database
GPG Key ID: FBE2DFDB363EF55B
1 changed files with 17 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

34
src/dialogs/config-flow/step-flow-pick-handler.ts
View File

@ -21,7 +21,6 @@ import { brandsUrl } from "../../util/brands-url";
import { documentationUrl } from "../../util/documentation-url";
import { configFlowContentStyles } from "./styles";
import "@material/mwc-list/mwc-list-item";
import { afterNextRender } from "../../common/util/render-status";
interface HandlerObj {
name: string;
@ -147,10 +146,26 @@ class StepFlowPickHandler extends LitElement {
}
public willUpdate(changedProps: PropertyValues): void {
super.willUpdate(changedProps);
if (this._filter === undefined && this.initialFilter !== undefined) {
this._filter = this.initialFilter;
}
super.willUpdate(changedProps);
if (this.initialFilter !== undefined && this._filter === "") {
this.initialFilter = undefined;
this._filter = "";
this._width = undefined;
this._height = undefined;
} else if (
this.hasUpdated &&
changedProps.has("_filter") &&
(!this._width || !this._height)
) {
// Store the width and height so that when we search, box doesn't jump
const boundingRect =
this.shadowRoot!.querySelector("div")!.getBoundingClientRect();
this._width = boundingRect.width;
this._height = boundingRect.height;
}
}
protected firstUpdated(changedProps) {
@ -161,21 +176,6 @@ class StepFlowPickHandler extends LitElement {
);
}
protected updated(changedProps) {
super.updated(changedProps);
// Store the width and height so that when we search, box doesn't jump
if (!this._width || !this._height) {
this.updateComplete.then(() => {
afterNextRender(() => {
const boundingRect =
this.shadowRoot!.querySelector("div")!.getBoundingClientRect();
this._width = boundingRect.width;
this._height = boundingRect.height;
});
});
}
}
private _getHandlers() {
return this._filterHandlers(
this.handlers,