|
1 | 1 | --- |
2 | 2 | name: reactor-recipes |
3 | | -description: "Paste-ready single-file Reactor recipes indexed by intent — list with add/delete/toggle, sidebar navigation between pages, form with validation + submit gating, async fetch with loading/error/data states, themed Win11 card surface. Use a recipe instead of synthesizing from prose: copy, adjust, ship." |
| 3 | +description: "Intent-first map into the Reactor scenario catalogue — list add/delete/toggle, sidebar navigation, validation and submit gating forms, async fetch states, card surfaces, and canvas positioning. Prefer the scenario source under samples/scenarios/ over legacy recipe files." |
4 | 4 | --- |
5 | 5 |
|
6 | 6 | ## How to use this skill |
7 | 7 |
|
8 | | -Each recipe is a complete, compilable single-file program. **Copy the file's body directly into your project**; don't synthesize the pattern from scratch. The recipes use real Reactor APIs only — no pseudocode. |
| 8 | +The primary source is now the **scenario catalogue** under `samples/scenarios/`. Each scenario folder contains a compilable single-file app in `Scenario.cs`; copy the matching scenario and adapt it instead of synthesizing from prose. |
9 | 9 |
|
10 | | -The full recipe content is in `references/<name>.cs`. Read just the recipe(s) that match your intent. |
| 10 | +The old `references/` folder no longer contains the legacy recipe `.cs` files. It only keeps markdown docs such as `references/index.md` and `references/animated-list.md`. |
11 | 11 |
|
12 | | -## Intent → recipe map |
| 12 | +## Intent → scenario map |
13 | 13 |
|
14 | | -| Intent | Recipe | APIs used | |
| 14 | +| Intent | Scenario source | APIs used | |
15 | 15 | |---|---|---| |
16 | | -| Add / remove / toggle items in a list | `references/list-add-delete.cs` | `UseReducer`, `WithKey`, `Command` | |
17 | | -| Animate list insert / move / remove | `references/animated-list.md` | `Animations.Animate`, `AnimationKind`, `IReactorKeyed`, `UseReducedMotion` | |
18 | | -| Sidebar navigation between pages | `references/sidebar-nav.cs` | `UseNavigation`, `NavigationView`, `NavigationHost`, `WithNavigation` | |
19 | | -| Form with validation + submit gating | `references/form-with-validation.cs` | `UseValidationContext`, `FormField`, `Validate.*`, `ShowWhen` | |
20 | | -| Fetch data with loading / error / data states | `references/async-fetch-list.cs` | `UseResource`, `AsyncValue<T>.Match` | |
21 | | -| Themed Win11 card surface | `references/themed-card.cs` | `Theme.*` tokens, `Border`, `FlexColumn`, `.Padding`, `.CornerRadius`, `.WithBorder` | |
22 | | -| Absolute positioning with Canvas | `references/canvas-positioning.cs` | `Canvas`, `.Canvas(left, top)`, `.CenterAt`, shapes | |
| 16 | +| Add / remove / toggle items in a list | `samples/scenarios/lists/list-add-delete-toggle/Scenario.cs` | `UseReducer`, `WithKey`, `Command` | |
| 17 | +| Animate list insert / move / remove | `samples/apps/animated-list-demo/` | `Animations.Animate`, `AnimationKind`, `IReactorKeyed`, `UseReducedMotion` | |
| 18 | +| Sidebar navigation between pages | `samples/scenarios/navigation/sidebar-nav/Scenario.cs` | `UseNavigation`, `NavigationView`, `NavigationHost`, `WithNavigation` | |
| 19 | +| Form with validation + submit gating | `samples/scenarios/forms/form-validation-context/Scenario.cs` and `samples/scenarios/forms/form-submit-gating/Scenario.cs` | `UseValidationContext`, `FormField`, `Validate.*`, `ShowWhen` | |
| 20 | +| Fetch data with loading / error / data states | `samples/scenarios/hooks/async-fetch-list/Scenario.cs` | `UseResource`, `AsyncValue<T>.Match` | |
| 21 | +| Themed Win11 card surface | `samples/scenarios/layout/card-surface/Scenario.cs` | `Theme.*` tokens, `Border`, `FlexColumn`, `.Padding`, `.CornerRadius`, `.WithBorder` | |
| 22 | +| Absolute positioning with Canvas | `samples/scenarios/layout/canvas-positioning/Scenario.cs` | `Canvas`, `.Canvas(left, top)`, `.CenterAt`, shapes | |
23 | 23 |
|
24 | | -See `references/index.md` for the full index. |
| 24 | +See `samples/scenarios/README.md` for the catalogue contract and `samples/scenarios/_generated/scenarios.json` for the generated index. |
25 | 25 |
|
26 | | -## Recipe contract |
| 26 | +## Scenario contract |
27 | 27 |
|
28 | | -A good recipe: |
| 28 | +A good scenario: |
29 | 29 | - Compiles standalone (`dotnet run` works against the file). |
30 | 30 | - Targets one intent — no kitchen-sink demos. |
31 | | -- Stays under ~120 lines including imports and `ReactorApp.Run` shell. |
32 | | -- Uses real Reactor APIs only. |
| 31 | +- Stays concise, with real Reactor APIs only. |
33 | 32 | - Comments only the *non-obvious*. |
34 | 33 |
|
35 | | -## Adapting a recipe |
| 34 | +## Adapting a scenario |
36 | 35 |
|
37 | | -The recipes use `#:package Microsoft.UI.Reactor@0.0.0-local` (selfhost default). Replace the version with whatever you depend on outside the source clone. |
| 36 | +Scenarios use `#:package Microsoft.UI.Reactor@0.0.0-local` (selfhost default). Replace the version with whatever you depend on outside the source clone. |
38 | 37 |
|
39 | | -If you need analyzer coverage (`REACTOR_DSL_001` and friends), promote the recipe to a `.csproj` — single-file `.cs` builds don't load analyzers. See `reactor-getting-started` for the `.csproj` template. |
| 38 | +If you need analyzer coverage (`REACTOR_DSL_001` and friends), promote the scenario to a `.csproj` — single-file `.cs` builds don't load analyzers. See `reactor-getting-started` for the `.csproj` template. |
0 commit comments