@zevra/ui 0.47.0 → 0.49.0

package/react/icon.tsx

@@ -57,6 +57,9 @@ export interface IconButtonProps
    *  L'écrire pour l'ACTION (« Fermer le panneau ») et non pour le dessin
    *  (« Croix ») : c'est ce que le lecteur d'écran annonce. */
   label: string
+  /** Geste DESTRUCTIF (la corbeille d'une ligne) : grise au repos, rouge
+   *  sur fond pâle au survol, comme `variante="fantome-danger"`. */
+  danger?: boolean
   taille?: IconProps['taille']
   /** `arrondis` (option) ou `vifs` (défaut de la charte). Sans valeur, le
    *  composant suit son conteneur : voir `Angles`. */
@@ -68,6 +71,7 @@ export interface IconButtonProps
 export function IconButton({
   icone,
   label,
+  danger,
   taille = 'lg',
   angles,
   className,
@@ -79,7 +83,7 @@ export function IconButton({
     <button
       type={type}
       aria-label={label}
-      className={cx('zv-icon-btn', classeAngles(angles), className)}
+      className={cx('zv-icon-btn', danger && 'zv-icon-btn--danger', classeAngles(angles), className)}
       {...reste}
     >
       {icone ? <Icon nom={icone} taille={taille} /> : children}

package/src/icons.css

@@ -81,6 +81,17 @@
   color: var(--ink);
 }
 
+/* L'icône qui DÉTRUIT (27/10/2026, 0.48.0, HORS RELEVÉ, voir DECISIONS.md) :
+ * la corbeille d'une ligne. Grise au repos comme les autres ; au survol,
+ * l'encre --err sur le fond --err-soft, les teintes du fantôme destructif
+ * (`fantome-danger`). Pas d'aplat : une rangée de corbeilles rouges
+ * pleines crierait sur toute la liste. Le désactivé, déclaré plus bas à
+ * spécificité supérieure, l'emporte. */
+.zv-icon-btn--danger:hover {
+  background: var(--err-soft);
+  color: var(--err);
+}
+
 /* Désactivé. C'était la SEULE classe interactive du module sans cet état :
  * .zv-btn, .zv-chrome-btn, .zv-menu__item, .zv-pager__arrow, .zv-range et
  * les champs en ont tous un. Sans lui, un bouton fermé se rendait comme un

package/src/navigation.css

@@ -147,6 +147,10 @@
   font-weight: 500;
   color: var(--ink-2);
   text-decoration: none;
+  /* Le rayon d'action (DECISIONS, 02/11/2026) : 0 par défaut, et sous
+   * `zv-arrondi` l'entrée s'arrondit comme les boutons et les champs, au
+   * lieu de trancher à angle vif dans une colonne arrondie. */
+  border-radius: var(--r-btn);
 }
 
 /* ⚠️ CONTRE-ORDRE, pas un style. base.css repeint les liens nus en accent, et

package/src/tokens.css

@@ -155,6 +155,21 @@
   --fmt-pdf: #c4362b;
   --fmt-docx: #2a5ba8;
 
+  /* Séries de données (DECISIONS, « La palette de données », 02/11/2026).
+   * HORS RELEVÉ. Cinq teintes catégorielles dans un ORDRE fixe : l'ordre
+   * écarte les voisines pour un daltonien (ΔE 9,1 au plus juste, 19,6 en
+   * vision normale), validé au script de palette catégorielle sur blanc.
+   * Pas de sixième teinte : le reste se replie dans `--serie-autres`.
+   * ⚠️ 3, 4 et 5 passent sous 3:1 sur le blanc : un graphique qui les
+   * emploie porte une légende ET une vue tableau. Ce n'est pas le spectre,
+   * qui garde ses trois emplois. */
+  --serie-1: #2a78d6;
+  --serie-2: #eb6834;
+  --serie-3: #1baf7a;
+  --serie-4: #eda100;
+  --serie-5: #e87ba4;
+  --serie-autres: #8a93a8;
+
   /* Signature */
   --spec-filet: 56px; /* filet de spectre 56×2px devant chaque kicker */
 }

package/tokens/index.js

@@ -62,11 +62,19 @@ export const degrades = {
 }
 
 /**
- * Palette ordonnée pour les visualisations de données. Dérivée du spectre :
- * un graphe reste ainsi dans la marque sans emprunter à l'indigo, qui porte
- * l'action et ne doit pas se confondre avec une série de données.
+ * Palette ordonnée pour les visualisations de données : miroir de
+ * `--serie-1` à `--serie-5` (tokens.css), dans le MÊME ordre, qui est ce qui
+ * les garde distinctes pour un daltonien. Au-delà de cinq séries, le reste se
+ * replie dans `serieAutres`, jamais dans une sixième teinte.
+ *
+ * Elle remplace la série dérivée du spectre (0.48 et avant), dont deux
+ * voisines étaient indiscernables même en vision normale : voir DECISIONS,
+ * « La palette de données » (02/11/2026).
  */
-export const serieGraphique = ['#5848f8', '#2f6ef8', '#14c2f8', '#8a3af8', '#b8a8f8']
+export const serieGraphique = ['#2a78d6', '#eb6834', '#1baf7a', '#eda100', '#e87ba4']
+
+/** Le repli « Autres » d'un graphique : le gris des étiquettes (`--label`). */
+export const serieAutres = '#8a93a8'
 
 export const polices = {
   display: '"Outfit", "Helvetica Neue", Arial, sans-serif',
@@ -124,4 +132,4 @@ export const ombres = {
   glyph: 'drop-shadow(0 24px 32px rgba(88, 72, 248, 0.28))',
 }
 
-export default { couleurs, degrades, serieGraphique, polices, tailles, mesures, rayons, ombres }
+export default { couleurs, degrades, serieGraphique, serieAutres, polices, tailles, mesures, rayons, ombres }