mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-14 04:46:34 +00:00
Fix combo box inside dialog (#12805)
This commit is contained in:
Bram Kragten
GitHub
parent
41c61a2895
commit
a72fd19b73
@ -89,8 +89,8 @@
|
||||
"@polymer/paper-tooltip": "^3.0.1",
|
||||
"@polymer/polymer": "3.4.1",
|
||||
"@thomasloven/round-slider": "0.5.4",
|
||||
"@vaadin/combo-box": "^22.0.4",
|
||||
"@vaadin/vaadin-themable-mixin": "^22.0.4",
|
||||
"@vaadin/combo-box": "^23.0.10",
|
||||
"@vaadin/vaadin-themable-mixin": "^23.0.10",
|
||||
"@vibrant/color": "^3.2.1-alpha.1",
|
||||
"@vibrant/core": "^3.2.1-alpha.1",
|
||||
"@vibrant/quantizer-mmcq": "^3.2.1-alpha.1",
|
||||
|
||||
@ -31,6 +31,7 @@ const rowRenderer: ComboBoxLitRenderer<HassEntityWithCachedName> = (item) =>
|
||||
<span>${item.friendly_name}</span>
|
||||
<span slot="secondary">${item.entity_id}</span>
|
||||
</mwc-list-item>`;
|
||||
|
||||
@customElement("ha-entity-picker")
|
||||
export class HaEntityPicker extends LitElement {
|
||||
@property({ attribute: false }) public hass!: HomeAssistant;
|
||||
|
||||
@ -96,6 +96,8 @@ export class HaComboBox extends LitElement {
|
||||
|
||||
@query("vaadin-combo-box-light", true) private _comboBox!: ComboBoxLight;
|
||||
|
||||
private _overlayMutationObserver?: MutationObserver;
|
||||
|
||||
public open() {
|
||||
this.updateComplete.then(() => {
|
||||
this._comboBox?.open();
|
||||
@ -108,6 +110,14 @@ export class HaComboBox extends LitElement {
|
||||
});
|
||||
}
|
||||
|
||||
public disconnectedCallback() {
|
||||
super.disconnectedCallback();
|
||||
if (this._overlayMutationObserver) {
|
||||
this._overlayMutationObserver.disconnect();
|
||||
this._overlayMutationObserver = undefined;
|
||||
}
|
||||
}
|
||||
|
||||
public get selectedItem() {
|
||||
return this._comboBox.selectedItem;
|
||||
}
|
||||
@ -194,12 +204,57 @@ export class HaComboBox extends LitElement {
|
||||
}
|
||||
|
||||
private _openedChanged(ev: PolymerChangedEvent<boolean>) {
|
||||
const opened = ev.detail.value;
|
||||
// delay this so we can handle click event before setting _opened
|
||||
setTimeout(() => {
|
||||
this._opened = ev.detail.value;
|
||||
this._opened = opened;
|
||||
}, 0);
|
||||
// @ts-ignore
|
||||
fireEvent(this, ev.type, ev.detail);
|
||||
|
||||
if (
|
||||
opened &&
|
||||
"MutationObserver" in window &&
|
||||
!this._overlayMutationObserver
|
||||
) {
|
||||
const overlay = document.querySelector<HTMLElement>(
|
||||
"vaadin-combo-box-overlay"
|
||||
);
|
||||
|
||||
if (!overlay) {
|
||||
return;
|
||||
}
|
||||
|
||||
this._overlayMutationObserver = new MutationObserver((mutations) => {
|
||||
mutations.forEach((mutation) => {
|
||||
if (
|
||||
mutation.type === "attributes" &&
|
||||
mutation.attributeName === "inert" &&
|
||||
// @ts-expect-error
|
||||
overlay.inert === true
|
||||
) {
|
||||
// @ts-expect-error
|
||||
overlay.inert = false;
|
||||
this._overlayMutationObserver?.disconnect();
|
||||
this._overlayMutationObserver = undefined;
|
||||
} else if (mutation.type === "childList") {
|
||||
mutation.removedNodes.forEach((node) => {
|
||||
if (node.nodeName === "VAADIN-COMBO-BOX-OVERLAY") {
|
||||
this._overlayMutationObserver?.disconnect();
|
||||
this._overlayMutationObserver = undefined;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this._overlayMutationObserver.observe(overlay, {
|
||||
attributes: true,
|
||||
});
|
||||
this._overlayMutationObserver.observe(document.body, {
|
||||
childList: true,
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
private _filterChanged(ev: PolymerChangedEvent<string>) {
|
||||
|
||||
@ -14,7 +14,6 @@ import {
|
||||
ApplicationCredential,
|
||||
} from "../../../data/application_credential";
|
||||
import { domainToName } from "../../../data/integration";
|
||||
import { PolymerChangedEvent } from "../../../polymer-types";
|
||||
import { haStyleDialog } from "../../../resources/styles";
|
||||
import { HomeAssistant } from "../../../types";
|
||||
import { AddApplicationCredentialDialogParams } from "./show-dialog-add-application-credential";
|
||||
@ -169,11 +168,9 @@ export class DialogAddApplicationCredential extends LitElement {
|
||||
fireEvent(this, "dialog-closed", { dialog: this.localName });
|
||||
}
|
||||
|
||||
private async _handleDomainPicked(ev: PolymerChangedEvent<string>) {
|
||||
const target = ev.target as any;
|
||||
if (target.selectedItem) {
|
||||
this._domain = target.selectedItem.id;
|
||||
}
|
||||
private async _handleDomainPicked(ev: CustomEvent) {
|
||||
ev.stopPropagation();
|
||||
this._domain = ev.detail.value;
|
||||
}
|
||||
|
||||
private _handleValueChanged(ev: CustomEvent) {
|
||||
|
||||
141
yarn.lock
141
yarn.lock
@ -3246,7 +3246,7 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@polymer/iron-resizable-behavior@npm:^3.0.0, @polymer/iron-resizable-behavior@npm:^3.0.0-pre.26, @polymer/iron-resizable-behavior@npm:^3.0.1":
|
||||
"@polymer/iron-resizable-behavior@npm:^3.0.0-pre.26, @polymer/iron-resizable-behavior@npm:^3.0.1":
|
||||
version: 3.0.1
|
||||
resolution: "@polymer/iron-resizable-behavior@npm:3.0.1"
|
||||
dependencies:
|
||||
@ -4196,87 +4196,86 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/combo-box@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/combo-box@npm:22.0.4"
|
||||
"@vaadin/combo-box@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/combo-box@npm:23.0.10"
|
||||
dependencies:
|
||||
"@open-wc/dedupe-mixin": ^1.3.0
|
||||
"@polymer/iron-resizable-behavior": ^3.0.0
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/field-base": ^22.0.4
|
||||
"@vaadin/input-container": ^22.0.4
|
||||
"@vaadin/item": ^22.0.4
|
||||
"@vaadin/vaadin-lumo-styles": ^22.0.4
|
||||
"@vaadin/vaadin-material-styles": ^22.0.4
|
||||
"@vaadin/vaadin-overlay": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: a3cde710d1187bba8e9e7eeb7f6397e6e1158befa3412c3aa684b3b45a1425cdee28d408d5e4dc4f586e1f6881db8850fc51c38f4658c4eb65c51a26a9623c56
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
"@vaadin/field-base": ^23.0.10
|
||||
"@vaadin/input-container": ^23.0.10
|
||||
"@vaadin/item": ^23.0.10
|
||||
"@vaadin/vaadin-lumo-styles": ^23.0.10
|
||||
"@vaadin/vaadin-material-styles": ^23.0.10
|
||||
"@vaadin/vaadin-overlay": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: daaa0bd0cc0e8f1622417bd311e389f860c76d31fe8885f23fcdd486ff966a0945d6fe504f8d7251ec1ec54b95ef66b52d8a9e9e03ec21791bb6ca8b7f24efeb
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/component-base@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/component-base@npm:22.0.4"
|
||||
"@vaadin/component-base@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/component-base@npm:23.0.10"
|
||||
dependencies:
|
||||
"@open-wc/dedupe-mixin": ^1.3.0
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/vaadin-development-mode-detector": ^2.0.0
|
||||
"@vaadin/vaadin-usage-statistics": ^2.1.0
|
||||
lit: ^2.0.0
|
||||
checksum: d18e7cebdd2928e33641ee035927540239e8a65d23521aca2e35d9992a44060d951e877af09088de0ffa88daa11f86a02b86a087cb29b51d9ada574009159509
|
||||
checksum: 2b4d851999aad9dc8e1131d66924e26db64ce5a61d2c895bdf00c8daef774a651f5c2d5ade7274d3c7a1b8286170ee21a7ef873547895e0ceef4f7a7e07073a7
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/field-base@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/field-base@npm:22.0.4"
|
||||
"@vaadin/field-base@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/field-base@npm:23.0.10"
|
||||
dependencies:
|
||||
"@open-wc/dedupe-mixin": ^1.3.0
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
lit: ^2.0.0
|
||||
checksum: 4ca54ea3efd1bad2cea6ada97484e24f77f7ebb2ab5da7de5b9b7949d624b049d357c7f6f69206f1f10023b1711dc7b8bde9f6dfad774578efec00e1907c4763
|
||||
checksum: 0f8d631af00a8268997beed8bde3f6080482eaf044577fd0df0b518fe06b90cbfa6f5c1b2b6e054171de652914d5596749484e4eaecff9754aef70760f25f493
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/icon@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/icon@npm:22.0.4"
|
||||
"@vaadin/icon@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/icon@npm:23.0.10"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/vaadin-lumo-styles": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
"@vaadin/vaadin-lumo-styles": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
lit: ^2.0.0
|
||||
checksum: 65e5195a8eb6f8ce24471c3f52ffdd7edc49249e39922e945eb8f02fc2b277d8d527a1538241b9660ca568a87663912b1be9c82fa8a841f286e713630d52f3db
|
||||
checksum: 1b7da9116ac649796e7852572280be67176fd609c46f37cb1f35fdd1daba0d44ac4c81642de07104c16580b9165f1f05af15c15c3828c95bc9d795b3050b31a1
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/input-container@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/input-container@npm:22.0.4"
|
||||
"@vaadin/input-container@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/input-container@npm:23.0.10"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/vaadin-lumo-styles": ^22.0.4
|
||||
"@vaadin/vaadin-material-styles": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: 718cb7d8f715427d9085feee8a0df987440511059c5bbfcaa80d63ecd989a693f8f50af9da0f483555396aece21b75eff280921eda7cf0b6358e67518e53ba85
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
"@vaadin/vaadin-lumo-styles": ^23.0.10
|
||||
"@vaadin/vaadin-material-styles": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: 2a21486ef0d4618bf890823bae2471a4e476cf37d5b53059c80e0516acc34990dd0a627751b17ea3ab7eb3040dd343b222b9984d734bd07985a6b9f441015aa3
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/item@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/item@npm:22.0.4"
|
||||
"@vaadin/item@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/item@npm:23.0.10"
|
||||
dependencies:
|
||||
"@open-wc/dedupe-mixin": ^1.3.0
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/vaadin-lumo-styles": ^22.0.4
|
||||
"@vaadin/vaadin-material-styles": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: ef8c253668852a129656e083149b3866327dfae8671e30bb1bf78b39f969bd1db74892f090c7632b64fd91c25334f0542ad9dc6848486609de4350da5e5ea44c
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
"@vaadin/vaadin-lumo-styles": ^23.0.10
|
||||
"@vaadin/vaadin-material-styles": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: 790fb48a12c37ad20fbb8f498601585006e27e2b78164336932c64071b1a7d34e88541d4f190c5357c32694dc76676d63c22b4c9cee64debecef90ea5f9ebbc5
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@ -4287,49 +4286,49 @@ __metadata:
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/vaadin-lumo-styles@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/vaadin-lumo-styles@npm:22.0.4"
|
||||
"@vaadin/vaadin-lumo-styles@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/vaadin-lumo-styles@npm:23.0.10"
|
||||
dependencies:
|
||||
"@polymer/iron-icon": ^3.0.0
|
||||
"@polymer/iron-iconset-svg": ^3.0.0
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/icon": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: 15e9becd675e0d12024fbdfaecedd03f55841f685932ff5cf8a2143641f895309f21b84f378f1fca3af538c3aba26dad81421f05a28f31ad7bb5550ede8a3aea
|
||||
"@vaadin/icon": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: c2a9c9f9d441bc55f326b267c4953361d64fed4bfe08727e7c3ea1d1598711c18c4e78faedb7ae192ba474b72a6f1521f366be1a9ed80132f83bc400869275c7
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/vaadin-material-styles@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/vaadin-material-styles@npm:22.0.4"
|
||||
"@vaadin/vaadin-material-styles@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/vaadin-material-styles@npm:23.0.10"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: 0e341e03eab9641cc317a9cbf6d57e7d026539d7bc77159226625aad63a379f31cd70da5e02f10a3d79e9fe0cba1b058935beb2c5d98f146bfb9dd45d8634ee6
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: d2f47272ac6ec3c099a6bebb0d6d861837f5d506b4c1c1ce2fe7d691b1aa8dd944afaaa9c3d4fc51cbee2cfb2efb677a89428fc124a1a4c4cc2b98058a6d2ef7
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/vaadin-overlay@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/vaadin-overlay@npm:22.0.4"
|
||||
"@vaadin/vaadin-overlay@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/vaadin-overlay@npm:23.0.10"
|
||||
dependencies:
|
||||
"@polymer/polymer": ^3.0.0
|
||||
"@vaadin/component-base": ^22.0.4
|
||||
"@vaadin/vaadin-lumo-styles": ^22.0.4
|
||||
"@vaadin/vaadin-material-styles": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
checksum: 1b012ff0beac7879da498cf50ee0974d4c3e5637ebea7f7834b9bfc45b9f02e80c61267794c0f3f4e1d4853aa2f35113e1d94bc187d9fe072f37a03eb99f3ab6
|
||||
"@vaadin/component-base": ^23.0.10
|
||||
"@vaadin/vaadin-lumo-styles": ^23.0.10
|
||||
"@vaadin/vaadin-material-styles": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
checksum: 25bbca730426a87967ea0648db760b2669a257e46cd2e60cd9506bbfd8c0e7c353fc23063aa338b8feee9f6ed0a763c78a458b79c39d04c34591fdc8e476274c
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
"@vaadin/vaadin-themable-mixin@npm:^22.0.4":
|
||||
version: 22.0.4
|
||||
resolution: "@vaadin/vaadin-themable-mixin@npm:22.0.4"
|
||||
"@vaadin/vaadin-themable-mixin@npm:^23.0.10":
|
||||
version: 23.0.10
|
||||
resolution: "@vaadin/vaadin-themable-mixin@npm:23.0.10"
|
||||
dependencies:
|
||||
"@open-wc/dedupe-mixin": ^1.3.0
|
||||
lit: ^2.0.0
|
||||
checksum: 0b2dce09626c92b85ff2d2ad48c8130239bf41fd95147a5fd4490cab4767f074ba9d1008d732d9e90b9219cb1ac0509f4a5fc8637eb5847d6d33e14b20552186
|
||||
checksum: 056bff097ebc7fe1756c53018272b8b3b9006a53e77bf5ba964cff2f3b43ede52d980352a3bd38bc9eb6889ab85e897dcdc67493e9c0380993afd4fa0f2e7796
|
||||
languageName: node
|
||||
linkType: hard
|
||||
|
||||
@ -9084,8 +9083,8 @@ fsevents@^1.2.7:
|
||||
"@types/webspeechapi": ^0.0.29
|
||||
"@typescript-eslint/eslint-plugin": ^4.32.0
|
||||
"@typescript-eslint/parser": ^4.32.0
|
||||
"@vaadin/combo-box": ^22.0.4
|
||||
"@vaadin/vaadin-themable-mixin": ^22.0.4
|
||||
"@vaadin/combo-box": ^23.0.10
|
||||
"@vaadin/vaadin-themable-mixin": ^23.0.10
|
||||
"@vibrant/color": ^3.2.1-alpha.1
|
||||
"@vibrant/core": ^3.2.1-alpha.1
|
||||
"@vibrant/quantizer-mmcq": ^3.2.1-alpha.1
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user