Migrate ha-progress-ring to webawesome (#26542)

src/components/ha-progress-ring.ts

@@ -1,12 +1,21 @@
-import ProgressRing from "@shoelace-style/shoelace/dist/components/progress-ring/progress-ring.component";
-import progressRingStyles from "@shoelace-style/shoelace/dist/components/progress-ring/progress-ring.styles";
+import ProgressRing from "@awesome.me/webawesome/dist/components/progress-ring/progress-ring";
 import { css } from "lit";
+import type { CSSResultGroup } from "lit";
 import { customElement, property } from "lit/decorators";
+import { StateSet } from "../resources/polyfills/stateset";
 
 @customElement("ha-progress-ring")
 export class HaProgressRing extends ProgressRing {
   @property() public size?: "tiny" | "small" | "medium" | "large";
 
+  attachInternals() {
+    const internals = super.attachInternals();
+    Object.defineProperty(internals, "states", {
+      value: new StateSet(this, internals.states),
+    });
+    return internals;
+  }
+
   public updated(changedProps) {
     super.updated(changedProps);
 
@@ -31,24 +40,26 @@ export class HaProgressRing extends ProgressRing {
     }
   }
 
-  static override styles = [
-    progressRingStyles,
-    css`
-      :host {
-        --indicator-color: var(
-          --ha-progress-ring-indicator-color,
-          var(--primary-color)
-        );
-        --track-color: var(
-          --ha-progress-ring-divider-color,
-          var(--divider-color)
-        );
-        --track-width: 4px;
-        --speed: 3.5s;
-        --size: var(--ha-progress-ring-size, 48px);
-      }
-    `,
-  ];
+  static get styles(): CSSResultGroup {
+    return [
+      ProgressRing.styles,
+      css`
+        :host {
+          --indicator-color: var(
+            --ha-progress-ring-indicator-color,
+            var(--primary-color)
+          );
+          --track-color: var(
+            --ha-progress-ring-divider-color,
+            var(--divider-color)
+          );
+          --track-width: 4px;
+          --speed: 3.5s;
+          --size: var(--ha-progress-ring-size, 48px);
+        }
+      `,
+    ];
+  }
 }
 
 declare global {