diff --git a/src/components/target-picker/dialog/dialog-target-details.ts b/src/components/target-picker/dialog/dialog-target-details.ts
index e231d14a00..e48a81b109 100644
--- a/src/components/target-picker/dialog/dialog-target-details.ts
+++ b/src/components/target-picker/dialog/dialog-target-details.ts
@@ -1,17 +1,15 @@
-import { mdiClose } from "@mdi/js";
-import { css, html, LitElement, nothing } from "lit";
-import { customElement, property, query, state } from "lit/decorators";
+import { html, LitElement, nothing } from "lit";
+import { customElement, property, state } from "lit/decorators";
import { fireEvent } from "../../../common/dom/fire_event";
import type { HassDialog } from "../../../dialogs/make-dialog-manager";
import type { HomeAssistant } from "../../../types";
import "../../ha-dialog-header";
import "../../ha-icon-button";
import "../../ha-icon-next";
-import "../../ha-md-dialog";
-import type { HaMdDialog } from "../../ha-md-dialog";
import "../../ha-md-list";
import "../../ha-md-list-item";
import "../../ha-svg-icon";
+import "../../ha-wa-dialog";
import "../ha-target-picker-item-row";
import type { TargetDetailsDialogParams } from "./show-dialog-target-details";
@@ -21,14 +19,15 @@ class DialogTargetDetails extends LitElement implements HassDialog {
@state() private _params?: TargetDetailsDialogParams;
- @query("ha-md-dialog") private _dialog?: HaMdDialog;
+ @state() private _opened = false;
public showDialog(params: TargetDetailsDialogParams): void {
this._params = params;
+ this._opened = true;
}
public closeDialog() {
- this._dialog?.close();
+ this._opened = false;
return true;
}
@@ -43,58 +42,31 @@ class DialogTargetDetails extends LitElement implements HassDialog {
}
return html`
-
-
-
- ${this.hass.localize(
- "ui.components.target-picker.target_details"
- )}
- ${this.hass.localize(
- `ui.components.target-picker.type.${this._params.type}`
- )}:
- ${this._params.title}
-
-
-
-
-
+
+
+
`;
}
-
- static styles = css`
- ha-md-dialog {
- min-width: 400px;
- max-height: 90%;
- --dialog-content-padding: var(--ha-space-2) var(--ha-space-6)
- max(var(--safe-area-inset-bottom, var(--ha-space-0)), var(--ha-space-8));
- }
-
- @media all and (max-width: 600px), all and (max-height: 500px) {
- ha-md-dialog {
- --md-dialog-container-shape: var(--ha-space-0);
- min-width: 100%;
- min-height: 100%;
- }
- }
- `;
}
declare global {
diff --git a/src/components/target-picker/ha-target-picker-item-row.ts b/src/components/target-picker/ha-target-picker-item-row.ts
index 29ba36baf0..4884d82902 100644
--- a/src/components/target-picker/ha-target-picker-item-row.ts
+++ b/src/components/target-picker/ha-target-picker-item-row.ts
@@ -162,11 +162,12 @@ export class HaTargetPickerItemRow extends LitElement {
${name}
${context && !this.hideContext
? html`${context}`
- : this._domainName && this.subEntry
- ? html`${this._domainName}`
- : nothing}
+ : nothing}
+ ${this._domainName && this.subEntry
+ ? html`${this._domainName}`
+ : nothing}
${!this.subEntry && entries && showEntities
? html`
@@ -231,9 +232,11 @@ export class HaTargetPickerItemRow extends LitElement {
const rows1 =
(nextType === "area"
? entries?.referenced_areas
- : nextType === "device"
+ : nextType === "device" && this.type !== "label"
? entries?.referenced_devices
- : entries?.referenced_entities) || [];
+ : this.type !== "label"
+ ? entries?.referenced_entities
+ : []) || [];
const devicesInAreas = [] as string[];
@@ -284,9 +287,13 @@ export class HaTargetPickerItemRow extends LitElement {
const entityRows =
this.type === "label" && entries
- ? entries.referenced_entities.filter((entity_id) =>
- this.hass.entities[entity_id].labels.includes(this.itemId)
- )
+ ? entries.referenced_entities.filter((entity_id) => {
+ const entity = this.hass.entities[entity_id];
+ return (
+ entity.labels.includes(this.itemId) &&
+ !entries.referenced_devices.includes(entity.device_id || "")
+ );
+ })
: nextType === "device" && entries
? entries.referenced_entities.filter(
(entity_id) =>
@@ -412,7 +419,6 @@ export class HaTargetPickerItemRow extends LitElement {
const device = this.hass.devices[device_id];
if (
!hiddenAreaIds.includes(device.area_id || "") &&
- (this.type !== "label" || device.labels.includes(this.itemId)) &&
deviceMeetsFilter(
device,
this.hass.entities,
@@ -669,6 +675,14 @@ export class HaTargetPickerItemRow extends LitElement {
button.link:focus {
text-decoration: underline;
}
+
+ .domain {
+ width: fit-content;
+ border-radius: var(--ha-border-radius-md);
+ background-color: var(--ha-color-fill-neutral-quiet-resting);
+ padding: var(--ha-space-1);
+ font-family: var(--ha-font-family-code);
+ }
`,
];
}