feat(docs): add analytics and pattern showcase stories
This commit is contained in:
@@ -0,0 +1,54 @@
|
||||
# Analytics Workspace Scene
|
||||
|
||||
- Status: `completed`
|
||||
- Owner: `codex`
|
||||
- Date: `2026-03-25`
|
||||
|
||||
## Goal
|
||||
|
||||
Add a new Storybook `Scenes` entry that mirrors the supplied logistics analytics reference page
|
||||
while staying inside Cadence UI's active tonal Material-inspired design language and leaning on the
|
||||
current shared component set first.
|
||||
|
||||
## Scope
|
||||
|
||||
- In scope:
|
||||
- add a new `Scenes/Analytics Workspace` story under `apps/docs/src`
|
||||
- match the reference page's main information architecture: sidebar, top workspace toolbar,
|
||||
analytics header, KPI cards, two upper chart panels, and one wide lower trend panel
|
||||
- reuse existing shared components for shell, navigation, cards, charts, inputs, badges, and
|
||||
segmented controls whenever possible
|
||||
- keep the scene responsive across mobile and desktop Storybook widths
|
||||
- Out of scope:
|
||||
- pixel-matching the supplied screenshot's white-label brand
|
||||
- replacing the active Cadence tonal system with a new one-off skin
|
||||
- changing shared component APIs unless a clear gap blocks the composition
|
||||
|
||||
## Constraints
|
||||
|
||||
- Follow `DESIGN.md` over the raw screenshot when style details conflict.
|
||||
- Do not disturb unrelated in-progress workspace changes.
|
||||
- Keep any missing visual glue local to the scene unless it is clearly reusable.
|
||||
|
||||
## Affected Surfaces
|
||||
|
||||
- `apps/docs/src`
|
||||
- `docs/exec-plans`
|
||||
|
||||
## Plan
|
||||
|
||||
1. Add an execution plan for the new analytics workspace scene.
|
||||
2. Compose the new scene from the current shell, nav, toolbar, stat, metric, and chart components.
|
||||
3. Fill any remaining screenshot-specific presentation gaps with lightweight scene-local helpers.
|
||||
4. Run the narrowest useful docs validation for the changed surface.
|
||||
|
||||
## Validation
|
||||
|
||||
- `pnpm harness:validate:changed`
|
||||
|
||||
## Status Log
|
||||
|
||||
- `2026-03-25 20:14` started plan for a new analytics workspace scene based on the provided logistics dashboard reference
|
||||
- `2026-03-25 20:31` added `Scenes/Analytics Workspace` with a sidebar shell, workspace toolbar, KPI cards, two upper chart panels, and a wide lower automation trend panel
|
||||
- `2026-03-25 20:36` verified `apps/docs/src/analytics-workspace.stories.tsx` with `pnpm exec eslint apps/docs/src/analytics-workspace.stories.tsx` and `pnpm --filter @ai-ui/docs typecheck`
|
||||
- `2026-03-25 20:37` noted `pnpm harness:validate:changed` is currently blocked by unrelated pre-existing lint errors in `packages/ui/src/components/gauge.tsx` and `packages/ui/src/components/progress.test.tsx`
|
||||
@@ -0,0 +1,59 @@
|
||||
# Analytics Workspace Showcase
|
||||
|
||||
- Status: `completed`
|
||||
- Owner: `codex`
|
||||
- Date: `2026-03-25`
|
||||
|
||||
## Goal
|
||||
|
||||
Add a full-screen Storybook scene that proves the current Cadence UI component set can
|
||||
compose a polished revenue operations dashboard similar to the provided reference without
|
||||
introducing one-off primitives or drifting away from the active Material-inspired design
|
||||
language.
|
||||
|
||||
## Scope
|
||||
|
||||
- In scope:
|
||||
- add one new `Scenes` Storybook story for a revenue analytics workspace
|
||||
- compose the page from the existing component surface plus lightweight layout-only markup
|
||||
- keep the scene responsive so it remains readable on desktop and mobile widths
|
||||
- validate the result in Storybook and through the docs build
|
||||
- Out of scope:
|
||||
- adding new shared components or changing existing component APIs
|
||||
- matching the reference screenshot's exact monochrome branding over Cadence UI's active tonal system
|
||||
- adding this scene to the curated smoke contract unless it becomes a required regression surface
|
||||
|
||||
## Constraints
|
||||
|
||||
- Follow `DESIGN.md` over the raw screenshot when visual details conflict.
|
||||
- Reuse existing components such as `Card`, `Input`, `Badge`, `Avatar`, `Button`, `Tabs`, and `Progress`.
|
||||
- Keep the implementation isolated to docs surfaces unless a clear shared gap appears.
|
||||
|
||||
## Affected Surfaces
|
||||
|
||||
- `apps/docs/src`
|
||||
- `docs/exec-plans`
|
||||
|
||||
## Plan
|
||||
|
||||
1. Add an execution plan so the scene work is resumable and reviewable.
|
||||
2. Build a new full-screen Storybook scene that mirrors the reference information architecture:
|
||||
sidebar, hero header, KPI cards, trend chart, and AI summary panels.
|
||||
3. Use the running Storybook instance to inspect spacing, hierarchy, and responsive behavior.
|
||||
4. Run the narrowest useful docs validation suite and record the outcome.
|
||||
|
||||
## Validation
|
||||
|
||||
- `pnpm harness:validate:docs`
|
||||
- browser review against the local Storybook instance on `http://localhost:6006/`
|
||||
|
||||
## Orchestration Task Sketch
|
||||
|
||||
- `T1`: add the new dashboard showcase scene
|
||||
- `T2 -> T1`: inspect and validate the scene in Storybook
|
||||
|
||||
## Status Log
|
||||
|
||||
- `2026-03-25 15:45` started plan for a new Storybook dashboard scene based on the supplied analytics reference
|
||||
- `2026-03-25 16:02` added `Scenes/Revenue Dashboard`, verified `pnpm harness:validate:docs`, and reviewed desktop/mobile rendering against the local Storybook iframe
|
||||
- `2026-03-25 16:04` noted an unrelated existing Storybook dev-index failure from `apps/docs/src/components/progress.stories.tsx` that does not block direct iframe review of the new scene
|
||||
Reference in New Issue
Block a user