OUI_XFAB documentation
UI and Dependency Migration
PrimeVue to Vuetify
The UI migration replaced PrimeVue, PrimeIcons, and PrimeUIX Aura themes with Vuetify 4 and Material Design Icons. The migration was performed module by module while preserving route, locale, theme, fixture data, behavior, and layout intent.
The complete inventory is UI Migration Tracker. Each reviewed surface keeps a deterministic pair under docs/ui-migration-review/<module>/:
before-primevue.png
after-vuetify.png
The capture contract uses Playwright Chromium at 1280x800, English, light theme, deterministic WebSocket fixtures, and settled dialog transitions. The reconciliation pair additionally covers desktop and tablet occupied/empty load-port states.
Icon Policy
Application icons use the MDI icon set configured by src/shared/ui/vuetify.ts and loaded through @mdi/font. PrimeIcons is removed from the browser dependency graph; no compatibility shim is retained.
Current Direct Dependencies
The authoritative version and ownership list is docs/dependencies.md. The current UI/runtime foundation is:
| Area | Package |
|---|---|
| Framework | Vue 3 |
| UI | Vuetify 4 |
| Icons | @mdi/font |
| State | Pinia 4 |
| Router | Vue Router 5 |
| Build | Vite 8 |
| Test | Vitest 4, jsdom 30, Playwright |
| Types | Canonical typescript@6.0.3 and vue-tsc |
TypeScript 6
The project uses the canonical typescript package at 6.0.3, not @typescript/typescript6. This keeps the standard tsc and tsserver commands and makes a future TypeScript 7 upgrade a direct major-version update after compatibility validation.
Node 26 and @types/node 26 remain deferred because the deployment runtime is Node 24.
Visual Acceptance
Visual parity means more than matching a screenshot. Reviewers must compare the same route, viewport, locale, theme, fixture data, action state, focus behavior, disabled state, and console output. Behavioral tests and screenshot evidence are both required for a migrated module.