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>
56 lines
1.6 KiB
TypeScript
56 lines
1.6 KiB
TypeScript
// 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
|