@solazah/solazah-cli 0.2.10

package/templates/react/package.json

@@ -0,0 +1,66 @@
+{
+  "name": "{{PLUGIN_NAME}}",
+  "version": "0.0.1",
+  "type": "module",
+  "main": "index.html",
+  "author": "{{PLUGIN_AUTHOR}}",
+  "description": "{{PLUGIN_DESCRIPTION}}",
+  "keywords": ["solazah", "plugin"],
+  "scripts": {
+    "dev": "vite --port {{DEV_PORT}}",
+    "build": "vite build --config vite.config.ts",
+    "lint": "eslint .",
+    "preview": "vite preview",
+    "version": "standard-version",
+    "package": "npm run build && node package.config.js",
+    "publish": "npm publish ./release",
+    "package:publish": "npm run package && npm run publish"
+  },
+  "dependencies": {
+    "@hookform/resolvers": "^5.2.2",
+    "@modelcontextprotocol/sdk": "^1.26.0",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-dropdown-menu": "^2.1.16",
+    "@radix-ui/react-label": "^2.1.7",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@tailwindcss/vite": "^4.1.14",
+    "ahooks": "^3.9.6",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.544.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "react-hook-form": "^7.64.0",
+    "react-router-dom": "^6.28.0",
+    "sonner": "^2.0.7",
+    "tailwind-merge": "^3.3.1",
+    "tailwindcss": "^4.1.14",
+    "tw-animate-css": "^1.4.0",
+    "valtio": "^2.2.0",
+    "zod": "^4.1.12"
+  },
+  "devDependencies": {
+    "@commitlint/cli": "^19.8.1",
+    "@commitlint/config-conventional": "^19.8.1",
+    "@eslint/js": "^9.9.0",
+    "@types/node": "^24.6.2",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.1",
+    "eslint": "^9.9.0",
+    "eslint-plugin-react-hooks": "^5.1.0-rc.0",
+    "eslint-plugin-react-refresh": "^0.4.9",
+    "globals": "^15.9.0",
+    "husky": "^9.1.7",
+    "standard-version": "^9.5.0",
+    "typescript": "^5.5.3",
+    "typescript-eslint": "^8.0.1",
+    "vite": "^5.4.1",
+    "vite-plugin-svgr": "^4.3.0"
+  },
+  "commitlint": {
+    "extends": [
+      "@commitlint/config-conventional"
+    ]
+  }
+}

package/templates/react/src/renderer/components/ui/card.tsx

@@ -0,0 +1,76 @@
+import * as React from "react"
+
+import { cn } from "@/renderer/lib/utils"
+
+const Card = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn(
+      "rounded-xl border bg-card text-card-foreground shadow",
+      className
+    )}
+    {...props}
+  />
+))
+Card.displayName = "Card"
+
+const CardHeader = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex flex-col space-y-1.5 p-6", className)}
+    {...props}
+  />
+))
+CardHeader.displayName = "CardHeader"
+
+const CardTitle = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("font-semibold leading-none tracking-tight", className)}
+    {...props}
+  />
+))
+CardTitle.displayName = "CardTitle"
+
+const CardDescription = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("text-sm text-muted-foreground", className)}
+    {...props}
+  />
+))
+CardDescription.displayName = "CardDescription"
+
+const CardContent = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
+))
+CardContent.displayName = "CardContent"
+
+const CardFooter = React.forwardRef<
+  HTMLDivElement,
+  React.HTMLAttributes<HTMLDivElement>
+>(({ className, ...props }, ref) => (
+  <div
+    ref={ref}
+    className={cn("flex items-center p-6 pt-0", className)}
+    {...props}
+  />
+))
+CardFooter.displayName = "CardFooter"
+
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }

package/templates/react/src/renderer/components/ui/sonner.tsx

@@ -0,0 +1,35 @@
+import {
+    CircleCheckIcon,
+    InfoIcon,
+    Loader2Icon,
+    OctagonXIcon,
+    TriangleAlertIcon,
+} from "lucide-react"
+import { Toaster as Sonner, type ToasterProps } from "sonner"
+
+const Toaster = ({ ...props }: ToasterProps) => {
+    return (
+        <Sonner
+            theme="system"
+            className="toaster group"
+            icons={{
+                success: <CircleCheckIcon className="size-4" />,
+                info: <InfoIcon className="size-4" />,
+                warning: <TriangleAlertIcon className="size-4" />,
+                error: <OctagonXIcon className="size-4" />,
+                loading: <Loader2Icon className="size-4 animate-spin" />,
+            }}
+            style={
+                {
+                    "--normal-bg": "var(--popover)",
+                    "--normal-text": "var(--popover-foreground)",
+                    "--normal-border": "var(--border)",
+                    "--border-radius": "var(--radius)",
+                } as React.CSSProperties
+            }
+            {...props}
+        />
+    )
+}
+
+export { Toaster }

package/templates/react/src/renderer/index.css

@@ -0,0 +1,164 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+
+@custom-variant dark (&:is(.dark *));
+
+
+div[role="menuitem"],
+div[role="menu"],
+div[role="option"],
+button {
+  cursor: pointer;
+}
+
+::-webkit-scrollbar {
+  width: 5px;
+  height: 5px;
+}
+
+::-webkit-scrollbar-track {
+  background-color: transparent;
+  border-radius: .75rem;
+  width: 5px;
+  height: 5px;
+  transition-duration: .4s
+}
+
+::-webkit-scrollbar-thumb {
+  background-color: rgba(204, 204, 204, 0.575);
+  border-radius: .75rem;
+  width: 5px;
+  height: 5px;
+  transition-duration: .4s
+}
+
+::-webkit-scrollbar-thumb:hover {
+  background-color: rgba(128, 128, 128, 0.8)
+}
+
+::-webkit-scrollbar-thumb:active {
+  background-color: rgba(68, 68, 68, 0.23)
+}
+
+@theme inline {
+  --radius-sm: calc(var(--radius) - 4px);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) + 4px);
+  --color-background: var(--background);
+  --color-foreground: var(--foreground);
+  --color-card: var(--card);
+  --color-card-foreground: var(--card-foreground);
+  --color-popover: var(--popover);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-primary: var(--primary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-secondary: var(--secondary);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-muted: var(--muted);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-accent: var(--accent);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-destructive: var(--destructive);
+  --color-border: var(--border);
+  --color-input: var(--input);
+  --color-ring: var(--ring);
+  --color-chart-1: var(--chart-1);
+  --color-chart-2: var(--chart-2);
+  --color-chart-3: var(--chart-3);
+  --color-chart-4: var(--chart-4);
+  --color-chart-5: var(--chart-5);
+  --color-sidebar: var(--sidebar);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-ring: var(--sidebar-ring);
+}
+
+:root {
+  --radius: 0.625rem;
+  --background: oklch(1 0 0);
+  --foreground: oklch(0.145 0 0);
+  --card: oklch(1 0 0);
+  --card-foreground: oklch(0.145 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.205 0 0);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.97 0 0);
+  --muted-foreground: oklch(0.556 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.646 0.222 41.116);
+  --chart-2: oklch(0.6 0.118 184.704);
+  --chart-3: oklch(0.398 0.07 227.392);
+  --chart-4: oklch(0.828 0.189 84.429);
+  --chart-5: oklch(0.769 0.188 70.08);
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(0.922 0 0);
+  --primary-foreground: oklch(0.205 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.488 0.243 264.376);
+  --chart-2: oklch(0.696 0.17 162.48);
+  --chart-3: oklch(0.769 0.188 70.08);
+  --chart-4: oklch(0.627 0.265 303.9);
+  --chart-5: oklch(0.645 0.246 16.439);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+  }
+
+  body {
+    @apply bg-background text-foreground;
+  }
+}
+
+.titlebar {
+  -webkit-app-region: drag;
+  -webkit-user-select: none;
+  user-select: none;
+}

package/templates/react/src/renderer/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>{{PLUGIN_DISPLAY_NAME}}</title>
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./main.tsx"></script>
+  </body>
+</html>

package/templates/react/src/renderer/lib/utils.ts

@@ -0,0 +1,6 @@
+import { clsx, type ClassValue } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs))
+}

package/templates/react/src/renderer/main.tsx

@@ -0,0 +1,56 @@
+import {createRoot} from 'react-dom/client'
+import './index.css'
+import {HashRouter, Route, Routes} from "react-router-dom";
+import {Toaster} from "@/renderer/components/ui/sonner.tsx";
+import Home from "@/renderer/pages/Home.tsx";
+
+console.log("[{{PLUGIN_NAME}}] plugin loaded!");
+
+// 插件准备就绪时触发
+window.ipcRenderer?.on("plugin.onReady", async (event, args) => {
+    console.log("[{{PLUGIN_NAME}}] onReady!", args);
+
+    // 在这里初始化你的插件
+    // 例如：加载配置、注册命令等
+
+    // 示例：注册命令
+    // await window.ipcRenderer.invoke("plugin.setCommands", [
+    //     {
+    //         name: "示例命令",
+    //         alias: ["example"],
+    //         silence: false,
+    //         shortcut: "",
+    //     }
+    // ]);
+});
+
+// 用户执行命令时触发
+window.ipcRenderer?.on("plugin.onEnter", async (event, name, args) => {
+    console.log("[{{PLUGIN_NAME}}] onEnter!", name, args);
+
+    // 如果是主命令，显示插件界面
+    if (name === "{{PLUGIN_DISPLAY_NAME}}") {
+        return;
+    }
+
+    // 处理其他命令
+    // 例如：执行特定操作
+});
+
+const App = () => {
+    return (
+        <HashRouter>
+            <div className="{{PLUGIN_CLASS_NAME}}">
+                <Toaster/>
+                <main className="w-full h-screen">
+                    <div className="titlebar h-10"></div>
+                    <Routes>
+                        <Route path="/" element={<Home />} />
+                    </Routes>
+                </main>
+            </div>
+        </HashRouter>
+    );
+};
+
+createRoot(document.getElementById('root')!).render(<App/>);

package/templates/react/src/renderer/pages/Home.tsx

@@ -0,0 +1,154 @@
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/renderer/components/ui/card";
+
+export default function Home() {
+    return (
+        <div className="container mx-auto p-8 max-w-4xl">
+            <div className="space-y-6">
+                {/* Header */}
+                <div className="space-y-2">
+                    <h1 className="text-4xl font-bold tracking-tight">
+                        {{PLUGIN_DISPLAY_NAME}}
+                    </h1>
+                    <p className="text-lg text-muted-foreground">
+                        {{PLUGIN_DESCRIPTION}}
+                    </p>
+                </div>
+
+                {/* Quick Start Card */}
+                <Card>
+                    <CardHeader>
+                        <CardTitle>🚀 Quick Start</CardTitle>
+                        <CardDescription>
+                            Get started with your plugin development
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent className="space-y-4">
+                        <div>
+                            <h3 className="font-semibold mb-2">1. Customize Your Plugin</h3>
+                            <ul className="list-disc list-inside space-y-1 text-sm text-muted-foreground">
+                                <li>Edit <code className="px-1 py-0.5 bg-muted rounded">src/renderer.js</code> for plugin logic</li>
+                                <li>Modify <code className="px-1 py-0.5 bg-muted rounded">src/pages/Home.tsx</code> for UI</li>
+                                <li>Update <code className="px-1 py-0.5 bg-muted rounded">manifest.json</code> for plugin settings</li>
+                            </ul>
+                        </div>
+
+                        <div>
+                            <h3 className="font-semibold mb-2">2. Add UI Components</h3>
+                            <p className="text-sm text-muted-foreground mb-2">
+                                This plugin uses shadcn/ui components. Add more with:
+                            </p>
+                            <code className="block px-3 py-2 bg-muted rounded text-sm">
+                                npx shadcn@latest add button input dialog
+                            </code>
+                        </div>
+
+                        <div>
+                            <h3 className="font-semibold mb-2">3. Implement Features</h3>
+                            <ul className="list-disc list-inside space-y-1 text-sm text-muted-foreground">
+                                <li>Register commands in <code className="px-1 py-0.5 bg-muted rounded">plugin.onReady</code></li>
+                                <li>Handle commands in <code className="px-1 py-0.5 bg-muted rounded">plugin.onEnter</code></li>
+                                <li>Use Valtio for state management</li>
+                                <li>Use React Hook Form + Zod for forms</li>
+                            </ul>
+                        </div>
+                    </CardContent>
+                </Card>
+
+                {/* Documentation Card */}
+                <Card>
+                    <CardHeader>
+                        <CardTitle>📚 Documentation</CardTitle>
+                        <CardDescription>
+                            Learn more about plugin development
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent>
+                        <div className="grid gap-3">
+                            <div className="flex items-start gap-3">
+                                <div className="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0">
+                                    <span className="text-sm">📖</span>
+                                </div>
+                                <div>
+                                    <div className="font-medium">README.md</div>
+                                    <div className="text-sm text-muted-foreground">
+                                        Project overview and quick reference
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div className="flex items-start gap-3">
+                                <div className="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0">
+                                    <span className="text-sm">📘</span>
+                                </div>
+                                <div>
+                                    <div className="font-medium">GUIDE.md</div>
+                                    <div className="text-sm text-muted-foreground">
+                                        Detailed development guide with examples
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div className="flex items-start gap-3">
+                                <div className="w-8 h-8 rounded-full bg-primary/10 flex items-center justify-center flex-shrink-0">
+                                    <span className="text-sm">🤖</span>
+                                </div>
+                                <div>
+                                    <div className="font-medium">CLAUDE.md</div>
+                                    <div className="text-sm text-muted-foreground">
+                                        AI-assisted development tips
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </CardContent>
+                </Card>
+
+                {/* Tech Stack Card */}
+                <Card>
+                    <CardHeader>
+                        <CardTitle>🛠️ Tech Stack</CardTitle>
+                        <CardDescription>
+                            This plugin is built with modern technologies
+                        </CardDescription>
+                    </CardHeader>
+                    <CardContent>
+                        <div className="grid grid-cols-2 md:grid-cols-3 gap-3 text-sm">
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">React 19</div>
+                                <div className="text-xs text-muted-foreground">UI Framework</div>
+                            </div>
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">TypeScript</div>
+                                <div className="text-xs text-muted-foreground">Type Safety</div>
+                            </div>
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">Vite 5</div>
+                                <div className="text-xs text-muted-foreground">Build Tool</div>
+                            </div>
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">Tailwind CSS</div>
+                                <div className="text-xs text-muted-foreground">Styling</div>
+                            </div>
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">shadcn/ui</div>
+                                <div className="text-xs text-muted-foreground">Components</div>
+                            </div>
+                            <div className="p-3 rounded-lg bg-muted">
+                                <div className="font-semibold">Valtio</div>
+                                <div className="text-xs text-muted-foreground">State</div>
+                            </div>
+                        </div>
+                    </CardContent>
+                </Card>
+
+                {/* Footer */}
+                <div className="text-center text-sm text-muted-foreground pt-4">
+                    <p>Happy coding! 🎉</p>
+                    <p className="mt-1">
+                        Created with <span className="text-red-500">♥</span> using Solazah CLI
+                    </p>
+                </div>
+            </div>
+        </div>
+    );
+}

package/templates/react/src/renderer/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/templates/react/template.json

@@ -0,0 +1,15 @@
+{
+  "name": "react",
+  "displayName": "React",
+  "description": "React 19 + TypeScript + Vite + Tailwind CSS",
+  "version": "1.0.0",
+  "features": [
+    "React 19 with TypeScript",
+    "Vite 5 build system",
+    "Tailwind CSS 4",
+    "shadcn/ui components",
+    "Valtio state management",
+    "React Router",
+    "React Hook Form + Zod"
+  ]
+}

package/templates/react/tsconfig.app.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "module": "ESNext",
+    "skipLibCheck": true,
+
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    "jsx": "react-jsx",
+
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": ["src"]
+}

package/templates/react/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "files": [],
+  "references": [
+    {
+      "path": "./tsconfig.app.json"
+    },
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ],
+  "compilerOptions": {
+    "baseUrl": ".",
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    }
+  }
+}

package/templates/react/tsconfig.node.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "lib": [
+      "ES2023"
+    ],
+    "module": "ESNext",
+    "skipLibCheck": true,
+    /* Bundler mode */
+    "moduleResolution": "bundler",
+    "allowImportingTsExtensions": true,
+    "isolatedModules": true,
+    "moduleDetection": "force",
+    "noEmit": true,
+    /* Linting */
+    "strict": true,
+    "noUnusedLocals": true,
+    "noUnusedParameters": true,
+    "noFallthroughCasesInSwitch": true,
+    "noUncheckedSideEffectImports": true
+  },
+  "include": [
+    "vite.config.ts"
+  ]
+}