20230302.0 (#15678)

build-scripts/bundle.js

@@ -117,7 +117,11 @@ module.exports.babelOptions = ({ latestBuild, isProdBuild }) => ({
       "template-html-minifier",
       {
         modules: {
-          lit: ["html", "svg", { name: "css", encapsulation: "style" }],
+          lit: [
+            "html",
+            { name: "svg", encapsulation: "svg" },
+            { name: "css", encapsulation: "style" },
+          ],
           "@polymer/polymer/lib/utils/html-tag": ["html"],
         },
         strictCSS: true,

pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "setuptools.build_meta"
 
 [project]
 name         = "home-assistant-frontend"
-version      = "20230301.0"
+version      = "20230302.0"
 license      = {text = "Apache-2.0"}
 description  = "The Home Assistant frontend"
 readme       = "README.md"

src/common/number/format_number.ts

@@ -77,6 +77,26 @@ export const formatNumber = (
       ).format(Number(num));
     }
   }
+
+  if (
+    !Number.isNaN(Number(num)) &&
+    num !== "" &&
+    localeOptions?.number_format === NumberFormat.none &&
+    Intl &&
+    (options?.maximumFractionDigits != null ||
+      options?.minimumFractionDigits != null)
+  ) {
+    // If NumberFormat is none, just set the digits options for precision and use en-US format without grouping.
+    return new Intl.NumberFormat(
+      "en-US",
+      getDefaultFormatOptions(num, {
+        useGrouping: false,
+        maximumFractionDigits: options?.maximumFractionDigits,
+        minimumFractionDigits: options?.minimumFractionDigits,
+      })
+    ).format(Number(num));
+  }
+
   if (typeof num === "string") {
     return num;
   }

src/dialogs/more-info/components/ha-more-info-toggle.ts

@@ -64,7 +64,9 @@ export class HaMoreInfoToggle extends LitElement {
   }
 
   protected render(): TemplateResult {
-    const color = stateColorCss(this.stateObj);
+    const onColor = stateColorCss(this.stateObj, "on");
+    const offColor = stateColorCss(this.stateObj, "off");
+
     const isOn = this.stateObj.state === "on";
     const isOff = this.stateObj.state === "off";
 
@@ -82,7 +84,7 @@ export class HaMoreInfoToggle extends LitElement {
               active: isOn,
             })}
             style=${styleMap({
-              "--color": color,
+              "--color": onColor,
             })}
           >
             <ha-svg-icon .path=${this.iconPathOn || mdiFlash}></ha-svg-icon>
@@ -97,7 +99,7 @@ export class HaMoreInfoToggle extends LitElement {
               active: isOff,
             })}
             style=${styleMap({
-              "--color": color,
+              "--color": offColor,
             })}
           >
             <ha-svg-icon .path=${this.iconPathOff || mdiFlashOff}></ha-svg-icon>
@@ -117,7 +119,8 @@ export class HaMoreInfoToggle extends LitElement {
         @change=${this._valueChanged}
         .ariaLabel=${this.hass.localize("ui.dialogs.more_info_control.toggle")}
         style=${styleMap({
-          "--control-switch-on-color": color,
+          "--control-switch-on-color": onColor,
+          "--control-switch-off-color": offColor,
         })}
         .disabled=${this.stateObj.state === UNAVAILABLE}
       >

src/dialogs/more-info/const.ts

@@ -16,7 +16,12 @@ export const EDITABLE_DOMAINS_WITH_ID = ["scene", "automation"];
  * */
 export const EDITABLE_DOMAINS_WITH_UNIQUE_ID = ["script"];
 /** Domains with with new more info design. */
-export const DOMAINS_WITH_NEW_MORE_INFO = ["light", "siren", "switch"];
+export const DOMAINS_WITH_NEW_MORE_INFO = [
+  "input_boolean",
+  "light",
+  "siren",
+  "switch",
+];
 /** Domains with separate more info dialog. */
 export const DOMAINS_WITH_MORE_INFO = [
   "alarm_control_panel",
@@ -29,6 +34,7 @@ export const DOMAINS_WITH_MORE_INFO = [
   "fan",
   "group",
   "humidifier",
+  "input_boolean",
   "input_datetime",
   "light",
   "lock",

src/dialogs/more-info/controls/more-info-input_boolean.ts

@@ -0,0 +1,51 @@
+import { mdiPower, mdiPowerOff } from "@mdi/js";
+import { HassEntity } from "home-assistant-js-websocket";
+import { CSSResultGroup, html, LitElement, TemplateResult } from "lit";
+import { customElement, property } from "lit/decorators";
+import "../../../components/ha-attributes";
+import type { HomeAssistant } from "../../../types";
+import { moreInfoControlStyle } from "../components/ha-more-info-control-style";
+import "../components/ha-more-info-state-header";
+import "../components/ha-more-info-toggle";
+
+@customElement("more-info-input_boolean")
+class MoreInfoInputBoolean extends LitElement {
+  @property({ attribute: false }) public hass!: HomeAssistant;
+
+  @property({ attribute: false }) public stateObj?: HassEntity;
+
+  protected render(): TemplateResult | null {
+    if (!this.hass || !this.stateObj) {
+      return null;
+    }
+
+    return html`
+      <ha-more-info-state-header
+        .hass=${this.hass}
+        .stateObj=${this.stateObj}
+      ></ha-more-info-state-header>
+      <div class="controls">
+        <ha-more-info-toggle
+          .stateObj=${this.stateObj}
+          .hass=${this.hass}
+          .iconPathOn=${mdiPower}
+          .iconPathOff=${mdiPowerOff}
+        ></ha-more-info-toggle>
+      </div>
+      <ha-attributes
+        .hass=${this.hass}
+        .stateObj=${this.stateObj}
+      ></ha-attributes>
+    `;
+  }
+
+  static get styles(): CSSResultGroup {
+    return moreInfoControlStyle;
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "more-info-input_boolean": MoreInfoInputBoolean;
+  }
+}

src/dialogs/more-info/controls/more-info-siren.ts

@@ -1,8 +1,8 @@
 import { mdiVolumeHigh, mdiVolumeOff } from "@mdi/js";
+import { HassEntity } from "home-assistant-js-websocket";
 import { CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
 import "../../../components/ha-attributes";
-import { LightEntity } from "../../../data/light";
 import type { HomeAssistant } from "../../../types";
 import { moreInfoControlStyle } from "../components/ha-more-info-control-style";
 import "../components/ha-more-info-state-header";
@@ -12,7 +12,7 @@ import "../components/ha-more-info-toggle";
 class MoreInfoSiren extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false }) public stateObj?: LightEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render(): TemplateResult | null {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/controls/more-info-switch.ts

@@ -1,8 +1,8 @@
 import { mdiPower, mdiPowerOff } from "@mdi/js";
+import { HassEntity } from "home-assistant-js-websocket";
 import { CSSResultGroup, html, LitElement, TemplateResult } from "lit";
 import { customElement, property } from "lit/decorators";
 import "../../../components/ha-attributes";
-import { LightEntity } from "../../../data/light";
 import type { HomeAssistant } from "../../../types";
 import { moreInfoControlStyle } from "../components/ha-more-info-control-style";
 import "../components/ha-more-info-state-header";
@@ -12,7 +12,7 @@ import "../components/ha-more-info-toggle";
 class MoreInfoSwitch extends LitElement {
   @property({ attribute: false }) public hass!: HomeAssistant;
 
-  @property({ attribute: false }) public stateObj?: LightEntity;
+  @property({ attribute: false }) public stateObj?: HassEntity;
 
   protected render(): TemplateResult | null {
     if (!this.hass || !this.stateObj) {

src/dialogs/more-info/state_more_info_control.ts

@@ -16,6 +16,7 @@ const LAZY_LOADED_MORE_INFO_CONTROL = {
   fan: () => import("./controls/more-info-fan"),
   group: () => import("./controls/more-info-group"),
   humidifier: () => import("./controls/more-info-humidifier"),
+  input_boolean: () => import("./controls/more-info-input_boolean"),
   input_datetime: () => import("./controls/more-info-input_datetime"),
   light: () => import("./controls/more-info-light"),
   lock: () => import("./controls/more-info-lock"),

src/panels/lovelace/common/has-changed.ts

@@ -1,6 +1,6 @@
 import { HassEntity } from "home-assistant-js-websocket";
 import { PropertyValues } from "lit";
-import { EntityRegistryEntry } from "../../../data/entity_registry";
+import { EntityRegistryDisplayEntry } from "../../../data/entity_registry";
 import { HomeAssistant } from "../../../types";
 import { processConfigEntities } from "./process-config-entities";
 
@@ -37,24 +37,19 @@ function compareEntityState(
   return oldState !== newState;
 }
 
-function compareEntityEntryOptions(
+function compareEntityDisplayEntry(
   oldHass: HomeAssistant,
   newHass: HomeAssistant,
   entityId: string
 ) {
   const oldEntry = oldHass.entities[entityId] as
-    | EntityRegistryEntry
+    | EntityRegistryDisplayEntry
     | undefined;
   const newEntry = newHass.entities[entityId] as
-    | EntityRegistryEntry
+    | EntityRegistryDisplayEntry
     | undefined;
 
-  return (
-    oldEntry?.options?.sensor?.display_precision !==
-      newEntry?.options?.sensor?.display_precision ||
-    oldEntry?.options?.sensor?.suggested_display_precision !==
-      newEntry?.options?.sensor?.suggested_display_precision
-  );
+  return oldEntry?.display_precision !== newEntry?.display_precision;
 }
 
 // Check if config or Entity changed
@@ -71,7 +66,7 @@ export function hasConfigOrEntityChanged(
 
   return (
     compareEntityState(oldHass, newHass, element._config!.entity) ||
-    compareEntityEntryOptions(oldHass, newHass, element._config!.entity)
+    compareEntityDisplayEntry(oldHass, newHass, element._config!.entity)
   );
 }
 
@@ -96,7 +91,7 @@ export function hasConfigOrEntitiesChanged(
 
     return (
       compareEntityState(oldHass, newHass, entity.entity) ||
-      compareEntityEntryOptions(oldHass, newHass, entity.entity)
+      compareEntityDisplayEntry(oldHass, newHass, entity.entity)
     );
   });
 }

src/translations/en.json

@@ -1053,13 +1053,13 @@
           "failed": "Failed to reboot system"
         },
         "shutdown": {
-          "title": "Shutdown system",
-          "description": "Shutdown the system running Home Assistant and all Add-ons.",
-          "confirm_title": "Shutdown system?",
-          "confirm_description": "This will shutdown the complete system which includes Home Assistant and all Add-ons.",
-          "confirm_action": "Shutdown",
+          "title": "Shut down system",
+          "description": "Shut down the system running Home Assistant and all Add-ons.",
+          "confirm_title": "Shut down system?",
+          "confirm_description": "This will shut down the complete system which includes Home Assistant and all Add-ons.",
+          "confirm_action": "Shut down",
           "shutting_down": "Shutting down system",
-          "failed": "Failed to shutdown system"
+          "failed": "Failed to shut down system"
         }
       },
       "aliases": {

test/common/string/format_number.ts

@@ -69,6 +69,33 @@ describe("formatNumber", () => {
     );
   });
 
+  it("Formats number with fraction digits options if number format is none", () => {
+    assert.strictEqual(
+      formatNumber(
+        1234.5,
+        { ...defaultLocale, number_format: NumberFormat.none },
+        {
+          minimumFractionDigits: 2,
+          maximumFractionDigits: 2,
+        }
+      ),
+      "1234.50"
+    );
+  });
+
+  it("Do not formats number with others options if number format is none", () => {
+    assert.strictEqual(
+      formatNumber(
+        1234.5,
+        { ...defaultLocale, number_format: NumberFormat.none },
+        {
+          useGrouping: true,
+        }
+      ),
+      "1234.5"
+    );
+  });
+
   it("Sets only the maximumFractionDigits format option when none are provided for a number value", () => {
     assert.deepEqual(getDefaultFormatOptions(1234.5), {
       maximumFractionDigits: 2,

yarn.lock

@@ -6060,12 +6060,12 @@ __metadata:
   linkType: hard
 
 "bl@npm:^1.2.1":
-  version: 1.2.2
-  resolution: "bl@npm:1.2.2"
+  version: 1.2.3
+  resolution: "bl@npm:1.2.3"
   dependencies:
     readable-stream: ^2.3.5
     safe-buffer: ^5.1.1
-  checksum: aaa95591dbed4af648167093308c26a8d2cb17b0061525e7ba55e6fc238f172bc3d0874996e1cc61d6333423eb582c02cae53a081380b73c61de2fb510e300a2
+  checksum: 123f097989ce2fa9087ce761cd41176aaaec864e28f7dfe5c7dab8ae16d66d9844f849c3ad688eb357e3c5e4f49b573e3c0780bb8bc937206735a3b6f8569a5f
   languageName: node
   linkType: hard
 
@@ -6931,12 +6931,12 @@ __metadata:
   linkType: hard
 
 "copy-props@npm:^2.0.1":
-  version: 2.0.4
-  resolution: "copy-props@npm:2.0.4"
+  version: 2.0.5
+  resolution: "copy-props@npm:2.0.5"
   dependencies:
-    each-props: ^1.3.0
-    is-plain-object: ^2.0.1
-  checksum: 48a8cd2374f222a58eeacbe268fd52f96a039e632ee96cc3f8fe1fbb00699b76032cee47c073882aec44fcc1e2096685e811e1c65995bcfefae739b5f2b2a2a4
+    each-props: ^1.3.2
+    is-plain-object: ^5.0.0
+  checksum: e05bbd4b020fb19f3ce9edce51478d41283397af7ac393297859e2014f518d96e3e2d47ff84736e7c46c17f03fee58c5cef16a8a2420237b069873e5cfe80672
   languageName: node
   linkType: hard
 
@@ -7438,7 +7438,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"each-props@npm:^1.3.0":
+"each-props@npm:^1.3.2":
   version: 1.3.2
   resolution: "each-props@npm:1.3.2"
   dependencies:
@@ -12402,7 +12402,7 @@ fsevents@~2.3.2:
   languageName: node
   linkType: hard
 
-"object.assign@npm:^4.0.4, object.assign@npm:^4.1.2, object.assign@npm:^4.1.4":
+"object.assign@npm:^4.0.4, object.assign@npm:^4.1.0, object.assign@npm:^4.1.2, object.assign@npm:^4.1.4":
   version: 4.1.4
   resolution: "object.assign@npm:4.1.4"
   dependencies:
@@ -16793,11 +16793,12 @@ typescript@^3.8.3:
   linkType: hard
 
 "yargs-parser@npm:^5.0.0":
-  version: 5.0.0
-  resolution: "yargs-parser@npm:5.0.0"
+  version: 5.0.1
+  resolution: "yargs-parser@npm:5.0.1"
   dependencies:
     camelcase: ^3.0.0
-  checksum: 5580caa20c4f012a681269377940d89db37563c24b2abeca08c9e616385eb9d16517fd26f58dd9796a6f12b7bc91e54ec0c46f313eac310ad80fcd12ddb1ec63
+    object.assign: ^4.1.0
+  checksum: 8eff7f3653afc9185cb917ee034d189c1ba4bc0fd5005c9588442e25557e9bf69c7331663a6f9a2bb897cd4c1544ba9675ed3335133e19e660a3086fedc259db
   languageName: node
   linkType: hard