DEV: Add high level system spec and clean up JS (#34)

2025-03-13 01:18:36 +10:00
parent 9a5759ae86
commit d85097774f
10 changed files with 141 additions and 53 deletions
@@ -0,0 +1,41 @@
+import Component from "@glimmer/component";
+import { fn } from "@ember/helper";
+import { action } from "@ember/object";
+import { service } from "@ember/service";
+import { htmlSafe } from "@ember/template";
+import DButton from "discourse/components/d-button";
+import concatClass from "discourse/helpers/concat-class";
+
+export default class SitePaletteMenuItem extends Component {
+  @service customColor;
+
+  get siteStyle() {
+    return `--icon-color: ${this.args.colorPalette.color}`;
+  }
+
+  get activeClass() {
+    if (this.customColor.color === this.args.colorPalette.name) {
+      return "active";
+    }
+  }
+
+  @action
+  handleInput(colorPalette) {
+    this.customColor.setColor(colorPalette.name);
+  }
+
+  <template>
+    <div class="color-palette-menu__item" data-color={{@colorPalette.name}}>
+      <DButton
+        class={{concatClass
+          "btn-flat color-palette-menu__item-choice"
+          this.activeClass
+        }}
+        style={{htmlSafe this.siteStyle}}
+        @icon="circle"
+        @translatedLabel={{@colorPalette.label}}
+        @action={{fn this.handleInput @colorPalette}}
+      />
+    </div>
+  </template>
+}