fix rgb color for dark theme

src/panels/lovelace/components/hui-action-editor.ts

@@ -23,13 +23,13 @@ import { EditorTarget } from "../editor/types";
 
 @customElement("hui-action-editor")
 export class HuiActionEditor extends LitElement {
-  @property({ attribute: false }) public config?: ActionConfig;
+  @property() public config?: ActionConfig;
 
-  @property({ attribute: false }) public label?: string;
+  @property() public label?: string;
 
-  @property({ attribute: false }) public actions?: string[];
+  @property() public actions?: string[];
 
-  @property({ attribute: false }) protected hass?: HomeAssistant;
+  @property() protected hass?: HomeAssistant;
 
   get _action(): string {
     return this.config?.action || "";
@@ -55,19 +55,17 @@ export class HuiActionEditor extends LitElement {
       return html``;
     }
     return html`
-      <paper-dropdown-menu .label=${this.label}>
+      <paper-dropdown-menu
+        .label="${this.label}"
+        .configValue="${"action"}"
+        @value-changed="${this._valueChanged}"
+      >
         <paper-listbox
           slot="dropdown-content"
-          attr-for-selected="item-value"
-          .configValue=${"action"}
-          .selected=${this._action}
-          @iron-select=${this._valueChanged}
+          .selected="${this.actions.indexOf(this._action)}"
         >
-          <paper-item></paper-item>
           ${this.actions.map((action) => {
-            return html`
-              <paper-item .itemValue=${action}>${action}</paper-item>
-            `;
+            return html` <paper-item>${action}</paper-item> `;
           })}
         </paper-listbox>
       </paper-dropdown-menu>
@@ -75,9 +73,9 @@ export class HuiActionEditor extends LitElement {
         ? html`
             <paper-input
               label="Navigation Path"
-              .value=${this._navigation_path}
-              .configValue=${"navigation_path"}
-              @value-changed=${this._valueChanged}
+              .value="${this._navigation_path}"
+              .configValue="${"navigation_path"}"
+              @value-changed="${this._valueChanged}"
             ></paper-input>
           `
         : ""}
@@ -85,9 +83,9 @@ export class HuiActionEditor extends LitElement {
         ? html`
             <paper-input
               label="Url Path"
-              .value=${this._url_path}
-              .configValue=${"url_path"}
-              @value-changed=${this._valueChanged}
+              .value="${this._url_path}"
+              .configValue="${"url_path"}"
+              @value-changed="${this._valueChanged}"
             ></paper-input>
           `
         : ""}
@@ -95,9 +93,9 @@ export class HuiActionEditor extends LitElement {
         ? html`
             <ha-service-picker
               .hass=${this.hass}
-              .value=${this._service}
-              .configValue=${"service"}
-              @value-changed=${this._valueChanged}
+              .value="${this._service}"
+              .configValue="${"service"}"
+              @value-changed="${this._valueChanged}"
             ></ha-service-picker>
             <b>Service data can only be entered in the code editor</b>
           `
@@ -105,26 +103,20 @@ export class HuiActionEditor extends LitElement {
     `;
   }
 
-  private _valueChanged(ev: CustomEvent): void {
+  private _valueChanged(ev: Event): void {
     ev.stopPropagation();
-    if (!this.hass || !ev.detail.item?.itemValue) {
+    if (!this.hass) {
       return;
     }
-
     const target = ev.target! as EditorTarget;
-
-    if (this[`_${target.configValue}`] === ev.detail.item.itemValue) {
+    if (this[`_${target.configValue}`] === target.value) {
       return;
     }
-
     if (target.configValue) {
       const newConfig =
         target.configValue === "action"
-          ? { action: ev.detail.item.itemValue }
-          : {
-              ...this.config!,
-              [target.configValue!]: ev.detail.item.itemValue,
-            };
+          ? { action: target.value }
+          : { ...this.config!, [target.configValue!]: target.value };
       fireEvent(this, "value-changed", { value: newConfig });
     }
   }

src/resources/styles.ts

@@ -5,6 +5,7 @@ export const darkStyles = {
   "card-background-color": "#1c1c1c",
   "secondary-background-color": "#1e1e1e",
   "primary-text-color": "#e1e1e1",
+  "rgb-primary-text-color": "225, 225, 225",
   "secondary-text-color": "#9b9b9b",
   "disabled-text-color": "#6f6f6f",
   "app-header-text-color": "#e1e1e1",