Author Component

by dotnet0608d8924cd3MITListed Oct 8, 2026Updated Oct 8, 2026

Create or review Blazor components (.razor files) with correct architecture. USE FOR: writing new Blazor components that do NOT involve JavaScript interop, implementing parameters and EventCallback, RenderFragment slots, component lifecycle (OnInitializedAsync, OnParametersSet), async patterns, IAsyncDisposable, CancellationToken, CSS isolation, code-behind. DO NOT USE FOR: creating new projects (use create-blazor-project), JavaScript interop or calling browser APIs from Blazor (use use-js-interop), forms and validation (use collect-user-input), prerendering issues (use support-prerendering), HTTP data fetching patterns (use fetch-and-send-data), coordinating state between unrelated components (use coordinate-components).

AI-generated overview

Guides writing and reviewing Blazor components (.razor files) with correct architecture, parameters, lifecycle, async and disposal patterns.

What it does
Provides rules and reference material for authoring or reviewing Blazor components. It covers parameter and EventCallback conventions, RenderFragment slots and generics, file and code-behind layout, component lifecycle, async and debounce/polling patterns, and IAsyncDisposable disposal. It also lists anti-patterns to avoid, such as mutating parameters or using Action/Func for events.
When to use it
Use when writing new Blazor components that do not involve JavaScript interop, or when reviewing existing .razor components for architectural correctness. It is not intended for project creation, JS interop, forms and validation, prerendering, HTTP data fetching, or cross-component state coordination.
Requirements
No scripts; instructions and reference documents only. The agent needs the accompanying reference files on async programming, component breakdown and component disposal.

Author Blazor Component

Core Rules

  • Data flows down via [Parameter]. Events flow up via EventCallback<T> (never Action/Func).
  • Never mutate [Parameter] properties. Copy to a private field in OnParametersSet.
  • Use [Parameter] public T Prop { get; set; } — never required or init (causes BL0007).
  • Use [EditorRequired] for required parameters.
  • Handle all states: loading, empty, loaded, error — each with @if/@else.
  • Use @key on repeated elements in loops for efficient diffing.
  • Use IReadOnlyList<T> (not IEnumerable<T>) for collection parameters.

RenderFragment & Generics

csharp
[Parameter] public RenderFragment? ChildContent { get; set; }[Parameter] public RenderFragment<TItem>? RowTemplate { get; set; }  // generic template

Use @typeparam TItem for generic components.

File Patterns

  • Single-file: .razor with @code block when logic < ~50 lines.
  • Code-behind: .razor + .razor.cs with partial class when logic > ~50 lines.

Disposal

Implement IAsyncDisposable (not IDisposable) when the component owns subscriptions, timers, or CTS. In DisposeAsync: unsubscribe (-=), cancel CTS, dispose resources. Never call StateHasChanged.

Async Patterns

  • await every async operation. Never use .Result, .Wait(), Task.Run, ContinueWith, Thread.Start.
  • Debounce: Task.Delay + CancellationTokenSource. Cancel old CTS, create new, await delay, do work. Never use System.Threading.Timer or System.Timers.Timer.
  • Polling: Loop in OnInitializedAsync with await Task.Delay(interval, token) — stays on sync context.
  • External events (Action<T>): Use async void handler + await InvokeAsync(() => { state++; StateHasChanged(); }) + catch → DispatchExceptionAsync. Never _ = InvokeAsync(...).
  • Cancel CTS in DisposeAsync. Don't catch ObjectDisposedException — use CTS cancellation.

Don'ts

  • required/init on [Parameter] — runtime failure
  • Mutate [Parameter] — copy to private field in OnParametersSet
  • Action/Func for events — use EventCallback<T>
  • Task.Run/.Result/.Wait()/Timer for debounce — deadlock or thread-pool escape
  • Inline style attributes — use CSS classes or data-* attributes
  • catch { throw; } — use when guard or let exceptions propagate
  • Gold-plating: ARIA, wrapper divs, accessibility features not requested
  • _ = InvokeAsync(...) — swallows exceptions; use async void + DispatchExceptionAsync

Source and attribution

Source:dotnet/skillsinplugins/dotnet-blazor/skills/author-componentat commit0608d89

License: MIT

Content belongs to its original authors. SourceWeft indexes it from a public repository.

Report or request removal