MVVM development guidance

Use this skill whenever MVVM is the primary pattern in play—new view models, model validation, or wiring UI components to observable commands.

Core packages

packages/mvvm-core implements the foundational concepts (BaseModel, RestfulApiModel, BaseViewModel, commands, observable collections, QueryStateModel, DI container). Refer to references/mvvm-core-overview.md for the current shape of each export and the RxJS/Zod patterns the library enforces.
packages/models and packages/view-models build on mvvm-core and publish workspace-friendly entry points (@repo/models, @repo/view-models). Whenever you create new data shapes or view logic, keep them under these packages so multiple apps can import from the same build outputs.

BaseModel centralizes data$, isLoading$, and error$ observables plus setData, setLoading, setError, and a validate helper wired to a Zod schema. Every shared model should inherit from it to get consistent state tracking and disposal semantics.
RestfulApiModel wraps Fetcher, baseUrl, endpoint, schema, and initialData. Its fetch, create, update, and delete methods reuse the executeApiRequest/optimistic flows from BaseModel, so you do not re-implement loading/error handling or validation.
QueryStateModel, ObservableCollection, and the other helpers in packages/mvvm-core/src/models layer on top when you need caching, pagination, or custom change events for lists of entities.