[docs] Add PrimeVue deprecated component guidelines (#4097)

This commit is contained in:
Christian Byrne
2025-06-07 18:27:35 -07:00
committed by GitHub
parent 1ca71caf45
commit 6bbe46009b
2 changed files with 25 additions and 0 deletions

View File

@@ -38,6 +38,20 @@ const tailwindCssBestPractices = [
"Implement responsive design with Tailwind CSS",
]
// PrimeVue deprecated components - DO NOT USE
const deprecatedPrimeVueComponents = [
"DO NOT use deprecated PrimeVue components. Use these replacements instead:",
"Dropdown → Use Select (import from 'primevue/select')",
"OverlayPanel → Use Popover (import from 'primevue/popover')",
"Calendar → Use DatePicker (import from 'primevue/datepicker')",
"InputSwitch → Use ToggleSwitch (import from 'primevue/toggleswitch')",
"Sidebar → Use Drawer (import from 'primevue/drawer')",
"Chips → Use AutoComplete with multiple enabled and typeahead disabled",
"TabMenu → Use Tabs without panels",
"Steps → Use Stepper without panels",
"InlineMessage → Use Message component"
]
// Additional instructions
const additionalInstructions = `
1. Leverage VueUse functions for performance-enhancing styles
@@ -51,4 +65,5 @@ const additionalInstructions = `
9. Use Vite for fast development and building
10. Use vue-i18n in composition API for any string literals. Place new translation
entries in src/locales/en/main.json.
11. Never use deprecated PrimeVue components listed above
`;

View File

@@ -36,3 +36,13 @@
- Use Vite for fast development and building
- Use vue-i18n in composition API for any string literals. Place new translation entries in src/locales/en/main.json.
- Avoid using `@ts-expect-error` to work around type issues. We needed to employ it to migrate to TypeScript, but it should not be viewed as an accepted practice or standard.
- DO NOT use deprecated PrimeVue components. Use these replacements instead:
* `Dropdown` → Use `Select` (import from 'primevue/select')
* `OverlayPanel` → Use `Popover` (import from 'primevue/popover')
* `Calendar` → Use `DatePicker` (import from 'primevue/datepicker')
* `InputSwitch` → Use `ToggleSwitch` (import from 'primevue/toggleswitch')
* `Sidebar` → Use `Drawer` (import from 'primevue/drawer')
* `Chips` → Use `AutoComplete` with multiple enabled and typeahead disabled
* `TabMenu` → Use `Tabs` without panels
* `Steps` → Use `Stepper` without panels
* `InlineMessage` → Use `Message` component