chore: v0.1.0 — CI/CD + npm publish setup

- Rename scope from @chainstream to @chainstream-io
- Bump @chainstream-io/a2ui-catalog and @chainstream-io/a2ui-react to 0.1.0
- Add `files: ["dist"]` to both packages for clean npm publishes
- Add GitHub Actions: ci.yml (build on PR/push) + publish.yml (npm publish on tag)
- Update root build script to skip unfinished image-renderer
- Add KlineChart, stories, hooks, shadcn UI primitives, and globals.css

Made-with: Cursor

Author: harry5556

.github/workflows/ci.yml

@@ -0,0 +1,23 @@
+name: CI
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+
+      - run: pnpm install --frozen-lockfile
+
+      - run: pnpm build

.github/workflows/publish.yml

@@ -0,0 +1,33 @@
+name: Publish to npm
+
+on:
+  push:
+    tags: ['v*']
+  workflow_dispatch:
+
+jobs:
+  publish:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+
+      - uses: pnpm/action-setup@v4
+
+      - uses: actions/setup-node@v4
+        with:
+          node-version: '22'
+          registry-url: 'https://registry.npmjs.org'
+
+      - run: pnpm install --frozen-lockfile
+
+      - run: pnpm build
+
+      - name: Publish catalog
+        run: pnpm --filter @chainstream-io/a2ui-catalog publish --no-git-checks
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+      - name: Publish react
+        run: pnpm --filter @chainstream-io/a2ui-react publish --no-git-checks
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

.storybook/main.ts

@@ -1,12 +1,29 @@
 import type { StorybookConfig } from '@storybook/react-vite';
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+
+const __dirname = dirname(fileURLToPath(import.meta.url));
 
 const config: StorybookConfig = {
   stories: ['../packages/react/src/**/*.stories.@(ts|tsx)'],
-  addons: ['@storybook/addon-essentials'],
+  addons: ['@storybook/addon-essentials', '@storybook/addon-interactions'],
   framework: {
     name: '@storybook/react-vite',
     options: {},
   },
+  viteFinal: async (config) => {
+    const tailwindcss = await import('@tailwindcss/vite');
+    config.plugins = config.plugins || [];
+    config.plugins.push(tailwindcss.default());
+
+    config.resolve = config.resolve || {};
+    config.resolve.alias = {
+      ...config.resolve.alias,
+      '@': resolve(__dirname, '../packages/react/src'),
+    };
+
+    return config;
+  },
 };
 
 export default config;

.storybook/preview.ts

@@ -1,7 +1,15 @@
 import type { Preview } from '@storybook/react';
+import '../packages/react/src/globals.css';
 
 const preview: Preview = {
   parameters: {
+    backgrounds: {
+      default: 'dark',
+      values: [
+        { name: 'dark', value: '#0d1117' },
+        { name: 'light', value: '#ffffff' },
+      ],
+    },
     controls: {
       matchers: {
         color: /(background|color)$/i,

README.md

@@ -0,0 +1,34 @@
+# ChainStream A2UI Components
+
+A2UI Crypto Catalog — 10 个交互式链上数据可视化组件。
+
+## Packages
+
+| Package | npm | Description |
+|---------|-----|-------------|
+| `@chainstream/a2ui-catalog` | Catalog schema | 组件 JSON Schema 定义 + 验证器 |
+| `@chainstream/a2ui-react` | React renderer | 10 个 React 组件 (TradingView Lightweight Charts) |
+| `@chainstream/a2ui-image-renderer` | Image fallback | Puppeteer 服务端渲染截图 |
+
+## Components
+
+| Component | Description |
+|-----------|-------------|
+| `KlineChart` | 专业级 K 线图 (OHLCV + 成交量 + 时间周期切换 + 实时更新) |
+| `PriceLineChart` | 价格走势折线图 |
+| `VolumeBarChart` | 交易量柱状图 |
+| `HolderPieChart` | 持仓分布饼图 (Top 10) |
+| `PnLWaterfall` | 盈亏瀑布图 |
+| `TokenCard` | 代币信息卡片 |
+| `TradeTable` | 实时交易明细表 |
+| `WalletDashboard` | 钱包总览面板 |
+| `AlertBadge` | 风险/信号告警标签 |
+| `SmartMoneyFlow` | 聪明钱资金流向 Sankey 图 |
+
+## Development
+
+```bash
+pnpm install
+pnpm run storybook     # Storybook on :6006
+pnpm run build         # Build all packages
+```

package.json

@@ -5,11 +5,26 @@
   "description": "A2UI Crypto Catalog and renderers for ChainStream",
   "license": "MIT",
   "scripts": {
-    "build": "pnpm -r build",
+    "build": "pnpm --filter @chainstream-io/a2ui-catalog --filter @chainstream-io/a2ui-react build",
     "lint": "pnpm -r lint",
     "test": "pnpm -r test",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build"
   },
-  "packageManager": "pnpm@10.9.0"
+  "packageManager": "pnpm@10.9.0",
+  "devDependencies": {
+    "storybook": "^8.6.0",
+    "@storybook/react": "^8.6.0",
+    "@storybook/react-vite": "^8.6.0",
+    "@storybook/addon-essentials": "^8.6.0",
+    "@storybook/addon-interactions": "^8.6.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
+    "typescript": "^5.7.0",
+    "tailwindcss": "^4.0.0",
+    "@tailwindcss/vite": "^4.0.0",
+    "vite": "^6.0.0"
+  }
 }

packages/catalog/package.json

@@ -1,9 +1,10 @@
 {
-  "name": "@chainstream/a2ui-catalog",
-  "version": "0.0.1",
+  "name": "@chainstream-io/a2ui-catalog",
+  "version": "0.1.0",
   "description": "A2UI Crypto Catalog JSON Schema definitions",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "files": ["dist"],
   "license": "MIT",
   "scripts": {
     "build": "tsc",

packages/catalog/src/schema/crypto-catalog.ts

@@ -9,10 +9,16 @@ export interface CryptoComponent {
 }
 
 export const cryptoCatalog: Record<string, CryptoComponent> = {
-  CandlestickChart: {
-    type: 'CandlestickChart',
-    description: 'OHLCV candlestick chart',
+  KlineChart: {
+    type: 'KlineChart',
+    description: 'Full-featured K-line chart with volume overlay, resolution bar, crosshair info, and real-time updates via WebSocket',
     dataBinding: { path: '/klines', format: 'ohlcv' },
+    props: {
+      showVolume: true,
+      showToolbar: true,
+      showCrosshairInfo: true,
+      autoScroll: true,
+    },
   },
   PriceLineChart: {
     type: 'PriceLineChart',

packages/react/package.json

@@ -1,26 +1,40 @@
 {
-  "name": "@chainstream/a2ui-react",
-  "version": "0.0.1",
+  "name": "@chainstream-io/a2ui-react",
+  "version": "0.1.0",
   "description": "React renderer for A2UI Crypto Catalog components",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
+  "files": ["dist"],
   "license": "MIT",
   "scripts": {
-    "build": "tsc",
+    "build": "tsc && tsc-alias",
     "test": "jest"
   },
   "dependencies": {
-    "@chainstream/a2ui-catalog": "workspace:*",
-    "lightweight-charts": "^4.2.0"
+    "@chainstream-io/a2ui-catalog": "workspace:*",
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.0",
+    "lightweight-charts": "^4.2.0",
+    "lucide-react": "^0.468.0",
+    "radix-ui": "^1.0.0",
+    "tailwind-merge": "^3.0.0",
+    "tw-animate-css": "^1.0.0"
   },
   "peerDependencies": {
+    "@chainstream-io/sdk": "^2.0.0",
     "react": "^18.0.0 || ^19.0.0",
     "react-dom": "^18.0.0 || ^19.0.0"
   },
+  "peerDependenciesMeta": {
+    "@chainstream-io/sdk": {
+      "optional": true
+    }
+  },
   "devDependencies": {
     "@types/react": "^19.0.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
+    "tsc-alias": "^1.8.16",
     "typescript": "^5.7.0"
   },
   "publishConfig": {

packages/react/src/components/AlertBadge.stories.tsx

@@ -0,0 +1,42 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { AlertBadge } from './AlertBadge';
+
+const meta: Meta<typeof AlertBadge> = {
+  title: 'UI/AlertBadge',
+  component: AlertBadge,
+  parameters: { layout: 'centered' },
+};
+
+export default meta;
+type Story = StoryObj<typeof AlertBadge>;
+
+export const Info: Story = {
+  args: {
+    type: 'info',
+    message: 'New listing detected on Raydium',
+    timestamp: Date.now(),
+  },
+};
+
+export const Warning: Story = {
+  args: {
+    type: 'warning',
+    message: 'Top holder owns 45% of supply',
+    timestamp: Date.now(),
+  },
+};
+
+export const Danger: Story = {
+  args: {
+    type: 'danger',
+    message: 'Honeypot risk — sell tax 99%',
+  },
+};
+
+export const Success: Story = {
+  args: {
+    type: 'success',
+    message: 'Audit passed by CertiK',
+    timestamp: Date.now(),
+  },
+};