feat(primevue): add PrimeVue plugin with Aura preset and Crewli teal tokens
Scaffolds apps/app/src/plugins/primevue/ as three files mirroring the Vuetify plugin structure at apps/app/src/plugins/vuetify/: - theme.ts — CrewliPreset extends Aura via definePreset(). Primary palette (50–950) is the exact token plan from RFC Appendix B, centered on Crewli teal #0D9394 (light primary, primary.500) and #0B7F80 (dark primary, primary.600). Surface tokens use Aura defaults. colorScheme.light/dark map primary.color, hover, active, and contrastColor per Appendix B. - defaults.ts — empty pt (PassThrough) defaults object. F3 ships this scaffold; F4 sub-packages populate component-level defaults as each Vuetify surface migrates. - index.ts — installPrimeVue(app) registers PrimeVue with the preset, Dutch locale (primelocale/nl.json → nl.nl), darkModeSelector: '.dark' (matches Vuexy convention per AD-2), and the three services Toast, Confirmation, Dialog. Theme imports use @primeuix/themes (the maintained successor PrimeVue's official docs prescribe), not RFC v1.0's @primevue/themes. See B1 commit for substitution rationale. RFC will be aligned in B9. The plugin is not yet registered in main.ts — that lands in B4 after Tailwind v4 wiring (B3). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
55
apps/app/src/plugins/primevue/theme.ts
Normal file
55
apps/app/src/plugins/primevue/theme.ts
Normal file
@@ -0,0 +1,55 @@
|
||||
// Crewli Aura preset. Token values per RFC-WS-FRONTEND-PRIMEVUE Appendix B.
|
||||
//
|
||||
// Primary palette derives from Crewli teal #0D9394 (light primary) and
|
||||
// #0B7F80 (dark primary) — the same values the Vuetify side uses at
|
||||
// apps/app/src/plugins/vuetify/theme.ts. The two themes are intentionally
|
||||
// kept in lockstep during the F3–F6 parallel-mode window so that pages
|
||||
// in either framework render with identical brand color.
|
||||
//
|
||||
// Imports use @primeuix/themes (PrimeVue 4's officially documented theme
|
||||
// package, per primevue.org/vite/), substituting RFC v1.0's reference to
|
||||
// the deprecated @primevue/themes. See B1 commit for rationale.
|
||||
|
||||
import { definePreset } from '@primeuix/themes'
|
||||
import Aura from '@primeuix/themes/aura'
|
||||
|
||||
export const staticPrimaryColor = '#0D9394'
|
||||
export const staticPrimaryDarkenColor = '#0B7F80'
|
||||
|
||||
export const CrewliPreset = definePreset(Aura, {
|
||||
semantic: {
|
||||
primary: {
|
||||
50: '#E6F4F4',
|
||||
100: '#CCE9EA',
|
||||
200: '#99D3D4',
|
||||
300: '#66BDBE',
|
||||
400: '#33A7A8',
|
||||
500: '#0D9394',
|
||||
600: '#0B7F80',
|
||||
700: '#086B6C',
|
||||
800: '#055758',
|
||||
900: '#034344',
|
||||
950: '#012F30',
|
||||
},
|
||||
colorScheme: {
|
||||
light: {
|
||||
primary: {
|
||||
color: '{primary.500}',
|
||||
contrastColor: '#ffffff',
|
||||
hoverColor: '{primary.600}',
|
||||
activeColor: '{primary.700}',
|
||||
},
|
||||
},
|
||||
dark: {
|
||||
primary: {
|
||||
color: '{primary.400}',
|
||||
contrastColor: '{surface.900}',
|
||||
hoverColor: '{primary.300}',
|
||||
activeColor: '{primary.200}',
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
})
|
||||
|
||||
export default CrewliPreset
|
||||
Reference in New Issue
Block a user