generate-workflow-diagram
정보
이 스킬은 주석 처리된 워크플로우 데이터에서 Mermaid 플로우차트 다이어그램을 생성합니다. 테마 선택, 다양한 출력 형식, 문서 내장 옵션을 제공합니다. 소스 변경 후 또는 다양한 대상에 맞게 시각 자료를 조정할 때 시각적 워크플로우 다이어그램을 생성하거나 업데이트하는 데 사용하세요.
빠른 설치
Claude Code
추천npx skills add pjt222/agent-almanac -a claude-code/plugin add https://github.com/pjt222/agent-almanacgit clone https://github.com/pjt222/agent-almanac.git ~/.claude/skills/generate-workflow-diagramClaude Code에서 이 명령을 복사하여 붙여넣어 스킬을 설치하세요
문서
生工作流圖
由 putior 工作流數據生題 Mermaid 流程圖並嵌文檔。
用
- 源檔標註後欲出視覺圖
- 工作流變後重生圖
- 為不同受眾換題或出格式
- 嵌工作流圖於 README、Quarto、R Markdown
入
- 必:工作流數據(由
put()、put_auto()、put_merge()) - 可:題名(默
"light";選:light、dark、auto、minimal、github、viridis、magma、plasma、cividis) - 可:出目標:控台、檔徑、剪貼、原串
- 可:交互:
show_source_info、enable_clicks
行
一:取工作流數據
由三源之一取工作流數據。
library(putior)
# From manual annotations
workflow <- put("./src/")
# From manual annotations, excluding specific files
workflow <- put("./src/", exclude = c("build-workflow\\.R$", "test_"))
# From auto-detection only
workflow <- put_auto("./src/")
# From merged (manual + auto)
workflow <- put_merge("./src/", merge_strategy = "supplement")
工作流數據幀或含來自標註之 node_type 列。節點型控 Mermaid 形:
node_type | Mermaid Shape | Use Case |
|---|---|---|
"input" | Stadium ([...]) | Data sources, configuration files |
"output" | Subroutine [[...]] | Generated artifacts, reports |
"process" | Rectangle [...] | Processing steps (default) |
"decision" | Diamond {...} | Conditional logic, branching |
"start" / "end" | Stadium ([...]) | Entry/terminal nodes |
各 node_type 亦得相應 CSS 類(如 class nodeId input;)供題化。
得:數據幀至少一列,含 id、label,可選 input、output、source_file、node_type 列。
敗:數據幀空→無標註或模式。先行 analyze-codebase-workflow,或驗標註合語法用 put("./src/", validate = TRUE)。
二:擇題與選項
依目標受眾擇題。
# List all available themes
get_diagram_themes()
# Standard themes
# "light" — Default, bright colors
# "dark" — For dark mode environments
# "auto" — GitHub-adaptive with solid colors
# "minimal" — Grayscale, print-friendly
# "github" — Optimized for GitHub README files
# Colorblind-safe themes (viridis family)
# "viridis" — Purple→Blue→Green→Yellow, general accessibility
# "magma" — Purple→Red→Yellow, high contrast for print
# "plasma" — Purple→Pink→Orange→Yellow, presentations
# "cividis" — Blue→Gray→Yellow, maximum accessibility (no red-green)
他參:
direction:圖向——"TD"(上下,默)、"LR"(左右)、"RL"、"BT"show_artifacts:TRUE/FALSE——示物件節點(檔、數據);大工作流或噪(如 16+ 額外節點)show_workflow_boundaries:TRUE/FALSE——各源檔節點裹入 Mermaid 子圖source_info_style:源檔訊於節點顯示法(如副題)node_labels:節點標籤文格式
得:題名印出。依脈絡擇一。
敗:題名未識→put_diagram() 回退 "light"。察拼法。
三:用 put_theme() 自定調色(可選)
九內建題不合→以 put_theme() 造自定題。
# Create custom palette — unspecified types inherit from base theme
cyberpunk <- put_theme(
base = "dark",
input = c(fill = "#1a1a2e", stroke = "#00ff88", color = "#00ff88"),
process = c(fill = "#16213e", stroke = "#44ddff", color = "#44ddff"),
output = c(fill = "#0f3460", stroke = "#ff3366", color = "#ff3366"),
decision = c(fill = "#1a1a2e", stroke = "#ffaa33", color = "#ffaa33")
)
# Use the palette parameter (overrides theme when provided)
mermaid_content <- put_diagram(workflow, palette = cyberpunk, output = "raw")
writeLines(mermaid_content, "workflow.mmd")
put_theme() 受 input、process、output、decision、artifact、start、end 節點型。各取命名向量 c(fill = "#hex", stroke = "#hex", color = "#hex")。未設型承基題。
得:Mermaid 出具自定 classDef 行。node_type 之形保,僅色變。諸節點型用 stroke-width:2px——put_theme() 當前未支援覆寫。
敗:調色非 putior_theme 類→put_diagram() 發明誤。確傳 put_theme() 返值,非原列。
**回退——手動 classDef 替換:**欲 put_theme() 外之細控(如各型畫筆寬),用基題生後手換 classDef:
mermaid_content <- put_diagram(workflow, theme = "dark", output = "raw")
lines <- strsplit(mermaid_content, "\n")[[1]]
lines <- lines[!grepl("^\\s*classDef ", lines)]
custom_defs <- c(" classDef input fill:#1a1a2e,stroke:#00ff88,stroke-width:3px,color:#00ff88")
mermaid_content <- paste(c(lines, custom_defs), collapse = "\n")
四:生 Mermaid 出
按所需出模生圖。
# Print to console (default)
cat(put_diagram(workflow, theme = "github"))
# Save to file
writeLines(put_diagram(workflow, theme = "github"), "docs/workflow.md")
# Get raw string for embedding
mermaid_code <- put_diagram(workflow, output = "raw", theme = "github")
# With source file info (shows which file each node comes from)
cat(put_diagram(workflow, theme = "github", show_source_info = TRUE))
# With clickable nodes (for VS Code, RStudio, or file:// protocol)
cat(put_diagram(workflow,
theme = "github",
enable_clicks = TRUE,
click_protocol = "vscode" # or "rstudio", "file"
))
# Full-featured
cat(put_diagram(workflow,
theme = "viridis",
show_source_info = TRUE,
enable_clicks = TRUE,
click_protocol = "vscode"
))
得:有效 Mermaid 碼以 flowchart TD(或依向為 LR)開。諸節點以箭頭連示數據流。
敗:出為 flowchart TD 無節點→數據幀空。連缺→察諸節點間出檔名符入檔名。
五:嵌目標文檔
將圖插入適文檔格式。
GitHub README(```mermaid 碼欄):
## Workflow
```mermaid
flowchart TD
A["Extract Data"] --> B["Transform"]
B --> C["Load"]
```
Quarto 文(原生 mermaid 塊經 knit_child):
# Chunk 1: Generate code (visible, foldable)
workflow <- put("./src/")
mermaid_code <- put_diagram(workflow, output = "raw", theme = "github")
# Chunk 2: Output as native mermaid chunk (hidden)
#| output: asis
#| echo: false
mermaid_chunk <- paste0("```{mermaid}\n", mermaid_code, "\n```")
cat(knitr::knit_child(text = mermaid_chunk, quiet = TRUE))
R Markdown(mermaid.js CDN 或 DiagrammeR):
DiagrammeR::mermaid(put_diagram(workflow, output = "raw"))
得:圖於目標格式正確繪。GitHub 原生繪 mermaid 碼欄。
敗:GitHub 不繪→確碼欄用精確 ```mermaid(無額屬性)。Quarto→用 knit_child() 法;{mermaid} 塊不支援變量插值。
驗
-
put_diagram()生有效 Mermaid(以flowchart開) - 諸預期節點皆現於圖
- 連節點間之數據流連(箭頭)具
- 所選題已應(察出之 init 塊含題特色)
- 圖於目標格式(GitHub、Quarto 等)正確繪
忌
- 空圖:常因
put()返無列。察標註存且合語法 - 諸節點皆斷:出檔名須精確符入檔名(含副檔)供 putior 連。
data.csv與Data.csv異 - 題於 GitHub 不顯:GitHub 之 mermaid 繪器題支援有限。
"github"題專設。%%{init:...}%%題塊或被部分繪器忽 - Quarto mermaid 變量插值:Quarto 之
{mermaid}塊不直支 R 變量。用步五之knit_child()法 - 可點節點不作:點指令需支 Mermaid 交互事件之繪器。GitHub 靜繪器不支點。用本機 Mermaid 繪器或 putior Shiny 沙盒
- 自參元管線檔:掃含生圖建腳本之目錄→子圖 ID 重並 Mermaid 誤。用
exclude於掃時略:workflow <- put("./src/", exclude = c("build-workflow\\.R$", "build-workflow\\.js$")) show_artifacts = TRUE過噪:大項目或生眾物件節點(10-20+),亂圖。用show_artifacts = FALSE並倚node_type標註顯標關鍵入出
參
annotate-source-filesanalyze-codebase-workflowsetup-putior-cicreate-quarto-reportbuild-pkgdown-site
GitHub 저장소
연관 스킬
content-collections
메타이 스킬은 콘텐츠 콜렉션(Content Collections)을 위한 프로덕션 검증된 설정을 제공합니다. 콘텐츠 콜렉션은 Markdown/MDX 파일을 Zod 검증이 포함된 타입 안전한 데이터 콜렉션으로 변환해주는 TypeScript 최우선 도구입니다. 블로그, 문서 사이트 또는 콘텐츠 중심의 Vite + React 애플리케이션을 구축할 때 타입 안전성과 자동 콘텐츠 검증을 보장하기 위해 사용하세요. Vite 플러그인 구성과 MDX 컴파일부터 배포 최적화 및 스키마 검증에 이르기까지 모든 것을 다룹니다.
polymarket
메타이 스킬은 개발자들이 Polymarket 예측 시장 플랫폼을 활용한 애플리케이션을 구축할 수 있도록 지원하며, 거래 및 시장 데이터를 위한 API 통합 기능을 포함합니다. 또한 WebSocket을 통한 실시간 데이터 스트리밍을 제공하여 실시간 거래와 시장 활동을 모니터링할 수 있습니다. 이를 통해 거래 전략을 구현하거나 실시간 시장 업데이트를 처리하는 도구를 생성하는 데 활용할 수 있습니다.
creating-opencode-plugins
메타이 스킬은 개발자들이 명령어, 파일, LSP 작업 등 25개 이상의 이벤트 유형에 연결되는 OpenCode 플러그인을 만들 수 있도록 돕습니다. JavaScript/TypeScript 모듈을 위한 플러그인 구조, 이벤트 API 명세, 구현 패턴을 제공합니다. OpenCode AI 어시스턴트의 라이프사이클을 사용자 정의 이벤트 기반 로직으로 가로채거나, 모니터링하거나, 확장해야 할 때 사용하세요.
sglang
메타SGLang은 RadixAttention 프리픽스 캐싱을 활용하여 JSON, 정규식, 에이전트 워크플로우를 위한 고속 구조화 생성에 특화된 고성능 LLM 서빙 프레임워크입니다. 특히 반복되는 프리픽스가 있는 작업에서 상당히 빠른 추론 속도를 제공하여 복잡한 구조화 출력 및 다중 턴 대화에 이상적입니다. 제약 디코딩이 필요하거나 광범위한 프리픽스 공유가 있는 애플리케이션을 구축할 때는 vLLM과 같은 대안보다 SGLang을 선택하십시오.
