diff --git a/docs/design/kanban-dialogs/index.html b/docs/design/kanban-dialogs/index.html new file mode 100644 index 0000000000..f32f74f5a8 --- /dev/null +++ b/docs/design/kanban-dialogs/index.html @@ -0,0 +1,903 @@ + + + + + +Hermes Kanban — Native Dialog Prototypes + + + + +
+

Hermes Kanban — Native Dialog Prototypes

+

+ Four approaches to replacing window.confirm(), + window.prompt(), and window.alert() in + plugins/kanban/dashboard/dist/index.js. Click a page-level + trigger to fire the same flow in every variant simultaneously, or use the + per-variant buttons to fire flows unique to that variant. +

+
+ + + + + + + +
+
+ +
+ + + + +
+
+

Variant A

+
Conservative
+

Direct 1:1 mapping to the host's ConfirmDialog. Single-line input. Minimal chrome.

+
+
+
Click a trigger to preview.
+
+
+ Trade-off: Safest to ship — zero new components, zero new + patterns. Fails the GPT-OSS review on three points: no multi-line + summary, validation triggers a SECOND dialog instead of inline, no bulk + affordance. +
+
+ + + + +
+
+

Variant B

+
Strong-fit (Pro's pick)
+

Textarea + contextual SVG icon + inline validation + pluralized copy. What the design brief recommends.

+
+
+
Click a trigger to preview.
+
+
+ Trade-off: Best baseline, but Pro suggested either + a disabled-button or an inline error — GPT-OSS caught that both + are needed (button disabled AND error visible) for screen-reader users. + Bottom-sheet on mobile is the right move but still has keyboard edge cases. +
+
+ + + + +
+
+

Variant B-refined

+
Synthesis (recommended)
+

All of B's improvements + GPT-OSS fixes: auto-focus, dual-validation, cancellable-spinner, per-task summaries in bulk.

+
+
+
Click a trigger to preview.
+
+
+ Why this is the recommendation: Single contextual icon + (not four) keeps the title readable. Confirm button stays enabled until + textarea has content; the inline error appears on submit-attempted-empty + AND on blur if still empty. Cancel button stays clickable during the + PATCH (only the confirm shows the spinner) so users can abort slow + networks. Bulk-many shows an expandable list with per-task summary + fields. +
+
+ + + + +
+
+

Variant C

+
Divergent: undo toast
+

Skip the modal entirely for non-destructive moves. Optimistic UI + 5s undo in a bottom-right toast.

+
+
+
Click a trigger to preview.
+
+
+
+ Trade-off: Radical speedup for routine moves, but breaks + the required-summary flow (you can't optimistically "complete" a task + that's missing required schema data). Best used as a + complement to B-refined — undo toast for the safe moves, + modal for done/blocked/archive. +
+
+ +
+ +
+

Decision matrix — recommended pick: B-refined

+ + + + + + + + + + + + + + + + + +
CapabilityABB-refinedC
Centered modal (Radix) ✓ ✓ ✓ ✗
Multi-line summary ✗ ✓ ✓ ✗
Single contextual icon ✗ 4 ✓ ✗
Inline validation (no second dialog)✗ ~ ✓ ✗
Disabled button + persistent error ✗ ~ ✓ ✗
Cancellable spinner during PATCH ✗ ✗ ✓ ✓
Bulk-many expandable list ✗ ✗ ✓ ✗
Auto-focus textarea + mobile scroll ✗ ~ ✓ ✗
Toast on success ✗ ✗ ✗ ✓
Toast on error ✗ ✗ opt. ✓
Survives the required-summary flow ✗ ✓ ✓ ✗
+
+ + + + + \ No newline at end of file