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
+19
View File
@@ -4575,3 +4575,22 @@ button.breadcrumb-current { max-width: 260px; }
.ftable-editor .ftable-rowbar { opacity: 1; }
.ftable-editor .ftable-addcol { opacity: 1; }
}
/* ── v5.2.0: Notion AI-style block editor ── */
@keyframes ai-pulse { 0%,100%{opacity:.45} 50%{opacity:1} }
.slash-menu { flex-direction: column; }
.slash-menu .sm-footer:hover { background: var(--bg-hover); }
.slash-item.selected { background: var(--bg-hover); }
.slash-item-hint { font-size: 12px; color: var(--text-dim); opacity: .7; }
.sm-preview { font-family: inherit; }
#_aiC { font-family: inherit; }
.aici-result p { margin: 0 0 8px; }
.aici-result h1,.aici-result h2,.aici-result h3,.aici-result h4 { margin: 10px 0 6px; font-weight: 700; }
.aici-result h1{font-size:1.4em}.aici-result h2{font-size:1.25em}.aici-result h3{font-size:1.1em}.aici-result h4{font-size:1em}
.aici-result ul,.aici-result ol { margin: 0 0 8px; padding-left: 22px; }
.aici-result li { margin: 2px 0; }
.aici-result code { background: rgba(127,127,127,.18); border-radius: 4px; padding: 1px 5px; font-size: .9em; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; }
.aici-result blockquote { border-left: 3px solid var(--accent,#2383E2); margin: 8px 0; padding: 2px 12px; color: var(--text-dim); }
.aici-result a { color: var(--accent,#2383E2); }
.aici-fb:disabled { opacity:.4; cursor:default; }
@media (max-width:768px){ #_aiC { width: 92vw; } }