feat(editor): Notion AI-style block UX (hint, compact slash menu, inline AI composer)
FlowDeck CI / test (push) Failing after 14s
FlowDeck CI / docker (push) Skipped

- Empty paragraph placeholder: "Press space for AI or / for commands".
- Slash menu redesigned: compact items (icon + name + shortcut #/##/### on
  right), friendly group labels, 'Close menu (esc)' footer, 'Type to search'
  input at bottom, and hover preview card (e.g. 'Our Values' H2 sample).
- Inline AI composer (AIC): space on empty block opens 'Edit with AI' pill;
  Enter -> agent generate with animated 'Brewing...' (stop button) -> framed
  markdown result + thumbs/thumbdown + 'Insert below' -> applyAIBlocks (md2b).
- CSS: ai-pulse animation, .aici-result styles, .sm-* tweaks; app.css cache.
- VERSION + app.main -> 5.1.2; CHANGELOG updated.
- 271 tests pass (no regression); editor renders 200 (hint/menu/AIC present);
  JS validated via node --check.
This commit is contained in:
2026-09-07 10:52:23 -04:00
parent 4dc06eb203
commit d6bb424021
5 changed files with 181 additions and 21 deletions
+24 -1
View File
@@ -1,6 +1,29 @@
# Changelog — FlowDeck
## v5.1.1 (2026-09-07) — Rendu Markdown naturel (éditeur + panneau Agent)
## v5.1.2 (2026-09-07) — Éditeur style Notion AI (hint, menu slash, AI inline)
> Adapte le visuel des blocs à l'expérience Notion AI : hint sur bloc vide, menu
> `/` compact avec raccourcis + aperçu au survol, et composer AI inline
> (« Edit with AI » → « Brewing… » → résultat encadré → « Insert below »).
### Bloc vide & commandes (Images 1 & 3)
- **Hint de bloc vide** : sur un paragraphe vide, le placeholder devient
« Press 'space' for AI or '/' for commands ».
- **Menu slash refait** : compact (icône + nom + raccourci `#`/`##`/`###`… à droite),
groupes renommés (« Basic blocks », « Media », « Data »), footer **« Close menu (esc) »**,
champ **« Type to search »** en bas, et **aperçu au survol** d'un item (carte
« Our Values » / exemple de rendu de bloc), positionnée à côté du menu.
### Composer AI inline (Images 2, 4, 5, 6)
- **Espace sur un bloc vide** ouvre le composer AI inline (pill « **Edit with AI** »).
- **Entrée** → l'agent génère : indicateur « **Brewing…** » animé (bouton ■ pour
stopper), puis **résultat encadré** (markdown rendu : titres, listes, gras…)
avec barre d'actions (👍/👎) et bouton **« Insert below »**.
- **Insert below** insère le contenu comme vrais blocs (via `applyAIBlocks` → `md2b`).
### Tests / validation
- 271 tests pytest verts (aucune régression) ; éditeur rendu 200 (hint, menu, AIC présents) ;
JS validé (`node --check`).
> L'agent FlowDeck et l'insertion dans les pages affichent désormais le markdown
> rendu (titre, gras, tableaux, code…) au lieu des caractères bruts `##`, `**`…