Loading skill
Install any skill in seconds. Free to start, no credit card required.
Get Started Free →dotnet/coordinate-components
Share state between components that don't have a direct parent-child parameter relationship, using cascading values, scoped services with change events, or CascadingValueSource via DI. USE WHEN the user needs a CascadingParameter or CascadingValue that works across render mode boundaries, a shopping cart or notification count accessible from multiple pages, a theme or user preference cascaded app-wide, or when components in different parts of the tree must react when shared data changes. Also US
Passed 22 of 22 test cases with the skill, and 19 of 22 without it.
and 3 more in the full report
3 fixed19 passed either way0 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 3 test cases the skill fixed. Same model, same prompt, with and without the skill.
I'm building a Blazor application and need to share active theme configurations across all pages and components, including interactive components nested inside static layouts. When users switch themes, all consuming components need to update immediately without forcing a browser refresh. Could you provide a complete C# and Razor code example demonstrating how to register this shared state globally in startup, trigger update notifications from a toggle component, and consume the state in child components?
| Checked | Without skill | With skill |
|---|---|---|
| Registers the theme state globally using AddCascadingValue with CascadingValueSource in Program.cs | Missed | Passed |
| Consumes the theme state in child components using [CascadingParameter] | Missed | Passed |
| Triggers state updates using NotifyChangedAsync on CascadingValueSource | Missed | Passed |
The instructions your model reads when the skill loads.
Read AGENTS.md at the workspace root to learn the project's conventions before making changes.
| Need | Mechanism | When to use |
|---|---|---|
| Subtree (same render mode) | CascadingValue component | Theme, layout config within a layout |
| App-wide (all render modes) | CascadingValueSource<T> via DI | Current user, feature flags, theme shared globally |
| Mutable shared state within a circuit | Scoped service + Action event | Shopping cart, notification count, selected filters |
For parent→child one level: use [Parameter] / EventCallback (see author-component skill).
For persisting state across prerender→interactive: see support-prerendering skill.
CascadingValueSource<T> (Step 4)Program.cs with AddCascadingValue(...) and isFixed: false[CascadingParameter] in child componentsNotifyChangedAsync(newValue) — never page reloadStateHasChanged from background threads in InvokeAsyncIDisposable — dispose timers, cancel tokens, unsubscribe eventsWrap a subtree with <CascadingValue> to flow data to all descendants without passing it through every intermediate component.
@* In a layout or parent component *@
<CascadingValue Value="theme">
@Body
</CascadingValue>
@code {
private ThemeInfo theme = new() { ButtonClass = "btn-primary" };
test cases passed, vs 19 / 22 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.