docs(rfc): correct AD-2/AD-5 and Appendix B to reflect ecosystem state
Three RFC drift corrections discovered during F3 implementation: 1. AD-5 icon rendering: corrected from "<i :class='i-tabler-X'>" utility-class pattern (which would require UnoCSS, not installed) to "@iconify/vue's <Icon> component with name='tabler-X' prop" (existing Crewli pattern producing real SVG output). The thin wrapper shipped in F3 B6 as apps/app/src/components/Icon.vue accordingly. 2. AD-2 theme architecture: corrected package reference from @primevue/themes@^4.5 (deprecated by PrimeFaces) to @primeuix/themes@^2 (the path now prescribed by PrimeVue 4's official install docs at primevue.org/vite/). Same maintainers, same API surface (definePreset, Aura preset, semantic tokens). F3 commit B1 already uses the corrected package. 3. Appendix B Aura theme token plan: updated import-path examples to @primeuix/themes and @primeuix/themes/aura accordingly. Also updated: - §6 F3 deliverables list: dependency line now reads @primeuix/themes@^2 with a footnote linking to the B1 rationale. - Appendix C Version Pinning Policy: separated @primeuix/themes from the primevue/^primevue/forms lockstep pin (independent release cadence). - dev-docs/PRIMEVUE_COMPONENTS.md §3 (Data display): VIcon row updated to <Icon name="tabler-..." />; surrounding migration-spirit paragraph rewritten; §10 external-resources link relabeled to @primeuix/themes. These are RFC drift corrections — the implementation in F3 (commits B1, B2, B6 of this sprint) already uses the corrected packages and import paths. This commit aligns the spec with reality so future contributors don't reach for the deprecated/inaccurate documentation. .claude-sync/ regenerates automatically post-commit via lefthook. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -129,17 +129,21 @@ replaces `VSheet`, `VSpacer`, and most uses of `VContainer`.
|
||||
| `VChip` | `Tag` (preferred) or `Chip` | https://primevue.org/tag/ | `Tag` for status badges; `Chip` for removable filters |
|
||||
| `VAvatar` | `Avatar` | https://primevue.org/avatar/ | `variant='tonal'` → `:style="{ background, color }"` (no built-in tonal) |
|
||||
| `VImg` | `<img>` (native) | — | No wrapper needed; use `loading="lazy"` |
|
||||
| `VIcon` | `<i class="i-tabler-..." />` | — | **Iconify-Tabler retained** per [RFC AD-5](./RFC-WS-FRONTEND-PRIMEVUE.md#ad-5-icons--iconify-tabler-retained-primeicons-not-installed); PrimeIcons is **not installed** |
|
||||
| `VIcon` | `<Icon name="tabler-..." />` | — | **Iconify-Tabler retained** per [RFC AD-5](./RFC-WS-FRONTEND-PRIMEVUE.md#ad-5-icons--iconify-tabler-retained-primeicons-not-installed); thin wrapper at `apps/app/src/components/Icon.vue` over `@iconify/vue`'s `<Icon>`. PrimeIcons is **not installed** |
|
||||
| `VLabel` | `<label>` (native) or `<FormField label="...">` | — | |
|
||||
| `VTimeline` / `VTimelineItem` | `Timeline` | https://primevue.org/timeline/ | |
|
||||
| `VBadge` (1 use) | `Badge` or `OverlayBadge` | https://primevue.org/badge/ | |
|
||||
|
||||
**Migration spirit.** `VIcon` is the most widespread component (267 uses)
|
||||
and it does **not** become a PrimeVue component. The Iconify-Tabler
|
||||
class-based pattern (`<i class="i-tabler-arrow-right" />`) is
|
||||
stack-agnostic and survives the migration intact. PrimeIcons is not
|
||||
installed; do not introduce `pi pi-*` icon classes during F4 — they will
|
||||
not render. Lists are the most context-dependent area: a selection list
|
||||
naming convention survives intact: call-sites use the existing
|
||||
`tabler-*` string identifiers (e.g. `tabler-arrow-right`) and the new
|
||||
`apps/app/src/components/Icon.vue` wrapper renders them through
|
||||
`@iconify/vue` as real `<svg>` markup. UnoCSS-style `i-tabler-*` utility
|
||||
classes were considered but not adopted (UnoCSS is not in the stack);
|
||||
the wrapper preserves Crewli continuity. PrimeIcons is not installed;
|
||||
do not introduce `pi pi-*` icon classes during F4 — they will not
|
||||
render. Lists are the most context-dependent area: a selection list
|
||||
uses `Listbox`, a card grid uses `DataView`, a navigation list uses
|
||||
`MenuItem`/`PanelMenu`, and a generic display list is just `<ul><li>`.
|
||||
|
||||
@@ -369,7 +373,7 @@ External (PrimeVue ecosystem):
|
||||
|
||||
- PrimeVue components: https://primevue.org/
|
||||
- `@primevue/forms` (form layer): https://primevue.org/forms/
|
||||
- `@primevue/themes` (Aura preset): https://primevue.org/theming/styled/
|
||||
- `@primeuix/themes` (Aura preset, the maintained successor to `@primevue/themes`): https://primevue.org/theming/styled/
|
||||
- `tailwindcss-primeui` (token bridge): https://github.com/primefaces/tailwindcss-primeui
|
||||
|
||||
Internal (Crewli docs):
|
||||
|
||||
Reference in New Issue
Block a user