@su-record/vibe 2.8.51 → 2.8.53

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (428) hide show
  1. package/.env.example +37 -37
  2. package/CLAUDE.md +169 -169
  3. package/LICENSE +21 -21
  4. package/README.ko.md +5 -5
  5. package/README.md +5 -5
  6. package/agents/architect-low.md +41 -41
  7. package/agents/architect-medium.md +59 -59
  8. package/agents/architect.md +80 -80
  9. package/agents/build-error-resolver.md +115 -115
  10. package/agents/compounder.md +261 -261
  11. package/agents/diagrammer.md +178 -178
  12. package/agents/docs/api-documenter.md +99 -99
  13. package/agents/docs/changelog-writer.md +93 -93
  14. package/agents/e2e-tester.md +294 -294
  15. package/agents/event/event-comms.md +78 -78
  16. package/agents/event/event-content.md +68 -68
  17. package/agents/event/event-image.md +95 -95
  18. package/agents/event/event-ops.md +84 -84
  19. package/agents/event/event-scheduler.md +69 -69
  20. package/agents/event/event-speaker.md +86 -86
  21. package/agents/explorer-low.md +42 -42
  22. package/agents/explorer-medium.md +59 -59
  23. package/agents/explorer.md +48 -48
  24. package/agents/implementer-low.md +43 -43
  25. package/agents/implementer-medium.md +52 -52
  26. package/agents/implementer.md +54 -54
  27. package/agents/junior-mentor.md +141 -141
  28. package/agents/planning/requirements-analyst.md +84 -84
  29. package/agents/planning/ux-advisor.md +83 -83
  30. package/agents/qa/acceptance-tester.md +86 -86
  31. package/agents/qa/edge-case-finder.md +93 -93
  32. package/agents/qa/qa-coordinator.md +131 -131
  33. package/agents/refactor-cleaner.md +143 -143
  34. package/agents/research/best-practices-agent.md +199 -199
  35. package/agents/research/codebase-patterns-agent.md +157 -157
  36. package/agents/research/framework-docs-agent.md +188 -188
  37. package/agents/research/security-advisory-agent.md +213 -213
  38. package/agents/review/architecture-reviewer.md +107 -107
  39. package/agents/review/complexity-reviewer.md +116 -116
  40. package/agents/review/data-integrity-reviewer.md +88 -88
  41. package/agents/review/git-history-reviewer.md +103 -103
  42. package/agents/review/performance-reviewer.md +86 -86
  43. package/agents/review/python-reviewer.md +150 -150
  44. package/agents/review/rails-reviewer.md +139 -139
  45. package/agents/review/react-reviewer.md +144 -144
  46. package/agents/review/security-reviewer.md +80 -80
  47. package/agents/review/simplicity-reviewer.md +140 -140
  48. package/agents/review/test-coverage-reviewer.md +116 -116
  49. package/agents/review/typescript-reviewer.md +127 -127
  50. package/agents/searcher.md +54 -54
  51. package/agents/simplifier.md +120 -120
  52. package/agents/tester.md +49 -49
  53. package/agents/ui/ui-a11y-auditor.md +93 -93
  54. package/agents/ui/ui-antipattern-detector.md +102 -102
  55. package/agents/ui/ui-dataviz-advisor.md +69 -69
  56. package/agents/ui/ui-design-system-gen.md +57 -57
  57. package/agents/ui/ui-industry-analyzer.md +49 -49
  58. package/agents/ui/ui-layout-architect.md +65 -65
  59. package/agents/ui/ui-stack-implementer.md +68 -68
  60. package/agents/ui/ux-compliance-reviewer.md +81 -81
  61. package/agents/ui-previewer.md +258 -258
  62. package/commands/vibe.analyze.md +379 -379
  63. package/commands/vibe.docs.md +32 -32
  64. package/commands/vibe.event.md +163 -163
  65. package/commands/vibe.figma.md +69 -69
  66. package/commands/vibe.review.md +686 -686
  67. package/commands/vibe.run.md +2276 -2276
  68. package/commands/vibe.spec.md +1195 -1195
  69. package/commands/vibe.spec.review.md +609 -609
  70. package/commands/vibe.trace.md +259 -259
  71. package/commands/vibe.utils.md +413 -413
  72. package/commands/vibe.verify.md +510 -510
  73. package/dist/cli/collaborator.js +52 -52
  74. package/dist/cli/commands/config.js +9 -9
  75. package/dist/cli/commands/evolution.js +12 -12
  76. package/dist/cli/commands/figma.js +20 -20
  77. package/dist/cli/commands/info.js +53 -53
  78. package/dist/cli/commands/init.d.ts.map +1 -1
  79. package/dist/cli/commands/init.js +82 -15
  80. package/dist/cli/commands/init.js.map +1 -1
  81. package/dist/cli/commands/remove.js +14 -14
  82. package/dist/cli/commands/sentinel.js +27 -27
  83. package/dist/cli/commands/skills.js +5 -5
  84. package/dist/cli/commands/slack.js +10 -10
  85. package/dist/cli/commands/stats.js +6 -6
  86. package/dist/cli/commands/telegram.js +12 -12
  87. package/dist/cli/detect.js +32 -32
  88. package/dist/cli/index.js +51 -51
  89. package/dist/cli/llm/claude-commands.js +16 -16
  90. package/dist/cli/llm/config.js +18 -18
  91. package/dist/cli/llm/gemini-commands.js +16 -16
  92. package/dist/cli/llm/gpt-commands.js +19 -19
  93. package/dist/cli/llm/help.js +21 -21
  94. package/dist/cli/postinstall/constants.d.ts.map +1 -1
  95. package/dist/cli/postinstall/constants.js +2 -0
  96. package/dist/cli/postinstall/constants.js.map +1 -1
  97. package/dist/cli/postinstall/cursor-agents.js +32 -32
  98. package/dist/cli/postinstall/cursor-rules.js +83 -83
  99. package/dist/cli/postinstall/cursor-skills.js +743 -743
  100. package/dist/cli/setup/Provisioner.js +42 -42
  101. package/dist/cli/types.d.ts +12 -0
  102. package/dist/cli/types.d.ts.map +1 -1
  103. package/dist/infra/lib/DeepInit.js +24 -24
  104. package/dist/infra/lib/IterationTracker.js +11 -11
  105. package/dist/infra/lib/PythonParser.js +108 -108
  106. package/dist/infra/lib/ReviewRace.js +96 -96
  107. package/dist/infra/lib/SkillFrontmatter.js +28 -28
  108. package/dist/infra/lib/SkillQualityGate.js +9 -9
  109. package/dist/infra/lib/SkillRepository.js +159 -159
  110. package/dist/infra/lib/TokenBudgetTracker.d.ts +13 -0
  111. package/dist/infra/lib/TokenBudgetTracker.d.ts.map +1 -1
  112. package/dist/infra/lib/TokenBudgetTracker.js +44 -3
  113. package/dist/infra/lib/TokenBudgetTracker.js.map +1 -1
  114. package/dist/infra/lib/UltraQA.js +99 -99
  115. package/dist/infra/lib/autonomy/AuditStore.js +41 -41
  116. package/dist/infra/lib/autonomy/ConfirmationStore.js +30 -30
  117. package/dist/infra/lib/autonomy/EventOutbox.js +38 -38
  118. package/dist/infra/lib/autonomy/PolicyEngine.d.ts +3 -3
  119. package/dist/infra/lib/autonomy/PolicyEngine.js +18 -18
  120. package/dist/infra/lib/autonomy/SecuritySentinel.js +1 -1
  121. package/dist/infra/lib/autonomy/SuggestionStore.js +33 -33
  122. package/dist/infra/lib/embedding/VectorStore.js +22 -22
  123. package/dist/infra/lib/evolution/AgentAnalyzer.js +10 -10
  124. package/dist/infra/lib/evolution/DescriptionOptimizer.js +21 -21
  125. package/dist/infra/lib/evolution/GenerationRegistry.js +36 -36
  126. package/dist/infra/lib/evolution/InsightStore.js +90 -90
  127. package/dist/infra/lib/evolution/ParityTester.js +57 -57
  128. package/dist/infra/lib/evolution/RollbackManager.js +5 -5
  129. package/dist/infra/lib/evolution/SkillBenchmark.js +23 -23
  130. package/dist/infra/lib/evolution/SkillEvalRunner.js +50 -50
  131. package/dist/infra/lib/evolution/SkillGapDetector.js +10 -10
  132. package/dist/infra/lib/evolution/UsageTracker.js +28 -28
  133. package/dist/infra/lib/gemini/orchestration.js +5 -5
  134. package/dist/infra/lib/gpt/orchestration.js +4 -4
  135. package/dist/infra/lib/memory/KnowledgeGraph.js +4 -4
  136. package/dist/infra/lib/memory/MemorySearch.js +57 -57
  137. package/dist/infra/lib/memory/MemoryStorage.js +181 -181
  138. package/dist/infra/lib/memory/ObservationStore.js +28 -28
  139. package/dist/infra/lib/memory/ReflectionStore.js +30 -30
  140. package/dist/infra/lib/memory/SessionRAGRetriever.js +7 -7
  141. package/dist/infra/lib/memory/SessionRAGStore.js +225 -225
  142. package/dist/infra/lib/memory/SessionSummarizer.js +9 -9
  143. package/dist/infra/orchestrator/AgentManager.js +12 -12
  144. package/dist/infra/orchestrator/AgentRegistry.js +65 -65
  145. package/dist/infra/orchestrator/MultiLlmResearch.js +8 -8
  146. package/dist/infra/orchestrator/SwarmOrchestrator.test.js +16 -16
  147. package/dist/infra/orchestrator/parallelResearch.js +24 -24
  148. package/dist/tools/convention/analyzeComplexity.test.js +115 -115
  149. package/dist/tools/convention/validateCodeQuality.test.js +104 -104
  150. package/dist/tools/memory/createMemoryTimeline.js +10 -10
  151. package/dist/tools/memory/getMemoryGraph.js +12 -12
  152. package/dist/tools/memory/getSessionContext.js +9 -9
  153. package/dist/tools/memory/linkMemories.js +14 -14
  154. package/dist/tools/memory/listMemories.js +4 -4
  155. package/dist/tools/memory/recallMemory.js +4 -4
  156. package/dist/tools/memory/saveMemory.js +4 -4
  157. package/dist/tools/memory/searchMemoriesAdvanced.js +23 -23
  158. package/dist/tools/semantic/analyzeDependencyGraph.js +12 -12
  159. package/dist/tools/semantic/astGrep.test.js +6 -6
  160. package/dist/tools/spec/prdParser.test.js +171 -171
  161. package/dist/tools/spec/specGenerator.js +169 -169
  162. package/dist/tools/spec/traceabilityMatrix.js +64 -64
  163. package/dist/tools/spec/traceabilityMatrix.test.js +28 -28
  164. package/hooks/gemini-hooks.json +73 -73
  165. package/hooks/hooks.json +174 -170
  166. package/hooks/scripts/__tests__/keyword-detector.test.js +199 -199
  167. package/hooks/scripts/__tests__/pre-tool-guard.test.js +286 -286
  168. package/hooks/scripts/__tests__/sentinel-guard.test.js +210 -210
  169. package/hooks/scripts/auto-commit.js +97 -97
  170. package/hooks/scripts/auto-format.js +64 -64
  171. package/hooks/scripts/auto-test.js +81 -81
  172. package/hooks/scripts/code-check.js +268 -268
  173. package/hooks/scripts/codex-detect.js +46 -46
  174. package/hooks/scripts/codex-review-gate.js +80 -80
  175. package/hooks/scripts/command-log.js +32 -32
  176. package/hooks/scripts/context-save.js +353 -353
  177. package/hooks/scripts/devlog-gen.js +230 -0
  178. package/hooks/scripts/evolution-engine.js +91 -91
  179. package/hooks/scripts/figma-extract.js +635 -477
  180. package/hooks/scripts/hud-status.js +321 -321
  181. package/hooks/scripts/keyword-detector.js +214 -214
  182. package/hooks/scripts/llm-orchestrate.js +572 -572
  183. package/hooks/scripts/post-edit.js +32 -32
  184. package/hooks/scripts/pr-test-gate.js +52 -52
  185. package/hooks/scripts/pre-tool-guard.js +214 -159
  186. package/hooks/scripts/prompt-dispatcher.js +185 -185
  187. package/hooks/scripts/sentinel-guard.js +131 -131
  188. package/hooks/scripts/session-start.js +177 -177
  189. package/hooks/scripts/skill-injector.js +83 -83
  190. package/hooks/scripts/stop-notify.js +209 -209
  191. package/hooks/scripts/utils.js +243 -243
  192. package/languages/csharp-unity.md +515 -515
  193. package/languages/gdscript-godot.md +470 -470
  194. package/languages/ruby-rails.md +489 -489
  195. package/languages/typescript-angular.md +433 -433
  196. package/languages/typescript-astro.md +416 -416
  197. package/languages/typescript-electron.md +406 -406
  198. package/languages/typescript-nestjs.md +524 -524
  199. package/languages/typescript-svelte.md +407 -407
  200. package/languages/typescript-tauri.md +365 -365
  201. package/package.json +101 -101
  202. package/skills/agents-md/SKILL.md +121 -121
  203. package/skills/agents-md/rubrics/what-to-keep.md +49 -49
  204. package/skills/agents-md/templates/agents-md.md +36 -36
  205. package/skills/arch-guard/SKILL.md +181 -181
  206. package/skills/arch-guard/agents/detector.md +48 -48
  207. package/skills/arch-guard/agents/reporter.md +48 -48
  208. package/skills/arch-guard/agents/rule-generator.md +49 -49
  209. package/skills/arch-guard/agents/violation-checker.md +51 -51
  210. package/skills/arch-guard/frameworks/clean-architecture.md +108 -108
  211. package/skills/arch-guard/frameworks/solid.md +102 -102
  212. package/skills/arch-guard/scripts/check-boundaries.js +90 -90
  213. package/skills/arch-guard/templates/arch-rules.json +47 -47
  214. package/skills/arch-guard/templates/violation-report.md +53 -53
  215. package/skills/brand-assets/SKILL.md +147 -147
  216. package/skills/brand-assets/rubrics/asset-checklist.md +98 -98
  217. package/skills/brand-assets/templates/brand-guide.md +161 -161
  218. package/skills/capability-loop/SKILL.md +168 -168
  219. package/skills/capability-loop/agents/capability-designer.md +61 -61
  220. package/skills/capability-loop/agents/failure-analyst.md +55 -55
  221. package/skills/capability-loop/agents/implementer.md +50 -50
  222. package/skills/capability-loop/agents/tester.md +53 -53
  223. package/skills/capability-loop/templates/capability-spec.md +118 -118
  224. package/skills/capability-loop/templates/failure-analysis.md +118 -118
  225. package/skills/characterization-test/SKILL.md +207 -207
  226. package/skills/characterization-test/agents/behavior-capturer.md +50 -50
  227. package/skills/characterization-test/agents/coverage-checker.md +54 -54
  228. package/skills/characterization-test/agents/reporter.md +50 -50
  229. package/skills/characterization-test/agents/test-writer.md +49 -49
  230. package/skills/characterization-test/rubrics/coverage-criteria.md +53 -53
  231. package/skills/characterization-test/templates/test-template.ts +101 -101
  232. package/skills/chub-usage/SKILL.md +139 -139
  233. package/skills/claude-md-guide/SKILL.md +351 -351
  234. package/skills/claude-md-guide/rubrics/anti-patterns.md +88 -88
  235. package/skills/claude-md-guide/templates/claude-md.md +54 -54
  236. package/skills/commerce-patterns/SKILL.md +64 -64
  237. package/skills/commerce-patterns/rubrics/checkout-flow.md +48 -48
  238. package/skills/commerce-patterns/templates/product-schema.md +85 -85
  239. package/skills/commit-push-pr/SKILL.md +77 -77
  240. package/skills/commit-push-pr/agents/change-analyzer.md +55 -55
  241. package/skills/commit-push-pr/agents/message-writer.md +50 -50
  242. package/skills/commit-push-pr/agents/pr-writer.md +58 -58
  243. package/skills/commit-push-pr/agents/reviewer.md +52 -52
  244. package/skills/commit-push-pr/rubrics/commit-message.md +73 -73
  245. package/skills/commit-push-pr/templates/pr-body.md +63 -63
  246. package/skills/context7-usage/SKILL.md +106 -106
  247. package/skills/context7-usage/rubrics/when-to-use.md +50 -50
  248. package/skills/create-prd/SKILL.md +90 -90
  249. package/skills/create-prd/agents/edge-case-finder.md +48 -48
  250. package/skills/create-prd/agents/prioritizer.md +60 -60
  251. package/skills/create-prd/agents/requirements-writer.md +48 -48
  252. package/skills/create-prd/agents/researcher.md +55 -55
  253. package/skills/create-prd/agents/reviewer.md +54 -54
  254. package/skills/create-prd/frameworks/jobs-to-be-done.md +96 -96
  255. package/skills/create-prd/frameworks/rice-scoring.md +97 -97
  256. package/skills/create-prd/orchestrator.md +70 -70
  257. package/skills/create-prd/rubrics/completeness.md +58 -58
  258. package/skills/create-prd/templates/prd.md +139 -139
  259. package/skills/design-audit/SKILL.md +152 -152
  260. package/skills/design-audit/agents/a11y-auditor.md +43 -43
  261. package/skills/design-audit/agents/performance-auditor.md +46 -46
  262. package/skills/design-audit/agents/responsive-auditor.md +46 -46
  263. package/skills/design-audit/agents/scorer.md +47 -47
  264. package/skills/design-audit/agents/slop-detector.md +47 -47
  265. package/skills/design-audit/frameworks/core-web-vitals.md +107 -107
  266. package/skills/design-audit/frameworks/wcag-checklist.md +64 -64
  267. package/skills/design-audit/orchestrator.md +64 -64
  268. package/skills/design-audit/rubrics/ai-slop-patterns.md +83 -83
  269. package/skills/design-audit/rubrics/scoring.md +63 -63
  270. package/skills/design-audit/templates/report.md +88 -88
  271. package/skills/design-critique/SKILL.md +139 -139
  272. package/skills/design-critique/rubrics/ux-heuristics.md +143 -143
  273. package/skills/design-critique/templates/critique-report.md +86 -86
  274. package/skills/design-distill/SKILL.md +130 -130
  275. package/skills/design-distill/templates/design-system.md +132 -132
  276. package/skills/design-normalize/SKILL.md +133 -133
  277. package/skills/design-normalize/rubrics/token-naming.md +117 -117
  278. package/skills/design-normalize/templates/token-audit.md +89 -89
  279. package/skills/design-polish/SKILL.md +131 -131
  280. package/skills/design-polish/rubrics/polish-checklist.md +68 -68
  281. package/skills/design-polish/templates/polish-report.md +64 -64
  282. package/skills/design-teach/SKILL.md +182 -182
  283. package/skills/design-teach/rubrics/brand-personality.md +73 -73
  284. package/skills/design-teach/templates/design-context.json +36 -36
  285. package/skills/devlog/SKILL.md +143 -0
  286. package/skills/e2e-commerce/SKILL.md +62 -62
  287. package/skills/e2e-commerce/templates/test-scenarios.md +170 -170
  288. package/skills/event-comms/SKILL.md +162 -162
  289. package/skills/event-comms/templates/email-invite.md +99 -99
  290. package/skills/event-comms/templates/sns-post.md +133 -133
  291. package/skills/event-ops/SKILL.md +198 -198
  292. package/skills/event-ops/rubrics/contingency.md +85 -85
  293. package/skills/event-ops/templates/d-day-checklist.md +65 -65
  294. package/skills/event-planning/SKILL.md +132 -132
  295. package/skills/event-planning/rubrics/timeline.md +70 -70
  296. package/skills/event-planning/templates/event-plan.md +91 -91
  297. package/skills/exec-plan/SKILL.md +149 -149
  298. package/skills/exec-plan/agents/decomposer.md +47 -47
  299. package/skills/exec-plan/agents/dependency-mapper.md +44 -44
  300. package/skills/exec-plan/agents/estimator.md +43 -43
  301. package/skills/exec-plan/agents/validator.md +55 -55
  302. package/skills/exec-plan/orchestrator.md +70 -70
  303. package/skills/exec-plan/rubrics/complexity-scoring.md +75 -75
  304. package/skills/exec-plan/templates/plan.md +147 -147
  305. package/skills/git-worktree/SKILL.md +73 -73
  306. package/skills/git-worktree/rubrics/when-to-use.md +55 -55
  307. package/skills/handoff/SKILL.md +110 -110
  308. package/skills/handoff/agents/context-summarizer.md +51 -51
  309. package/skills/handoff/agents/document-writer.md +63 -63
  310. package/skills/handoff/agents/state-collector.md +53 -53
  311. package/skills/handoff/agents/verifier.md +48 -48
  312. package/skills/handoff/rubrics/completeness.md +62 -62
  313. package/skills/handoff/templates/handoff.md +107 -107
  314. package/skills/parallel-research/SKILL.md +89 -89
  315. package/skills/parallel-research/agents/best-practices.md +43 -43
  316. package/skills/parallel-research/agents/codebase-patterns.md +46 -46
  317. package/skills/parallel-research/agents/framework-docs.md +45 -45
  318. package/skills/parallel-research/agents/security-advisory.md +46 -46
  319. package/skills/parallel-research/agents/synthesizer.md +52 -52
  320. package/skills/parallel-research/experts/best-practices.md +50 -50
  321. package/skills/parallel-research/experts/codebase-patterns.md +70 -70
  322. package/skills/parallel-research/experts/framework-docs.md +65 -65
  323. package/skills/parallel-research/experts/security-advisory.md +69 -69
  324. package/skills/parallel-research/orchestrator.md +65 -65
  325. package/skills/parallel-research/templates/synthesis.md +101 -101
  326. package/skills/prioritization-frameworks/SKILL.md +87 -87
  327. package/skills/prioritization-frameworks/rubrics/frameworks.md +79 -79
  328. package/skills/prioritization-frameworks/templates/scoring-matrix.md +69 -69
  329. package/skills/priority-todos/SKILL.md +64 -64
  330. package/skills/priority-todos/rubrics/prioritization.md +70 -70
  331. package/skills/priority-todos/templates/todo-board.md +59 -59
  332. package/skills/seo-checklist/SKILL.md +58 -58
  333. package/skills/seo-checklist/frameworks/structured-data.md +153 -153
  334. package/skills/seo-checklist/rubrics/content-seo.md +42 -42
  335. package/skills/seo-checklist/rubrics/technical-seo.md +48 -48
  336. package/skills/techdebt/SKILL.md +124 -124
  337. package/skills/techdebt/agents/analyzer.md +50 -50
  338. package/skills/techdebt/agents/fixer.md +41 -41
  339. package/skills/techdebt/agents/reviewer.md +47 -47
  340. package/skills/techdebt/agents/scanner.md +44 -44
  341. package/skills/techdebt/orchestrator.md +70 -70
  342. package/skills/techdebt/rubrics/severity.md +51 -51
  343. package/skills/techdebt/scripts/scan.js +90 -90
  344. package/skills/techdebt/templates/report.md +86 -86
  345. package/skills/tool-fallback/SKILL.md +104 -104
  346. package/skills/tool-fallback/rubrics/fallback-chain.md +58 -58
  347. package/skills/typescript-advanced-types/SKILL.md +67 -67
  348. package/skills/typescript-advanced-types/rubrics/type-patterns.md +109 -109
  349. package/skills/ui-ux-pro-max/SKILL.md +236 -236
  350. package/skills/ui-ux-pro-max/reference/color-and-contrast.md +517 -517
  351. package/skills/ui-ux-pro-max/reference/interaction-design.md +544 -544
  352. package/skills/ui-ux-pro-max/reference/motion-design.md +591 -591
  353. package/skills/ui-ux-pro-max/reference/responsive-design.md +463 -463
  354. package/skills/ui-ux-pro-max/reference/spatial-design.md +390 -390
  355. package/skills/ui-ux-pro-max/reference/typography.md +455 -455
  356. package/skills/ui-ux-pro-max/reference/ux-writing.md +469 -469
  357. package/skills/ui-ux-pro-max/rubrics/interaction-states.md +83 -83
  358. package/skills/ui-ux-pro-max/rubrics/responsive-breakpoints.md +99 -99
  359. package/skills/user-personas/SKILL.md +75 -75
  360. package/skills/user-personas/rubrics/research-methods.md +56 -56
  361. package/skills/user-personas/templates/persona.md +89 -89
  362. package/skills/vercel-react-best-practices/SKILL.md +60 -60
  363. package/skills/vercel-react-best-practices/rubrics/performance.md +82 -82
  364. package/skills/vercel-react-best-practices/rubrics/server-components.md +86 -86
  365. package/skills/vibe.docs/SKILL.md +171 -171
  366. package/skills/vibe.docs/templates/architecture.md +80 -80
  367. package/skills/vibe.docs/templates/readme.md +84 -84
  368. package/skills/vibe.docs/templates/release-notes.md +74 -74
  369. package/skills/vibe.figma/SKILL.md +215 -982
  370. package/skills/vibe.figma/rubrics/extraction-checklist.md +51 -51
  371. package/skills/vibe.figma/templates/component-index.md +126 -126
  372. package/skills/vibe.figma/templates/figma-handoff.md +100 -100
  373. package/skills/vibe.figma/templates/remapped-tree.md +277 -277
  374. package/skills/vibe.figma.convert/SKILL.md +188 -511
  375. package/skills/vibe.figma.convert/rubrics/conversion-rules.md +129 -113
  376. package/skills/vibe.figma.convert/templates/component.md +140 -140
  377. package/skills/vibe.figma.extract/SKILL.md +179 -300
  378. package/skills/vibe.figma.extract/rubrics/image-rules.md +145 -137
  379. package/skills/video-production/SKILL.md +52 -52
  380. package/skills/video-production/rubrics/quality-checklist.md +58 -58
  381. package/skills/video-production/templates/production-plan.md +104 -104
  382. package/vibe/config.json +29 -29
  383. package/vibe/constitution.md +227 -227
  384. package/vibe/rules/principles/communication-guide.md +98 -98
  385. package/vibe/rules/principles/development-philosophy.md +52 -52
  386. package/vibe/rules/principles/quick-start.md +102 -102
  387. package/vibe/rules/quality/bdd-contract-testing.md +393 -393
  388. package/vibe/rules/quality/checklist.md +276 -276
  389. package/vibe/rules/quality/performance.md +236 -236
  390. package/vibe/rules/quality/testing-strategy.md +440 -440
  391. package/vibe/rules/standards/anti-patterns.md +541 -541
  392. package/vibe/rules/standards/code-structure.md +291 -291
  393. package/vibe/rules/standards/complexity-metrics.md +313 -313
  394. package/vibe/rules/standards/git-workflow.md +237 -237
  395. package/vibe/rules/standards/naming-conventions.md +198 -198
  396. package/vibe/rules/standards/security.md +305 -305
  397. package/vibe/rules/writing/document-style.md +74 -74
  398. package/vibe/setup.sh +31 -31
  399. package/vibe/templates/constitution-template.md +252 -252
  400. package/vibe/templates/contract-backend-template.md +526 -526
  401. package/vibe/templates/contract-frontend-template.md +599 -599
  402. package/vibe/templates/feature-template.md +96 -96
  403. package/vibe/templates/spec-template.md +221 -221
  404. package/vibe/ui-ux-data/charts.csv +26 -26
  405. package/vibe/ui-ux-data/colors.csv +97 -97
  406. package/vibe/ui-ux-data/icons.csv +101 -101
  407. package/vibe/ui-ux-data/landing.csv +31 -31
  408. package/vibe/ui-ux-data/products.csv +96 -96
  409. package/vibe/ui-ux-data/react-performance.csv +45 -45
  410. package/vibe/ui-ux-data/stacks/astro.csv +54 -54
  411. package/vibe/ui-ux-data/stacks/flutter.csv +53 -53
  412. package/vibe/ui-ux-data/stacks/html-tailwind.csv +56 -56
  413. package/vibe/ui-ux-data/stacks/jetpack-compose.csv +53 -53
  414. package/vibe/ui-ux-data/stacks/nextjs.csv +53 -53
  415. package/vibe/ui-ux-data/stacks/nuxt-ui.csv +51 -51
  416. package/vibe/ui-ux-data/stacks/nuxtjs.csv +59 -59
  417. package/vibe/ui-ux-data/stacks/react-native.csv +52 -52
  418. package/vibe/ui-ux-data/stacks/react.csv +54 -54
  419. package/vibe/ui-ux-data/stacks/shadcn.csv +61 -61
  420. package/vibe/ui-ux-data/stacks/svelte.csv +54 -54
  421. package/vibe/ui-ux-data/stacks/swiftui.csv +51 -51
  422. package/vibe/ui-ux-data/stacks/vue.csv +50 -50
  423. package/vibe/ui-ux-data/styles.csv +68 -68
  424. package/vibe/ui-ux-data/typography.csv +57 -57
  425. package/vibe/ui-ux-data/ui-reasoning.csv +101 -101
  426. package/vibe/ui-ux-data/ux-guidelines.csv +99 -99
  427. package/vibe/ui-ux-data/version.json +31 -31
  428. package/vibe/ui-ux-data/web-interface.csv +31 -31
@@ -1,416 +1,416 @@
1
- # 🚀 TypeScript + Astro Quality Rules
2
-
3
- ## Core Principles (inherited from core)
4
-
5
- ```markdown
6
- ✅ Single Responsibility (SRP)
7
- ✅ Don't Repeat Yourself (DRY)
8
- ✅ Reusability
9
- ✅ Low Complexity
10
- ✅ Functions ≤ 30 lines
11
- ✅ Nesting ≤ 3 levels
12
- ✅ Cyclomatic complexity ≤ 10
13
- ```
14
-
15
- ## Astro Architecture
16
-
17
- ```
18
- ┌─────────────────────────────────────────────┐
19
- │ .astro Components (Server-first) │
20
- │ - Zero JS by default │
21
- │ - HTML + CSS + optional JS │
22
- ├─────────────────────────────────────────────┤
23
- │ Islands (Interactive Components) │
24
- │ - React, Vue, Svelte, Solid │
25
- │ - Hydration on demand │
26
- ├─────────────────────────────────────────────┤
27
- │ Content Collections (Type-safe content) │
28
- │ - Markdown, MDX │
29
- │ - Schema validation │
30
- └─────────────────────────────────────────────┘
31
- ```
32
-
33
- ## Astro Component Patterns
34
-
35
- ### 1. Basic Component Structure
36
-
37
- ```astro
38
- ---
39
- // Component Script (Server-side TypeScript)
40
- interface Props {
41
- title: string;
42
- description?: string;
43
- tags?: string[];
44
- }
45
-
46
- const { title, description, tags = [] } = Astro.props;
47
-
48
- // Server-side data fetching
49
- const posts = await fetch('https://api.example.com/posts').then(r => r.json());
50
- ---
51
-
52
- <!-- Component Template -->
53
- <article class="card">
54
- <h2>{title}</h2>
55
- {description && <p>{description}</p>}
56
-
57
- {tags.length > 0 && (
58
- <ul class="tags">
59
- {tags.map(tag => <li>{tag}</li>)}
60
- </ul>
61
- )}
62
- </article>
63
-
64
- <style>
65
- /* Scoped styles by default */
66
- .card {
67
- padding: 1rem;
68
- border: 1px solid #ccc;
69
- border-radius: 8px;
70
- }
71
-
72
- .tags {
73
- display: flex;
74
- gap: 0.5rem;
75
- list-style: none;
76
- padding: 0;
77
- }
78
- </style>
79
- ```
80
-
81
- ### 2. Slots and Named Slots
82
-
83
- ```astro
84
- ---
85
- // Layout.astro
86
- interface Props {
87
- title: string;
88
- }
89
-
90
- const { title } = Astro.props;
91
- ---
92
-
93
- <!DOCTYPE html>
94
- <html>
95
- <head>
96
- <title>{title}</title>
97
- <slot name="head" />
98
- </head>
99
- <body>
100
- <header>
101
- <slot name="header">
102
- <h1>{title}</h1>
103
- </slot>
104
- </header>
105
-
106
- <main>
107
- <slot /> <!-- Default slot -->
108
- </main>
109
-
110
- <footer>
111
- <slot name="footer">
112
- <p>© 2024</p>
113
- </slot>
114
- </footer>
115
- </body>
116
- </html>
117
-
118
- <!-- Usage -->
119
- ---
120
- import Layout from '../layouts/Layout.astro';
121
- ---
122
-
123
- <Layout title="Home">
124
- <Fragment slot="header">
125
- <nav>...</nav>
126
- </Fragment>
127
-
128
- <p>Main content goes here</p>
129
-
130
- <p slot="footer">Custom footer</p>
131
- </Layout>
132
- ```
133
-
134
- ### 3. Content Collections
135
-
136
- ```typescript
137
- // src/content/config.ts
138
- import { defineCollection, z } from 'astro:content';
139
-
140
- const blogCollection = defineCollection({
141
- type: 'content',
142
- schema: z.object({
143
- title: z.string(),
144
- description: z.string(),
145
- pubDate: z.coerce.date(),
146
- author: z.string().default('Anonymous'),
147
- tags: z.array(z.string()).default([]),
148
- image: z.string().optional(),
149
- draft: z.boolean().default(false),
150
- }),
151
- });
152
-
153
- const authorsCollection = defineCollection({
154
- type: 'data',
155
- schema: z.object({
156
- name: z.string(),
157
- email: z.string().email(),
158
- avatar: z.string().url(),
159
- }),
160
- });
161
-
162
- export const collections = {
163
- blog: blogCollection,
164
- authors: authorsCollection,
165
- };
166
- ```
167
-
168
- ```astro
169
- ---
170
- // src/pages/blog/[...slug].astro
171
- import { getCollection, getEntry } from 'astro:content';
172
- import Layout from '../../layouts/Layout.astro';
173
-
174
- export async function getStaticPaths() {
175
- const posts = await getCollection('blog', ({ data }) => !data.draft);
176
-
177
- return posts.map(post => ({
178
- params: { slug: post.slug },
179
- props: { post },
180
- }));
181
- }
182
-
183
- const { post } = Astro.props;
184
- const { Content, headings } = await post.render();
185
- ---
186
-
187
- <Layout title={post.data.title}>
188
- <article>
189
- <h1>{post.data.title}</h1>
190
- <time datetime={post.data.pubDate.toISOString()}>
191
- {post.data.pubDate.toLocaleDateString()}
192
- </time>
193
- <Content />
194
- </article>
195
- </Layout>
196
- ```
197
-
198
- ### 4. Islands (Client Interactivity)
199
-
200
- ```astro
201
- ---
202
- // Using React component
203
- import Counter from '../components/Counter.tsx';
204
- import SearchBar from '../components/SearchBar.tsx';
205
- import Newsletter from '../components/Newsletter.tsx';
206
- import Comments from '../components/Comments.tsx';
207
- ---
208
-
209
- <!-- No JS - static HTML -->
210
- <h1>My Page</h1>
211
-
212
- <!-- Hydrate on page load -->
213
- <Counter client:load initialCount={0} />
214
-
215
- <!-- Hydrate when visible in viewport -->
216
- <Comments client:visible postId="123" />
217
-
218
- <!-- Hydrate on idle (requestIdleCallback) -->
219
- <Newsletter client:idle />
220
-
221
- <!-- Hydrate on media query match -->
222
- <SearchBar client:media="(min-width: 768px)" />
223
-
224
- <!-- Never hydrate - just render HTML -->
225
- <StaticComponent />
226
- ```
227
-
228
- ### 5. API Routes
229
-
230
- ```typescript
231
- // src/pages/api/posts.ts
232
- import type { APIRoute } from 'astro';
233
-
234
- export const GET: APIRoute = async ({ request, url }) => {
235
- const page = Number(url.searchParams.get('page') ?? '1');
236
- const limit = Number(url.searchParams.get('limit') ?? '10');
237
-
238
- const posts = await db.post.findMany({
239
- skip: (page - 1) * limit,
240
- take: limit,
241
- });
242
-
243
- return new Response(JSON.stringify(posts), {
244
- status: 200,
245
- headers: { 'Content-Type': 'application/json' },
246
- });
247
- };
248
-
249
- export const POST: APIRoute = async ({ request }) => {
250
- try {
251
- const body = await request.json();
252
-
253
- if (!body.title) {
254
- return new Response(JSON.stringify({ error: 'Title is required' }), {
255
- status: 400,
256
- headers: { 'Content-Type': 'application/json' },
257
- });
258
- }
259
-
260
- const post = await db.post.create({ data: body });
261
-
262
- return new Response(JSON.stringify(post), {
263
- status: 201,
264
- headers: { 'Content-Type': 'application/json' },
265
- });
266
- } catch (error) {
267
- return new Response(JSON.stringify({ error: 'Server error' }), {
268
- status: 500,
269
- headers: { 'Content-Type': 'application/json' },
270
- });
271
- }
272
- };
273
- ```
274
-
275
- ### 6. Middleware
276
-
277
- ```typescript
278
- // src/middleware.ts
279
- import { defineMiddleware, sequence } from 'astro:middleware';
280
-
281
- const auth = defineMiddleware(async ({ locals, request, redirect }, next) => {
282
- const token = request.headers.get('Authorization')?.replace('Bearer ', '');
283
-
284
- if (token) {
285
- const user = await validateToken(token);
286
- if (user) {
287
- locals.user = user;
288
- }
289
- }
290
-
291
- // Protected routes
292
- if (request.url.includes('/admin') && !locals.user?.isAdmin) {
293
- return redirect('/login');
294
- }
295
-
296
- return next();
297
- });
298
-
299
- const logger = defineMiddleware(async ({ request }, next) => {
300
- console.log(`${request.method} ${request.url}`);
301
- const response = await next();
302
- console.log(`Response: ${response.status}`);
303
- return response;
304
- });
305
-
306
- export const onRequest = sequence(logger, auth);
307
- ```
308
-
309
- ### 7. View Transitions
310
-
311
- ```astro
312
- ---
313
- // Layout.astro
314
- import { ViewTransitions } from 'astro:transitions';
315
- ---
316
-
317
- <html>
318
- <head>
319
- <ViewTransitions />
320
- </head>
321
- <body>
322
- <header transition:persist>
323
- <nav>...</nav>
324
- </header>
325
-
326
- <main transition:animate="slide">
327
- <slot />
328
- </main>
329
- </body>
330
- </html>
331
-
332
- <!-- Custom animation -->
333
- <div transition:animate={{
334
- old: {
335
- name: 'fadeOut',
336
- duration: '0.2s',
337
- easing: 'ease-out',
338
- },
339
- new: {
340
- name: 'fadeIn',
341
- duration: '0.3s',
342
- easing: 'ease-in',
343
- },
344
- }}>
345
- Content
346
- </div>
347
- ```
348
-
349
- ### 8. Environment Variables
350
-
351
- ```typescript
352
- // astro.config.mjs
353
- export default defineConfig({
354
- vite: {
355
- define: {
356
- 'import.meta.env.PUBLIC_API_URL': JSON.stringify(process.env.PUBLIC_API_URL),
357
- },
358
- },
359
- });
360
-
361
- // Usage in .astro files
362
- ---
363
- const apiUrl = import.meta.env.PUBLIC_API_URL; // Client-safe
364
- const dbUrl = import.meta.env.DATABASE_URL; // Server-only
365
- ---
366
-
367
- // Type declarations (env.d.ts)
368
- /// <reference types="astro/client" />
369
- interface ImportMetaEnv {
370
- readonly DATABASE_URL: string;
371
- readonly PUBLIC_API_URL: string;
372
- }
373
- ```
374
-
375
- ## Project Structure
376
-
377
- ```
378
- src/
379
- ├── components/
380
- │ ├── Card.astro
381
- │ ├── Header.astro
382
- │ └── islands/ # Interactive components
383
- │ ├── Counter.tsx
384
- │ └── Search.svelte
385
- ├── content/
386
- │ ├── config.ts # Collection schemas
387
- │ └── blog/
388
- │ ├── post-1.md
389
- │ └── post-2.mdx
390
- ├── layouts/
391
- │ ├── Layout.astro
392
- │ └── BlogPost.astro
393
- ├── pages/
394
- │ ├── index.astro
395
- │ ├── blog/
396
- │ │ ├── index.astro
397
- │ │ └── [...slug].astro
398
- │ └── api/
399
- │ └── posts.ts
400
- ├── styles/
401
- │ └── global.css
402
- └── middleware.ts
403
- ```
404
-
405
- ## Checklist
406
-
407
- - [ ] Use `.astro` for static content
408
- - [ ] Use Islands only where needed (client:*)
409
- - [ ] Define Content Collections with schemas
410
- - [ ] Use TypeScript for type safety
411
- - [ ] Scope styles by default
412
- - [ ] Use slots for composition
413
- - [ ] Implement proper error handling
414
- - [ ] Use middleware for auth/logging
415
- - [ ] Enable View Transitions for SPA-like navigation
416
- - [ ] Optimize images with astro:assets
1
+ # 🚀 TypeScript + Astro Quality Rules
2
+
3
+ ## Core Principles (inherited from core)
4
+
5
+ ```markdown
6
+ ✅ Single Responsibility (SRP)
7
+ ✅ Don't Repeat Yourself (DRY)
8
+ ✅ Reusability
9
+ ✅ Low Complexity
10
+ ✅ Functions ≤ 30 lines
11
+ ✅ Nesting ≤ 3 levels
12
+ ✅ Cyclomatic complexity ≤ 10
13
+ ```
14
+
15
+ ## Astro Architecture
16
+
17
+ ```
18
+ ┌─────────────────────────────────────────────┐
19
+ │ .astro Components (Server-first) │
20
+ │ - Zero JS by default │
21
+ │ - HTML + CSS + optional JS │
22
+ ├─────────────────────────────────────────────┤
23
+ │ Islands (Interactive Components) │
24
+ │ - React, Vue, Svelte, Solid │
25
+ │ - Hydration on demand │
26
+ ├─────────────────────────────────────────────┤
27
+ │ Content Collections (Type-safe content) │
28
+ │ - Markdown, MDX │
29
+ │ - Schema validation │
30
+ └─────────────────────────────────────────────┘
31
+ ```
32
+
33
+ ## Astro Component Patterns
34
+
35
+ ### 1. Basic Component Structure
36
+
37
+ ```astro
38
+ ---
39
+ // Component Script (Server-side TypeScript)
40
+ interface Props {
41
+ title: string;
42
+ description?: string;
43
+ tags?: string[];
44
+ }
45
+
46
+ const { title, description, tags = [] } = Astro.props;
47
+
48
+ // Server-side data fetching
49
+ const posts = await fetch('https://api.example.com/posts').then(r => r.json());
50
+ ---
51
+
52
+ <!-- Component Template -->
53
+ <article class="card">
54
+ <h2>{title}</h2>
55
+ {description && <p>{description}</p>}
56
+
57
+ {tags.length > 0 && (
58
+ <ul class="tags">
59
+ {tags.map(tag => <li>{tag}</li>)}
60
+ </ul>
61
+ )}
62
+ </article>
63
+
64
+ <style>
65
+ /* Scoped styles by default */
66
+ .card {
67
+ padding: 1rem;
68
+ border: 1px solid #ccc;
69
+ border-radius: 8px;
70
+ }
71
+
72
+ .tags {
73
+ display: flex;
74
+ gap: 0.5rem;
75
+ list-style: none;
76
+ padding: 0;
77
+ }
78
+ </style>
79
+ ```
80
+
81
+ ### 2. Slots and Named Slots
82
+
83
+ ```astro
84
+ ---
85
+ // Layout.astro
86
+ interface Props {
87
+ title: string;
88
+ }
89
+
90
+ const { title } = Astro.props;
91
+ ---
92
+
93
+ <!DOCTYPE html>
94
+ <html>
95
+ <head>
96
+ <title>{title}</title>
97
+ <slot name="head" />
98
+ </head>
99
+ <body>
100
+ <header>
101
+ <slot name="header">
102
+ <h1>{title}</h1>
103
+ </slot>
104
+ </header>
105
+
106
+ <main>
107
+ <slot /> <!-- Default slot -->
108
+ </main>
109
+
110
+ <footer>
111
+ <slot name="footer">
112
+ <p>© 2024</p>
113
+ </slot>
114
+ </footer>
115
+ </body>
116
+ </html>
117
+
118
+ <!-- Usage -->
119
+ ---
120
+ import Layout from '../layouts/Layout.astro';
121
+ ---
122
+
123
+ <Layout title="Home">
124
+ <Fragment slot="header">
125
+ <nav>...</nav>
126
+ </Fragment>
127
+
128
+ <p>Main content goes here</p>
129
+
130
+ <p slot="footer">Custom footer</p>
131
+ </Layout>
132
+ ```
133
+
134
+ ### 3. Content Collections
135
+
136
+ ```typescript
137
+ // src/content/config.ts
138
+ import { defineCollection, z } from 'astro:content';
139
+
140
+ const blogCollection = defineCollection({
141
+ type: 'content',
142
+ schema: z.object({
143
+ title: z.string(),
144
+ description: z.string(),
145
+ pubDate: z.coerce.date(),
146
+ author: z.string().default('Anonymous'),
147
+ tags: z.array(z.string()).default([]),
148
+ image: z.string().optional(),
149
+ draft: z.boolean().default(false),
150
+ }),
151
+ });
152
+
153
+ const authorsCollection = defineCollection({
154
+ type: 'data',
155
+ schema: z.object({
156
+ name: z.string(),
157
+ email: z.string().email(),
158
+ avatar: z.string().url(),
159
+ }),
160
+ });
161
+
162
+ export const collections = {
163
+ blog: blogCollection,
164
+ authors: authorsCollection,
165
+ };
166
+ ```
167
+
168
+ ```astro
169
+ ---
170
+ // src/pages/blog/[...slug].astro
171
+ import { getCollection, getEntry } from 'astro:content';
172
+ import Layout from '../../layouts/Layout.astro';
173
+
174
+ export async function getStaticPaths() {
175
+ const posts = await getCollection('blog', ({ data }) => !data.draft);
176
+
177
+ return posts.map(post => ({
178
+ params: { slug: post.slug },
179
+ props: { post },
180
+ }));
181
+ }
182
+
183
+ const { post } = Astro.props;
184
+ const { Content, headings } = await post.render();
185
+ ---
186
+
187
+ <Layout title={post.data.title}>
188
+ <article>
189
+ <h1>{post.data.title}</h1>
190
+ <time datetime={post.data.pubDate.toISOString()}>
191
+ {post.data.pubDate.toLocaleDateString()}
192
+ </time>
193
+ <Content />
194
+ </article>
195
+ </Layout>
196
+ ```
197
+
198
+ ### 4. Islands (Client Interactivity)
199
+
200
+ ```astro
201
+ ---
202
+ // Using React component
203
+ import Counter from '../components/Counter.tsx';
204
+ import SearchBar from '../components/SearchBar.tsx';
205
+ import Newsletter from '../components/Newsletter.tsx';
206
+ import Comments from '../components/Comments.tsx';
207
+ ---
208
+
209
+ <!-- No JS - static HTML -->
210
+ <h1>My Page</h1>
211
+
212
+ <!-- Hydrate on page load -->
213
+ <Counter client:load initialCount={0} />
214
+
215
+ <!-- Hydrate when visible in viewport -->
216
+ <Comments client:visible postId="123" />
217
+
218
+ <!-- Hydrate on idle (requestIdleCallback) -->
219
+ <Newsletter client:idle />
220
+
221
+ <!-- Hydrate on media query match -->
222
+ <SearchBar client:media="(min-width: 768px)" />
223
+
224
+ <!-- Never hydrate - just render HTML -->
225
+ <StaticComponent />
226
+ ```
227
+
228
+ ### 5. API Routes
229
+
230
+ ```typescript
231
+ // src/pages/api/posts.ts
232
+ import type { APIRoute } from 'astro';
233
+
234
+ export const GET: APIRoute = async ({ request, url }) => {
235
+ const page = Number(url.searchParams.get('page') ?? '1');
236
+ const limit = Number(url.searchParams.get('limit') ?? '10');
237
+
238
+ const posts = await db.post.findMany({
239
+ skip: (page - 1) * limit,
240
+ take: limit,
241
+ });
242
+
243
+ return new Response(JSON.stringify(posts), {
244
+ status: 200,
245
+ headers: { 'Content-Type': 'application/json' },
246
+ });
247
+ };
248
+
249
+ export const POST: APIRoute = async ({ request }) => {
250
+ try {
251
+ const body = await request.json();
252
+
253
+ if (!body.title) {
254
+ return new Response(JSON.stringify({ error: 'Title is required' }), {
255
+ status: 400,
256
+ headers: { 'Content-Type': 'application/json' },
257
+ });
258
+ }
259
+
260
+ const post = await db.post.create({ data: body });
261
+
262
+ return new Response(JSON.stringify(post), {
263
+ status: 201,
264
+ headers: { 'Content-Type': 'application/json' },
265
+ });
266
+ } catch (error) {
267
+ return new Response(JSON.stringify({ error: 'Server error' }), {
268
+ status: 500,
269
+ headers: { 'Content-Type': 'application/json' },
270
+ });
271
+ }
272
+ };
273
+ ```
274
+
275
+ ### 6. Middleware
276
+
277
+ ```typescript
278
+ // src/middleware.ts
279
+ import { defineMiddleware, sequence } from 'astro:middleware';
280
+
281
+ const auth = defineMiddleware(async ({ locals, request, redirect }, next) => {
282
+ const token = request.headers.get('Authorization')?.replace('Bearer ', '');
283
+
284
+ if (token) {
285
+ const user = await validateToken(token);
286
+ if (user) {
287
+ locals.user = user;
288
+ }
289
+ }
290
+
291
+ // Protected routes
292
+ if (request.url.includes('/admin') && !locals.user?.isAdmin) {
293
+ return redirect('/login');
294
+ }
295
+
296
+ return next();
297
+ });
298
+
299
+ const logger = defineMiddleware(async ({ request }, next) => {
300
+ console.log(`${request.method} ${request.url}`);
301
+ const response = await next();
302
+ console.log(`Response: ${response.status}`);
303
+ return response;
304
+ });
305
+
306
+ export const onRequest = sequence(logger, auth);
307
+ ```
308
+
309
+ ### 7. View Transitions
310
+
311
+ ```astro
312
+ ---
313
+ // Layout.astro
314
+ import { ViewTransitions } from 'astro:transitions';
315
+ ---
316
+
317
+ <html>
318
+ <head>
319
+ <ViewTransitions />
320
+ </head>
321
+ <body>
322
+ <header transition:persist>
323
+ <nav>...</nav>
324
+ </header>
325
+
326
+ <main transition:animate="slide">
327
+ <slot />
328
+ </main>
329
+ </body>
330
+ </html>
331
+
332
+ <!-- Custom animation -->
333
+ <div transition:animate={{
334
+ old: {
335
+ name: 'fadeOut',
336
+ duration: '0.2s',
337
+ easing: 'ease-out',
338
+ },
339
+ new: {
340
+ name: 'fadeIn',
341
+ duration: '0.3s',
342
+ easing: 'ease-in',
343
+ },
344
+ }}>
345
+ Content
346
+ </div>
347
+ ```
348
+
349
+ ### 8. Environment Variables
350
+
351
+ ```typescript
352
+ // astro.config.mjs
353
+ export default defineConfig({
354
+ vite: {
355
+ define: {
356
+ 'import.meta.env.PUBLIC_API_URL': JSON.stringify(process.env.PUBLIC_API_URL),
357
+ },
358
+ },
359
+ });
360
+
361
+ // Usage in .astro files
362
+ ---
363
+ const apiUrl = import.meta.env.PUBLIC_API_URL; // Client-safe
364
+ const dbUrl = import.meta.env.DATABASE_URL; // Server-only
365
+ ---
366
+
367
+ // Type declarations (env.d.ts)
368
+ /// <reference types="astro/client" />
369
+ interface ImportMetaEnv {
370
+ readonly DATABASE_URL: string;
371
+ readonly PUBLIC_API_URL: string;
372
+ }
373
+ ```
374
+
375
+ ## Project Structure
376
+
377
+ ```
378
+ src/
379
+ ├── components/
380
+ │ ├── Card.astro
381
+ │ ├── Header.astro
382
+ │ └── islands/ # Interactive components
383
+ │ ├── Counter.tsx
384
+ │ └── Search.svelte
385
+ ├── content/
386
+ │ ├── config.ts # Collection schemas
387
+ │ └── blog/
388
+ │ ├── post-1.md
389
+ │ └── post-2.mdx
390
+ ├── layouts/
391
+ │ ├── Layout.astro
392
+ │ └── BlogPost.astro
393
+ ├── pages/
394
+ │ ├── index.astro
395
+ │ ├── blog/
396
+ │ │ ├── index.astro
397
+ │ │ └── [...slug].astro
398
+ │ └── api/
399
+ │ └── posts.ts
400
+ ├── styles/
401
+ │ └── global.css
402
+ └── middleware.ts
403
+ ```
404
+
405
+ ## Checklist
406
+
407
+ - [ ] Use `.astro` for static content
408
+ - [ ] Use Islands only where needed (client:*)
409
+ - [ ] Define Content Collections with schemas
410
+ - [ ] Use TypeScript for type safety
411
+ - [ ] Scope styles by default
412
+ - [ ] Use slots for composition
413
+ - [ ] Implement proper error handling
414
+ - [ ] Use middleware for auth/logging
415
+ - [ ] Enable View Transitions for SPA-like navigation
416
+ - [ ] Optimize images with astro:assets