Optimal ViewModel and Wizard creation patterns for Avalonia using Zafiro and ReactiveUI.
Install with the open skills CLI (global, non-interactive — available in every Claude Code session):
npx skills add davila7/claude-code-templates --skill "avalonia-viewmodels-zafiro" -g -a claude-code -yOr manually — clone and copy the skill directory (SKILL.md + companion files):
git clone --depth 1 https://github.com/davila7/claude-code-templates /tmp/claude-code-templates && cp -r /tmp/claude-code-templates/cli-tool/components/skills/development/avalonia-viewmodels-zafiro ~/.claude/skills/avalonia-viewmodels-zafiro-davila7This skill is a directory: SKILL.md is the entry point; the files below ship with it.
---
name: avalonia-viewmodels-zafiro
description: Optimal ViewModel and Wizard creation patterns for Avalonia using Zafiro and ReactiveUI.
---
# Avalonia ViewModels with Zafiro
This skill provides a set of best practices and patterns for creating ViewModels, Wizards, and managing navigation in Avalonia applications, leveraging the power of **ReactiveUI** and the **Zafiro** toolkit.
## Core Principles
1. **Functional-Reactive Approach**: Use ReactiveUI (`ReactiveObject`, `WhenAnyValue`, etc.) to handle state and logic.
2. **Enhanced Commands**: Utilize `IEnhancedCommand` for better command management, including progress reporting and name/text attributes.
3. **Wizard Pattern**: Implement complex flows using `SlimWizard` and `WizardBuilder` for a declarative and maintainable approach.
4. **Automatic Section Discovery**: Use the `[Section]` attribute to register and discover UI sections automatically.
5. **Clean Composition**: map ViewModels to Views using `DataTypeViewLocator` and manage dependencies in the `CompositionRoot`.
## Guides
- [ViewModels & Commands](viewmodels.md): Creating robust ViewModels and handling commands.
- [Wizards & Flows](wizards.md): Building multi-step wizards with `SlimWizard`.
- [Navigation & Sections](navigation_sections.md): Managing navigation and section-based UIs.
- [Composition & Mapping](composition.md): Best practices for View-ViewModel wiring and DI.
## Example Reference
For real-world implementations, refer to the **Angor** project:
- `CreateProjectFlowV2.cs`: Excellent example of complex Wizard building.
- `HomeViewModel.cs`: Simple section ViewModel using functional-reactive commands.
You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.
Roleplay the most difficult, tech-resistant user for your product. Browse the app as that persona, find every UX pain point, then filter complaints through a pragmatism layer to separate real problems from noise. Creates actionable tickets from genuine issues only.
ASCII video: convert video/audio to colored ASCII MP4/GIF.