---
suivi: 1663
date: 2026-09-22
sujet: Barre KPI compacte — largeur naturelle, 18 px
chantier: Foncier / Faisabilité
type: feature
statut: poussé
hash: 2eec028a
fichiers:
  - resources/js/Components/Foncier/ScenarioKpiBar.vue
  - tests/Unit/ScenarioKpiBarCompacte1663SourceTest.php
  - tests/Unit/ScenarioKpiBarLisere1658SourceTest.php
  - tests/Unit/ScenarioSeuilsCouleurBarreKpi1654SourceTest.php
  - database/data/journal_mises_a_jour_post_2026_06_12.php
  - public/build/
  - docs/suivi/SUIVI_1663_barre_kpi_compacte.md
---

# SUIVI #1663 — barre KPI compacte

## PROMPT ENVOYÉ

Lot PUREMENT VISUEL. Barre KPI du scénario : blocs à largeur
naturelle, groupés à gauche ; valeurs 22 px → 18 px ; padding
serré. Aucun calcul, aucun payload, aucun palier modifié.
AppShell et Scenarios/Show.vue intouchés. Rebase après #1662.

## FICHES LUES

- **#1658 LEÇON** — liseré + fond blanc ; hauteur ≈ 82 px
  (rangée KPI py-1 + 10+22+py-0.5). `flex-1` + `min-w-[8.5rem]`
  n'étaient pas discutés : c'est eux qui étirent. Conservé :
  filet 3 px, CLASSES_PALIER_LISERE, Teleport, pas de repli.
- **#1654 LEÇON** — une seule source de seuils ; 0 → palier
  null. Aucune classe de palier touchée ici.
- **#1640** — Teleport `#scenario-kpi-bar-host`,
  `overflow-x-hidden` interdit, `flex-wrap` pour le retour
  à la ligne.
- **#1652** — estompage `opacity-50` conservé sur la valeur.
- **#1648 / #1659** — Enregistrer et Export PDF intouchés.
- **#1661 / #1662** — Show.vue dossier / grille en série ;
  ce lot ne les touche pas.

Anti-collision : dernier numéro = **#1662**. **#1663 est libre.**

## SYNTHÈSE

### Ce qui étirait

```
class="flex min-w-[8.5rem] flex-1 items-stretch gap-2 rounded-sm py-0.5 pr-2"
```

`flex-1` (`flex: 1 1 0%`) + `min-w-[8.5rem]`. Le contenu interne
avait aussi `min-w-0 flex-1`.

### Remplacement

```
class="flex flex-none items-stretch gap-1.5 rounded-sm py-0.5 pl-1 pr-1.5"
```

Rangée : `justify-start gap-x-1.5`. Valeur : `text-[18px]`.

### Hauteurs (modèle de boîte)

| | Décomposition | Total |
|---|---|---|
| Avant (#1658) | KPI py-1 8 + 10+22+py-0.5 36 → 44 ; filet 2 + ancres py-1 8 + bouton 27 + border-b 1 | **≈ 82 px** |
| Après (#1663) | KPI py-1 8 + 10+18+py-0.5 32 → 40 ; filet 2 + ancres inchangée 36 | **≈ 78 px** |

Baisse de 4 px. Jamais d'augmentation.

## DÉPLOIEMENT-TEST

```
git pull origin main
php artisan optimize:clear
php artisan view:clear
php artisan journal:sync
```

Pas de migrate. `route:clear` inutile.

## LEÇON

Sur une rangée `flex`, `flex-1` sur les enfants étire même si
le `justify` par défaut est `start`. Pour coller au mockup
« largeur du contenu », `flex-none` (pas seulement retirer
`flex-grow` : le `min-w` imposait encore 8,5 rem). `flex-wrap`
sans `overflow-x-hidden` : à l'étroit les blocs passent à
la ligne au lieu de scroller.