Merge branch 'dev' into picture-card-image

Author: DTekNOdev

.github/PULL_REQUEST_TEMPLATE.md

@@ -69,7 +69,6 @@
 - [ ] I understand the code I am submitting and can explain how it works.
 - [ ] The code change is tested and works locally.
 - [ ] There is no commented out code in this PR.
-- [ ] I have followed the [development checklist][dev-checklist]
 - [ ] I have followed the [perfect PR recommendations][perfect-pr]
 - [ ] Any generated code has been carefully reviewed for correctness and compliance with project standards.
 
@@ -105,6 +104,5 @@ To help with the load of incoming pull requests:
 
   Below, some useful links you could explore:
 -->
-[dev-checklist]: https://developers.home-assistant.io/docs/development_checklist/
 [docs-repository]: https://github.com/home-assistant/home-assistant.io
 [perfect-pr]: https://developers.home-assistant.io/docs/review-process/#creating-the-perfect-pr

.yarn/releases/yarn-4.13.0.cjs .yarn/releases/yarn-4.14.1.cjs.yarn/releases/yarn-4.13.0.cjs renamed to .yarn/releases/yarn-4.14.1.cjs

@@ -8,4 +8,4 @@ enableGlobalCache: false
 
 nodeLinker: node-modules
 
-yarnPath: .yarn/releases/yarn-4.13.0.cjs
+yarnPath: .yarn/releases/yarn-4.14.1.cjs

.yarnrc.yml

@@ -149,6 +149,38 @@ const CONFIGS = [
   max: 1.9
   unit: GBP/h`,
   },
+  {
+    heading: "A lot of segments",
+    config: `
+- type: gauge
+  needle: true
+  name: Percent gauge
+  entity: sensor.brightness_high
+  unit: "%"
+  min: 0
+  max: 100
+  segments:
+    - from: 0
+      color: "#db4437"
+    - from: 10
+      color: "#cc4d39"
+    - from: 20
+      color: "#bd563a"
+    - from: 30
+      color: "#ad603c"
+    - from: 40
+      color: "#9e693d"
+    - from: 50
+      color: "#8f723f"
+    - from: 60
+      color: "#807b41"
+    - from: 70
+      color: "#718442"
+    - from: 80
+      color: "#618e44"
+    - from: 90
+      color: "#43a047"`,
+  },
 ];
 
 @customElement("demo-lovelace-gauge-card")

gallery/src/pages/lovelace/gauge-card.ts

@@ -30,23 +30,23 @@
     "@braintree/sanitize-url": "7.1.2",
     "@codemirror/autocomplete": "6.20.1",
     "@codemirror/commands": "6.10.3",
-    "@codemirror/lang-jinja": "6.0.0",
+    "@codemirror/lang-jinja": "6.0.1",
     "@codemirror/lang-yaml": "6.1.3",
     "@codemirror/language": "6.12.3",
     "@codemirror/search": "6.6.0",
     "@codemirror/state": "6.6.0",
     "@codemirror/view": "6.41.0",
     "@date-fns/tz": "1.4.1",
     "@egjs/hammerjs": "2.0.17",
-    "@formatjs/intl-datetimeformat": "7.3.1",
-    "@formatjs/intl-displaynames": "7.3.1",
-    "@formatjs/intl-durationformat": "0.10.3",
-    "@formatjs/intl-getcanonicallocales": "3.2.2",
-    "@formatjs/intl-listformat": "8.3.1",
-    "@formatjs/intl-locale": "5.3.1",
-    "@formatjs/intl-numberformat": "9.3.1",
-    "@formatjs/intl-pluralrules": "6.3.1",
-    "@formatjs/intl-relativetimeformat": "12.3.1",
+    "@formatjs/intl-datetimeformat": "7.3.2",
+    "@formatjs/intl-displaynames": "7.3.2",
+    "@formatjs/intl-durationformat": "0.10.4",
+    "@formatjs/intl-getcanonicallocales": "3.2.3",
+    "@formatjs/intl-listformat": "8.3.2",
+    "@formatjs/intl-locale": "5.3.2",
+    "@formatjs/intl-numberformat": "9.3.2",
+    "@formatjs/intl-pluralrules": "6.3.2",
+    "@formatjs/intl-relativetimeformat": "12.3.2",
     "@fullcalendar/core": "6.1.20",
     "@fullcalendar/daygrid": "6.1.20",
     "@fullcalendar/interaction": "6.1.20",
@@ -100,15 +100,15 @@
     "hls.js": "1.6.16",
     "home-assistant-js-websocket": "9.6.0",
     "idb-keyval": "6.2.2",
-    "intl-messageformat": "11.2.0",
+    "intl-messageformat": "11.2.1",
     "js-yaml": "4.1.1",
     "leaflet": "1.9.4",
     "leaflet-draw": "patch:leaflet-draw@npm%3A1.0.4#./.yarn/patches/leaflet-draw-npm-1.0.4-0ca0ebcf65.patch",
     "leaflet.markercluster": "1.5.3",
     "lit": "3.3.2",
     "lit-html": "3.3.2",
     "luxon": "3.7.2",
-    "marked": "18.0.0",
+    "marked": "18.0.1",
     "memoize-one": "6.0.0",
     "node-vibrant": "4.0.4",
     "object-hash": "3.0.0",
@@ -135,15 +135,15 @@
     "@babel/helper-define-polyfill-provider": "0.6.8",
     "@babel/plugin-transform-runtime": "7.29.0",
     "@babel/preset-env": "7.29.2",
-    "@bundle-stats/plugin-webpack-filter": "4.22.0",
+    "@bundle-stats/plugin-webpack-filter": "4.22.1",
     "@eslint/eslintrc": "3.3.5",
     "@eslint/js": "10.0.1",
     "@html-eslint/eslint-plugin": "0.59.0",
     "@lokalise/node-api": "15.7.1",
     "@octokit/auth-oauth-device": "8.0.3",
     "@octokit/plugin-retry": "8.1.0",
     "@octokit/rest": "22.0.1",
-    "@rsdoctor/rspack-plugin": "1.5.7",
+    "@rsdoctor/rspack-plugin": "1.5.9",
     "@rspack/core": "1.7.11",
     "@rspack/dev-server": "1.2.1",
     "@types/babel__plugin-transform-runtime": "7.9.5",
@@ -196,14 +196,14 @@
     "lodash.template": "4.5.0",
     "map-stream": "0.0.7",
     "pinst": "3.0.0",
-    "prettier": "3.8.2",
+    "prettier": "3.8.3",
     "rspack-manifest-plugin": "5.2.1",
     "serve": "14.2.6",
     "sinon": "21.1.2",
     "tar": "7.5.13",
     "terser-webpack-plugin": "5.4.0",
     "ts-lit-plugin": "2.0.2",
-    "typescript": "6.0.2",
+    "typescript": "6.0.3",
     "typescript-eslint": "8.58.2",
     "vite-tsconfig-paths": "6.1.1",
     "vitest": "4.1.4",
@@ -222,7 +222,7 @@
     "@material/mwc-list@^0.27.0": "patch:@material/mwc-list@npm%3A0.27.0#~/.yarn/patches/@material-mwc-list-npm-0.27.0-5344fc9de4.patch",
     "glob@^10.2.2": "^10.5.0"
   },
-  "packageManager": "yarn@4.13.0",
+  "packageManager": "yarn@4.14.1",
   "volta": {
     "node": "24.15.0"
   }

package.json

@@ -1,4 +1,3 @@
-import type { DurationInput } from "@formatjs/intl-durationformat/src/types";
 import memoizeOne from "memoize-one";
 import type { HaDurationData } from "../../components/ha-duration-input";
 import type { FrontendLocaleData } from "../../data/translation";
@@ -114,7 +113,7 @@ export const formatDuration = (
     case "d": {
       const days = Math.floor(value);
       const hours = Math.floor((value - days) * 24);
-      const input: DurationInput = {
+      const input = {
         days,
         hours,
       };
@@ -123,7 +122,7 @@ export const formatDuration = (
     case "h": {
       const hours = Math.floor(value);
       const minutes = Math.floor((value - hours) * 60);
-      const input: DurationInput = {
+      const input = {
         hours,
         minutes,
       };
@@ -132,7 +131,7 @@ export const formatDuration = (
     case "min": {
       const minutes = Math.floor(value);
       const seconds = Math.floor((value - minutes) * 60);
-      const input: DurationInput = {
+      const input = {
         minutes,
         seconds,
       };

src/common/datetime/format_duration.ts

@@ -1,4 +1,8 @@
-import type { Connection, UnsubscribeFunc } from "home-assistant-js-websocket";
+import type {
+  Collection,
+  Connection,
+  UnsubscribeFunc,
+} from "home-assistant-js-websocket";
 
 export const subscribeOne = async <T>(
   conn: Connection,
@@ -13,3 +17,11 @@ export const subscribeOne = async <T>(
       resolve(items);
     });
   });
+
+export const subscribeOneCollection = async <T>(collection: Collection<T>) =>
+  new Promise<T>((resolve) => {
+    const unsub = collection.subscribe((data) => {
+      unsub();
+      resolve(data);
+    });
+  });

src/common/util/subscribe-one.ts

@@ -132,8 +132,6 @@ export class HaGauge extends LitElement {
 
           const x1 = -arcRadius * Math.cos((startAngle * Math.PI) / 180);
           const y1 = -arcRadius * Math.sin((startAngle * Math.PI) / 180);
-          const x2 = -arcRadius * Math.cos((endAngle * Math.PI) / 180);
-          const y2 = -arcRadius * Math.sin((endAngle * Math.PI) / 180);
 
           const isFirst = i === 0;
           const isLast = i === arr.length - 1;
@@ -144,7 +142,7 @@ export class HaGauge extends LitElement {
                 class="level"
                 stroke="${level.stroke}"
                 style="stroke-linecap: butt"
-                d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 ${x2} ${y2}"
+                d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 40 0"
               />
             `;
           }
@@ -157,9 +155,9 @@ export class HaGauge extends LitElement {
 
             return svg`
                 <path class="level" stroke="${level.stroke}" style="stroke-linecap: butt"
-                      d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 ${xm} ${ym}" />
+                      d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 40 0" />
                 <path class="level" stroke="${level.stroke}" style="stroke-linecap: butt"
-                      d="M ${xm} ${ym} A ${arcRadius} ${arcRadius} 0 0 1 ${x2} ${y2}" />
+                      d="M ${xm} ${ym} A ${arcRadius} ${arcRadius} 0 0 1 40 0" />
             `;
           }
 
@@ -168,7 +166,7 @@ export class HaGauge extends LitElement {
               class="level"
               stroke="${level.stroke}"
               style="stroke-linecap: butt"
-              d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 ${x2} ${y2}"
+              d="M ${x1} ${y1} A ${arcRadius} ${arcRadius} 0 ${largeArc} 1 40 0"
             ></path>
           `;
         })}
@@ -178,7 +176,7 @@ export class HaGauge extends LitElement {
             ? svg`
                 <path
                 class="needle"
-                d="M -34,-3 L -48,-1 A 1,1,0,0,0,-48,1 L -34,3 A 2,2,0,0,0,-34,-3 Z"
+                d="M -34,-3 L -40,-1 A 1,1,0,0,0,-40,1 L -34,3 A 2,2,0,0,0,-34,-3 Z"
 
                 style=${styleMap({ transform: `rotate(${this._angle}deg)` })}
               />