build(storybook): migrate from @repo/ui to @repo/core-ui
This commit is contained in:
@@ -2,7 +2,7 @@
|
|||||||
|
|
||||||
## Purpose
|
## Purpose
|
||||||
|
|
||||||
Centralized Storybook instance that pulls and renders all stories from `packages/ui`. Provides a visual development environment, component documentation, and MCP integration for AI agents.
|
Centralized Storybook instance that pulls and renders all stories from `packages/core-ui`. Provides a visual development environment, component documentation, and MCP integration for AI agents.
|
||||||
|
|
||||||
## Port: 6006
|
## Port: 6006
|
||||||
|
|
||||||
@@ -19,7 +19,7 @@ import type { StorybookConfig } from "@storybook/react-vite";
|
|||||||
|
|
||||||
const config: StorybookConfig = {
|
const config: StorybookConfig = {
|
||||||
framework: "@storybook/react-vite",
|
framework: "@storybook/react-vite",
|
||||||
stories: ["../../../packages/ui/src/**/*.stories.@(ts|tsx)"],
|
stories: ["../../../packages/core-ui/src/**/*.stories.@(ts|tsx)"],
|
||||||
addons: ["@storybook/addon-essentials"],
|
addons: ["@storybook/addon-essentials"],
|
||||||
docs: {
|
docs: {
|
||||||
autodocs: "tag",
|
autodocs: "tag",
|
||||||
@@ -36,7 +36,7 @@ const config: StorybookConfig = {
|
|||||||
```
|
```
|
||||||
|
|
||||||
Key configuration details:
|
Key configuration details:
|
||||||
- **`stories`** glob reaches into `packages/ui/src/` to find all `.stories.tsx` files
|
- **`stories`** glob reaches into `packages/core-ui/src/` to find all `.stories.tsx` files
|
||||||
- **`viteFinal`** adds the `@tailwindcss/vite` plugin so Tailwind v4 classes render correctly in stories
|
- **`viteFinal`** adds the `@tailwindcss/vite` plugin so Tailwind v4 classes render correctly in stories
|
||||||
- **`autodocs: "tag"`** generates documentation pages for stories tagged with `"autodocs"`
|
- **`autodocs: "tag"`** generates documentation pages for stories tagged with `"autodocs"`
|
||||||
- **`@storybook/addon-essentials`** includes Controls, Actions, Backgrounds, Viewport, Docs
|
- **`@storybook/addon-essentials`** includes Controls, Actions, Backgrounds, Viewport, Docs
|
||||||
@@ -45,7 +45,7 @@ Key configuration details:
|
|||||||
|
|
||||||
```typescript
|
```typescript
|
||||||
import type { Preview } from "@storybook/react";
|
import type { Preview } from "@storybook/react";
|
||||||
import "../../../packages/ui/src/styles/globals.css";
|
import "../../../packages/core-ui/src/styles/globals.css";
|
||||||
|
|
||||||
const preview: Preview = {
|
const preview: Preview = {
|
||||||
parameters: {
|
parameters: {
|
||||||
@@ -78,7 +78,7 @@ Stories are organized by Atomic Design level via the `title` field in story meta
|
|||||||
|
|
||||||
### Existing Stories
|
### Existing Stories
|
||||||
|
|
||||||
| Story title | Component | Location in `@repo/ui` |
|
| Story title | Component | Location in `@repo/core-ui` |
|
||||||
|---|---|---|
|
|---|---|---|
|
||||||
| `Atoms/Button` | Button (5 variants: Default, Secondary, Destructive, Outline, Ghost) | `src/atoms/button/button.stories.tsx` |
|
| `Atoms/Button` | Button (5 variants: Default, Secondary, Destructive, Outline, Ghost) | `src/atoms/button/button.stories.tsx` |
|
||||||
| `Atoms/Input` | Input (Default, Disabled) | `src/atoms/input/input.stories.tsx` |
|
| `Atoms/Input` | Input (Default, Disabled) | `src/atoms/input/input.stories.tsx` |
|
||||||
@@ -120,7 +120,7 @@ Always query MCP before creating new UI components:
|
|||||||
|
|
||||||
| Dependency | Purpose |
|
| Dependency | Purpose |
|
||||||
|---|---|
|
|---|---|
|
||||||
| `@repo/ui` | Source of all component stories |
|
| `@repo/core-ui` | Source of all component stories |
|
||||||
| `@storybook/react-vite` | Storybook framework using Vite bundler |
|
| `@storybook/react-vite` | Storybook framework using Vite bundler |
|
||||||
| `@storybook/addon-essentials` | Controls, Actions, Docs, Backgrounds, Viewport |
|
| `@storybook/addon-essentials` | Controls, Actions, Docs, Backgrounds, Viewport |
|
||||||
| `@tailwindcss/vite` | Vite plugin for Tailwind CSS v4 |
|
| `@tailwindcss/vite` | Vite plugin for Tailwind CSS v4 |
|
||||||
@@ -131,5 +131,5 @@ Always query MCP before creating new UI components:
|
|||||||
|
|
||||||
## Cross-References
|
## Cross-References
|
||||||
|
|
||||||
- **Component source:** `packages/ui/` -- see `packages/ui/AGENTS.md`
|
- **Component source:** `packages/core-ui/` -- see `packages/core-ui/AGENTS.md`
|
||||||
- **Tailwind tokens:** `packages/ui/src/styles/globals.css`
|
- **Tailwind tokens:** `packages/core-ui/src/styles/globals.css`
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
"lint": "eslint ."
|
"lint": "eslint ."
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@repo/ui": "workspace:*"
|
"@repo/core-ui": "workspace:*"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@repo/eslint-config": "workspace:*",
|
"@repo/eslint-config": "workspace:*",
|
||||||
|
|||||||
4
pnpm-lock.yaml
generated
4
pnpm-lock.yaml
generated
@@ -69,9 +69,9 @@ importers:
|
|||||||
|
|
||||||
apps/storybook:
|
apps/storybook:
|
||||||
dependencies:
|
dependencies:
|
||||||
'@repo/ui':
|
'@repo/core-ui':
|
||||||
specifier: workspace:*
|
specifier: workspace:*
|
||||||
version: link:../../packages/ui
|
version: link:../../packages/core-ui
|
||||||
devDependencies:
|
devDependencies:
|
||||||
'@repo/eslint-config':
|
'@repo/eslint-config':
|
||||||
specifier: workspace:*
|
specifier: workspace:*
|
||||||
|
|||||||
Reference in New Issue
Block a user