ZephyrCloudIO · Nsttt · Oct 9, 2025
diff --git a/examples/tsdown/.github/workflows/release.yml b/examples/tsdown/.github/workflows/release.yml
@@ -0,0 +1,26 @@
+name: Release
+
+permissions:
+  contents: write
+
+on:
+  push:
+    tags:
+      - 'v*'
+
+jobs:
+  release:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Set node
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+
+      - run: npx changelogithub
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
diff --git a/examples/tsdown/.github/workflows/unit-test.yml b/examples/tsdown/.github/workflows/unit-test.yml
@@ -0,0 +1,38 @@
+name: Unit Test
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Install pnpm
+        uses: pnpm/[email protected]
+
+      - name: Set node LTS
+        uses: actions/setup-node@v4
+        with:
+          node-version: lts/*
+          cache: pnpm
+
+      - name: Install
+        run: pnpm install
+
+      - name: Build
+        run: pnpm run build
+
+      - name: Lint
+        run: pnpm run lint
+
+      - name: Typecheck
+        run: pnpm run typecheck
+
+      - name: Test
+        run: pnpm run test
diff --git a/examples/tsdown/.gitignore b/examples/tsdown/.gitignore
@@ -0,0 +1,4 @@
+node_modules
+dist
+*.log
+.DS_Store
diff --git a/examples/tsdown/.vscode/settings.json b/examples/tsdown/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "editor.formatOnSave": true
+}
diff --git a/examples/tsdown/README.md b/examples/tsdown/README.md
@@ -0,0 +1,29 @@
+# react-components-starter
+
+A starter for creating a React component library.
+
+## Development
+
+- Install dependencies:
+
+```bash
+npm install
+```
+
+- Run the playground:
+
+```bash
+npm run playground
+```
+
+- Run the unit tests:
+
+```bash
+npm run test
+```
+
+- Build the library:
+
+```bash
+npm run build
+```
diff --git a/examples/tsdown/package.json b/examples/tsdown/package.json
@@ -0,0 +1,55 @@
+{
+  "name": "react-components-starter",
+  "version": "0.0.0",
+  "description": "A starter for creating a React component library.",
+  "type": "module",
+  "license": "MIT",
+  "homepage": "https://github.com/author/library#readme",
+  "bugs": {
+    "url": "https://github.com/author/library/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/author/library.git"
+  },
+  "author": "Author Name <[email protected]>",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": "./dist/index.js",
+    "./package.json": "./package.json"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "tsdown",
+    "dev": "tsdown --watch",
+    "playground": "vite --config playground/vite.config.ts",
+    "test": "vitest",
+    "typecheck": "tsc --noEmit",
+    "release": "bumpp && pnpm publish",
+    "prepublishOnly": "pnpm run build"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.3.0",
+    "@types/node": "^22.15.17",
+    "@types/react": "^19.1.3",
+    "@types/react-dom": "^19.1.4",
+    "@vitejs/plugin-react": "^4.4.1",
+    "bumpp": "^10.1.0",
+    "happy-dom": "^17.4.6",
+    "react": "^19.1.0",
+    "react-dom": "^19.1.0",
+    "tsdown": "^0.11.1",
+    "typescript": "^5.8.3",
+    "vite": "npm:rolldown-vite@latest",
+    "vitest": "^3.1.3",
+    "zephyr-rolldown-plugin": "^0.1.0-next.1"
+  }
+}
diff --git a/examples/tsdown/playground/index.html b/examples/tsdown/playground/index.html
@@ -0,0 +1,12 @@
+<!doctype html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>React Components Starter</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="/src/index.tsx"></script>
+  </body>
+</html>
diff --git a/examples/tsdown/playground/src/App.tsx b/examples/tsdown/playground/src/App.tsx
@@ -0,0 +1,9 @@
+import { MyButton } from '../../src'
+
+export function App() {
+  return (
+    <>
+      <MyButton type="primary" />
+    </>
+  )
+}
diff --git a/examples/tsdown/playground/src/index.tsx b/examples/tsdown/playground/src/index.tsx
@@ -0,0 +1,10 @@
+import { StrictMode } from 'react'
+import { createRoot } from 'react-dom/client'
+import { App } from './App.tsx'
+import './style.css'
+
+createRoot(document.querySelector('#app')!).render(
+  <StrictMode>
+    <App />
+  </StrictMode>,
+)
diff --git a/examples/tsdown/playground/src/style.css b/examples/tsdown/playground/src/style.css
@@ -0,0 +1,79 @@
+:root {
+  font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
+  line-height: 1.5;
+  font-weight: 400;
+
+  color-scheme: light dark;
+  color: rgba(255, 255, 255, 0.87);
+  background-color: #242424;
+
+  font-synthesis: none;
+  text-rendering: optimizeLegibility;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+a {
+  font-weight: 500;
+  color: #646cff;
+  text-decoration: inherit;
+}
+a:hover {
+  color: #535bf2;
+}
+
+body {
+  margin: 0;
+  display: flex;
+  place-items: center;
+  min-width: 320px;
+  min-height: 100vh;
+}
+
+h1 {
+  font-size: 3.2em;
+  line-height: 1.1;
+}
+
+button {
+  border-radius: 8px;
+  border: 1px solid transparent;
+  padding: 0.6em 1.2em;
+  font-size: 1em;
+  font-weight: 500;
+  font-family: inherit;
+  background-color: #1a1a1a;
+  cursor: pointer;
+  transition: border-color 0.25s;
+}
+button:hover {
+  border-color: #646cff;
+}
+button:focus,
+button:focus-visible {
+  outline: 4px auto -webkit-focus-ring-color;
+}
+
+.card {
+  padding: 2em;
+}
+
+#app {
+  max-width: 1280px;
+  margin: 0 auto;
+  padding: 2rem;
+  text-align: center;
+}
+
+@media (prefers-color-scheme: light) {
+  :root {
+    color: #213547;
+    background-color: #ffffff;
+  }
+  a:hover {
+    color: #747bff;
+  }
+  button {
+    background-color: #f9f9f9;
+  }
+}
diff --git a/examples/tsdown/playground/vite.config.ts b/examples/tsdown/playground/vite.config.ts
@@ -0,0 +1,7 @@
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vite'
+
+export default defineConfig({
+  root: './playground',
+  plugins: [react()],
+})
diff --git a/examples/tsdown/src/MyButton.tsx b/examples/tsdown/src/MyButton.tsx
@@ -0,0 +1,9 @@
+import React from 'react'
+
+interface MyButtonProps {
+  type?: 'primary'
+}
+
+export const MyButton: React.FC<MyButtonProps> = ({ type }) => {
+  return <button className="my-button">my button: type {type}</button>
+}
diff --git a/examples/tsdown/src/index.ts b/examples/tsdown/src/index.ts
@@ -0,0 +1 @@
+export { MyButton } from './MyButton'
diff --git a/examples/tsdown/tests/index.test.tsx b/examples/tsdown/tests/index.test.tsx
@@ -0,0 +1,17 @@
+import { render, screen } from '@testing-library/react'
+import { expect, test } from 'vitest'
+import { MyButton } from '../src'
+
+test('button', () => {
+  render(<MyButton type="primary" />)
+
+  const buttonElement = screen.getByText(/my button: type primary/i)
+
+  expect(buttonElement).toBeInTheDocument()
+  expect(buttonElement).toHaveTextContent('my button: type primary')
+  expect(buttonElement.outerHTML).toMatchInlineSnapshot(
+    `"<button class="my-button">my button: type primary</button>"`,
+  )
+
+  expect(buttonElement).toHaveClass('my-button')
+})
diff --git a/examples/tsdown/tests/setup.ts b/examples/tsdown/tests/setup.ts
@@ -0,0 +1 @@
+import '@testing-library/jest-dom'
diff --git a/examples/tsdown/tsconfig.json b/examples/tsdown/tsconfig.json
@@ -0,0 +1,21 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "jsx": "react",
+    "lib": ["es2023"],
+    "moduleDetection": "force",
+    "module": "preserve",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "types": ["node"],
+    "strict": true,
+    "noUnusedLocals": true,
+    "declaration": true,
+    "emitDeclarationOnly": true,
+    "esModuleInterop": true,
+    "isolatedModules": true,
+    "verbatimModuleSyntax": true,
+    "skipLibCheck": true
+  },
+  "include": ["src"]
+}
diff --git a/examples/tsdown/tsdown.config.ts b/examples/tsdown/tsdown.config.ts
@@ -0,0 +1,11 @@
+import { defineConfig } from 'tsdown'
+import { withZephyr } from 'zephyr-rolldown-plugin'
+
+export default defineConfig([
+  {
+    entry: ['./src/index.ts'],
+    platform: 'neutral',
+    dts: true,
+    plugins: [withZephyr()]
+  },
+])
diff --git a/examples/tsdown/vitest.config.ts b/examples/tsdown/vitest.config.ts
@@ -0,0 +1,11 @@
+import react from '@vitejs/plugin-react'
+import { defineConfig } from 'vitest/config'
+
+export default defineConfig({
+  plugins: [react()],
+  test: {
+    environment: 'happy-dom',
+    globals: true,
+    setupFiles: './tests/setup.ts',
+  },
+})