Expose every Bulma variant as a choosable option, not just a curated few

Adds a shared bulma_variants.py (color/size option lists) and expands BULMA_*_CONTROLS in bulma_controls.py to cover each component's full modifier set: Bouton (colour incl. white/light/dark/black/text, light-shade toggle, size, rounded, outlined, inverted, static, loading, fullwidth), Titre (Bulma size is-1..is-6 independent of heading level, is-spaced), Jauge (size), Tableau (bordered/fullwidth/striped/hoverable/narrow, now toggleable instead of hardcoded), Onglets (alignment, boxed/toggle/toggle-rounded style, size, fullwidth), and every form field — champ_texte/email/mot_de_passe, zone_texte, liste_deroulante (colour, size, rounded, static).

render_select.py/render_onglets.py/render_jauge.py now redirect the merged "class" from _visible_attrs to the actual Bulma sub-element (the .select wrapper, the .tabs div, the <progress> tag) instead of the outer positioning wrapper, since that's what needs to carry the modifier classes.

Also fixed a real latent bug found while wiring this up: a checkbox control with default=True (e.g. Tableau's "Première ligne = en-tête") was never actually applied on a freshly created element — default_style_and_attributes unconditionally skipped ALL checkbox types at creation, so the panel showed it checked while the element itself had nothing set. Now a checkbox's default=True is frozen at creation like any other meaningful default; default=False (the common case) is unaffected.

Verified end to end: every widget's variant controls save and render the right class tokens (spot-checked titre/tableau/onglets/champ_texte/liste_deroulante/jauge), full suite green (89 passed).
This commit is contained in:
william
2026-08-24 14:50:44 +02:00
parent bb01e9fdf1
commit a7518355ed
7 changed files with 122 additions and 35 deletions
@@ -1,25 +1,65 @@
from ..controls.c_select import c_select
from ..controls.c_checkbox import c_checkbox
from ..bulma_variants import BULMA_COLOR_OPTIONS, BULMA_SIZE_OPTIONS
_GROUP = "Style Bulma"
# Chaque widget "natif Bulma" (voir fixed_attrs dans registry.py) expose ici
# TOUTES les variantes que Bulma propose pour son composant — chacune ajoute
# un jeton de classe indépendant (target "class:xxx", voir
# save_element_controls.py et _visible_attrs.py) à la classe de base déjà
# posée par fixed_attrs. Laissé à "" (par défaut) = aucun modificateur, look
# Bulma nu. Les réglages de couleur/taille "libres" du widget (curseurs,
# sélecteurs de couleur) restent utilisables par-dessus : un style en ligne
# gagne toujours contre une classe CSS, donc personnaliser une couleur ou une
# taille "à la main" continue de fonctionner exactement comme avant.
# Réglages Bulma (https://bulma.io) posés en plus des réglages de style
# "libres" déjà existants (couleur, taille de police...) — chacun ajoute un
# jeton de classe CSS (target "class:xxx", voir save_element_controls.py et
# _visible_attrs.py) à la classe de base du widget (posée via fixed_attrs,
# ex. "button"). Laissé à "" (par défaut) = look Bulma nu, sans modificateur.
# Les réglages de couleur/taille "libres" du widget restent utilisables par-
# dessus : un style en ligne gagne toujours contre une classe CSS, donc
# personnaliser une couleur ou une taille continue de fonctionner exactement
# comme avant, Bulma ne servant alors que de base par défaut.
BULMA_BUTTON_CONTROLS = [
c_select("bulma_couleur", "Style Bulma — couleur", "class:couleur", [
("", "Aucun (couleurs ci-dessous)"),
("is-primary", "Primaire"), ("is-link", "Lien"), ("is-info", "Info"),
("is-success", "Succès"), ("is-warning", "Attention"), ("is-danger", "Danger"),
("is-light", "Clair"), ("is-dark", "Sombre"),
], default="", group="Style Bulma"),
c_select("bulma_taille", "Style Bulma — taille", "class:taille", [
("", "Normale"), ("is-small", "Petite"), ("is-medium", "Moyenne"), ("is-large", "Grande"),
], default="", group="Style Bulma"),
c_checkbox("bulma_arrondi", "Coins bien arrondis (Bulma)", "class:arrondi", "is-rounded", "", group="Style Bulma"),
c_checkbox("bulma_contour", "Contour seulement (Bulma)", "class:contour", "is-outlined", "", group="Style Bulma"),
c_select("bulma_couleur", "Couleur", "class:couleur", BULMA_COLOR_OPTIONS, default="", group=_GROUP),
c_checkbox("bulma_nuance_claire", "Nuance claire (combinable avec une couleur)", "class:nuance", "is-light", "", group=_GROUP),
c_select("bulma_taille", "Taille", "class:taille", BULMA_SIZE_OPTIONS, default="", group=_GROUP),
c_checkbox("bulma_arrondi", "Coins bien arrondis", "class:arrondi", "is-rounded", "", group=_GROUP),
c_checkbox("bulma_contour", "Contour seulement (fond transparent)", "class:contour", "is-outlined", "", group=_GROUP),
c_checkbox("bulma_inverse", "Couleurs inversées", "class:inverse", "is-inverted", "", group=_GROUP),
c_checkbox("bulma_statique", "Statique (non cliquable visuellement)", "class:statique", "is-static", "", group=_GROUP),
c_checkbox("bulma_chargement", "Indicateur de chargement", "class:chargement", "is-loading", "", group=_GROUP),
c_checkbox("bulma_pleine_largeur", "Pleine largeur", "class:largeur", "is-fullwidth", "", group=_GROUP),
]
BULMA_TITLE_CONTROLS = [
c_select("bulma_taille", "Taille Bulma (indépendante du niveau de titre)", "class:taille",
[("", "Automatique"), ("is-1", "1 — la plus grande"), ("is-2", "2"), ("is-3", "3"),
("is-4", "4"), ("is-5", "5"), ("is-6", "6 — la plus petite")], default="", group=_GROUP),
c_checkbox("bulma_espace", "Garder l'espacement même sans sous-titre", "class:espace", "is-spaced", "", group=_GROUP),
]
BULMA_PROGRESS_CONTROLS = [
c_select("bulma_taille", "Taille de la barre", "class:taille", BULMA_SIZE_OPTIONS, default="", group=_GROUP),
]
BULMA_TABLE_CONTROLS = [
c_checkbox("bulma_bordure", "Bordures", "class:bordure", "is-bordered", "", default=True, group=_GROUP),
c_checkbox("bulma_pleine_largeur", "Pleine largeur", "class:largeur", "is-fullwidth", "", default=True, group=_GROUP),
c_checkbox("bulma_zebre", "Lignes zébrées", "class:zebre", "is-striped", "", group=_GROUP),
c_checkbox("bulma_survol", "Ligne surlignée au survol", "class:survol", "is-hoverable", "", group=_GROUP),
c_checkbox("bulma_compact", "Compact (cellules resserrées)", "class:compact", "is-narrow", "", group=_GROUP),
]
BULMA_TABS_CONTROLS = [
c_select("bulma_alignement", "Alignement", "class:alignement",
[("", "Gauche (par défaut)"), ("is-centered", "Centré"), ("is-right", "Droite")], default="", group=_GROUP),
c_select("bulma_style", "Style", "class:style",
[("", "Simple (soulignement)"), ("is-boxed", "Encadré"), ("is-toggle", "Boutons accolés"),
("is-toggle is-toggle-rounded", "Boutons accolés, arrondis")], default="", group=_GROUP),
c_select("bulma_taille", "Taille", "class:taille", BULMA_SIZE_OPTIONS, default="", group=_GROUP),
c_checkbox("bulma_pleine_largeur", "Pleine largeur (onglets étirés)", "class:largeur", "is-fullwidth", "", group=_GROUP),
]
# Champs de formulaire (input/textarea/select) : mêmes variantes que Bulma
# propose pour .input/.textarea/.select.
BULMA_FIELD_CONTROLS = [
c_select("bulma_couleur", "Couleur", "class:couleur", BULMA_COLOR_OPTIONS, default="", group=_GROUP),
c_select("bulma_taille", "Taille", "class:taille", BULMA_SIZE_OPTIONS, default="", group=_GROUP),
c_checkbox("bulma_arrondi", "Coins bien arrondis", "class:arrondi", "is-rounded", "", group=_GROUP),
c_checkbox("bulma_statique", "Statique (lecture seule visuelle)", "class:statique", "is-static", "", group=_GROUP),
]