feat(editor): Notion AI-style block UX (hint, compact slash menu, inline AI composer)
- 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:
+24
-1
@@ -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 `##`, `**`…
|
||||
|
||||
Reference in New Issue
Block a user