diff --git a/dist/cookcli-card.js b/dist/cookcli-card.js index e581cf9..32c35a0 100644 --- a/dist/cookcli-card.js +++ b/dist/cookcli-card.js @@ -33,6 +33,10 @@ */ class CookCliCard extends HTMLElement { + static getConfigElement() { + return document.createElement("cookcli-card-editor"); + } + static getStubConfig() { return { title: "Recettes" }; } @@ -179,7 +183,83 @@ class CookCliCard extends HTMLElement { } } +class CookCliCardEditor extends HTMLElement { + setConfig(config) { + this._config = config || {}; + } + + set hass(hass) { + this._hass = hass; + } + + // Définit le schéma du formulaire (une entrée par champ configurable) + get _schema() { + return [ + { + name: "title", + selector: { text: {} }, + }, + { + name: "dashboard_path", + selector: { text: {} }, + helper: "Laisser vide pour naviguer dans le dashboard courant", + }, + { + name: "entry_id", + selector: { text: {} }, + helper: "Optionnel — ID d'entrée si plusieurs serveurs CookCLI", + }, + ]; + } + + // Fournit les libellés des champs + _computeLabel(schema) { + const labels = { + title: "Titre", + dashboard_path: "Chemin du dashboard", + entry_id: "Entry ID", + }; + return labels[schema.name] || schema.name; + } + + // Gère les changements dans le formulaire + _valueChanged(ev) { + if (!this._config || !this._hass) { + return; + } + const newConfig = { ...this._config, ...ev.detail.value }; + + this._config = newConfig; + + const event = new CustomEvent("config-changed", { + detail: { config: newConfig }, + bubbles: true, + composed: true, + }); + this.dispatchEvent(event); + } + + render() { + if (!this._hass) return; + + this.innerHTML = ` + + `; + } + + connectedCallback() { + this.render(); + } +} + customElements.define("cookcli-card", CookCliCard); +customElements.define("cookcli-card-editor", CookCliCardEditor); window.customCards = window.customCards || []; window.customCards.push({