diff --git a/src/panels/config/integrations/ha-config-sub-entry-row.ts b/src/panels/config/integrations/ha-config-sub-entry-row.ts
index a2c7c32de0..cad0c049c5 100644
--- a/src/panels/config/integrations/ha-config-sub-entry-row.ts
+++ b/src/panels/config/integrations/ha-config-sub-entry-row.ts
@@ -11,6 +11,8 @@ import {
import { css, html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
+import "../../../components/ha-dropdown";
+import "../../../components/ha-dropdown-item";
import type { ConfigEntry, SubEntry } from "../../../data/config_entries";
import { deleteSubEntry, updateSubEntry } from "../../../data/config_entries";
import type { DeviceRegistryEntry } from "../../../data/device/device_registry";
@@ -89,7 +91,7 @@ class HaConfigSubEntryRow extends LitElement {
`
: nothing}
-
+
${devices.length || services.length
? html`
-
-
- ${this.hass.localize(
- `ui.panel.config.integrations.config_entry.devices`,
- { count: devices.length }
- )}
-
-
+
+
+ ${this.hass.localize(
+ `ui.panel.config.integrations.config_entry.devices`,
+ { count: devices.length }
+ )}
+
+
+
`
: nothing}
${services.length
- ? html`
-
- ${this.hass.localize(
- `ui.panel.config.integrations.config_entry.services`,
- { count: services.length }
- )}
-
- `
+ ? html`
+
+
+
+ ${this.hass.localize(
+ `ui.panel.config.integrations.config_entry.services`,
+ { count: services.length }
+ )}
+
+
+
+ `
: nothing}
${entities.length
? html`
-
-
- ${this.hass.localize(
- `ui.panel.config.integrations.config_entry.entities`,
- { count: entities.length }
- )}
-
-
+
+
+ ${this.hass.localize(
+ `ui.panel.config.integrations.config_entry.entities`,
+ { count: entities.length }
+ )}
+
+
+
`
: nothing}
-
-
+
+
${this.hass.localize(
"ui.panel.config.integrations.config_entry.rename"
)}
-
-
-
+
+
+
${this.hass.localize(
"ui.panel.config.integrations.config_entry.delete"
)}
-
-
+
+
${this._expanded
? html`
@@ -225,6 +228,19 @@ class HaConfigSubEntryRow extends LitElement {
});
}
+ private _handleMenuAction = (ev: CustomEvent) => {
+ const value = ev.detail.item.value;
+ switch (value) {
+ case "rename":
+ this._handleRenameSub();
+ break;
+ case "delete":
+ this._handleDeleteSub();
+ break;
+ // devices, services, entities are handled by href navigation
+ }
+ };
+
private _handleRenameSub = async (): Promise
=> {
const newName = await showPromptDialog(this, {
title: this.hass.localize("ui.common.rename"),
@@ -286,6 +302,9 @@ class HaConfigSubEntryRow extends LitElement {
ha-md-list-item.has-subentries {
border-bottom: 1px solid var(--divider-color);
}
+ ha-dropdown a {
+ text-decoration: none;
+ }
`;
}
diff --git a/src/panels/config/integrations/ha-integration-overflow-menu.ts b/src/panels/config/integrations/ha-integration-overflow-menu.ts
index 2b3413a684..135a3e9f41 100644
--- a/src/panels/config/integrations/ha-integration-overflow-menu.ts
+++ b/src/panels/config/integrations/ha-integration-overflow-menu.ts
@@ -1,10 +1,10 @@
import { mdiDotsVertical } from "@mdi/js";
-import { html, LitElement } from "lit";
+import { css, html, LitElement } from "lit";
import { customElement, property } from "lit/decorators";
+import "../../../components/ha-dropdown";
+import "../../../components/ha-dropdown-item";
import "../../../components/ha-icon-button";
import type { HomeAssistant } from "../../../types";
-import "../../../components/ha-md-list-item";
-import "../../../components/ha-md-button-menu";
@customElement("ha-integration-overflow-menu")
export class HaIntegrationOverflowMenu extends LitElement {
@@ -12,22 +12,32 @@ export class HaIntegrationOverflowMenu extends LitElement {
protected render() {
return html`
-
+
-
- ${this.hass.localize(
- "ui.panel.config.application_credentials.caption"
- )}
-
-
+
+
+ ${this.hass.localize(
+ "ui.panel.config.application_credentials.caption"
+ )}
+
+
+
`;
}
-}
+ static styles = css`
+ :host {
+ display: flex;
+ }
+ a {
+ text-decoration: none;
+ }
+ `;
+}
declare global {
interface HTMLElementTagNameMap {
"ha-integration-overflow-menu": HaIntegrationOverflowMenu;
diff --git a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
index af27793629..4f18fc081d 100644
--- a/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
+++ b/src/panels/config/lovelace/dashboards/ha-config-lovelace-dashboards.ts
@@ -8,7 +8,7 @@ import {
mdiPlus,
} from "@mdi/js";
import type { PropertyValues } from "lit";
-import { LitElement, html, nothing } from "lit";
+import { LitElement, css, html, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import memoize from "memoize-one";
import { storage } from "../../../../common/decorators/storage";
@@ -21,12 +21,12 @@ import type {
SortingChangedEvent,
} from "../../../../components/data-table/ha-data-table";
import "../../../../components/ha-button";
+import "../../../../components/ha-dropdown";
+import "../../../../components/ha-dropdown-item";
import "../../../../components/ha-fab";
import "../../../../components/ha-icon";
import "../../../../components/ha-icon-button";
import "../../../../components/ha-icon-overflow-menu";
-import "../../../../components/ha-md-button-menu";
-import "../../../../components/ha-md-list-item";
import "../../../../components/ha-svg-icon";
import "../../../../components/ha-tooltip";
import { saveFrontendSystemData } from "../../../../data/frontend";
@@ -413,16 +413,20 @@ export class HaConfigLovelaceDashboards extends LitElement {
has-fab
clickable
>
-
+
-
- ${this.hass.localize("ui.panel.config.lovelace.resources.caption")}
-
-
+
+
+ ${this.hass.localize(
+ "ui.panel.config.lovelace.resources.caption"
+ )}
+
+
+
- html`
- ${category.icon
- ? html``
- : html``}
- ${category.name}
- `
- )}
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.no_category"
- )}
-
-
-
-
-
- ${this.hass.localize("ui.panel.config.category.editor.add")}
-
- `;
-
- const labelItems = html` ${this._labels?.map((label) => {
- const color = label.color ? computeCssColor(label.color) : undefined;
- const selected = this._selected.every((entityId) =>
- this.hass.entities[entityId]?.labels.includes(label.label_id)
- );
- const partial =
- !selected &&
- this._selected.some((entityId) =>
- this.hass.entities[entityId]?.labels.includes(label.label_id)
- );
- return html`
-
-
- ${label.icon
- ? html``
- : nothing}
- ${label.name}
-
- `;
- })}
-
-
-
- ${this.hass.localize("ui.panel.config.labels.add_label")}
-
`;
-
- const areaItems = html`${Object.values(this.hass.areas).map(
- (area) =>
- html`
- ${area.icon
- ? html``
- : html``}
- ${area.name}
- `
- )}
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.no_area"
- )}
-
-
-
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.add_area"
- )}
-
- `;
-
const areasInOverflow =
(this._sizeController.value && this._sizeController.value < 900) ||
(!this._sizeController.value && this.hass.dockedSidebar === "docked");
@@ -705,7 +611,10 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
>
${!this.narrow
- ? html`
+ ? html`
- ${categoryItems}
-
+ ${this._renderCategoryItems()}
+
${labelsInOverflow
? nothing
- : html`
+ : html`
- ${labelItems}
- `}
+ ${this._renderLabelItems()}
+ `}
${areasInOverflow
? nothing
- : html`
+ : html`
- ${areaItems}
- `}`
+ ${this._renderAreaItems()}
+ `}`
: nothing}
${this.narrow || areasInOverflow
- ? html`
-
- ${
- this.narrow
+ ? html`
+ ${this.narrow
? html``
- }
-
- ${
- this.narrow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.move_category"
- )}
-
-
-
- ${categoryItems}
- `
- : nothing
- }
- ${
- this.narrow || labelsInOverflow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.add_label"
- )}
-
-
-
- ${labelItems}
- `
- : nothing
- }
- ${
- this.narrow || areasInOverflow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.move_area"
- )}
-
-
-
- ${areaItems}
- `
- : nothing
- }
- `
+ >`}
+ ${this.narrow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.move_category"
+ )}
+ ${this._renderCategoryItems("submenu")}
+ `
+ : nothing}
+ ${this.narrow || labelsInOverflow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.add_label"
+ )}
+ ${this._renderLabelItems("submenu")}
+ `
+ : nothing}
+ ${this.narrow || areasInOverflow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.move_area"
+ )}
+ ${this._renderAreaItems("submenu")}
+ `
+ : nothing}
+ `
: nothing}
${!this.scenes.length
? html`
@@ -1027,12 +907,22 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) {
}
}
- private _handleBulkCategory = (item) => {
- const category = item.value;
- this._bulkAddCategory(category);
+ private _handleBulkCategory = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ const value = ev.detail.item.value;
+ if (value === "category_create") {
+ this._bulkCreateCategory();
+ return;
+ }
+ if (value === "category_none") {
+ this._bulkAddCategory(null);
+ return;
+ }
+ if (value?.startsWith("category_")) {
+ this._bulkAddCategory(value.substring(9));
+ }
};
- private async _bulkAddCategory(category: string) {
+ private async _bulkAddCategory(category: string | null) {
const promises: Promise
[] = [];
this._selected.forEach((entityId) => {
promises.push(
@@ -1057,11 +947,18 @@ ${rejected
}
}
- private async _handleBulkLabel(ev) {
- const label = ev.currentTarget.value;
- const action = ev.currentTarget.action;
- this._bulkLabel(label, action);
- }
+ private _handleBulkLabel = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ ev.preventDefault();
+ const value = ev.detail.item.value;
+ if (value === "label_create") {
+ this._bulkCreateLabel();
+ return;
+ }
+ if (value?.startsWith("label_")) {
+ const action = (ev.detail.item as any).action;
+ this._bulkLabel(value.substring(6), action);
+ }
+ };
private async _bulkLabel(label: string, action: "add" | "remove") {
const promises: Promise[] = [];
@@ -1093,12 +990,22 @@ ${rejected
}
}
- private _handleBulkArea = (item) => {
- const area = item.value;
- this._bulkAddArea(area);
+ private _handleBulkArea = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ const value = ev.detail.item.value;
+ if (value === "area_create") {
+ this._bulkCreateArea();
+ return;
+ }
+ if (value === "area_none") {
+ this._bulkAddArea(null);
+ return;
+ }
+ if (value?.startsWith("area_")) {
+ this._bulkAddArea(value.substring(5));
+ }
};
- private async _bulkAddArea(area: string) {
+ private async _bulkAddArea(area: string | null) {
const promises: Promise[] = [];
this._selected.forEach((entityId) => {
promises.push(
@@ -1286,6 +1193,132 @@ ${rejected
});
};
+ private _renderCategoryItems = (slot = "") =>
+ html`${this._categories?.map(
+ (category) =>
+ html`
+ ${category.icon
+ ? html``
+ : html``}
+ ${category.name}
+ `
+ )}
+
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.no_category"
+ )}
+
+
+
+ ${this.hass.localize("ui.panel.config.category.editor.add")}
+ `;
+
+ private _renderLabelItems = (slot = "") =>
+ html`${this._labels?.map((label) => {
+ const color = label.color ? computeCssColor(label.color) : undefined;
+ const selected = this._selected.every((entityId) =>
+ this.hass.entities[entityId]?.labels.includes(label.label_id)
+ );
+ const partial =
+ !selected &&
+ this._selected.some((entityId) =>
+ this.hass.entities[entityId]?.labels.includes(label.label_id)
+ );
+ return html`
+
+
+ ${label.icon
+ ? html``
+ : nothing}
+ ${label.name}
+
+ `;
+ })}
+
+
+ ${this.hass.localize("ui.panel.config.labels.add_label")}
+ `;
+
+ private _renderAreaItems = (slot = "") =>
+ html`${Object.values(this.hass.areas).map(
+ (area) =>
+ html`
+ ${area.icon
+ ? html``
+ : html``}
+ ${area.name}
+ `
+ )}
+
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.no_area"
+ )}
+
+
+
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.add_area"
+ )}
+ `;
+
+ private _handleBulkAction = (ev) => {
+ const item = ev.detail.item;
+ const value = item.value;
+
+ if (!value) {
+ return;
+ }
+
+ if (value.startsWith("category_")) {
+ if (value === "category_create") {
+ this._bulkCreateCategory();
+ } else if (value === "category_none") {
+ this._bulkAddCategory(null);
+ } else {
+ this._bulkAddCategory(value.substring(9));
+ }
+ return;
+ }
+
+ if (value.startsWith("label_")) {
+ if (value === "label_create") {
+ this._bulkCreateLabel();
+ } else {
+ const action = item.action;
+ this._bulkLabel(value.substring(6), action);
+ }
+ return;
+ }
+
+ if (value.startsWith("area_")) {
+ if (value === "area_create") {
+ this._bulkCreateArea();
+ } else if (value === "area_none") {
+ this._bulkAddArea(null);
+ } else {
+ this._bulkAddArea(value.substring(5));
+ }
+ }
+ };
+
private _handleSortingChanged(ev: CustomEvent) {
this._activeSorting = ev.detail;
}
@@ -1334,7 +1367,7 @@ ${rejected
ha-assist-chip {
--ha-assist-chip-container-shape: 10px;
}
- ha-md-button-menu ha-assist-chip {
+ ha-dropdown ha-assist-chip {
--md-assist-chip-trailing-space: 8px;
}
ha-label {
diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts
index 7f89c43f60..742427b802 100644
--- a/src/panels/config/script/ha-script-picker.ts
+++ b/src/panels/config/script/ha-script-picker.ts
@@ -1,7 +1,7 @@
+import "@home-assistant/webawesome/dist/components/divider/divider";
import { ResizeController } from "@lit-labs/observers/resize-controller";
import { consume } from "@lit/context";
import {
- mdiChevronRight,
mdiCog,
mdiContentDuplicate,
mdiDelete,
@@ -46,6 +46,9 @@ import type {
SortingChangedEvent,
} from "../../../components/data-table/ha-data-table";
import "../../../components/data-table/ha-data-table-labels";
+import "../../../components/ha-dropdown";
+import "../../../components/ha-dropdown-item";
+import type { HaDropdownItem } from "../../../components/ha-dropdown-item";
import "../../../components/ha-fab";
import "../../../components/ha-filter-blueprints";
import "../../../components/ha-filter-categories";
@@ -81,6 +84,7 @@ import type {
UpdateEntityRegistryEntryResult,
} from "../../../data/entity/entity_registry";
import { updateEntityRegistryEntry } from "../../../data/entity/entity_registry";
+import { getEntityVoiceAssistantsIds } from "../../../data/expose";
import type { LabelRegistryEntry } from "../../../data/label/label_registry";
import {
createLabelRegistryEntry,
@@ -113,12 +117,11 @@ import { showAssignCategoryDialog } from "../category/show-dialog-assign-categor
import { showCategoryRegistryDetailDialog } from "../category/show-dialog-category-registry-detail";
import { configSections } from "../ha-panel-config";
import { showLabelDetailDialog } from "../labels/show-dialog-label-detail";
-import { getEntityVoiceAssistantsIds } from "../../../data/expose";
-import { getAvailableAssistants } from "../voice-assistants/expose/available-assistants";
import {
- getAssistantsTableColumn,
getAssistantsSortableKey,
+ getAssistantsTableColumn,
} from "../voice-assistants/expose/assistants-table-column";
+import { getAvailableAssistants } from "../voice-assistants/expose/available-assistants";
type ScriptItem = ScriptEntity & {
name: string;
@@ -451,102 +454,6 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
}
protected render(): TemplateResult {
- const categoryItems = html`${this._categories?.map(
- (category) =>
- html`
- ${category.icon
- ? html``
- : html``}
- ${category.name}
- `
- )}
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.no_category"
- )}
-
-
-
- ${this.hass.localize("ui.panel.config.category.editor.add")}
-
- `;
-
- const labelItems = html`${this._labels?.map((label) => {
- const color = label.color ? computeCssColor(label.color) : undefined;
- const selected = this._selected.every((entityId) =>
- this.hass.entities[entityId]?.labels.includes(label.label_id)
- );
- const partial =
- !selected &&
- this._selected.some((entityId) =>
- this.hass.entities[entityId]?.labels.includes(label.label_id)
- );
- return html`
-
-
- ${label.icon
- ? html``
- : nothing}
- ${label.name}
-
- `;
- })}
-
-
-
- ${this.hass.localize("ui.panel.config.labels.add_label")}
-
`;
-
- const areaItems = html`${Object.values(this.hass.areas).map(
- (area) =>
- html`
- ${area.icon
- ? html``
- : html``}
- ${area.name}
- `
- )}
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.no_area"
- )}
-
-
-
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.add_area"
- )}
-
- `;
-
const areasInOverflow =
(this._sizeController.value && this._sizeController.value < 900) ||
(!this._sizeController.value && this.hass.dockedSidebar === "docked");
@@ -687,7 +594,10 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
>
${!this.narrow
- ? html`
+ ? html`
- ${categoryItems}
-
+ ${this._renderCategoryItems()}
+
${labelsInOverflow
? nothing
- : html`
+ : html`
- ${labelItems}
- `}
+ ${this._renderLabelItems()}
+ `}
${areasInOverflow
? nothing
- : html`
+ : html`
- ${areaItems}
- `}`
+ ${this._renderAreaItems()}
+ `}`
: nothing}
${this.narrow || areasInOverflow
- ? html`
-
- ${
- this.narrow
+ ? html`
+ ${this.narrow
? html``
- }
-
- ${
- this.narrow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.move_category"
- )}
-
-
-
- ${categoryItems}
- `
- : nothing
- }
- ${
- this.narrow || labelsInOverflow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.automation.picker.bulk_actions.add_label"
- )}
-
-
-
- ${labelItems}
- `
- : nothing
- }
- ${
- this.narrow || areasInOverflow
- ? html`
-
-
- ${this.hass.localize(
- "ui.panel.config.devices.picker.bulk_actions.move_area"
- )}
-
-
-
- ${areaItems}
- `
- : nothing
- }
- `
+ >`}
+ ${this.narrow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.move_category"
+ )}
+ ${this._renderCategoryItems("submenu")}
+ `
+ : nothing}
+ ${this.narrow || labelsInOverflow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.add_label"
+ )}
+ ${this._renderLabelItems("submenu")}
+ `
+ : nothing}
+ ${this.narrow || areasInOverflow
+ ? html`
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.move_area"
+ )}
+ ${this._renderAreaItems("submenu")}
+ `
+ : nothing}
+ `
: nothing}
${!this.scripts.length
? html`
@@ -1056,12 +937,22 @@ class HaScriptPicker extends SubscribeMixin(LitElement) {
this._selected = ev.detail.value;
}
- private _handleBulkCategory = (item) => {
- const category = item.value;
- this._bulkAddCategory(category);
+ private _handleBulkCategory = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ const value = ev.detail.item.value;
+ if (value === "category_create") {
+ this._bulkCreateCategory();
+ return;
+ }
+ if (value === "category_none") {
+ this._bulkAddCategory(null);
+ return;
+ }
+ if (value?.startsWith("category_")) {
+ this._bulkAddCategory(value.substring(9));
+ }
};
- private async _bulkAddCategory(category: string) {
+ private async _bulkAddCategory(category: string | null) {
const promises: Promise
[] = [];
this._selected.forEach((entityId) => {
promises.push(
@@ -1086,11 +977,18 @@ ${rejected
}
}
- private async _handleBulkLabel(ev) {
- const label = ev.currentTarget.value;
- const action = ev.currentTarget.action;
- this._bulkLabel(label, action);
- }
+ private _handleBulkLabel = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ ev.preventDefault();
+ const value = ev.detail.item.value;
+ if (value === "label_create") {
+ this._bulkCreateLabel();
+ return;
+ }
+ if (value?.startsWith("label_")) {
+ const action = (ev.detail.item as any).action;
+ this._bulkLabel(value.substring(6), action);
+ }
+ };
private async _bulkLabel(label: string, action: "add" | "remove") {
const promises: Promise[] = [];
@@ -1296,12 +1194,22 @@ ${rejected
});
};
- private _handleBulkArea = (item) => {
- const area = item.value;
- this._bulkAddArea(area);
+ private _handleBulkArea = (ev: CustomEvent<{ item: HaDropdownItem }>) => {
+ const value = ev.detail.item.value;
+ if (value === "area_create") {
+ this._bulkCreateArea();
+ return;
+ }
+ if (value === "area_none") {
+ this._bulkAddArea(null);
+ return;
+ }
+ if (value?.startsWith("area_")) {
+ this._bulkAddArea(value.substring(5));
+ }
};
- private async _bulkAddArea(area: string) {
+ private async _bulkAddArea(area: string | null) {
const promises: Promise[] = [];
this._selected.forEach((entityId) => {
promises.push(
@@ -1336,6 +1244,132 @@ ${rejected
});
};
+ private _renderCategoryItems = (slot = "") =>
+ html`${this._categories?.map(
+ (category) =>
+ html`
+ ${category.icon
+ ? html``
+ : html``}
+ ${category.name}
+ `
+ )}
+
+ ${this.hass.localize(
+ "ui.panel.config.automation.picker.bulk_actions.no_category"
+ )}
+
+
+
+ ${this.hass.localize("ui.panel.config.category.editor.add")}
+ `;
+
+ private _renderLabelItems = (slot = "") =>
+ html`${this._labels?.map((label) => {
+ const color = label.color ? computeCssColor(label.color) : undefined;
+ const selected = this._selected.every((entityId) =>
+ this.hass.entities[entityId]?.labels.includes(label.label_id)
+ );
+ const partial =
+ !selected &&
+ this._selected.some((entityId) =>
+ this.hass.entities[entityId]?.labels.includes(label.label_id)
+ );
+ return html`
+
+
+ ${label.icon
+ ? html``
+ : nothing}
+ ${label.name}
+
+ `;
+ })}
+
+
+ ${this.hass.localize("ui.panel.config.labels.add_label")}
+ `;
+
+ private _renderAreaItems = (slot = "") =>
+ html`${Object.values(this.hass.areas).map(
+ (area) =>
+ html`
+ ${area.icon
+ ? html``
+ : html``}
+ ${area.name}
+ `
+ )}
+
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.no_area"
+ )}
+
+
+
+ ${this.hass.localize(
+ "ui.panel.config.devices.picker.bulk_actions.add_area"
+ )}
+ `;
+
+ private _handleBulkAction = (ev) => {
+ const item = ev.detail.item;
+ const value = item.value;
+
+ if (!value) {
+ return;
+ }
+
+ if (value.startsWith("category_")) {
+ if (value === "category_create") {
+ this._bulkCreateCategory();
+ } else if (value === "category_none") {
+ this._bulkAddCategory(null);
+ } else {
+ this._bulkAddCategory(value.substring(9));
+ }
+ return;
+ }
+
+ if (value.startsWith("label_")) {
+ if (value === "label_create") {
+ this._bulkCreateLabel();
+ } else {
+ const action = item.action;
+ this._bulkLabel(value.substring(6), action);
+ }
+ return;
+ }
+
+ if (value.startsWith("area_")) {
+ if (value === "area_create") {
+ this._bulkCreateArea();
+ } else if (value === "area_none") {
+ this._bulkAddArea(null);
+ } else {
+ this._bulkAddArea(value.substring(5));
+ }
+ }
+ };
+
private _handleSortingChanged(ev: CustomEvent) {
this._activeSorting = ev.detail;
}
@@ -1383,7 +1417,7 @@ ${rejected
ha-assist-chip {
--ha-assist-chip-container-shape: 10px;
}
- ha-md-button-menu ha-assist-chip {
+ ha-dropdown ha-assist-chip {
--md-assist-chip-trailing-space: 8px;
}
ha-label {
diff --git a/src/panels/developer-tools/statistics/developer-tools-statistics.ts b/src/panels/developer-tools/statistics/developer-tools-statistics.ts
index 636100e7a0..e6362353a9 100644
--- a/src/panels/developer-tools/statistics/developer-tools-statistics.ts
+++ b/src/panels/developer-tools/statistics/developer-tools-statistics.ts
@@ -28,10 +28,11 @@ import type {
SortingDirection,
} from "../../../components/data-table/ha-data-table";
import { showDataTableSettingsDialog } from "../../../components/data-table/show-dialog-data-table-settings";
+import "@home-assistant/webawesome/dist/components/divider/divider";
import "../../../components/ha-button";
import "../../../components/ha-dialog";
-import "../../../components/ha-md-button-menu";
-import "../../../components/ha-md-divider";
+import "../../../components/ha-dropdown";
+import "../../../components/ha-dropdown-item";
import type { HaMdMenu } from "../../../components/ha-md-menu";
import "../../../components/ha-md-menu-item";
import "../../../components/search-input-outlined";
@@ -325,7 +326,7 @@ class HaPanelDevStatistics extends KeyboardShortcutMixin(LitElement) {
"ui.components.subpage-data-table.exit_selection_mode"
)}
>
-
+
-
-
- ${localize("ui.components.subpage-data-table.select_all")}
-
-
-
-
- ${localize(
- "ui.panel.developer-tools.tabs.statistics.data_table.select_all_issues"
- )}
-
-
-
-
- ${localize(
- "ui.components.subpage-data-table.select_none"
- )}
-
-
-
-
-
- ${localize(
- "ui.components.subpage-data-table.exit_selection_mode"
- )}
-
-
-
+
+ ${localize("ui.components.subpage-data-table.select_all")}
+
+
+ ${localize(
+ "ui.panel.developer-tools.tabs.statistics.data_table.select_all_issues"
+ )}
+
+
+ ${localize("ui.components.subpage-data-table.select_none")}
+
+
+
+ ${localize(
+ "ui.components.subpage-data-table.exit_selection_mode"
+ )}
+
+
${localize("ui.components.subpage-data-table.selected", {
selected: this._selected.length,
@@ -814,7 +793,7 @@ class HaPanelDevStatistics extends KeyboardShortcutMixin(LitElement) {
#sort-by-anchor,
#group-by-anchor,
- ha-md-button-menu ha-assist-chip {
+ ha-dropdown ha-assist-chip {
--md-assist-chip-trailing-space: 8px;
}
`,