Migration to v5
Migration guide to PrimeVue v5.
Overview #
PrimeVue v5 is the first release under the PrimeUI umbrella. Licensing moves to a dual Community/Commercial model. Read the full story for the background and road ahead.
Breaking Changes
PrimeVue follows semantic versioning, and this release introduces no breaking changes to the public component APIs. Existing applications should upgrade without code edits. If you encounter a regression that looks like a breaking change, please open an issue so we can address it.
PRO Suite
PrimeUI PRO is the new enterprise tier from PrimeTek, expanding the suite with production-ready components.
- Scheduler.
- Charts.
- Text Editor.
- Task Board.
- Diagram, on the roadmap
- DataGrid, on the roadmap
- Gantt Chart, on the roadmap
- PDF Viewer, on the roadmap
New Components
v5 introduces a fresh set of components:
Enhancements
Several existing components have also been reworked:
- Carousel rebuilt around a compound API.
- Menu now supports multi-level navigation.
- Toast ships with new entry and exit animations.
- InputMask is now a directive rather than a component.
- Wide-ranging defect fixes across the suite.
- New documentation and demos.
16px Base
PrimeVue sizes its components in rem units relative to the document root font size, now assumed to be 16px to match the browser default. Earlier versions assumed 14px, so every preset also ships a compat variant calibrated for a 14px root to keep existing layouts intact. See Base Font Size for technical details.
Deprecations #
The following APIs are marked as deprecated in v5 and will be removed in a future major version. They continue to function in v5 so you can migrate gradually.
| API | Deprecated Since | Replacement | Removal | Status |
|---|---|---|---|---|
| MultiSelect | v5 | Select component with multiple property | v6 | deprecated |
| Galleria | v5 | Gallery component | v6 | deprecated |
| Image | v5 | Gallery component | v6 | deprecated |
| ColorPicker | v5 | InputColor component | v6 | deprecated |
| ImageCompare | v5 | Compare component | v6 | deprecated |
| ScrollPanel | v5 | ScrollArea component | v6 | deprecated |
| Password | v5 | InputPassword component | v6 | deprecated |
| InputMask | v5 | Mask directive | v6 | deprecated |
| PanelMenu | v5 | Menu component with toggleable option | v6 | deprecated |
| Chart | v5 | PrimeUI PRO Charts | v6 | deprecated |
| Editor | v5 | PrimeUI PRO Editor | v6 | deprecated |
| @primevue/icons package | v5 | SVG icons via @primeicons/vue | v6 | deprecated |
| AutoComplete multiple property | v5 | InputTags component with typeahead | v6 | deprecated |
| Button label, icon, iconPos, iconClass properties | v5 | Place the icon and label directly inside the default slot, ordering them as needed | v6 | deprecated |
| Button badge, badgeClass, badgeSeverity properties | v5 | Compose a Badge component inside the default slot | v6 | deprecated |
| Button loading and loadingIcon properties | v5 | Render your own spinner inside the default slot and toggle disabled | v6 | deprecated |
| Tabs scrollable property | v5 | Scrolling is now the default behavior if necessary | v6 | deprecated |
| Carousel data-driven (value) usage | v5 | Compound API with CarouselContent, CarouselItem and CarouselIndicators helpers. | v6 | deprecated |
Removals #
The list of items that were deprecated in previous releases and removed in this iteration.
| API | Deprecated In | Replacement | Status |
|---|---|---|---|
| Calendar | v4 | DatePicker component | removed |
| Dropdown | v4 | Select component | removed |
| Chips | v4 | InputTags component | removed |
| InputChips | v4 | InputTags component | removed |
| InputSwitch | v4 | ToggleSwitch component | removed |
| OverlayPanel | v4 | Popover component | removed |
| TabView | v4 | Tabs component | removed |
| AccordionTab | v4 | Accordion with AccordionPanel / AccordionHeader / AccordionContent | removed |
| BadgeDirective (v-badge) | v4 | OverlayBadge component | removed |
| InlineMessage | v4 | Message component | removed |
| TabMenu | v4 | Tabs component (without panels) | removed |
| AutoComplete removeTokenIcon property and removetokenicon slot | v4 | chipIcon property and chipicon slot | removed |
| AutoComplete item-select / item-unselect events | v4 | option-select / option-unselect events | removed |
| AutoComplete loadingIcon property and loadingicon slot | v4 | loader property and loader slot | removed |
| AutoComplete dropdownbutton slot | v4 | dropdown slot | removed |
| Accordion activeIndex property and update:activeIndex / tab-open / tab-close / tab-click events | v4 | value property and update:value event | removed |
| Button plain property | v4 | contrast severity | removed |
| PrimeVue config inputStyle option | v4 | inputVariant option | removed |
| CascadeSelect panelStyle / panelClass / panelProps properties | v4 | overlayStyle / overlayClass / overlayProps properties | removed |
| Select panelStyle / panelClass properties | v4 | overlayStyle / overlayClass properties | removed |
| InputNumber incrementButtonIcon / decrementButtonIcon properties and incrementbuttonicon / decrementbuttonicon slots | v4 | incrementIcon / decrementIcon properties and incrementicon / decrementicon slots | removed |
| Column rowtogglericon / nodetogglericon slots | v4 | rowtoggleicon / nodetoggleicon slots | removed |
| DataTable reorderindicatorupicon / reorderindicatordownicon slots | v4 | rowreorderindicatorupicon / rowreorderindicatordownicon slots | removed |
| Tree searchicon / togglericon / nodetogglericon slots | v4 | filtericon / nodetoggleicon slots | removed |
| TreeSelect itemtogglericon slot | v4 | itemtoggleicon slot | removed |
| TreeSelect triggericon slot | v4 | dropdownicon slot | removed |
| Dock icon slot | v4 | itemicon slot | removed |
| Menu submenuheader slot | v4 | submenulabel slot | removed |
| Menubar menubutton / menubuttonicon slots | v4 | button / buttonicon slots | removed |
| MegaMenu menubutton / menubuttonicon slots | v4 | button / buttonicon slots | removed |
| Message sticky property | v4 | life property to control auto-close | removed |
| UniqueComponentId utility (@primevue/core/utils) | v4 | uuid from @primeuix/utils | removed |
| Component instance hasFluid getter (BaseInput) | v4 | $fluid | removed |
| Component instance filled getter (BaseEditableHolder) | v4 | $filled | removed |
| Root element $pc marker (set on each component's root DOM element) | v4 | No replacement (internal) | removed |
| Paginator firstpagelinkicon / prevpagelinkicon / nextpagelinkicon / lastpagelinkicon slots | v4 | firsticon / previcon / nexticon / lasticon slots | removed |
| Panel / Fieldset togglericon slot | v4 | toggleicon slot | removed |
| SplitButton menubuttonicon slot | v4 | dropdownicon slot | removed |
| Toast icon slot | v4 | messageicon slot | removed |
| OrderList / PickList item slot | v4 | option slot | removed |
| TabPanel header / headerStyle / headerClass / headerProps / headerActionProps / contentStyle / contentClass / contentProps / disabled properties and header slot (TabView-only) | v4 | Tabs structure (Tab / TabList / TabPanels) | removed |
| switchTheme function | v4 | usePreset and related theme APIs | removed |
| primevue/themes presets | v4 | @primeuix/themes | removed |
| nuxt-primevue module | v4 | @primevue/nuxt-module | removed |
On this page
Overview1/3
Theme Designer