app.component.ts

import { Component, signal, CUSTOM_ELEMENTS_SCHEMA } from "@angular/core";

// Import Elena button class (registers the custom element)
import "@elenajs/components/dist/button.js";
// Import Elena button styles
import "@elenajs/components/dist/button.css";
// Import Elena stack class (registers the custom element)
import "@elenajs/components/dist/stack.js";
// Import Elena stack styles
import "@elenajs/components/dist/stack.css";

@Component({
  selector: "app-root",
  standalone: true,
  schemas: [CUSTOM_ELEMENTS_SCHEMA],
  templateUrl: "./app.component.html",
  styleUrl: "./app.component.css",
})
export class AppComponent {
  count = signal(0);

  variants = ["default", "primary", "danger"] as const;
  variant = signal<"default" | "primary" | "danger">("default");

  cycleVariant() {
    const next = this.variants[(this.variants.indexOf(this.variant()) + 1) % this.variants.length];
    this.variant.set(next);
  }
}