|
| 1 | +# Basic Composition Example |
| 2 | + |
| 3 | +This example shows Weave automatically routing between two **Claude Code skills** — a Design System skill and a Backend API skill — based on the meaning of your query. |
| 4 | + |
| 5 | +## What This Demonstrates |
| 6 | + |
| 7 | +When you have multiple skills loaded, Weave selects the right one for each task without you specifying which to use. A design query activates the Design System skill. A backend query activates the Backend API skill. When a task spans both domains, Weave composes both skills together automatically. |
| 8 | + |
| 9 | +This is the simplest Weave use case: one platform, two skills, zero manual routing. |
| 10 | + |
| 11 | +## Directory Structure |
| 12 | + |
| 13 | +``` |
| 14 | +basic-composition/ |
| 15 | +├── weave.yaml ← Weave config: one skill directory, dynamic strategy |
| 16 | +├── skills/ |
| 17 | +│ ├── design_system.md ← Claude Code skill: Design System Engineer |
| 18 | +│ └── backend_api.md ← Claude Code skill: Backend API Engineer |
| 19 | +└── README.md ← This file |
| 20 | +``` |
| 21 | + |
| 22 | +## How to Run |
| 23 | + |
| 24 | +From the repository root: |
| 25 | + |
| 26 | +```bash |
| 27 | +cd examples/basic-composition |
| 28 | + |
| 29 | +# Option A: interactive query mode (recommended) |
| 30 | +weave run --config weave.yaml |
| 31 | + |
| 32 | +# Then type any query at the prompt: |
| 33 | +# weave> design a button component with Tailwind CSS |
| 34 | +# weave> write a REST endpoint for creating a user |
| 35 | +# weave> add accessibility labels to a form |
| 36 | +``` |
| 37 | + |
| 38 | +```bash |
| 39 | +# Option B: one-shot query |
| 40 | +weave load ./skills --platform claude_code |
| 41 | +weave query "design a button component with Tailwind CSS" |
| 42 | + |
| 43 | +# See all loaded skills: |
| 44 | +weave list |
| 45 | + |
| 46 | +# With similarity scores for all skills: |
| 47 | +weave query "write a REST endpoint" --explain |
| 48 | +``` |
| 49 | + |
| 50 | +## Expected Output |
| 51 | + |
| 52 | +``` |
| 53 | +Loaded 2 skill(s) from ./skills (platform: claude_code) |
| 54 | +Session saved to .weave_session.json |
| 55 | +
|
| 56 | +# Design query → Design System skill selected |
| 57 | +$ weave query "design a button component with Tailwind CSS" |
| 58 | +[1] Design System Engineer (claude_code) — score: 0.7214 |
| 59 | + Building and maintaining UI components, design tokens, and accessibility |
| 60 | + standards for a consistent design system using Tailwind CSS and React. |
| 61 | +
|
| 62 | +# Backend query → Backend API skill selected |
| 63 | +$ weave query "write a REST endpoint for creating a user" |
| 64 | +[1] Backend API Engineer (claude_code) — score: 0.6891 |
| 65 | + Designing and implementing RESTful APIs, database schemas, and server-side |
| 66 | + business logic using FastAPI and PostgreSQL. |
| 67 | +``` |
| 68 | + |
| 69 | +## How It Works |
| 70 | + |
| 71 | +1. `weave load ./skills` reads both SKILL.md files and embeds each skill's |
| 72 | + `trigger_context` and `capabilities` using `all-MiniLM-L6-v2` (local, no API key). |
| 73 | +2. At query time, `weave query` embeds the query text and computes cosine similarity |
| 74 | + against every loaded skill's embedding. |
| 75 | +3. The highest-scoring skill is returned. If the top two scores fall within |
| 76 | + `confidence_threshold: 0.1` of each other, both are returned for composition — |
| 77 | + Weave assumes the task spans both domains. |
| 78 | +4. `WeaveComposer` merges the contexts: higher-confidence skill first, |
| 79 | + deduplicated, with a `---` separator before the secondary skill's unique content. |
| 80 | + |
| 81 | +## Extending This Example |
| 82 | + |
| 83 | +- Add a third SKILL.md to `skills/` (e.g. a DevOps skill) — Weave picks it up |
| 84 | + automatically on the next `weave load`. |
| 85 | +- Adjust `confidence_threshold` in `weave.yaml` to control how aggressively |
| 86 | + Weave composes multiple skills per query. |
| 87 | +- Set `explain: true` in the `output` section to see similarity scores for every |
| 88 | + loaded skill on every query. |
| 89 | +- See the **[cross-platform example](../cross-platform/)** to compose skills from |
| 90 | + different AI coding tools (Claude Code + Cursor) together. |
| 91 | +- See **[`../weave.yaml.example`](../weave.yaml.example)** for all available config options. |
| 92 | +- See **[`../../docs/architecture.md`](../../docs/architecture.md)** for a full explanation |
| 93 | + of the composition pipeline. |
0 commit comments