cadence-ui/docs/exec-plans/2026-03-25-workspace-toolbar-pattern.md

Workspace Toolbar Pattern

• Status: completed
• Owner: codex
• Date: 2026-03-25

Goal

Add a reusable WorkspaceToolbar pattern above the base component layer so workspace and desk-style screens can share one stable contract for search, filters, status chips, and action groups instead of hand-rolling a new top control row in each story or scene.

Scope

• In scope:
  • add a new WorkspaceToolbar pattern under packages/ui/src/patterns/
  • export the new pattern from @ai-ui/ui
  • add Storybook docs under Patterns/WorkspaceToolbar
  • refactor the revenue dashboard scene to consume the new pattern
  • add focused tests for the slot and variant contract
• Out of scope:
  • moving DataTable internal toolbar logic into the patterns layer
  • adding router-aware behavior, sticky behavior, or data-source behavior
  • introducing a second page-header-like title system inside the toolbar

Constraints

• Keep the API slot-oriented and composable instead of baking in search or filter behavior.
• Reuse the existing token and motion system from DESIGN.md.
• Keep the public variant surface restrained.
• Do not disturb unrelated in-flight work in the dirty worktree.

Affected Surfaces

• packages/ui/src/patterns
• packages/ui/src/index.ts
• apps/docs/src/patterns
• apps/docs/src/revenue-dashboard.stories.tsx
• docs/exec-plans

Plan

1. Add the new pattern implementation, variants, and focused tests in packages/ui/src/patterns/.
2. Export the pattern from @ai-ui/ui and add Storybook docs under Patterns/*.
3. Refactor the revenue dashboard toolbar composition to consume the shared pattern.
4. Run focused validation and record any skipped or blocked checks.

Validation

• pnpm --filter @ai-ui/ui test -- workspace-toolbar
• pnpm --filter @ai-ui/ui typecheck
• pnpm build:docs

Orchestration Task Sketch

• T1: implement the new pattern and public exports
• T2 -> T1: add docs stories and refactor the dashboard consumer
• T3 -> T2: run focused validation and record outcomes

Status Log

• 2026-03-25 19:13 started the workspace-toolbar slice after confirming the current patterns layer stops at shell and page framing, while the revenue dashboard still hand-rolls a workspace control row
• 2026-03-25 19:20 implemented WorkspaceToolbar with slot-based search, filters, status, and actions regions, then exported the new public pattern from @ai-ui/ui
• 2026-03-25 19:24 added Patterns/WorkspaceToolbar Storybook docs and refactored the revenue dashboard scene to consume the shared toolbar pattern
• 2026-03-25 19:26 validated the change with pnpm --filter @ai-ui/ui test -- workspace-toolbar, pnpm --filter @ai-ui/ui typecheck, and pnpm build:docs