Document Quick Add UX pattern and filter checked shopping items

- Add Quick Add UX pattern to DESIGN.md documenting expected behaviors
  for form submission, error handling, and completed item display
- Filter checked items from shopping-tab.html display (both grouped
  and ungrouped views)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

1 files changed, 20 insertions, 0 deletions

diff --git a/DESIGN.md b/DESIGN.md
index 27157d2..e0cf867 100644
--- a/DESIGN.md
+++ b/DESIGN.md
@@ -200,6 +200,26 @@ BuildTimeline(ctx, store, calendarClient, tasksClient, start, end)
 - **Labels:** `text-xs font-medium tracking-wider uppercase`
 - **Body:** `text-sm text-white/70`
 
+### Quick Add UX Pattern
+
+All quick-add forms (shopping, tasks, etc.) must follow these behaviors for rapid data entry:
+
+**On Successful Submission:**
+1. **Clear input** - Reset the form/input field immediately
+2. **Refocus input** - Return focus to the text input for the next entry
+3. **Visual feedback** - Brief flash (green background, 300ms) to confirm success
+4. **Update list** - New item appears in the list immediately
+
+**On Error:**
+1. **Preserve input** - Do not clear the input so user can retry
+2. **Show error** - Display error message near the input
+3. **Maintain focus** - Keep focus on the input
+
+**Checked/Completed Items:**
+- Completed items are immediately removed from view (not just crossed out)
+- User items: Deleted from database
+- External items (Trello, PlanToEat): Marked as checked, filtered from display
+
 ---
 
 ## API Integrations