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

20250701.0 (#26019)

Browse Source
This commit is contained in:
Paul Bottein 2025-07-01 15:04:35 +02:00 committed by GitHub
commit c3f0bba4a3
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
26 changed files with 415 additions and 286 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
pyproject.toml
View File

@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
[project]
name = "home-assistant-frontend"
version = "20250627.0"
version = "20250701.0"
license = "Apache-2.0"
license-files = ["LICENSE*"]
description = "The Home Assistant frontend"

4
src/common/entity/group_entities.ts
View File

@ -1,4 +1,4 @@
import { callService, type HassEntity } from "home-assistant-js-websocket";
import type { HassEntity } from "home-assistant-js-websocket";
import { computeStateDomain } from "./compute_state_domain";
import { isUnavailableState, UNAVAILABLE } from "../../data/entity";
import type { HomeAssistant } from "../../types";
@ -62,7 +62,7 @@ export const toggleGroupEntities = (
const entitiesIds = states.map((stateObj) => stateObj.entity_id);
callService(hass.connection, domain, service, {
hass.callService(domain, service, {
entity_id: entitiesIds,
});
};

192
src/components/ha-areas-floors-display-editor.ts
View File

@ -1,14 +1,15 @@
import { mdiTextureBox } from "@mdi/js";
import { mdiDrag, mdiTextureBox } from "@mdi/js";
import type { TemplateResult } from "lit";
import { LitElement, css, html, nothing } from "lit";
import { customElement, property } from "lit/decorators";
import { repeat } from "lit/directives/repeat";
import memoizeOne from "memoize-one";
import { fireEvent } from "../common/dom/fire_event";
import { computeFloorName } from "../common/entity/compute_floor_name";
import { getAreaContext } from "../common/entity/context/get_area_context";
import { stringCompare } from "../common/string/compare";
import { areaCompare } from "../data/area_registry";
import type { FloorRegistryEntry } from "../data/floor_registry";
import { getFloors } from "../panels/lovelace/strategies/areas/helpers/areas-strategy-helper";
import type { HomeAssistant } from "../types";
import "./ha-expansion-panel";
import "./ha-floor-icon";
@ -17,9 +18,14 @@ import type { DisplayItem, DisplayValue } from "./ha-items-display-editor";
import "./ha-svg-icon";
import "./ha-textfield";
export interface AreasDisplayValue {
export interface AreasFloorsDisplayValue {
areas_display?: {
hidden?: string[];
order?: string[];
};
floors_display?: {
order?: string[];
};
}
const UNASSIGNED_FLOOR = "__unassigned__";
@ -30,12 +36,10 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
@property() public label?: string;
@property({ attribute: false }) public value?: AreasDisplayValue;
@property({ attribute: false }) public value?: AreasFloorsDisplayValue;
@property() public helper?: string;
@property({ type: Boolean }) public expanded = false;
@property({ type: Boolean }) public disabled = false;
@property({ type: Boolean }) public required = false;
@ -44,55 +48,78 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
public showNavigationButton = false;
protected render(): TemplateResult {
const groupedItems = this._groupedItems(this.hass.areas, this.hass.floors);
const groupedAreasItems = this._groupedAreasItems(
this.hass.areas,
this.hass.floors
);
const filteredFloors = this._sortedFloors(this.hass.floors).filter(
const filteredFloors = this._sortedFloors(
this.hass.floors,
this.value?.floors_display?.order
).filter(
(floor) =>
// Only include floors that have areas assigned to them
groupedItems[floor.floor_id]?.length > 0
groupedAreasItems[floor.floor_id]?.length > 0
);
const value: DisplayValue = {
order: this.value?.order ?? [],
hidden: this.value?.hidden ?? [],
order: this.value?.areas_display?.order ?? [],
hidden: this.value?.areas_display?.hidden ?? [],
};
const canReorderFloors =
filteredFloors.filter((floor) => floor.floor_id !== UNASSIGNED_FLOOR)
.length > 1;
return html`
${this.label ? html`<label>${this.label}</label>` : nothing}
<ha-sortable
draggable-selector=".draggable"
handle-selector=".handle"
@item-moved=${this._floorMoved}
.disabled=${this.disabled || !canReorderFloors}
>
<div>
${repeat(
filteredFloors,
(floor) => floor.floor_id,
(floor: FloorRegistryEntry) => html`
<ha-expansion-panel
outlined
.header=${this.label}
.expanded=${this.expanded}
.header=${computeFloorName(floor)}
left-chevron
class=${floor.floor_id === UNASSIGNED_FLOOR ? "" : "draggable"}
>
<ha-svg-icon slot="leading-icon" .path=${mdiTextureBox}></ha-svg-icon>
${filteredFloors.map((floor, _, array) => {
const noFloors =
array.length === 1 && floor.floor_id === UNASSIGNED_FLOOR;
return html`
<div class="floor">
${noFloors
<ha-floor-icon
slot="leading-icon"
.floor=${floor}
></ha-floor-icon>
${floor.floor_id === UNASSIGNED_FLOOR || !canReorderFloors
? nothing
: html`<div class="header">
<ha-floor-icon .floor=${floor}></ha-floor-icon>
<p>${computeFloorName(floor)}</p>
</div>`}
<div class="areas">
: html`
<ha-svg-icon
class="handle"
slot="icons"
.path=${mdiDrag}
></ha-svg-icon>
`}
<ha-items-display-editor
.hass=${this.hass}
.items=${groupedItems[floor.floor_id] || []}
.items=${groupedAreasItems[floor.floor_id]}
.value=${value}
.floorId=${floor.floor_id ?? UNASSIGNED_FLOOR}
.floorId=${floor.floor_id}
@value-changed=${this._areaDisplayChanged}
.showNavigationButton=${this.showNavigationButton}
></ha-items-display-editor>
</div>
</div>
`;
})}
</ha-expansion-panel>
`
)}
</div>
</ha-sortable>
`;
}
private _groupedItems = memoizeOne(
private _groupedAreasItems = memoizeOne(
(
hassAreas: HomeAssistant["areas"],
// update items if floors change
@ -116,7 +143,6 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
label: area.name,
icon: area.icon ?? undefined,
iconPath: mdiTextureBox,
description: floor?.name,
});
return acc;
@ -128,18 +154,17 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
);
private _sortedFloors = memoizeOne(
(hassFloors: HomeAssistant["floors"]): FloorRegistryEntry[] => {
const floors = Object.values(hassFloors).sort((floorA, floorB) => {
if (floorA.level !== floorB.level) {
return (floorA.level ?? 0) - (floorB.level ?? 0);
}
return stringCompare(floorA.name, floorB.name);
});
(
hassFloors: HomeAssistant["floors"],
order: string[] | undefined
): FloorRegistryEntry[] => {
const floors = getFloors(hassFloors, order);
const noFloors = floors.length === 0;
floors.push({
floor_id: UNASSIGNED_FLOOR,
name: this.hass.localize(
"ui.panel.lovelace.strategy.areas.others_areas"
),
name: noFloors
? this.hass.localize("ui.panel.lovelace.strategy.areas.areas")
: this.hass.localize("ui.panel.lovelace.strategy.areas.other_areas"),
icon: null,
level: null,
aliases: [],
@ -150,17 +175,43 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
}
);
private async _areaDisplayChanged(ev) {
private _floorMoved(ev: CustomEvent<HASSDomEvents["item-moved"]>) {
ev.stopPropagation();
const value = ev.detail.value as DisplayValue;
const currentFloorId = ev.currentTarget.floorId;
const newIndex = ev.detail.newIndex;
const oldIndex = ev.detail.oldIndex;
const floorIds = this._sortedFloors(
this.hass.floors,
this.value?.floors_display?.order
).map((floor) => floor.floor_id);
const newOrder = [...floorIds];
const movedFloorId = newOrder.splice(oldIndex, 1)[0];
newOrder.splice(newIndex, 0, movedFloorId);
const newValue: AreasFloorsDisplayValue = {
areas_display: this.value?.areas_display,
floors_display: {
order: newOrder,
},
};
if (newValue.floors_display?.order?.length === 0) {
delete newValue.floors_display.order;
}
fireEvent(this, "value-changed", { value: newValue });
}
const floorIds = this._sortedFloors(this.hass.floors).map(
(floor) => floor.floor_id
);
private async _areaDisplayChanged(ev: CustomEvent<{ value: DisplayValue }>) {
ev.stopPropagation();
const value = ev.detail.value;
const currentFloorId = (ev.currentTarget as any).floorId;
const oldHidden = this.value?.hidden ?? [];
const oldOrder = this.value?.order ?? [];
const floorIds = this._sortedFloors(
this.hass.floors,
this.value?.floors_display?.order
).map((floor) => floor.floor_id);
const oldAreaDisplay = this.value?.areas_display ?? {};
const oldHidden = oldAreaDisplay?.hidden ?? [];
const oldOrder = oldAreaDisplay?.order ?? [];
const newHidden: string[] = [];
const newOrder: string[] = [];
@ -187,37 +238,27 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
}
}
const newValue: AreasDisplayValue = {
const newValue: AreasFloorsDisplayValue = {
areas_display: {
hidden: newHidden,
order: newOrder,
},
floors_display: this.value?.floors_display,
};
if (newValue.hidden?.length === 0) {
delete newValue.hidden;
if (newValue.areas_display?.hidden?.length === 0) {
delete newValue.areas_display.hidden;
}
if (newValue.order?.length === 0) {
delete newValue.order;
if (newValue.areas_display?.order?.length === 0) {
delete newValue.areas_display.order;
}
this.value = newValue;
if (newValue.floors_display?.order?.length === 0) {
delete newValue.floors_display.order;
}
fireEvent(this, "value-changed", { value: newValue });
}
static styles = css`
.floor .header p {
margin: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
flex: 1;
}
.floor .header {
margin: 16px 0 8px 0;
padding: 0 8px;
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
}
ha-expansion-panel {
margin-bottom: 8px;
--expansion-panel-summary-padding: 0 16px;
@ -225,6 +266,11 @@ export class HaAreasFloorsDisplayEditor extends LitElement {
ha-expansion-panel [slot="leading-icon"] {
margin-inline-end: 16px;
}
label {
display: block;
font-weight: var(--ha-font-weight-bold);
margin-bottom: 8px;
}
`;
}

6
src/components/ha-code-editor.ts
View File

@ -559,9 +559,9 @@ export class HaCodeEditor extends ReactiveElement {
right: 8px;
z-index: 1;
color: var(--secondary-text-color);
background-color: var(--card-background-color);
background-color: var(--secondary-background-color);
border-radius: 50%;
opacity: 0.6;
opacity: 0.9;
transition: opacity 0.2s;
--mdc-icon-button-size: 32px;
--mdc-icon-size: 18px;
@ -591,7 +591,7 @@ export class HaCodeEditor extends ReactiveElement {
z-index: 9999 !important;
background-color: var(
--code-editor-background-color,
var(--mdc-text-field-fill-color, whitesmoke)
var(--card-background-color)
) !important;
margin: 0 !important;
padding-top: var(--safe-area-inset-top) !important;

1
src/components/ha-control-button-group.ts
View File

@ -26,7 +26,6 @@ export class HaControlButtonGroup extends LitElement {
.container {
display: flex;
flex-direction: row;
justify-content: var(--control-button-group-alignment, start);
width: 100%;
height: 100%;
}

38
src/components/ha-items-display-editor.ts
View File

@ -122,22 +122,6 @@ export class HaItemDisplayEditor extends LitElement {
${description
? html`<span slot="supporting-text">${description}</span>`
: nothing}
${isVisible && !disableSorting
? html`
<ha-svg-icon
tabindex=${ifDefined(
this.showNavigationButton ? "0" : undefined
)}
.idx=${idx}
@keydown=${this.showNavigationButton
? this._dragHandleKeydown
: undefined}
class="handle"
.path=${mdiDrag}
slot="start"
></ha-svg-icon>
`
: html`<ha-svg-icon slot="start"></ha-svg-icon>`}
${!showIcon
? nothing
: icon
@ -162,6 +146,9 @@ export class HaItemDisplayEditor extends LitElement {
<span slot="end"> ${this.actionsRenderer(item)} </span>
`
: nothing}
${this.showNavigationButton
? html`<ha-icon-next slot="end"></ha-icon-next>`
: nothing}
<ha-icon-button
.path=${isVisible ? mdiEye : mdiEyeOff}
slot="end"
@ -174,9 +161,22 @@ export class HaItemDisplayEditor extends LitElement {
.value=${value}
@click=${this._toggle}
></ha-icon-button>
${this.showNavigationButton
? html` <ha-icon-next slot="end"></ha-icon-next> `
: nothing}
${isVisible && !disableSorting
? html`
<ha-svg-icon
tabindex=${ifDefined(
this.showNavigationButton ? "0" : undefined
)}
.idx=${idx}
@keydown=${this.showNavigationButton
? this._dragHandleKeydown
: undefined}
class="handle"
.path=${mdiDrag}
slot="end"
></ha-svg-icon>
`
: html`<ha-svg-icon slot="end"></ha-svg-icon>`}
</ha-md-list-item>
`;
}

6
src/components/ha-selector/ha-selector-object.ts
View File

@ -122,11 +122,7 @@ export class HaObjectSelector extends LitElement {
}
protected render() {
if (!this.selector.object) {
return nothing;
}
if (this.selector.object.fields) {
if (this.selector.object?.fields) {
if (this.selector.object.multiple) {
const items = ensureArray(this.value ?? []);
return html`

1
src/components/ha-settings-row.ts
View File

@ -89,6 +89,7 @@ export class HaSettingsRow extends LitElement {
display: var(--settings-row-content-display, flex);
justify-content: flex-end;
flex: 1;
min-width: 0;
padding: 16px 0;
}
.content ::slotted(*) {

1
src/panels/config/blueprint/blueprint-generic-editor.ts
View File

@ -173,6 +173,7 @@ export abstract class HaBlueprintGenericEditor extends LitElement {
.content=${value?.description}
></ha-markdown>
${html`<ha-selector
narrow
.hass=${this.hass}
.selector=${selector}
.key=${key}

117
src/panels/config/integrations/ha-config-entry-device-row.ts
View File

@ -1,9 +1,9 @@
import {
mdiCogOutline,
mdiDelete,
mdiDevices,
mdiDotsVertical,
mdiPencil,
mdiShapeOutline,
mdiStopCircleOutline,
mdiTransitConnectionVariant,
} from "@mdi/js";
@ -58,74 +58,86 @@ class HaConfigEntryDeviceRow extends LitElement {
area ? area.name : undefined,
].filter(Boolean);
return html`<ha-md-list-item @click=${this.narrow ? this._handleNavigateToDevice : undefined} class=${classMap({ disabled: Boolean(device.disabled_by) })}>
<ha-svg-icon .path=${device.entry_type === "service" ? mdiTransitConnectionVariant : mdiDevices} slot="start"></ha-svg-icon>
<div slot="headline"></div>${computeDeviceNameDisplay(device, this.hass)}</div>
return html`<ha-md-list-item
type="button"
@click=${this._handleNavigateToDevice}
class=${classMap({ disabled: Boolean(device.disabled_by) })}
>
<ha-svg-icon
.path=${device.entry_type === "service"
? mdiTransitConnectionVariant
: mdiDevices}
slot="start"
></ha-svg-icon>
<div slot="headline">${computeDeviceNameDisplay(device, this.hass)}</div>
<span slot="supporting-text"
>${supportingText.join(" • ")}
${supportingText.length && entities.length ? " • " : nothing}
${
entities.length
? this.narrow
${entities.length
? this.hass.localize(
"ui.panel.config.integrations.config_entry.entities",
{ count: entities.length }
)
: html`<a
href=${`/config/entities/?historyBack=1&device=${device.id}`}
>${this.hass.localize(
"ui.panel.config.integrations.config_entry.entities",
{ count: entities.length }
)}</a
>`
: nothing
}</span
: nothing}</span
>
${
!this.narrow
? html`<ha-icon-button-next
slot="end"
@click=${this._handleNavigateToDevice}
>
</ha-icon-button-next>`
: nothing
}
</ha-icon-button>
${!this.narrow
? html`<ha-icon-next slot="end"> </ha-icon-next>`
: nothing}
<div class="vertical-divider" slot="end" @click=${stopPropagation}></div>
${
!this.narrow
${!this.narrow
? html`<ha-icon-button
slot="end"
@click=${this._handleConfigureDevice}
@click=${this._handleEditDevice}
.path=${mdiPencil}
.label=${this.hass.localize(
"ui.panel.config.integrations.config_entry.device.configure"
"ui.panel.config.integrations.config_entry.device.edit"
)}
></ha-icon-button>`
: nothing
}
</ha-icon-button>
<ha-md-button-menu positioning="popover" slot="end" @click=${stopPropagation}>
: nothing}
<ha-md-button-menu
positioning="popover"
slot="end"
@click=${stopPropagation}
>
<ha-icon-button
slot="trigger"
.label=${this.hass.localize("ui.common.menu")}
.path=${mdiDotsVertical}
></ha-icon-button>
${
this.narrow
? html`<ha-md-menu-item @click=${this._handleConfigureDevice}>
<ha-svg-icon .path=${mdiCogOutline} slot="start"></ha-svg-icon>
${this.narrow
? html`<ha-md-menu-item @click=${this._handleEditDevice}>
<ha-svg-icon .path=${mdiPencil} slot="start"></ha-svg-icon>
${this.hass.localize(
"ui.panel.config.integrations.config_entry.device.configure"
"ui.panel.config.integrations.config_entry.device.edit"
)}
</ha-md-menu-item>`
: nothing
}
<ha-md-menu-item class=${device.disabled_by !== "user" ? "warning" : ""} @click=${this._handleDisableDevice} .disabled=${device.disabled_by !== "user" && device.disabled_by}>
: nothing}
${entities.length
? html`
<ha-md-menu-item
href=${`/config/entities/?historyBack=1&device=${device.id}`}
>
<ha-svg-icon
.path=${mdiShapeOutline}
slot="start"
></ha-svg-icon>
${this.hass.localize(
`ui.panel.config.integrations.config_entry.entities`,
{ count: entities.length }
)}
<ha-icon-next slot="end"></ha-icon-next>
</ha-md-menu-item>
`
: nothing}
<ha-md-menu-item
class=${device.disabled_by !== "user" ? "warning" : ""}
@click=${this._handleDisableDevice}
.disabled=${device.disabled_by !== "user" && device.disabled_by}
>
<ha-svg-icon .path=${mdiStopCircleOutline} slot="start"></ha-svg-icon>
${
device.disabled_by && device.disabled_by !== "user"
${device.disabled_by && device.disabled_by !== "user"
? this.hass.localize(
"ui.dialogs.device-registry-detail.enabled_cause",
{
@ -145,14 +157,10 @@ class HaConfigEntryDeviceRow extends LitElement {
)
: this.hass.localize(
"ui.panel.config.integrations.config_entry.device.disable"
)
}
)}
</ha-md-menu-item>
${
this.entry.supports_remove_device
? html` <ha-md-menu-item
${this.entry.supports_remove_device
? html`<ha-md-menu-item
class="warning"
@click=${this._handleDeleteDevice}
>
@ -161,8 +169,7 @@ class HaConfigEntryDeviceRow extends LitElement {
"ui.panel.config.integrations.config_entry.device.delete"
)}
</ha-md-menu-item>`
: nothing
}
: nothing}
</ha-md-button-menu>
</ha-md-list-item> `;
}
@ -170,7 +177,7 @@ class HaConfigEntryDeviceRow extends LitElement {
private _getEntities = (): EntityRegistryEntry[] =>
this.entities?.filter((entity) => entity.device_id === this.device.id);
private _handleConfigureDevice(ev: MouseEvent) {
private _handleEditDevice(ev: MouseEvent) {
ev.stopPropagation(); // Prevent triggering the click handler on the list item
showDeviceRegistryDetailDialog(this, {
device: this.device,
@ -295,6 +302,8 @@ class HaConfigEntryDeviceRow extends LitElement {
}
ha-md-list-item {
--md-list-item-leading-space: 56px;
--md-ripple-hover-color: transparent;
--md-ripple-pressed-color: transparent;
}
.disabled {
opacity: 0.5;

5
src/panels/config/integrations/ha-config-entry-row.ts
View File

@ -154,7 +154,10 @@ class HaConfigEntryRow extends LitElement {
statusLine.push(
html`<a
href=${`/config/entities/?historyBack=1&config_entry=${item.entry_id}`}
>${entities.length} entities</a
>${this.hass.localize(
"ui.panel.config.integrations.config_entry.entities",
{ count: entities.length }
)}</a
>`
);
}

3
src/panels/config/integrations/ha-config-integration-page.ts
View File

@ -432,7 +432,8 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
)}
</div>`
: nothing}
${this._manifest?.quality_scale &&
${this._manifest?.is_built_in &&
this._manifest.quality_scale &&
Object.keys(QUALITY_SCALE_MAP).includes(
this._manifest.quality_scale
)

3
src/panels/lovelace/card-features/common/card-feature-styles.ts
View File

@ -25,9 +25,6 @@ export const cardFeatureStyles = css`
flex-basis: 20px;
--control-button-padding: 0px;
}
ha-control-button-group[no-stretch] > ha-control-button {
max-width: 48px;
}
ha-control-button {
--control-button-focus-color: var(--feature-color);
}

23
src/panels/lovelace/card-features/hui-area-controls-card-feature.ts
View File

@ -1,5 +1,6 @@
import type { HassEntity } from "home-assistant-js-websocket";
import { css, html, LitElement, nothing } from "lit";
import { classMap } from "lit/directives/class-map";
import { customElement, property, state } from "lit/decorators";
import { styleMap } from "lit/directives/style-map";
import memoizeOne from "memoize-one";
@ -229,7 +230,11 @@ class HuiAreaControlsCardFeature
}
return html`
<ha-control-button-group ?no-stretch=${this.position === "inline"}>
<ha-control-button-group
class=${classMap({
"no-stretch": this.position === "inline",
})}
>
${displayControls.map((control) => {
const button = AREA_CONTROLS_BUTTONS[control];
@ -292,8 +297,22 @@ class HuiAreaControlsCardFeature
return [
cardFeatureStyles,
css`
:host {
pointer-events: none !important;
display: flex;
flex-direction: row;
justify-content: flex-end;
}
ha-control-button-group {
--control-button-group-alignment: flex-end;
pointer-events: auto;
width: 100%;
}
ha-control-button-group.no-stretch {
width: auto;
max-width: 100%;
}
ha-control-button-group.no-stretch > ha-control-button {
width: 48px;
}
ha-control-button {
--active-color: var(--state-active-color);

8
src/panels/lovelace/card-features/hui-card-feature.ts
View File

@ -1,4 +1,4 @@
import { LitElement, html, nothing } from "lit";
import { LitElement, css, html, nothing } from "lit";
import { customElement, property } from "lit/decorators";
import type { HomeAssistant } from "../../../types";
import type { HuiErrorCard } from "../cards/hui-error-card";
@ -56,6 +56,12 @@ export class HuiCardFeature extends LitElement {
}
return html`${element}`;
}
static styles = css`
:host > * {
pointer-events: auto;
}
`;
}
declare global {

1
src/panels/lovelace/card-features/hui-card-features.ts
View File

@ -46,6 +46,7 @@ export class HuiCardFeatures extends LitElement {
--feature-height: 42px;
--feature-border-radius: 12px;
--feature-button-spacing: 12px;
pointer-events: none;
position: relative;
width: 100%;
display: flex;

8
src/panels/lovelace/cards/hui-area-card.ts
View File

@ -348,6 +348,14 @@ export class HuiAreaCard extends LitElement implements LovelaceCard {
return undefined;
}
// If only one entity, return its formatted state
if (entities.length === 1) {
const stateObj = entities[0];
return isUnavailableState(stateObj.state)
? ""
: this.hass.formatEntityState(stateObj);
}
// Use the first entity's unit_of_measurement for formatting
const uom = entities.find(
(entity) => entity.attributes.unit_of_measurement

3
src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/dialog-dashboard-strategy-editor.ts
View File

@ -144,6 +144,9 @@ class DialogDashboardStrategyEditor extends LitElement {
.path=${mdiClose}
></ha-icon-button>
<span slot="title" .title=${title}>${title}</span>
${this._params.title
? html`<span slot="subtitle">${this._params.title}</span>`
: nothing}
<ha-button-menu
corner="BOTTOM_END"
menu-corner="END"

1
src/panels/lovelace/editor/dashboard-strategy-editor/dialogs/show-dialog-dashboard-strategy-editor.ts
View File

@ -3,6 +3,7 @@ import type { LovelaceDashboardStrategyConfig } from "../../../../../data/lovela
export interface DashboardStrategyEditorDialogParams {
config: LovelaceDashboardStrategyConfig;
title?: string;
saveConfig: (config: LovelaceDashboardStrategyConfig) => void;
takeControl: () => void;
deleteDashboard: () => Promise<boolean>;

1
src/panels/lovelace/hui-root.ts
View File

@ -782,6 +782,7 @@ class HUIRoot extends LitElement {
showDashboardStrategyEditorDialog(this, {
config: this.lovelace!.rawConfig,
title: this.panel ? getPanelTitle(this.hass, this.panel) : undefined,
saveConfig: this.lovelace!.saveConfig,
takeControl: () => {
showSaveDialog(this, {

4
src/panels/lovelace/strategies/areas/areas-dashboard-strategy.ts
View File

@ -22,6 +22,9 @@ export interface AreasDashboardStrategyConfig {
hidden?: string[];
order?: string[];
};
floors_display?: {
order?: string[];
};
areas_options?: Record<string, AreaOptions>;
}
@ -84,6 +87,7 @@ export class AreasDashboardStrategy extends ReactiveElement {
type: "areas-overview",
areas_display: config.areas_display,
areas_options: config.areas_options,
floors_display: config.floors_display,
} satisfies AreasViewStrategyConfig,
},
...areaViews,

20
src/panels/lovelace/strategies/areas/areas-overview-view-strategy.ts
View File

@ -1,6 +1,5 @@
import { ReactiveElement } from "lit";
import { customElement } from "lit/decorators";
import { stringCompare } from "../../../../common/string/compare";
import { floorDefaultIcon } from "../../../../components/ha-floor-icon";
import type { LovelaceSectionConfig } from "../../../../data/lovelace/config/section";
import type { LovelaceViewConfig } from "../../../../data/lovelace/config/view";
@ -9,7 +8,11 @@ import { getAreaControlEntities } from "../../card-features/hui-area-controls-ca
import { AREA_CONTROLS, type AreaControl } from "../../card-features/types";
import type { AreaCardConfig, HeadingCardConfig } from "../../cards/types";
import type { EntitiesDisplay } from "./area-view-strategy";
import { computeAreaPath, getAreas } from "./helpers/areas-strategy-helper";
import {
computeAreaPath,
getAreas,
getFloors,
} from "./helpers/areas-strategy-helper";
const UNASSIGNED_FLOOR = "__unassigned__";
@ -23,6 +26,9 @@ export interface AreasViewStrategyConfig {
hidden?: string[];
order?: string[];
};
floors_display?: {
order?: string[];
};
areas_options?: Record<string, AreaOptions>;
}
@ -38,19 +44,13 @@ export class AreasOverviewViewStrategy extends ReactiveElement {
config.areas_display?.order
);
const floors = Object.values(hass.floors);
floors.sort((floorA, floorB) => {
if (floorA.level !== floorB.level) {
return (floorA.level ?? 0) - (floorB.level ?? 0);
}
return stringCompare(floorA.name, floorB.name);
});
const floors = getFloors(hass.floors, config.floors_display?.order);
const floorSections = [
...floors,
{
floor_id: UNASSIGNED_FLOOR,
name: hass.localize("ui.panel.lovelace.strategy.areas.others_areas"),
name: hass.localize("ui.panel.lovelace.strategy.areas.other_areas"),
level: null,
icon: null,
},

19
src/panels/lovelace/strategies/areas/editor/hui-areas-dashboard-strategy-editor.ts
View File

@ -1,10 +1,12 @@
import { mdiThermometerWater } from "@mdi/js";
import { css, html, LitElement, nothing } from "lit";
import { customElement, property, state } from "lit/decorators";
import memoizeOne from "memoize-one";
import { fireEvent } from "../../../../../common/dom/fire_event";
import "../../../../../components/ha-areas-display-editor";
import type { AreasDisplayValue } from "../../../../../components/ha-areas-display-editor";
import "../../../../../components/ha-areas-floors-display-editor";
import type { AreasFloorsDisplayValue } from "../../../../../components/ha-areas-floors-display-editor";
import "../../../../../components/ha-entities-display-editor";
import "../../../../../components/ha-icon";
import "../../../../../components/ha-icon-button";
@ -126,7 +128,7 @@ export class HuiAreasDashboardStrategyEditor
`;
}
const value = this._config.areas_display;
const value = this._areasFloorsDisplayValue(this._config);
return html`
<ha-areas-floors-display-editor
@ -135,7 +137,7 @@ export class HuiAreasDashboardStrategyEditor
.label=${this.hass.localize(
"ui.panel.lovelace.editor.strategy.areas.areas_display"
)}
@value-changed=${this._areasDisplayChanged}
@value-changed=${this._areasFloorsDisplayChanged}
expanded
show-navigation-button
@item-display-navigate-clicked=${this._handleAreaNavigate}
@ -149,6 +151,13 @@ export class HuiAreasDashboardStrategyEditor
}
}
private _areasFloorsDisplayValue = memoizeOne(
(config: AreasDashboardStrategyConfig): AreasFloorsDisplayValue => ({
areas_display: config.areas_display,
floors_display: config.floors_display,
})
);
private _editArea(ev: Event): void {
ev.stopPropagation();
const area = (ev.currentTarget! as any).area as AreaRegistryEntry;
@ -163,11 +172,11 @@ export class HuiAreasDashboardStrategyEditor
this._area = ev.detail.value;
}
private _areasDisplayChanged(ev: CustomEvent): void {
const value = ev.detail.value as AreasDisplayValue;
private _areasFloorsDisplayChanged(ev: CustomEvent): void {
const value = ev.detail.value as AreasFloorsDisplayValue;
const newConfig: AreasDashboardStrategyConfig = {
...this._config!,
areas_display: value,
...value,
};
fireEvent(this, "config-changed", { config: newConfig });

25
src/panels/lovelace/strategies/areas/helpers/areas-strategy-helper.ts
View File

@ -3,9 +3,13 @@ import { computeStateName } from "../../../../../common/entity/compute_state_nam
import type { EntityFilterFunc } from "../../../../../common/entity/entity_filter";
import { generateEntityFilter } from "../../../../../common/entity/entity_filter";
import { stripPrefixFromEntityName } from "../../../../../common/entity/strip_prefix_from_entity_name";
import { orderCompare } from "../../../../../common/string/compare";
import {
orderCompare,
stringCompare,
} from "../../../../../common/string/compare";
import type { AreaRegistryEntry } from "../../../../../data/area_registry";
import { areaCompare } from "../../../../../data/area_registry";
import type { FloorRegistryEntry } from "../../../../../data/floor_registry";
import type { LovelaceCardConfig } from "../../../../../data/lovelace/config/card";
import type { HomeAssistant } from "../../../../../types";
import { supportsAlarmModesCardFeature } from "../../../card-features/hui-alarm-modes-card-feature";
@ -290,4 +294,23 @@ export const getAreas = (
return sortedAreas;
};
export const getFloors = (
entries: HomeAssistant["floors"],
floorsOrder?: string[]
): FloorRegistryEntry[] => {
const floors = Object.values(entries);
const compare = orderCompare(floorsOrder || []);
return floors.sort((floorA, floorB) => {
const order = compare(floorA.floor_id, floorB.floor_id);
if (order !== 0) {
return order;
}
if (floorA.level !== floorB.level) {
return (floorA.level ?? 0) - (floorB.level ?? 0);
}
return stringCompare(floorA.name, floorB.name);
});
};
export const computeAreaPath = (areaId: string): string => `areas-${areaId}`;

2
src/resources/codemirror.ts
View File

@ -51,7 +51,7 @@ export const haTheme = EditorView.theme({
"&": {
color: "var(--primary-text-color)",
backgroundColor:
"var(--code-editor-background-color, var(--mdc-text-field-fill-color, whitesmoke))",
"var(--code-editor-background-color, var(--card-background-color))",
borderRadius:
"var(--mdc-shape-small, 4px) var(--mdc-shape-small, 4px) 0px 0px",
caretColor: "var(--secondary-text-color)",

111
src/translations/en.json
View File

@ -51,7 +51,7 @@
"owner": "Owner",
"system-admin": "Administrators",
"system-users": "Users",
"system-read-only": "Read-Only Users"
"system-read-only": "Read-only users"
},
"config_entry": {
"disabled_by": {
@ -471,7 +471,7 @@
"radius_meters": "[%key:ui::panel::config::core::section::core::core_config::elevation_meters%]"
},
"selector": {
"options": "Selector Options",
"options": "Selector options",
"types": {
"action": "Action",
"area": "Area",
@ -480,7 +480,7 @@
"color_temp": "Color temperature",
"condition": "Condition",
"date": "Date",
"datetime": "Date and Time",
"datetime": "Date and time",
"device": "Device",
"duration": "Duration",
"entity": "Entity",
@ -490,7 +490,7 @@
"media": "Media",
"number": "Number",
"object": "Object",
"color_rgb": "RGB Color",
"color_rgb": "RGB color",
"select": "Select",
"state": "State",
"target": "Target",
@ -498,7 +498,7 @@
"text": "Text",
"theme": "Theme",
"time": "Time",
"manual": "Manual Entry"
"manual": "Manual entry"
}
},
"template": {
@ -857,7 +857,7 @@
"cyan": "Cyan",
"teal": "Teal",
"green": "Green",
"light-green": "Light Green",
"light-green": "Light green",
"lime": "Lime",
"yellow": "Yellow",
"amber": "Amber",
@ -1045,7 +1045,7 @@
"podcast": "Podcast",
"season": "Season",
"track": "Track",
"tv_show": "TV Show",
"tv_show": "TV show",
"url": "URL",
"video": "Video"
},
@ -2935,7 +2935,7 @@
"name": "Name",
"description": "Description",
"tag_id": "Tag ID",
"tag_id_placeholder": "Autogenerated if left empty",
"tag_id_placeholder": "Auto-generated if left empty",
"delete": "Delete",
"update": "Update",
"create": "Create",
@ -4490,14 +4490,14 @@
"trace_no_longer_available": "Chosen trace is no longer available",
"enter_downloaded_trace": "Enter downloaded trace",
"tabs": {
"details": "Step Details",
"timeline": "Trace Timeline",
"details": "Step details",
"timeline": "Trace timeline",
"logbook": "Related logbook entries",
"automation_config": "Automation Config",
"step_config": "Step Config",
"changed_variables": "Changed Variables",
"blueprint_config": "Blueprint Config",
"script_config": "Script Config"
"automation_config": "Automation config",
"step_config": "Step config",
"changed_variables": "Changed variables",
"blueprint_config": "Blueprint config",
"script_config": "Script config"
},
"path": {
"choose": "Select a step on the left for more information.",
@ -4544,7 +4544,7 @@
"caption": "Blueprints",
"description": "Manage blueprints",
"overview": {
"header": "Blueprint Editor",
"header": "Blueprint editor",
"introduction": "The blueprint configuration allows you to import and manage your blueprints.",
"learn_more": "Learn more about using blueprints",
"headers": {
@ -4601,14 +4601,14 @@
"override_description": "Importing it will override the existing blueprint. If the updated blueprint is not compatible, it can break your automations. Automations will have to be adjusted manually.",
"error_no_url": "Please enter the blueprint address.",
"unsupported_blueprint": "This blueprint is not supported",
"file_name": "Blueprint Path"
"file_name": "Blueprint path"
}
},
"script": {
"caption": "Scripts",
"description": "Execute a sequence of actions",
"picker": {
"header": "Script Editor",
"header": "Script editor",
"introduction": "The script editor allows you to create and edit scripts. Please follow the link below to read the instructions to make sure that you have configured Home Assistant correctly.",
"learn_more": "Learn more about scripts",
"no_scripts": "We couldn't find any scripts",
@ -4684,7 +4684,7 @@
"field_delete_confirm_title": "Delete field?",
"field_delete_confirm_text": "[%key:ui::panel::config::automation::editor::triggers::delete_confirm_text%]",
"header": "Script: {name}",
"default_name": "New Script",
"default_name": "New script",
"modes": {
"label": "[%key:ui::panel::config::automation::editor::modes::label%]",
"learn_more": "[%key:ui::panel::config::automation::editor::modes::learn_more%]",
@ -4729,7 +4729,7 @@
"description": "Capture device states and easily recall them later",
"activated": "Activated scene {name}.",
"picker": {
"header": "Scene Editor",
"header": "Scene editor",
"introduction": "The scene editor allows you to create and edit scenes. Please follow the link below to read the instructions to make sure that you have configured Home Assistant correctly.",
"learn_more": "Learn more about scenes",
"pick_scene": "Pick scene to edit",
@ -4993,7 +4993,7 @@
"other_home_assistant": "Other Home Assistant",
"instance_name": "Instance name",
"instance_version": "Instance version",
"ip_address": "IP Address",
"ip_address": "IP address",
"connected_at": "Connected at",
"obfuscated_ip": {
"show": "Show IP address",
@ -5383,6 +5383,7 @@
"confirm_disable_title": "Disable device?",
"confirm_disable_message": "Are you sure you want to disable {name} and all of its entities?",
"configure": "Configure device",
"edit": "Edit device",
"delete": "Remove device"
},
"devices": "{count} {count, plural,\n one {device}\n other {devices}\n}",
@ -5661,9 +5662,9 @@
},
"dhcp": {
"title": "DHCP discovery",
"mac_address": "MAC Address",
"mac_address": "MAC address",
"hostname": "Hostname",
"ip_address": "IP Address",
"ip_address": "IP address",
"no_devices_found": "No recent DHCP requests found; no matching discoveries detected"
},
"thread": {
@ -5722,7 +5723,7 @@
"name": "Name",
"type": "Type",
"port": "Port",
"ip_addresses": "IP Addresses",
"ip_addresses": "IP addresses",
"properties": "Properties",
"discovery_information": "Discovery information",
"copy_to_clipboard": "Copy to clipboard",
@ -6354,7 +6355,7 @@
"title": "Door lock",
"twist_assist": "Twist assist",
"block_to_block": "Block to block",
"auto_relock_time": "Auto relock time",
"auto_relock_time": "Autorelock time",
"hold_release_time": "Hold and release time",
"operation_type": "Operation type",
"operation_types": {
@ -6525,13 +6526,13 @@
"prefix": "Subnet prefix",
"add_address": "Add address",
"gateway": "Gateway address",
"dns_server": "DNS Server",
"add_dns_server": "Add DNS Server",
"dns_server": "DNS server",
"add_dns_server": "Add DNS server",
"custom_dns": "Custom",
"unsaved": "You have unsaved changes, these will get lost if you change tabs, do you want to continue?",
"failed_to_change": "Failed to change network settings",
"hostname": {
"title": "Host name",
"title": "Hostname",
"description": "The name your instance will have on your network",
"failed_to_set_hostname": "Setting hostname failed"
}
@ -6548,9 +6549,9 @@
},
"network_adapter": "Network adapter",
"network_adapter_info": "Configure which network adapters integrations will use. A restart is required for these settings to apply.",
"ip_information": "IP Information",
"ip_information": "IP information",
"adapter": {
"auto_configure": "Auto configure",
"auto_configure": "Autoconfigure",
"detected": "Detected",
"adapter": "Adapter"
}
@ -6559,7 +6560,7 @@
"caption": "Storage",
"description": "{percent_used} used - {free_space} free",
"used_space": "Used space",
"emmc_lifetime_used": "eMMC Lifetime Used",
"emmc_lifetime_used": "eMMC lifetime used",
"disk_metrics": "Disk metrics",
"datadisk": {
"title": "Move data disk",
@ -6685,7 +6686,7 @@
"actions": "Actions",
"others": "Others"
},
"others_areas": "Other areas",
"other_areas": "Other areas",
"areas": "Areas"
}
},
@ -6910,7 +6911,7 @@
},
"edit_view": {
"header": "View configuration",
"header_name": "{name} View Configuration",
"header_name": "{name} view configuration",
"add": "Add view",
"background": {
"settings": "Background settings",
@ -7026,7 +7027,7 @@
},
"edit_card": {
"header": "Card configuration",
"typed_header": "{type} Card configuration",
"typed_header": "{type} card configuration",
"pick_card": "Add to dashboard",
"pick_card_title": "Which card would you like to add to {name}",
"toggle_editor": "Toggle editor",
@ -7096,7 +7097,7 @@
"move_card": {
"header": "Choose a view to move the card to",
"strategy_error_title": "Impossible to move the card",
"strategy_error_text_strategy": "Moving a card to an auto generated view is not supported.",
"strategy_error_text_strategy": "Moving a card to an auto-generated view is not supported.",
"success": "Card moved successfully",
"error": "Error while moving card"
},
@ -7431,7 +7432,7 @@
},
"light": {
"name": "Light",
"description": "The Light card allows you to change the brightness of the light."
"description": "The Light card allows you to change the brightness of a light."
},
"generic": {
"alt_text": "Alternative text",
@ -7519,13 +7520,13 @@
"geo_location_sources": "Geolocation sources",
"no_geo_location_sources": "No geolocation sources available",
"appearance": "Appearance",
"theme_mode": "Theme Mode",
"theme_mode": "Theme mode",
"theme_modes": {
"auto": "Auto",
"light": "Light",
"dark": "Dark"
},
"default_zoom": "Default Zoom",
"default_zoom": "Default zoom",
"source": "Source",
"description": "The Map card that allows you to display entities on a map."
},
@ -7573,7 +7574,7 @@
"picture-elements": {
"name": "Picture elements",
"description": "The Picture elements card is one of the most versatile types of cards. The cards allow you to position icons or text and even actions! On an image based on coordinates.",
"card_options": "Card Options",
"card_options": "Card options",
"elements": "Elements",
"new_element": "Add new element",
"confirm_delete_element": "Are you sure you want to delete the {type} element?",
@ -7612,7 +7613,7 @@
"none": "None",
"line": "Line"
},
"description": "The Sensor card gives you a quick overview of your sensors state with an optional graph to visualize change over time.",
"description": "The Sensor card gives you a quick overview of a sensor's state with an optional graph to visualize change over time.",
"limit_min": "Minimum value",
"limit_max": "Maximum value"
},
@ -7622,14 +7623,14 @@
"integration_not_loaded": "This card requires the `todo` integration to be set up.",
"hide_completed": "Hide completed items",
"hide_create": "Hide 'Add item' field",
"display_order": "Display Order",
"display_order": "Display order",
"sort_modes": {
"none": "Default",
"manual": "Manual",
"alpha_asc": "Alphabetical (A-Z)",
"alpha_desc": "Alphabetical (Z-A)",
"duedate_asc": "Due Date (Soonest First)",
"duedate_desc": "Due Date (Latest First)"
"duedate_asc": "Due date (Soonest first)",
"duedate_desc": "Due date (Latest first)"
}
},
"thermostat": {
@ -7639,7 +7640,7 @@
},
"tile": {
"name": "Tile",
"description": "The tile card gives you a quick overview of your entity. The card allows you to toggle the entity, show the More info dialog or trigger custom actions.",
"description": "The Tile card gives you a quick overview of an entity. The card allows you to toggle the entity, show the More info dialog or trigger custom actions.",
"color": "Color",
"color_helper": "Inactive state (e.g. off, closed) will not be colored.",
"icon_tap_action": "Icon tap behavior",
@ -7693,7 +7694,7 @@
"badge": {
"entity": {
"name": "Entity",
"description": "The Entity badge gives you a quick overview of your entity.",
"description": "The Entity badge gives you a quick overview of an entity.",
"color": "[%key:ui::panel::lovelace::editor::card::tile::color%]",
"color_helper": "[%key:ui::panel::lovelace::editor::card::tile::color_helper%]",
"show_entity_picture": "Show entity picture",
@ -8231,14 +8232,14 @@
"confirm_delete_title": "Delete long-lived access token?",
"confirm_delete_text": "Are you sure you want to delete the long-lived access token for {name}?",
"delete_failed": "Failed to delete the access token.",
"create": "Create Token",
"create": "Create token",
"create_failed": "Failed to create the access token.",
"name": "Name",
"prompt_name": "Give the token a name",
"prompt_copy_token": "Copy your access token. It will not be shown again.",
"empty_state": "You have no long-lived access tokens yet.",
"qr_code_image": "QR code for token {name}",
"generate_qr_code": "Generate QR Code"
"generate_qr_code": "Generate QR code"
}
},
"todo": {
@ -8395,7 +8396,7 @@
"hdmi_input": "HDMI input",
"hdmi_switcher": "HDMI switcher",
"volume": "Volume",
"total_tv_time": "Total TV Time",
"total_tv_time": "Total TV time",
"turn_tv_off": "Turn television off",
"air": "Air"
},
@ -8665,7 +8666,7 @@
"input_button": "Input buttons",
"input_text": "Input texts",
"input_number": "Input numbers",
"input_datetime": "Input date times",
"input_datetime": "Input datetimes",
"input_select": "Input selects",
"template": "Template entities",
"universal": "Universal media player entities",
@ -9076,7 +9077,7 @@
},
"capability": {
"stage": {
"title": "Add-on Stage",
"title": "Add-on stage",
"description": "Add-ons can have one of three stages:\n\n{icon_stable} **Stable**: These are add-ons ready to be used in production.\n\n{icon_experimental} **Experimental**: These may contain bugs, and may be unfinished.\n\n{icon_deprecated} **Deprecated**: These add-ons will no longer receive any updates."
},
"rating": {
@ -9158,8 +9159,8 @@
"description": "This will restart the add-on if it crashes"
},
"auto_update": {
"title": "Auto update",
"description": "Auto update the add-on when there is a new version available"
"title": "Autoupdate",
"description": "Autoupdate the add-on when there is a new version available"
},
"ingress_panel": {
"title": "Show in sidebar",
@ -9270,7 +9271,7 @@
"addons": "Add-ons",
"dashboard": "Dashboard",
"backups": "Backups",
"store": "Add-on Store",
"store": "Add-on store",
"system": "System"
},
"my": {
@ -9360,7 +9361,7 @@
"hostname": "Hostname",
"change_hostname": "Change hostname",
"new_hostname": "Please enter a new hostname:",
"ip_address": "IP Address",
"ip_address": "IP address",
"change": "Change",
"operating_system": "Operating system",
"docker_version": "Docker version",
@ -9412,7 +9413,7 @@
"confirm_password": "Confirm encryption key",
"password_protection": "Password protection",
"enter_password": "Please enter a password.",
"passwords_not_matching": "The passwords does not match",
"passwords_not_matching": "The passwords do not match",
"backup_already_running": "A backup or restore is already running. Creating a new backup is currently not possible, try again later.",
"confirm_restore_partial_backup_title": "Restore partial backup",
"confirm_restore_partial_backup_text": "The backup will be restored. Depending on the size of the backup, this can take up to 45 min. Home Assistant needs to shutdown and the restore progress is running in the background. If it succeeds, Home Assistant will automatically start again.",