|
| 1 | +# Plugin Generator Template |
| 2 | +# Usage: Tell Claude "用 plugin-generator 建一個 [name] plugin" |
| 3 | +# |
| 4 | +# Claude reads this file and generates all required files for a new plugin. |
| 5 | + |
| 6 | +# ── Input (Claude fills based on user request) ─────────── |
| 7 | +input: |
| 8 | + name: "" # e.g., "data-mapper" |
| 9 | + vendor: "flyto-community" |
| 10 | + display_name: "" # e.g., "Data Mapper" |
| 11 | + description: "" # one-line |
| 12 | + category: "" # e.g., "data", "media", "human-in-the-loop", "notification" |
| 13 | + icon: "" # Lucide icon name |
| 14 | + color: "" # hex color |
| 15 | + |
| 16 | + # Steps to generate |
| 17 | + steps: |
| 18 | + - id: "" # e.g., "map_fields" |
| 19 | + label: "" |
| 20 | + description: "" |
| 21 | + type: headless | ui |
| 22 | + # If ui: |
| 23 | + ui_type: dialog | panel | page |
| 24 | + ui_width: 720 |
| 25 | + ui_height: 600 |
| 26 | + # Params |
| 27 | + params: |
| 28 | + - id: "" |
| 29 | + type: string | number | boolean | array | object |
| 30 | + label: "" |
| 31 | + required: true |
| 32 | + # Output |
| 33 | + output: |
| 34 | + - id: "" |
| 35 | + type: string |
| 36 | + description: "" |
| 37 | + |
| 38 | +# ── Output Files (Claude generates all of these) ───────── |
| 39 | +output: |
| 40 | + # 1. plugins/{name}/package.json |
| 41 | + package_json: |
| 42 | + name: "@flyto/plugin-{name}" |
| 43 | + version: "0.1.0" |
| 44 | + dependencies: |
| 45 | + "@flyto/plugin-sdk": "^0.1.0" |
| 46 | + scripts: |
| 47 | + build: tsc |
| 48 | + test: "node --test dist/**/*.test.js" |
| 49 | + start: "node dist/index.js" |
| 50 | + |
| 51 | + # 2. plugins/{name}/tsconfig.json |
| 52 | + tsconfig: |
| 53 | + extends: "../../tsconfig.json" |
| 54 | + compilerOptions: |
| 55 | + outDir: dist |
| 56 | + rootDir: src |
| 57 | + |
| 58 | + # 3. plugins/{name}/plugin.yaml |
| 59 | + plugin_yaml: |
| 60 | + # Generated from input.steps with full schema |
| 61 | + |
| 62 | + # 4. plugins/{name}/src/index.ts |
| 63 | + index_ts: |
| 64 | + # Pattern: |
| 65 | + # import { createPlugin } from "@flyto/plugin-sdk"; |
| 66 | + # const plugin = createPlugin({ id, version, name }); |
| 67 | + # |
| 68 | + # // For headless steps: |
| 69 | + # plugin.step("step_id", async (input, ctx) => { ... }); |
| 70 | + # |
| 71 | + # // For UI steps: |
| 72 | + # plugin.uiStep("step_id", { page, type, width, height }, async (input, ctx) => { |
| 73 | + # const result = await ctx.waitForUI({ page, props: { ... } }); |
| 74 | + # return { ok: true, data: result.data }; |
| 75 | + # }); |
| 76 | + # |
| 77 | + # plugin.start(); |
| 78 | + |
| 79 | + # 5. plugins/{name}/src/index.test.ts |
| 80 | + index_test_ts: |
| 81 | + # Pattern: |
| 82 | + # - Test step registration via handshake |
| 83 | + # - Test param validation (missing required → error) |
| 84 | + # - Test happy path with mocked data |
| 85 | + # - For UI steps: test registration metadata (type, width, height) |
| 86 | + |
| 87 | + # 6. plugins/{name}/ui/index.html (only for UI steps) |
| 88 | + ui_html: |
| 89 | + # Pattern: |
| 90 | + # - <!DOCTYPE html> with <head></head> (tokens auto-injected) |
| 91 | + # - Use var(--flyto-*) CSS variables for styling |
| 92 | + # - Use .flyto-btn, .flyto-input, .flyto-card utility classes |
| 93 | + # - window.flyto.props for input data |
| 94 | + # - window.flyto.submit(data) to return result |
| 95 | + # - window.flyto.cancel() to cancel |
| 96 | + # - Escape key → cancel, Cmd+Enter → submit |
| 97 | + |
| 98 | +# ── Rules ───────────────────────────────────────────────── |
| 99 | +rules: |
| 100 | + - All source files start with: // Copyright 2026 Flyto2. Licensed under Apache-2.0. See LICENSE. |
| 101 | + - Plugin runtime ID format: "{vendor}/{name}" |
| 102 | + - npm package name format: "@flyto/plugin-{name}" |
| 103 | + - Module registry key becomes: "plugin.{vendor}/{name}/{step_id}" |
| 104 | + - Use node:test for testing, not Jest |
| 105 | + - UI files use vanilla JS only — no framework, no build step |
| 106 | + - CSS uses flyto design tokens only — no custom colors |
| 107 | + - All UI text must be in English |
| 108 | + - postMessage callback uses 127.0.0.1, not localhost |
| 109 | + - Error responses follow: { ok: false, error: { code: "UPPER_SNAKE", message: "..." } } |
| 110 | + - Step handlers validate required params before calling waitForUI |
| 111 | + - UI steps must handle both submit and cancel paths |
| 112 | + |
| 113 | +# ── Checklist (Claude verifies before marking done) ─────── |
| 114 | +checklist: |
| 115 | + - [ ] package.json has correct name, version, dependencies |
| 116 | + - [ ] tsconfig.json extends root |
| 117 | + - [ ] plugin.yaml matches TS implementation |
| 118 | + - [ ] All steps in plugin.yaml have handlers in index.ts |
| 119 | + - [ ] Required params validated in handlers |
| 120 | + - [ ] Test file covers: registration, validation, happy path |
| 121 | + - [ ] UI uses flyto design tokens (no hardcoded colors) |
| 122 | + - [ ] UI handles Escape/Cmd+Enter keyboard shortcuts |
| 123 | + - [ ] npm run build succeeds |
| 124 | + - [ ] npm test passes |
| 125 | + - [ ] Symlink to ~/.flyto/plugins/ if needed |
0 commit comments