# PrimeVue Component Reference This document provides a comprehensive list of all PrimeVue components available in this project. **PrimeVue Version:** 4.2.5 **Total Components:** 147 ## Table of Contents - [Button](#button) - [Chart](#chart) - [Data](#data) - [Directives](#directives) - [File](#file) - [Form](#form) - [Media](#media) - [Menu](#menu) - [Messages](#messages) - [Misc](#misc) - [Overlay](#overlay) - [Panel](#panel) - [Stepper](#stepper) - [Uncategorized](#uncategorized) - [Utilities](#utilities) ## Button ### Button **Name:** `button` **Description:** Standard button component with various styles and severity levels, supports icons and loading states **Documentation:** [https://primevue.org/button/](https://primevue.org/button/) **Usage Example:** ```vue import Button from 'primevue/button'; ``` --- ### Buttongroup **Name:** `buttongroup` **Description:** Groups multiple buttons together as a cohesive unit with shared styling **Documentation:** [https://primevue.org/button/](https://primevue.org/button/) **Usage Example:** ```vue import Buttongroup from 'primevue/buttongroup'; ``` --- ### Speeddial **Name:** `speeddial` **Description:** Floating action button with expandable menu items, supports radial and linear layouts **Documentation:** [https://primevue.org/speeddial/](https://primevue.org/speeddial/) **Usage Example:** ```vue import Speeddial from 'primevue/speeddial'; ``` --- ### Splitbutton **Name:** `splitbutton` **Description:** Button with attached dropdown menu for additional actions **Documentation:** [https://primevue.org/splitbutton/](https://primevue.org/splitbutton/) **Usage Example:** ```vue import Splitbutton from 'primevue/splitbutton'; ``` --- ## Chart ### Chart **Name:** `chart` **Description:** Charts and graphs using Chart.js **Documentation:** [https://primevue.org/chart/](https://primevue.org/chart/) **Usage Example:** ```vue import Chart from 'primevue/chart'; ``` --- ## Data ### Carousel **Name:** `carousel` **Description:** Displays content in a rotating slideshow **Documentation:** [https://primevue.org/carousel/](https://primevue.org/carousel/) **Usage Example:** ```vue import Carousel from 'primevue/carousel'; ``` --- ### Datatable **Name:** `datatable` **Description:** Advanced data table with sorting, filtering, pagination, row selection, and column resizing **Documentation:** [https://primevue.org/datatable/](https://primevue.org/datatable/) **Usage Example:** ```vue import Datatable from 'primevue/datatable'; ``` --- ### Dataview **Name:** `dataview` **Description:** Displays data in list layout **Documentation:** [https://primevue.org/dataview/](https://primevue.org/dataview/) **Usage Example:** ```vue import Dataview from 'primevue/dataview'; ``` --- ### Orderlist **Name:** `orderlist` **Description:** Reorderable list component **Documentation:** [https://primevue.org/orderlist/](https://primevue.org/orderlist/) **Usage Example:** ```vue import Orderlist from 'primevue/orderlist'; ``` --- ### Organizationchart **Name:** `organizationchart` **Description:** Hierarchical organization display **Documentation:** [https://primevue.org/organizationchart/](https://primevue.org/organizationchart/) **Usage Example:** ```vue import Organizationchart from 'primevue/organizationchart'; ``` --- ### Paginator **Name:** `paginator` **Description:** Navigation for paged data **Documentation:** [https://primevue.org/paginator/](https://primevue.org/paginator/) **Usage Example:** ```vue import Paginator from 'primevue/paginator'; ``` --- ### Picklist **Name:** `picklist` **Description:** Dual list for item transfer **Documentation:** [https://primevue.org/picklist/](https://primevue.org/picklist/) **Usage Example:** ```vue import Picklist from 'primevue/picklist'; ``` --- ### Timeline **Name:** `timeline` **Description:** Chronological event display **Documentation:** [https://primevue.org/timeline/](https://primevue.org/timeline/) **Usage Example:** ```vue import Timeline from 'primevue/timeline'; ``` --- ### Tree **Name:** `tree` **Description:** Hierarchical tree structure **Documentation:** [https://primevue.org/tree/](https://primevue.org/tree/) **Usage Example:** ```vue import Tree from 'primevue/tree'; ``` --- ### Treetable **Name:** `treetable` **Description:** Table with tree structure **Documentation:** [https://primevue.org/treetable/](https://primevue.org/treetable/) **Usage Example:** ```vue import Treetable from 'primevue/treetable'; ``` --- ### Virtualscroller **Name:** `virtualscroller` **Description:** Virtual scrolling for large datasets **Documentation:** [https://primevue.org/virtualscroller/](https://primevue.org/virtualscroller/) **Usage Example:** ```vue import Virtualscroller from 'primevue/virtualscroller'; ``` --- ## Directives ### Animateonscroll **Name:** `animateonscroll` **Description:** Directive to apply animations when element becomes visible **Documentation:** [https://primevue.org/animateonscroll/](https://primevue.org/animateonscroll/) **Usage Example:** ```vue import Animateonscroll from 'primevue/animateonscroll'; ``` --- ### Badgedirective **Name:** `badgedirective` **Description:** Directive to add badges to any element **Documentation:** [https://primevue.org/badge/](https://primevue.org/badge/) **Usage Example:** ```vue import Badgedirective from 'primevue/badgedirective'; ``` --- ### Focustrap **Name:** `focustrap` **Description:** Directive to trap focus within element **Documentation:** [https://primevue.org/focustrap/](https://primevue.org/focustrap/) **Usage Example:** ```vue import Focustrap from 'primevue/focustrap'; ``` --- ### Keyfilter **Name:** `keyfilter` **Description:** Directive to filter keyboard input **Documentation:** [https://primevue.org/keyfilter/](https://primevue.org/keyfilter/) **Usage Example:** ```vue import Keyfilter from 'primevue/keyfilter'; ``` --- ### Ripple **Name:** `ripple` **Description:** Directive for material design ripple effect **Documentation:** [https://primevue.org/ripple/](https://primevue.org/ripple/) **Usage Example:** ```vue import Ripple from 'primevue/ripple'; ``` --- ### Styleclass **Name:** `styleclass` **Description:** Directive for dynamic styling **Documentation:** [https://primevue.org/styleclass/](https://primevue.org/styleclass/) **Usage Example:** ```vue import Styleclass from 'primevue/styleclass'; ``` --- ## File ### Fileupload **Name:** `fileupload` **Description:** File upload component with drag-drop **Documentation:** [https://primevue.org/fileupload/](https://primevue.org/fileupload/) **Usage Example:** ```vue import Fileupload from 'primevue/fileupload'; ``` --- ## Form ### Autocomplete **Name:** `autocomplete` **Description:** Provides filtered suggestions while typing input, supports multiple selection and custom item templates **Documentation:** [https://primevue.org/autocomplete/](https://primevue.org/autocomplete/) **Usage Example:** ```vue import Autocomplete from 'primevue/autocomplete'; ``` --- ### Calendar **Name:** `calendar` **Description:** Input component for date selection (legacy) **Documentation:** [https://primevue.org/calendar/](https://primevue.org/calendar/) **Usage Example:** ```vue import Calendar from 'primevue/calendar'; ``` --- ### Cascadeselect **Name:** `cascadeselect` **Description:** Nested dropdown selection component **Documentation:** [https://primevue.org/cascadeselect/](https://primevue.org/cascadeselect/) **Usage Example:** ```vue import Cascadeselect from 'primevue/cascadeselect'; ``` --- ### Checkbox **Name:** `checkbox` **Description:** Binary selection component **Documentation:** [https://primevue.org/checkbox/](https://primevue.org/checkbox/) **Usage Example:** ```vue import Checkbox from 'primevue/checkbox'; ``` --- ### Checkboxgroup **Name:** `checkboxgroup` **Description:** Groups multiple checkboxes **Documentation:** [https://primevue.org/checkbox/](https://primevue.org/checkbox/) **Usage Example:** ```vue import Checkboxgroup from 'primevue/checkboxgroup'; ``` --- ### Chips **Name:** `chips` **Description:** Input component for entering multiple values **Documentation:** [https://primevue.org/chips/](https://primevue.org/chips/) **Usage Example:** ```vue import Chips from 'primevue/chips'; ``` --- ### Colorpicker **Name:** `colorpicker` **Description:** Input component for color selection **Documentation:** [https://primevue.org/colorpicker/](https://primevue.org/colorpicker/) **Usage Example:** ```vue import Colorpicker from 'primevue/colorpicker'; ``` --- ### Datepicker **Name:** `datepicker` **Description:** Input component for date and time selection with calendar popup, supports date ranges and custom formatting **Documentation:** [https://primevue.org/datepicker/](https://primevue.org/datepicker/) **Usage Example:** ```vue import Datepicker from 'primevue/datepicker'; ``` --- ### Dropdown **Name:** `dropdown` **Description:** Single selection dropdown **Documentation:** [https://primevue.org/dropdown/](https://primevue.org/dropdown/) **Usage Example:** ```vue import Dropdown from 'primevue/dropdown'; ``` --- ### Editor **Name:** `editor` **Description:** Rich text editor component **Documentation:** [https://primevue.org/editor/](https://primevue.org/editor/) **Usage Example:** ```vue import Editor from 'primevue/editor'; ``` --- ### Floatlabel **Name:** `floatlabel` **Description:** Floating label for input components **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Floatlabel from 'primevue/floatlabel'; ``` --- ### Iconfield **Name:** `iconfield` **Description:** Input field with icon **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Iconfield from 'primevue/iconfield'; ``` --- ### Iftalabel **Name:** `iftalabel` **Description:** Input field with top-aligned label **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Iftalabel from 'primevue/iftalabel'; ``` --- ### Inputchips **Name:** `inputchips` **Description:** Multiple input values as chips **Documentation:** [https://primevue.org/chips/](https://primevue.org/chips/) **Usage Example:** ```vue import Inputchips from 'primevue/inputchips'; ``` --- ### Inputgroup **Name:** `inputgroup` **Description:** Groups input elements **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputgroup from 'primevue/inputgroup'; ``` --- ### Inputgroupaddon **Name:** `inputgroupaddon` **Description:** Addon for input groups **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputgroupaddon from 'primevue/inputgroupaddon'; ``` --- ### Inputicon **Name:** `inputicon` **Description:** Icon for input components **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputicon from 'primevue/inputicon'; ``` --- ### Inputmask **Name:** `inputmask` **Description:** Input with format masking **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputmask from 'primevue/inputmask'; ``` --- ### Inputnumber **Name:** `inputnumber` **Description:** Numeric input with spinner **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputnumber from 'primevue/inputnumber'; ``` --- ### Inputotp **Name:** `inputotp` **Description:** One-time password input **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputotp from 'primevue/inputotp'; ``` --- ### Inputswitch **Name:** `inputswitch` **Description:** Binary switch component **Documentation:** [https://primevue.org/toggleswitch/](https://primevue.org/toggleswitch/) **Usage Example:** ```vue import Inputswitch from 'primevue/inputswitch'; ``` --- ### Inputtext **Name:** `inputtext` **Description:** Text input component **Documentation:** [https://primevue.org/inputtext/](https://primevue.org/inputtext/) **Usage Example:** ```vue import Inputtext from 'primevue/inputtext'; ``` --- ### Knob **Name:** `knob` **Description:** Circular input component **Documentation:** [https://primevue.org/knob/](https://primevue.org/knob/) **Usage Example:** ```vue import Knob from 'primevue/knob'; ``` --- ### Listbox **Name:** `listbox` **Description:** Selection component with list interface **Documentation:** [https://primevue.org/listbox/](https://primevue.org/listbox/) **Usage Example:** ```vue import Listbox from 'primevue/listbox'; ``` --- ### Multiselect **Name:** `multiselect` **Description:** Multiple selection dropdown **Documentation:** [https://primevue.org/multiselect/](https://primevue.org/multiselect/) **Usage Example:** ```vue import Multiselect from 'primevue/multiselect'; ``` --- ### Password **Name:** `password` **Description:** Password input with strength meter **Documentation:** [https://primevue.org/password/](https://primevue.org/password/) **Usage Example:** ```vue import Password from 'primevue/password'; ``` --- ### Radiobutton **Name:** `radiobutton` **Description:** Single selection from group **Documentation:** [https://primevue.org/radiobutton/](https://primevue.org/radiobutton/) **Usage Example:** ```vue import Radiobutton from 'primevue/radiobutton'; ``` --- ### Radiobuttongroup **Name:** `radiobuttongroup` **Description:** Groups radio buttons **Documentation:** [https://primevue.org/radiobutton/](https://primevue.org/radiobutton/) **Usage Example:** ```vue import Radiobuttongroup from 'primevue/radiobuttongroup'; ``` --- ### Rating **Name:** `rating` **Description:** Star rating input component **Documentation:** [https://primevue.org/rating/](https://primevue.org/rating/) **Usage Example:** ```vue import Rating from 'primevue/rating'; ``` --- ### Select **Name:** `select` **Description:** Modern dropdown selection **Documentation:** [https://primevue.org/select/](https://primevue.org/select/) **Usage Example:** ```vue import Select from 'primevue/select'; ``` --- ### Selectbutton **Name:** `selectbutton` **Description:** Button-style selection component **Documentation:** [https://primevue.org/selectbutton/](https://primevue.org/selectbutton/) **Usage Example:** ```vue import Selectbutton from 'primevue/selectbutton'; ``` --- ### Slider **Name:** `slider` **Description:** Range selection component **Documentation:** [https://primevue.org/slider/](https://primevue.org/slider/) **Usage Example:** ```vue import Slider from 'primevue/slider'; ``` --- ### Textarea **Name:** `textarea` **Description:** Multi-line text input **Documentation:** [https://primevue.org/textarea/](https://primevue.org/textarea/) **Usage Example:** ```vue import Textarea from 'primevue/textarea'; ``` --- ### Togglebutton **Name:** `togglebutton` **Description:** Two-state button component **Documentation:** [https://primevue.org/togglebutton/](https://primevue.org/togglebutton/) **Usage Example:** ```vue import Togglebutton from 'primevue/togglebutton'; ``` --- ### Toggleswitch **Name:** `toggleswitch` **Description:** Switch component for binary state **Documentation:** [https://primevue.org/toggleswitch/](https://primevue.org/toggleswitch/) **Usage Example:** ```vue import Toggleswitch from 'primevue/toggleswitch'; ``` --- ### Treeselect **Name:** `treeselect` **Description:** Tree-structured selection **Documentation:** [https://primevue.org/treeselect/](https://primevue.org/treeselect/) **Usage Example:** ```vue import Treeselect from 'primevue/treeselect'; ``` --- ## Media ### Galleria **Name:** `galleria` **Description:** Image gallery with thumbnails **Documentation:** [https://primevue.org/galleria/](https://primevue.org/galleria/) **Usage Example:** ```vue import Galleria from 'primevue/galleria'; ``` --- ### Image **Name:** `image` **Description:** Enhanced image component with preview **Documentation:** [https://primevue.org/image/](https://primevue.org/image/) **Usage Example:** ```vue import Image from 'primevue/image'; ``` --- ### Imagecompare **Name:** `imagecompare` **Description:** Before/after image comparison slider **Documentation:** [https://primevue.org/imagecompare/](https://primevue.org/imagecompare/) **Usage Example:** ```vue import Imagecompare from 'primevue/imagecompare'; ``` --- ## Menu ### Breadcrumb **Name:** `breadcrumb` **Description:** Navigation component showing current page location **Documentation:** [https://primevue.org/breadcrumb/](https://primevue.org/breadcrumb/) **Usage Example:** ```vue import Breadcrumb from 'primevue/breadcrumb'; ``` --- ### Contextmenu **Name:** `contextmenu` **Description:** Right-click context menu **Documentation:** [https://primevue.org/contextmenu/](https://primevue.org/contextmenu/) **Usage Example:** ```vue import Contextmenu from 'primevue/contextmenu'; ``` --- ### Dock **Name:** `dock` **Description:** Dock layout with expandable items **Documentation:** [https://primevue.org/dock/](https://primevue.org/dock/) **Usage Example:** ```vue import Dock from 'primevue/dock'; ``` --- ### Megamenu **Name:** `megamenu` **Description:** Navigation with grouped menu items **Documentation:** [https://primevue.org/megamenu/](https://primevue.org/megamenu/) **Usage Example:** ```vue import Megamenu from 'primevue/megamenu'; ``` --- ### Menu **Name:** `menu` **Description:** Navigation menu component **Documentation:** [https://primevue.org/menu/](https://primevue.org/menu/) **Usage Example:** ```vue import Menu from 'primevue/menu'; ``` --- ### Menubar **Name:** `menubar` **Description:** Horizontal navigation menu **Documentation:** [https://primevue.org/menubar/](https://primevue.org/menubar/) **Usage Example:** ```vue import Menubar from 'primevue/menubar'; ``` --- ### Panelmenu **Name:** `panelmenu` **Description:** Vertical navigation menu **Documentation:** [https://primevue.org/panelmenu/](https://primevue.org/panelmenu/) **Usage Example:** ```vue import Panelmenu from 'primevue/panelmenu'; ``` --- ### Steps **Name:** `steps` **Description:** Step-by-step navigation **Documentation:** [https://primevue.org/steps/](https://primevue.org/steps/) **Usage Example:** ```vue import Steps from 'primevue/steps'; ``` --- ### Tabmenu **Name:** `tabmenu` **Description:** Menu styled as tabs **Documentation:** [https://primevue.org/tabmenu/](https://primevue.org/tabmenu/) **Usage Example:** ```vue import Tabmenu from 'primevue/tabmenu'; ``` --- ### Tieredmenu **Name:** `tieredmenu` **Description:** Hierarchical menu component **Documentation:** [https://primevue.org/tieredmenu/](https://primevue.org/tieredmenu/) **Usage Example:** ```vue import Tieredmenu from 'primevue/tieredmenu'; ``` --- ## Messages ### Inlinemessage **Name:** `inlinemessage` **Description:** Inline message display **Documentation:** [https://primevue.org/inlinemessage/](https://primevue.org/inlinemessage/) **Usage Example:** ```vue import Inlinemessage from 'primevue/inlinemessage'; ``` --- ### Message **Name:** `message` **Description:** Message component for notifications **Documentation:** [https://primevue.org/message/](https://primevue.org/message/) **Usage Example:** ```vue import Message from 'primevue/message'; ``` --- ### Toast **Name:** `toast` **Description:** Temporary message notifications **Documentation:** [https://primevue.org/toast/](https://primevue.org/toast/) **Usage Example:** ```vue import Toast from 'primevue/toast'; ``` --- ## Misc ### Avatar **Name:** `avatar` **Description:** Represents people using icons, labels and images **Documentation:** [https://primevue.org/avatar/](https://primevue.org/avatar/) **Usage Example:** ```vue import Avatar from 'primevue/avatar'; ``` --- ### Avatargroup **Name:** `avatargroup` **Description:** Groups multiple avatars together **Documentation:** [https://primevue.org/avatar/](https://primevue.org/avatar/) **Usage Example:** ```vue import Avatargroup from 'primevue/avatargroup'; ``` --- ### Badge **Name:** `badge` **Description:** Small numeric indicator for other components **Documentation:** [https://primevue.org/badge/](https://primevue.org/badge/) **Usage Example:** ```vue import Badge from 'primevue/badge'; ``` --- ### Blockui **Name:** `blockui` **Description:** Blocks user interaction with page elements **Documentation:** [https://primevue.org/blockui/](https://primevue.org/blockui/) **Usage Example:** ```vue import Blockui from 'primevue/blockui'; ``` --- ### Chip **Name:** `chip` **Description:** Compact element representing input, attribute or action **Documentation:** [https://primevue.org/chip/](https://primevue.org/chip/) **Usage Example:** ```vue import Chip from 'primevue/chip'; ``` --- ### Inplace **Name:** `inplace` **Description:** Editable content in place **Documentation:** [https://primevue.org/inplace/](https://primevue.org/inplace/) **Usage Example:** ```vue import Inplace from 'primevue/inplace'; ``` --- ### Metergroup **Name:** `metergroup` **Description:** Displays multiple meter values **Documentation:** [https://primevue.org/metergroup/](https://primevue.org/metergroup/) **Usage Example:** ```vue import Metergroup from 'primevue/metergroup'; ``` --- ### Overlaybadge **Name:** `overlaybadge` **Description:** Badge overlay for components **Documentation:** [https://primevue.org/badge/](https://primevue.org/badge/) **Usage Example:** ```vue import Overlaybadge from 'primevue/overlaybadge'; ``` --- ### Progressbar **Name:** `progressbar` **Description:** Progress indication component **Documentation:** [https://primevue.org/progressbar/](https://primevue.org/progressbar/) **Usage Example:** ```vue import Progressbar from 'primevue/progressbar'; ``` --- ### Progressspinner **Name:** `progressspinner` **Description:** Loading spinner component **Documentation:** [https://primevue.org/progressspinner/](https://primevue.org/progressspinner/) **Usage Example:** ```vue import Progressspinner from 'primevue/progressspinner'; ``` --- ### Skeleton **Name:** `skeleton` **Description:** Placeholder for loading content **Documentation:** [https://primevue.org/skeleton/](https://primevue.org/skeleton/) **Usage Example:** ```vue import Skeleton from 'primevue/skeleton'; ``` --- ### Tag **Name:** `tag` **Description:** Label component for categorization **Documentation:** [https://primevue.org/tag/](https://primevue.org/tag/) **Usage Example:** ```vue import Tag from 'primevue/tag'; ``` --- ### Terminal **Name:** `terminal` **Description:** Command line interface **Documentation:** [https://primevue.org/terminal/](https://primevue.org/terminal/) **Usage Example:** ```vue import Terminal from 'primevue/terminal'; ``` --- ## Overlay ### Confirmdialog **Name:** `confirmdialog` **Description:** Modal dialog for user confirmation **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Confirmdialog from 'primevue/confirmdialog'; ``` --- ### Confirmpopup **Name:** `confirmpopup` **Description:** Popup for user confirmation **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Confirmpopup from 'primevue/confirmpopup'; ``` --- ### Dialog **Name:** `dialog` **Description:** Modal dialog component **Documentation:** [https://primevue.org/dialog/](https://primevue.org/dialog/) **Usage Example:** ```vue import Dialog from 'primevue/dialog'; ``` --- ### Drawer **Name:** `drawer` **Description:** Sliding panel overlay **Documentation:** [https://primevue.org/drawer/](https://primevue.org/drawer/) **Usage Example:** ```vue import Drawer from 'primevue/drawer'; ``` --- ### Dynamicdialog **Name:** `dynamicdialog` **Description:** Programmatically created dialogs **Documentation:** [https://primevue.org/dynamicdialog/](https://primevue.org/dynamicdialog/) **Usage Example:** ```vue import Dynamicdialog from 'primevue/dynamicdialog'; ``` --- ### Overlaypanel **Name:** `overlaypanel` **Description:** Overlay panel component **Documentation:** [https://primevue.org/overlaypanel/](https://primevue.org/overlaypanel/) **Usage Example:** ```vue import Overlaypanel from 'primevue/overlaypanel'; ``` --- ### Popover **Name:** `popover` **Description:** Overlay component triggered by user interaction **Documentation:** [https://primevue.org/popover/](https://primevue.org/popover/) **Usage Example:** ```vue import Popover from 'primevue/popover'; ``` --- ### Sidebar **Name:** `sidebar` **Description:** Side panel overlay **Documentation:** [https://primevue.org/sidebar/](https://primevue.org/sidebar/) **Usage Example:** ```vue import Sidebar from 'primevue/sidebar'; ``` --- ### Tooltip **Name:** `tooltip` **Description:** Informational popup on hover **Documentation:** [https://primevue.org/tooltip/](https://primevue.org/tooltip/) **Usage Example:** ```vue import Tooltip from 'primevue/tooltip'; ``` --- ## Panel ### Accordion **Name:** `accordion` **Description:** Groups a collection of contents in tabs **Documentation:** [https://primevue.org/accordion/](https://primevue.org/accordion/) **Usage Example:** ```vue import Accordion from 'primevue/accordion'; ``` --- ### Accordioncontent **Name:** `accordioncontent` **Description:** Content container for accordion panels **Documentation:** [https://primevue.org/accordion/](https://primevue.org/accordion/) **Usage Example:** ```vue import Accordioncontent from 'primevue/accordioncontent'; ``` --- ### Accordionheader **Name:** `accordionheader` **Description:** Header section for accordion panels **Documentation:** [https://primevue.org/accordion/](https://primevue.org/accordion/) **Usage Example:** ```vue import Accordionheader from 'primevue/accordionheader'; ``` --- ### Accordionpanel **Name:** `accordionpanel` **Description:** Individual panel in an accordion **Documentation:** [https://primevue.org/accordion/](https://primevue.org/accordion/) **Usage Example:** ```vue import Accordionpanel from 'primevue/accordionpanel'; ``` --- ### Accordiontab **Name:** `accordiontab` **Description:** Legacy accordion tab component **Documentation:** [https://primevue.org/accordion/](https://primevue.org/accordion/) **Usage Example:** ```vue import Accordiontab from 'primevue/accordiontab'; ``` --- ### Card **Name:** `card` **Description:** Flexible content container **Documentation:** [https://primevue.org/card/](https://primevue.org/card/) **Usage Example:** ```vue import Card from 'primevue/card'; ``` --- ### Deferredcontent **Name:** `deferredcontent` **Description:** Loads content on demand **Documentation:** [https://primevue.org/deferredcontent/](https://primevue.org/deferredcontent/) **Usage Example:** ```vue import Deferredcontent from 'primevue/deferredcontent'; ``` --- ### Divider **Name:** `divider` **Description:** Separator component **Documentation:** [https://primevue.org/divider/](https://primevue.org/divider/) **Usage Example:** ```vue import Divider from 'primevue/divider'; ``` --- ### Fieldset **Name:** `fieldset` **Description:** Groups related form elements **Documentation:** [https://primevue.org/fieldset/](https://primevue.org/fieldset/) **Usage Example:** ```vue import Fieldset from 'primevue/fieldset'; ``` --- ### Panel **Name:** `panel` **Description:** Collapsible content container **Documentation:** [https://primevue.org/panel/](https://primevue.org/panel/) **Usage Example:** ```vue import Panel from 'primevue/panel'; ``` --- ### Scrollpanel **Name:** `scrollpanel` **Description:** Scrollable content container **Documentation:** [https://primevue.org/scrollpanel/](https://primevue.org/scrollpanel/) **Usage Example:** ```vue import Scrollpanel from 'primevue/scrollpanel'; ``` --- ### Splitter **Name:** `splitter` **Description:** Resizable split panels **Documentation:** [https://primevue.org/splitter/](https://primevue.org/splitter/) **Usage Example:** ```vue import Splitter from 'primevue/splitter'; ``` --- ### Splitterpanel **Name:** `splitterpanel` **Description:** Panel within splitter **Documentation:** [https://primevue.org/splitter/](https://primevue.org/splitter/) **Usage Example:** ```vue import Splitterpanel from 'primevue/splitterpanel'; ``` --- ### Tab **Name:** `tab` **Description:** Individual tab component **Documentation:** [https://primevue.org/tabs/](https://primevue.org/tabs/) **Usage Example:** ```vue import Tab from 'primevue/tab'; ``` --- ### Tablist **Name:** `tablist` **Description:** Container for tabs **Documentation:** [https://primevue.org/tabs/](https://primevue.org/tabs/) **Usage Example:** ```vue import Tablist from 'primevue/tablist'; ``` --- ### Tabpanel **Name:** `tabpanel` **Description:** Content panel for tabs **Documentation:** [https://primevue.org/tabs/](https://primevue.org/tabs/) **Usage Example:** ```vue import Tabpanel from 'primevue/tabpanel'; ``` --- ### Tabpanels **Name:** `tabpanels` **Description:** Container for tab panels **Documentation:** [https://primevue.org/tabs/](https://primevue.org/tabs/) **Usage Example:** ```vue import Tabpanels from 'primevue/tabpanels'; ``` --- ### Tabs **Name:** `tabs` **Description:** Modern tab container **Documentation:** [https://primevue.org/tabs/](https://primevue.org/tabs/) **Usage Example:** ```vue import Tabs from 'primevue/tabs'; ``` --- ### Tabview **Name:** `tabview` **Description:** Legacy tabbed interface **Documentation:** [https://primevue.org/tabview/](https://primevue.org/tabview/) **Usage Example:** ```vue import Tabview from 'primevue/tabview'; ``` --- ## Stepper ### Step **Name:** `step` **Description:** Individual step in stepper **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Step from 'primevue/step'; ``` --- ### Stepitem **Name:** `stepitem` **Description:** Item within step **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Stepitem from 'primevue/stepitem'; ``` --- ### Steplist **Name:** `steplist` **Description:** List of steps **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Steplist from 'primevue/steplist'; ``` --- ### Steppanel **Name:** `steppanel` **Description:** Content panel for stepper **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Steppanel from 'primevue/steppanel'; ``` --- ### Steppanels **Name:** `steppanels` **Description:** Container for step panels **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Steppanels from 'primevue/steppanels'; ``` --- ### Stepper **Name:** `stepper` **Description:** Multi-step process navigation **Documentation:** [https://primevue.org/stepper/](https://primevue.org/stepper/) **Usage Example:** ```vue import Stepper from 'primevue/stepper'; ``` --- ## Uncategorized ### Config **Name:** `config` **Description:** Configuration utility for global PrimeVue settings including theming, locale, and component options **Documentation:** [https://primevue.org/config/](https://primevue.org/config/) **Usage Example:** ```vue import Config from 'primevue/config'; ``` --- ### Confirmationeventbus **Name:** `confirmationeventbus` **Description:** Internal event bus system for managing confirmation dialog events and communication **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Confirmationeventbus from 'primevue/confirmationeventbus'; ``` --- ### Confirmationoptions **Name:** `confirmationoptions` **Description:** TypeScript interface definitions for confirmation dialog configuration options **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Confirmationoptions from 'primevue/confirmationoptions'; ``` --- ### Dynamicdialogeventbus **Name:** `dynamicdialogeventbus` **Description:** Internal event bus system for managing dynamic dialog creation and communication **Documentation:** [https://primevue.org/dynamicdialog/](https://primevue.org/dynamicdialog/) **Usage Example:** ```vue import Dynamicdialogeventbus from 'primevue/dynamicdialogeventbus'; ``` --- ### Dynamicdialogoptions **Name:** `dynamicdialogoptions` **Description:** TypeScript interface definitions for dynamic dialog configuration options **Documentation:** [https://primevue.org/dynamicdialog/](https://primevue.org/dynamicdialog/) **Usage Example:** ```vue import Dynamicdialogoptions from 'primevue/dynamicdialogoptions'; ``` --- ### Menuitem **Name:** `menuitem` **Description:** TypeScript interface definitions for menu item configuration shared across menu components **Documentation:** [https://primevue.org/menuitem/](https://primevue.org/menuitem/) **Usage Example:** ```vue import Menuitem from 'primevue/menuitem'; ``` --- ### Overlayeventbus **Name:** `overlayeventbus` **Description:** Internal event bus system for managing overlay component events and communication **Documentation:** [https://primevue.org/overlaypanel/](https://primevue.org/overlaypanel/) **Usage Example:** ```vue import Overlayeventbus from 'primevue/overlayeventbus'; ``` --- ### Passthrough **Name:** `passthrough` **Description:** Utility for customizing component styling and attributes through pass-through properties **Documentation:** [https://primevue.org/passthrough/](https://primevue.org/passthrough/) **Usage Example:** ```vue import Passthrough from 'primevue/passthrough'; ``` --- ### Toasteventbus **Name:** `toasteventbus` **Description:** Internal event bus system for managing toast notification events and communication **Documentation:** [https://primevue.org/toast/](https://primevue.org/toast/) **Usage Example:** ```vue import Toasteventbus from 'primevue/toasteventbus'; ``` --- ### Toastservice **Name:** `toastservice` **Description:** Service for programmatically displaying and managing toast notifications **Documentation:** [https://primevue.org/toast/](https://primevue.org/toast/) **Usage Example:** ```vue import Toastservice from 'primevue/toastservice'; ``` --- ### Toolbar **Name:** `toolbar` **Description:** Container for action buttons **Documentation:** [https://primevue.org/toolbar/](https://primevue.org/toolbar/) **Usage Example:** ```vue import Toolbar from 'primevue/toolbar'; ``` --- ### Treenode **Name:** `treenode` **Description:** Individual node in tree **Documentation:** [https://primevue.org/tree/](https://primevue.org/tree/) **Usage Example:** ```vue import Treenode from 'primevue/treenode'; ``` --- ## Utilities ### Column **Name:** `column` **Description:** Table column component for DataTable **Documentation:** [https://primevue.org/datatable/](https://primevue.org/datatable/) **Usage Example:** ```vue import Column from 'primevue/column'; ``` --- ### Columngroup **Name:** `columngroup` **Description:** Groups table columns **Documentation:** [https://primevue.org/datatable/](https://primevue.org/datatable/) **Usage Example:** ```vue import Columngroup from 'primevue/columngroup'; ``` --- ### Confirmationservice **Name:** `confirmationservice` **Description:** Service for programmatically displaying and managing confirmation dialogs **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Confirmationservice from 'primevue/confirmationservice'; ``` --- ### Dialogservice **Name:** `dialogservice` **Description:** Service for dynamic dialog creation **Documentation:** [https://primevue.org/dialogservice/](https://primevue.org/dialogservice/) **Usage Example:** ```vue import Dialogservice from 'primevue/dialogservice'; ``` --- ### Fluid **Name:** `fluid` **Description:** Container with fluid width **Documentation:** [https://primevue.org/fluid/](https://primevue.org/fluid/) **Usage Example:** ```vue import Fluid from 'primevue/fluid'; ``` --- ### Portal **Name:** `portal` **Description:** Renders content in different DOM location **Documentation:** [https://primevue.org/portal/](https://primevue.org/portal/) **Usage Example:** ```vue import Portal from 'primevue/portal'; ``` --- ### Row **Name:** `row` **Description:** Table row component **Documentation:** [https://primevue.org/datatable/](https://primevue.org/datatable/) **Usage Example:** ```vue import Row from 'primevue/row'; ``` --- ### Scrolltop **Name:** `scrolltop` **Description:** Button to scroll to top **Documentation:** [https://primevue.org/scrolltop/](https://primevue.org/scrolltop/) **Usage Example:** ```vue import Scrolltop from 'primevue/scrolltop'; ``` --- ### Terminalservice **Name:** `terminalservice` **Description:** Service for terminal component **Documentation:** [https://primevue.org/terminal/](https://primevue.org/terminal/) **Usage Example:** ```vue import Terminalservice from 'primevue/terminalservice'; ``` --- ### Useconfirm **Name:** `useconfirm` **Description:** Composable for confirmation dialogs **Documentation:** [https://primevue.org/confirmdialog/](https://primevue.org/confirmdialog/) **Usage Example:** ```vue import Useconfirm from 'primevue/useconfirm'; ``` --- ### Usedialog **Name:** `usedialog` **Description:** Composable for dynamic dialogs **Documentation:** [https://primevue.org/dynamicdialog/](https://primevue.org/dynamicdialog/) **Usage Example:** ```vue import Usedialog from 'primevue/usedialog'; ``` --- ### Usestyle **Name:** `usestyle` **Description:** Composable for dynamic styling **Documentation:** [https://primevue.org/usestyle/](https://primevue.org/usestyle/) **Usage Example:** ```vue import Usestyle from 'primevue/usestyle'; ``` --- ### Usetoast **Name:** `usetoast` **Description:** Composable for toast notifications **Documentation:** [https://primevue.org/toast/](https://primevue.org/toast/) **Usage Example:** ```vue import Usetoast from 'primevue/usetoast'; ``` ---