fraqtal/agentic-dev
Template
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: ui now optional — prerequisite notes + conditional HTML

Browse Source 
- AGENTS.md (root): marks core-ui as optional in the package table and
  boundary rules; points per-package docs to the .hbs template
- apps/storybook/AGENTS.md: rewrites around no-core-ui-by-default;
  stories glob and globals.css import described as post-scaffold steps
- apps/web-next/AGENTS.md: cross-reference updated to template file
- apps/web-tanstack/AGENTS.md: cross-reference updated to template file
- docs/architecture/data-flow-explainer.html: core-ui bullet notes
  optional status + generator command

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Danijel Martinek
2026-05-09 14:23:24 +02:00
parent a4c8f710a6
commit ae456a5436
5 changed files with 18 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
apps/storybook/AGENTS.md
View File

@@ -1,10 +1,12 @@
# AGENTS.md — apps/storybook
Centralized Storybook instance pulling stories from `@repo/core-ui`. Provides visual component development, documentation, and MCP integration for AI agents.
Centralized Storybook instance for visual component development, documentation, and MCP integration for AI agents. Currently ships with an empty stories list — scaffold `@repo/core-ui` first to populate it.
## Purpose
Visual testing and documentation hub for the design system. All stories live colocated with their components in `@repo/core-ui`. Storybook serves as the single source of truth for component usage.
Visual testing and documentation hub for the design system. When `@repo/core-ui` is scaffolded, stories live colocated with their components there. Storybook serves as the single source of truth for component usage.
> **core-ui is optional.** Scaffold it with `pnpm turbo gen core-package ui`, then add the stories glob and CSS import (see next-steps printed by the generator).
## Port: 6006
@@ -16,7 +18,7 @@ pnpm dev --filter @repo/storybook # http://localhost:6006
### `.storybook/main.ts`
Stories are discovered from `@repo/core-ui`:
Stories are empty by default. After scaffolding `@repo/core-ui`, add the glob:
```typescript
const config: StorybookConfig = {
@@ -35,17 +37,17 @@ const config: StorybookConfig = {
```
Key settings:
- **`stories` glob** — reaches into `packages/core-ui/src/` for all `*.stories.tsx` files
- **`stories` glob** — empty by default; add `"../../../packages/core-ui/src/**/*.stories.@(ts|tsx)"` after scaffolding core-ui
- **`viteFinal`** — adds Tailwind v4 plugin so classes render in Storybook
- **`autodocs: "tag"`** — auto-generates docs for tagged stories
### `.storybook/preview.ts`
Imports global styles:
After scaffolding `@repo/core-ui`, import global styles here:
```typescript
import type { Preview } from "@storybook/react";
import "../../../packages/core-ui/src/styles/globals.css";
import "@repo/core-ui/styles/globals.css";
const preview: Preview = {
parameters: {
@@ -70,7 +72,7 @@ Stories are organized by Atomic Design level via the `title` field:
| Organism | `"Organisms/{ComponentName}"` | Organisms > ComponentName |
| Template | `"Templates/{ComponentName}"` | Templates > ComponentName |
Example story file (`packages/core-ui/src/atoms/button/button.stories.tsx`):
Example story file (after scaffolding core-ui at `packages/core-ui/src/atoms/button/button.stories.tsx`):
```typescript
import type { Meta, StoryObj } from "@storybook/react";
@@ -118,7 +120,7 @@ http://localhost:6006/mcp
| Dependency | Purpose |
|---|---|
| `@repo/core-ui` | Component source + stories |
| `@repo/core-ui` | Component source + stories (optional — scaffold with `pnpm turbo gen core-package ui`) |
| `@storybook/react-vite` | Storybook with Vite bundler |
| `@storybook/addon-essentials` | Controls, Actions, Docs, Backgrounds |
| `@tailwindcss/vite` | Vite plugin for Tailwind v4 |
@@ -129,5 +131,6 @@ http://localhost:6006/mcp
## Cross-References
- **Component source:** `packages/core-ui/AGENTS.md`
- **Component source (when scaffolded):** `packages/core-ui/AGENTS.md`
- **Scaffold core-ui:** `pnpm turbo gen core-package ui`
- **Storybook docs:** `.storybook/` folder

2
apps/web-next/AGENTS.md
View File

@@ -108,4 +108,4 @@ Run: `pnpm test:e2e` starts the dev server and runs all `.spec.ts` files.
- **Feature packages:** `packages/{auth,blog,media,marketing-pages,navigation}/`
- **tRPC composition:** `packages/core-api/AGENTS.md`
- **tRPC client + provider (optional):** scaffold `@repo/core-trpc` first, then see `turbo/generators/templates/core-package/trpc/AGENTS.md.hbs`
- **UI components (optional):** scaffold `@repo/core-ui` first, then see `packages/core-ui/AGENTS.md`
- **UI components (optional):** scaffold with `pnpm turbo gen core-package ui`, then see `turbo/generators/templates/core-package/ui/AGENTS.md.hbs`

2
apps/web-tanstack/AGENTS.md
View File

@@ -110,5 +110,5 @@ Parallel to `apps/web-next` e2e: validates that features work across frameworks.
- **Feature packages:** `packages/{auth,blog,media,marketing-pages,navigation}/`
- **tRPC composition:** `packages/core-api/AGENTS.md`
- **tRPC client + provider (optional):** scaffold `@repo/core-trpc` first, then see `turbo/generators/templates/core-package/trpc/AGENTS.md.hbs`
- **UI components (optional):** scaffold `@repo/core-ui` first, then see `packages/core-ui/AGENTS.md`
- **UI components (optional):** scaffold with `pnpm turbo gen core-package ui`, then see `turbo/generators/templates/core-package/ui/AGENTS.md.hbs`
- **Next.js app (serves tRPC):** `apps/web-next/AGENTS.md`