@primevue/mcp 4.5.5 → 5.0.0-rc.2

package/data/llms/guides/guides/animations.md

@@ -0,0 +1,119 @@
+# Animations
+
+Various PrimeVue Components utilize native CSS animations to provide an enhanced user experience. The default animations are based on the best practices recommended by the usability experts. In case you need to customize the default animations, this documentation covers the entire set of built-in animations.
+
+## Introduction
+
+Various PrimeVue Components utilize native CSS animations to provide an enhanced user experience. The default animations are based on the best practices recommended by the usability experts. In case you need to customize the default animations, this documentation covers the entire set of built-in animations. Animations are defined using a combination of style classes and keyframes. The ⁠ .{classname}-enter-active and ⁠ .{classname}-leave-active classes specify the animation name, duration, and easing function. You can customize animations globally by overriding the default animation classes, affecting all components. Alternatively, you can apply scoped classes to individual components to modify their animations independently. For demo purposes, this second approach is used throughout the next sections.
+
+## Anchored Overlays
+
+Anchored overlays are the components that have a floating ui positioned relatively to another element such as Select, Popover. The enter and leave animations are defined with the .p-anchored-overlay-enter-active and .p-anchored-overlay-leave-active classes.
+
+```vue
+.p-anchored-overlay-enter-active {
+    animation: demo-overlay-in 300ms ease-out;
+}
+
+.p-anchored-overlay-leave-active {
+    animation: demo-overlay-out 250ms ease-in;
+}
+
+@keyframes demo-overlay-in {
+    from {
+        opacity: 0;
+        transform: translateY(10%);
+    }
+}
+
+@keyframes demo-overlay-out {
+    to {
+        opacity: 0;
+        transform: translateY(10%);
+    }
+}
+```
+
+## Collapsibles
+
+Collapsible components have a content that is toggleable including Accordion, Panel, Fieldset, Stepper and PanelMenu. The enter and leave animations are defined with the .p-collapsible-enter-active and .p-collapsible-leave-active classes.
+
+```vue
+.p-collapsible-enter-active {
+    animation: demo-collapsible-expand 500ms cubic-bezier(0.65, 0, 0.35, 1);
+}
+
+.p-collapsible-leave-active {
+    animation: demo-collapsible-collapse 500ms cubic-bezier(0.65, 0, 0.35, 1);
+}
+
+@keyframes demo-collapsible-expand {
+    from {
+        opacity: 0;
+        grid-template-rows: 0fr;
+        transform: scale(0.93);
+    }
+    to {
+        opacity: 1;
+        grid-template-rows: 1fr;
+    }
+}
+
+@keyframes demo-collapsible-collapse {
+    from {
+        opacity: 1;
+        grid-template-rows: 1fr;
+    }
+    to {
+        opacity: 0;
+        grid-template-rows: 0fr;
+        transform: scale(0.93);
+    }
+}
+```
+
+## Dialog
+
+Overlays such as Dialog and Drawer are positioned relative to the viewport and have their own animations.
+
+```vue
+.p-dialog-enter-active {
+    animation: demo-dialog-in 500ms ease-out;
+}
+
+.p-dialog-leave-active {
+    animation: demo-dialog-out 500ms ease-in;
+}
+
+@keyframes demo-dialog-in {
+    from {
+        opacity: 0;
+        transform: translateY(-10%) scale(1.1);
+        filter: blur(10px);
+    }
+}
+
+@keyframes demo-dialog-out {
+    to {
+        opacity: 0;
+        transform: translateY(200%) rotate(-90deg);
+    }
+}
+```
+
+## Disable
+
+Individual animations can be reduced and even disabled completely using the animation duration.
+
+```vue
+@media (prefers-reduced-motion: reduce) {
+    .p-anchored-overlay-enter-active,
+    .p-anchored-overlay-leave-active {
+        animation-duration: 0s !important;
+    }
+}
+```
+
+## Reference
+
+List of class names of the CSS animations used by the components. Component Enter Class Leave Class Accordion .p-collapsible-enter-active .p-collapsible-leave-active AutoComplete .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active CascadeSelect .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active ColorPicker .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active ConfirmPopup .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active ContextMenu .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active DatePicker .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active Dialog .p-dialog-enter-active .p-dialog-leave-active Drawer .p-drawer-enter-active .p-drawer-leave-active Fieldset .p-collapsible-enter-active .p-collapsible-leave-active Galleria .p-galleria-enter-active .p-galleria-leave-active Image .p-image-original-enter-active .p-image-original-leave-active Menu .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active Message .p-message-enter-active .p-message-leave-active Modal Masks .p-overlay-mask-enter-active .p-overlay-mask-leave-active MultiSelect .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active Panel .p-collapsible-enter-active .p-collapsible-leave-active PanelMenu .p-collapsible-enter-active .p-collapsible-leave-active Password .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active Select .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active Stepper .p-collapsible-enter-active .p-collapsible-leave-active TieredMenu .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active TreeSelect .p-anchored-overlay-enter-active .p-anchored-overlay-leave-active

package/data/llms/guides/guides/rtl.md

@@ -0,0 +1,7 @@
+# RTL Support
+
+Right-to-left direction support of PrimeVue.
+
+## Configuration
+
+The PrimeVue components natively support Right-to-Left (RTL) text direction through a modern CSS implementation utilizing FlexBox and classes like *-inline-start and *-block-end . Consequently, no JavaScript configuration is necessary; setting the document's text direction to RTL is sufficient to enable this feature. The RTL setting can either be set using the dir attribute or with the direction style property.

package/data/llms/guides/icons.md

@@ -0,0 +1,136 @@
+# Icons
+
+@primeicons/vue is the default icon library of PrimeVue with over 300 icons as standalone Vue components developed by PrimeTek. The library is optional as PrimeVue components can use any icon with templating.
+
+## Download
+
+@primeicons/vue is available at npm, run the following command to download it to your project.
+
+```vue
+npm install @primeicons/vue
+```
+
+## Import
+
+Each icon is a standalone Vue component. Import them individually for optimal tree-shaking, or use the named exports from the package root.
+
+```vue
+// Tree-shakeable, per-icon imports (recommended)
+import Search from '@primeicons/vue/search';
+import User from '@primeicons/vue/user';
+
+// Named imports from the package root
+import { Search, User, Check } from '@primeicons/vue';
+```
+
+## Figma
+
+PrimeIcons library is now available on Figma Community . By adding them as a library, you can easily use these icons in your designs.
+
+## Basic
+
+Each icon is a standalone Vue component rendered as an inline SVG, displayed by importing it from @primeicons/vue and using it as a tag.
+
+```vue
+<template>
+    <Check />
+    <Times />
+    <Search />
+    <User />
+</template>
+
+<script setup>
+import Check from '@primeicons/vue/check';
+import Times from '@primeicons/vue/times';
+import Search from '@primeicons/vue/search';
+import User from '@primeicons/vue/user';
+<\/script>
+```
+
+## Size
+
+Size of an icon is controlled with the size property that accepts a number in pixels or any CSS length value.
+
+```vue
+<template>
+    <Check :size="16" />
+    <Times :size="24" />
+    <Search :size="32" />
+    <User :size="40" />
+</template>
+
+<script setup>
+import Check from '@primeicons/vue/check';
+import Times from '@primeicons/vue/times';
+import Search from '@primeicons/vue/search';
+import User from '@primeicons/vue/user';
+<\/script>
+```
+
+## Color
+
+Icon color is defined with the color property which is inherited from the parent with currentColor by default.
+
+```vue
+<template>
+    <Check color="slateblue" />
+    <Times color="green" />
+    <Search color="var(--p-primary-color)" />
+    <User color="#708090" />
+</template>
+
+<script setup>
+import Check from '@primeicons/vue/check';
+import Times from '@primeicons/vue/times';
+import Search from '@primeicons/vue/search';
+import User from '@primeicons/vue/user';
+<\/script>
+```
+
+## Spin
+
+Use a spin animation utility like animate-spin from Tailwind apply rotation.
+
+```vue
+<template>
+    <Spinner class="animate-spin" :size="32" />
+    <Cog class="animate-spin" :size="32" />
+</template>
+
+<script setup>
+import Spinner from '@primeicons/vue/spinner';
+import Cog from '@primeicons/vue/cog';
+<\/script>
+```
+
+## Programmatic
+
+Icon components can be referenced programmatically by passing the component itself to APIs that accept an icon , such as the model of a Menu.
+
+```vue
+<template>
+    <div class="card flex justify-center">
+        <Menu :model="items" />
+    </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import Plus from '@primeicons/vue/plus';
+import Download from '@primeicons/vue/download';
+
+const items = ref([
+    {
+        label: 'File',
+        items: [
+            { label: 'New', icon: Plus },
+            { label: 'Open', icon: Download }
+        ]
+    }
+]);
+<\/script>
+```
+
+## List
+
+Here is the full list of icons available as Vue components. Click any icon to copy its import statement.

package/data/llms/guides/installation.md

@@ -0,0 +1,3 @@
+# Installation
+
+How to set up PrimeVue in your project. Select your framework to get started.

package/data/llms/guides/laravel.md

@@ -0,0 +1,66 @@
+# Install PrimeVue with Laravel
+
+Setting up PrimeVue in a Laravel project.
+
+## Download
+
+PrimeVue is available for download on npm registry .
+
+```vue
+# Using npm
+npm install primevue @primeuix/themes
+
+# Using yarn
+yarn add primevue @primeuix/themes
+
+# Using pnpm
+pnpm add primevue @primeuix/themes
+```
+
+## Plugin
+
+PrimeVue plugin is required to be installed as an application plugin to set up the default configuration . The plugin is lightweight, and only utilized for configuration purposes.
+
+```vue
+import { createApp } from 'vue';
+import PrimeVue from 'primevue/config';
+
+const app = createApp(App);
+app.use(PrimeVue);
+```
+
+## Theme
+
+Configure PrimeVue to use a theme like Aura.
+
+```vue
+import { createApp } from 'vue';
+import PrimeVue from 'primevue/config';
+import Aura from '@primeuix/themes/aura';
+
+const app = createApp(App);
+app.use(PrimeVue, {
+    theme: {
+        preset: Aura
+    }
+});
+```
+
+## Verify
+
+Verify your setup by adding a component such as Button . Each component can be imported and registered individually so that you only include what you use for bundle optimization. Import path is available in the documentation of the corresponding component.
+
+```vue
+import Button from "primevue/button"
+
+const app = createApp(App);
+app.component('Button', Button);
+```
+
+## Examples
+
+We've created various samples for the popular options in the Vue ecosystem. Visit the primevue-examples repository for more samples including laravel-quickstart and inertia-quickstart .
+
+## Next Steps
+
+Welcome to the Prime UI Ecosystem! Once you have PrimeVue up and running, we recommend exploring the following resources to gain a deeper understanding of the library. Global configuration Auto imports with tree-shaking Customization of styles Pass through attributes Getting support

package/data/llms/guides/llms.md

@@ -0,0 +1,15 @@
+# LLMs.txt
+
+LLM-optimized documentation endpoints for PrimeVue components.
+
+## /llms.txt
+
+The llms.txt file is an industry standard that helps AI models better understand and navigate the PrimeVue documentation. It lists key pages in a structured format, making it easier for LLMs to retrieve relevant information. Open llms.txt
+
+## /llms-full.txt
+
+The llms-full.txt file is a complete list of all the pages in the PrimeVue documentation. It is used to help AI models understand the entire documentation set. Open llms-full.txt
+
+## .md extension
+
+Add a .md to a page's URL to display a Markdown version of that page. Open /button.md

package/data/llms/guides/mcp.md

@@ -0,0 +1,104 @@
+# MCP Server
+
+Model Context Protocol (MCP) server for PrimeVue component library. Provides AI assistants with comprehensive access to PrimeVue component documentation.
+
+## Introduction
+
+Model Context Protocol (MCP) is an open standard that enables AI models to connect with external tools and data sources . The PrimeVue MCP server provides AI assistants with comprehensive access to: Component documentation including props , events , slots , and methods Theming and styling with Pass Through and design tokens Code examples and usage patterns Accessibility information Installation and configuration guides
+
+## Claude Code
+
+Add the PrimeVue MCP server using the CLI. After adding, start a new session and use /mcp to verify the connection.
+
+## VS Code
+
+Create .vscode/mcp.json in your project or ~/Library/Application Support/Code/User/mcp.json for global configuration.
+
+```vue
+{
+    "servers": {
+        "primevue": {
+            "command": "npx",
+            "args": ["-y", "@primevue/mcp"]
+        }
+    }
+}
+```
+
+## OpenAI Codex
+
+Add the PrimeVue MCP server using the CLI or edit ~/.codex/config.toml directly.
+
+```vue
+# Using the CLI
+codex mcp add primevue -- npx -y @primevue/mcp
+
+# Or edit ~/.codex/config.toml
+[mcp_servers.primevue]
+command = "npx"
+args = ["-y", "@primevue/mcp"]
+```
+
+## Cursor
+
+Create .cursor/mcp.json in your project or ~/.cursor/mcp.json for global configuration.
+
+```vue
+{
+    "mcpServers": {
+        "primevue": {
+            "command": "npx",
+            "args": ["-y", "@primevue/mcp"]
+        }
+    }
+}
+```
+
+## Windsurf
+
+Edit ~/.codeium/windsurf/mcp_config.json to add the PrimeVue MCP server.
+
+```vue
+{
+    "mcpServers": {
+        "primevue": {
+            "command": "npx",
+            "args": ["-y", "@primevue/mcp"]
+        }
+    }
+}
+```
+
+## Zed
+
+Add to your Zed settings at ~/.config/zed/settings.json (Linux) or ~/Library/Application Support/Zed/settings.json (macOS).
+
+```vue
+{
+    "context_servers": {
+        "primevue": {
+            "command": {
+                "path": "npx",
+                "args": ["-y", "@primevue/mcp"]
+            }
+        }
+    }
+}
+```
+
+## Available Tools
+
+Component Information Tools for exploring and understanding PrimeVue components. list_components : List all PrimeVue components with categories get_component : Get detailed info about a specific component search_components : Search components by name or description get_component_props : Get all props for a component get_component_events : Get all events for a component get_component_methods : Get all methods for a component get_component_slots : Get all slots for a component compare_components : Compare two components side by side Code Examples Tools for retrieving code samples and generating templates. get_usage_example : Get code examples for a component list_examples : List all available code examples get_example : Get a specific example by component and section generate_component_template : Generate a basic component template Theming & Styling Tools for customizing component appearance and styling. get_component_pt : Get Pass Through options for DOM customization get_component_tokens : Get design tokens (CSS variables) get_component_styles : Get CSS class names get_theming_guide : Get detailed theming guide get_passthrough_guide : Get Pass Through customization guide get_tailwind_guide : Get Tailwind CSS integration guide Documentation & Guides Tools for accessing PrimeVue documentation and guides. list_guides : List all guides and documentation pages get_guide : Get a specific guide by name get_configuration : Get PrimeVue configuration options get_installation : Get installation instructions get_accessibility_guide : Get accessibility guide get_accessibility_info : Get accessibility info for a component Search & Discovery Tools for finding components based on various criteria. search_all : Search across components, guides, and props suggest_component : Suggest components based on use case find_by_prop : Find components with a specific prop find_by_event : Find components that emit a specific event find_components_with_feature : Find components supporting a feature get_related_components : Find related components
+
+## Example Prompts
+
+Once installed, try asking your AI assistant:
+
+```vue
+"What are all the props available for the DataTable component?"
+"Show me how to implement row selection in DataTable"
+"How do I customize Button styles using Pass Through?"
+"What design tokens are available for the Card component?"
+"Find me a component for selecting multiple items from a list"
+"Compare AutoComplete and Select components"
+```

package/data/llms/guides/migration/v4.md

@@ -0,0 +1,15 @@
+# Migration
+
+Migration guide to PrimeVue v4.
+
+## Overview
+
+At PrimeTek, we have been developing UI component libraries since 2008. The web continues to undergo technological advancements, and as a result, we have to modernize and update our libraries to stay relevant. PrimeVue v4 is the next-generation version that fully embraces modern Web APIs and removes technical debt like the legacy-styled mode. Every component has been reviewed and enhanced. As part of our commitment to our products and the community, PrimeVue v3 will continue to be maintained until the end of 2024. The most notable feature is the new styled mode implementation. Previous iterations use SASS at an external repo called primevue-sass-theme which requires compilation of a theme.css a file. This file had to be included in the application and need to be swapped at runtime for basic tasks like dark mode or primary color changes. In v4, styled mode is now part of the core, SASS is not used at all, and a new design token based architecture that fully utilizes CSS variables has been created. The new API is modern and superior to the legacy styled mode. Names of some of the components have been changed to more common alternatives for example, Popover replaced OverlayPanel and InputSwitch is now called ToggleSwitch . Each component has been reviewed for a consistent naming between CSS class names and PT sections. An example would be the option element of a Select component that uses p-select-option for the class name. Components have been utilized more within other components, for instance Dialog close button is not actually a PrimeVue button so that closeButtonProps can be used to enable the features of button like outlined, raised and more. Whenever a component is using another component, in v3 the pt sections were causing confusion, to prevent this pc prefix is added to indicate that the PT section is actually a PrimeVue component, not a simple DOM element. This is especially useful because PT allows passing arbitrary attributes to DOM elements whereas if the element is actually a PrimeVue component, props can also be passed.
+
+## Compatible
+
+Renamed Components Old names are deprecated but still functional, migrate to new import paths instead e.g. primevue/calendar becomes primevue/datepicker . Calendar -> DatePicker . Dropdown -> Select . InputSwitch -> ToggleSwitch . OverlayPanel -> Popover . Sidebar -> Drawer . Deprecated Components Components that are deprecated since their functionality is provided by other components. Chips | Use AutoComplete with multiple enabled and typeahead disabled. TabMenu | Use Tabs without panels. Steps | Use Stepper without panels. InlineMessage | Use Message component. BadgeDirective | Use OverlayBadge instead. TabView | Use the new Tabs components. Accordion | Use with the new AccordionHeader and AccordionContent components. Important Tickets Issue tickets with detailed information about component internal changes. #5426 #5437
+
+## Breaking
+
+SASS Themes The styled mode theming has been reimplemented from scratch based on an all-new architecture. The theme.css and the primevue/resources do not exist anymore, so any imports of these assets needs to be removed. If you had a custom theme for v3, the theme needs to be recreated using the new APIs. See the customization section at styled mode for details. Removed Components TriStateCheckbox | Use Checkbox with indeterminate option. DataViewLayoutOptions | Use SelectButton instead. Removed APIs switchTheme function, use the new APIs like usePreset instead to dynamic theme switching. Relocated APIs Imports from primevue/api have been relocated to @primevue/core/api . Removed Files Themes under the primevue/resources path, migration to new styled mode is necessary. The legacy Tailwind preset at primevue/passthrough/tailwind . Message and InlineMessage InlineMessage is deprecated due to overlap with the Message . The spacing, closable and life properties of the Message have breaking changes to provide InlineMessage functionality. Default margin is removed, closable is false by default and messages do not disappear automatically. PT Section Names The experimental PassThrough feature is not production ready, there are changes on the PT section names due to alignment with CSS classes for certain components. If when component element is another PrimeVue component pc prefix is added for indication. Review the Pass Through section of a component for the new API. The Tailwind CSS presets for the unstyled mode are not updated to v4 yet. Removed Features Sidebar/Drawer size property is removed, use a responsive class utilty as replacement, demos have new examples. Rating cancel prop is removed as toggling the selected star value clears it. Inplace closable is removed in favor of templating and closeCallback prop. Removed Style Classes .p-link , use a button in link mode. .p-highlight , each component have its own class such as .p-select-option-selected . .p-fluid , use the new built-in fluid property of the supported components or the Fluid component. Nuxt Module The nuxt-primevue module has been replaced with the new @primevue/nuxt-module . The old module is still maintained for v3 users. PrimeFlex CSS In case you are using PrimeFlex CSS library, upgrade to PrimeFlex v4 since PrimeFlex v3 is not compatible with PrimeVue v4+.

package/data/llms/guides/migration/v5.md

@@ -0,0 +1,15 @@
+# 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: CommandMenu Compare Gallery InputTags InputPassword InputColor Sidebar ScrollArea 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 Galleria v5 Gallery component v6 Image v5 Gallery component v6 ColorPicker v5 InputColor component v6 ImageCompare v5 Compare component v6 ScrollPanel v5 ScrollArea component v6 Password v5 InputPassword component v6 InputMask v5 Mask directive v6 PanelMenu v5 Menu component with toggleable option v6 Chart v5 PrimeUI PRO Charts v6 Editor v5 PrimeUI PRO Editor v6 @primevue/icons package v5 SVG icons via @primeicons/vue v6 AutoComplete multiple property v5 InputTags component with typeahead v6 Button label , icon , iconPos , iconClass properties v5 Place the icon and label directly inside the default slot, ordering them as needed v6 Button badge , badgeClass , badgeSeverity properties v5 Compose a Badge component inside the default slot v6 Button loading and loadingIcon properties v5 Render your own spinner inside the default slot and toggle disabled v6 Tabs scrollable property v5 Scrolling is now the default behavior if necessary v6 Carousel data-driven ( value ) usage v5 Compound API with CarouselContent , CarouselItem and CarouselIndicators helpers. v6
+
+## 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 Dropdown v4 Select component Chips v4 InputTags component InputChips v4 InputTags component InputSwitch v4 ToggleSwitch component OverlayPanel v4 Popover component TabView v4 Tabs component AccordionTab v4 Accordion with AccordionPanel / AccordionHeader / AccordionContent BadgeDirective ( v-badge ) v4 OverlayBadge component InlineMessage v4 Message component TabMenu v4 Tabs component (without panels) AutoComplete removeTokenIcon property and removetokenicon slot v4 chipIcon property and chipicon slot AutoComplete item-select / item-unselect events v4 option-select / option-unselect events AutoComplete loadingIcon property and loadingicon slot v4 loader property and loader slot AutoComplete dropdownbutton slot v4 dropdown slot Accordion activeIndex property and update:activeIndex / tab-open / tab-close / tab-click events v4 value property and update:value event Button plain property v4 contrast severity PrimeVue config inputStyle option v4 inputVariant option CascadeSelect panelStyle / panelClass / panelProps properties v4 overlayStyle / overlayClass / overlayProps properties Select panelStyle / panelClass properties v4 overlayStyle / overlayClass properties InputNumber incrementButtonIcon / decrementButtonIcon properties and incrementbuttonicon / decrementbuttonicon slots v4 incrementIcon / decrementIcon properties and incrementicon / decrementicon slots Column rowtogglericon / nodetogglericon slots v4 rowtoggleicon / nodetoggleicon slots DataTable reorderindicatorupicon / reorderindicatordownicon slots v4 rowreorderindicatorupicon / rowreorderindicatordownicon slots Tree searchicon / togglericon / nodetogglericon slots v4 filtericon / nodetoggleicon slots TreeSelect itemtogglericon slot v4 itemtoggleicon slot TreeSelect triggericon slot v4 dropdownicon slot Dock icon slot v4 itemicon slot Menu submenuheader slot v4 submenulabel slot Menubar menubutton / menubuttonicon slots v4 button / buttonicon slots MegaMenu menubutton / menubuttonicon slots v4 button / buttonicon slots Message sticky property v4 life property to control auto-close UniqueComponentId utility ( @primevue/core/utils ) v4 uuid from @primeuix/utils Component instance hasFluid getter (BaseInput) v4 $fluid Component instance filled getter (BaseEditableHolder) v4 $filled Root element $pc marker (set on each component's root DOM element) v4 No replacement (internal) Paginator firstpagelinkicon / prevpagelinkicon / nextpagelinkicon / lastpagelinkicon slots v4 firsticon / previcon / nexticon / lasticon slots Panel / Fieldset togglericon slot v4 toggleicon slot SplitButton menubuttonicon slot v4 dropdownicon slot Toast icon slot v4 messageicon slot OrderList / PickList item slot v4 option slot TabPanel header / headerStyle / headerClass / headerProps / headerActionProps / contentStyle / contentClass / contentProps / disabled properties and header slot (TabView-only) v4 Tabs structure ( Tab / TabList / TabPanels ) switchTheme function v4 usePreset and related theme APIs primevue/themes presets v4 @primeuix/themes nuxt-primevue module v4 @primevue/nuxt-module

package/data/llms/guides/nuxt.md

@@ -0,0 +1,141 @@
+# Install PrimeVue with Nuxt
+
+Setting up PrimeVue in a Nuxt project.
+
+## Download
+
+PrimeVue is available for download on npm registry along with the official @primevue/nuxt-module .
+
+```vue
+# Using npm
+npm install primevue@5.0.0-rc.2 @primeuix/themes@3.0.0-rc.1
+npm install --save-dev @primevue/nuxt-module@5.0.0-rc.2
+
+# Using yarn
+yarn add primevue@5.0.0-rc.2 @primeuix/themes@3.0.0-rc.1
+yarn add --dev @primevue/nuxt-module@5.0.0-rc.2
+
+# Using pnpm
+pnpm add primevue@5.0.0-rc.2 @primeuix/themes@3.0.0-rc.1
+pnpm add -D @primevue/nuxt-module@5.0.0-rc.2
+```
+
+## Module
+
+In nuxt.config file, add the @primevue/nuxt-module to the modules section and define primevue object for the configuration of the module.
+
+## Theme
+
+Configure the module to use a theme like Aura.
+
+```vue
+import Aura from '@primeuix/themes/aura';
+
+export default defineNuxtConfig({
+    modules: [
+        '@primevue/nuxt-module'
+    ],
+    primevue: {
+        options: {
+            theme: {
+                preset: Aura
+            }
+        }
+    }
+})
+```
+
+## License
+
+Provide your PrimeUI license key through the public runtime config so the Nuxt module can pass it to PrimeVue. The key may also be supplied with the NUXT_PUBLIC_PRIMEUI_LICENSE environment variable, in which case no change to nuxt.config is required.
+
+```vue
+export default defineNuxtConfig({
+    modules: ['@primevue/nuxt-module'],
+    runtimeConfig: {
+        public: {
+            PRIMEUI_LICENSE: process.env.NUXT_PUBLIC_PRIMEUI_LICENSE
+        }
+    }
+});
+```
+
+## Verify
+
+The nuxt-primevue module registers the components automatically with tree-shaking support so you may start using them instantly.
+
+```vue
+<template>
+    <Button>Verify</Button>
+</template>
+```
+
+## usePrimeVue
+
+The module installs the PrimeVue plugin by default. Disable this option if you prefer to configure PrimeVue manually e.g. with a Nuxt plugin.
+
+```vue
+primevue: {
+    usePrimeVue: true | false
+}
+```
+
+## options
+
+Main configuration settings of PrimeVue, refer to the configuration documentation for details.
+
+```vue
+import Aura from '@primeuix/themes/aura';
+
+export default defineNuxtConfig({
+    modules: [
+        '@primevue/nuxt-module'
+    ],
+    primevue: {
+        options: {
+            ripple: true,
+            inputVariant: 'filled',
+            theme: {
+                preset: Aura,
+                options: {
+                    prefix: 'p',
+                    darkModeSelector: 'system',
+                    cssLayer: false
+                }
+            }
+        }
+    }
+})
+```
+
+## autoImport
+
+The auto import feature registers components automatically with tree shaking support. Defaults to true , when disabled use include/exclude options of components and directives for manual registration. Use the prefix in components and directives to add a prefix for registration.
+
+## importPT
+
+Configures the global pass through import path. mycustompt.js file defines the configuration and exports it.
+
+## importTheme
+
+Configures the theme configuration path for the customizations of a theme in styled mode. The mytheme.js file contains the theme configuration.
+
+## components
+
+When autoImport is disabled, use the include and exclude for manual registration. The components to import and register are defined with the include option using a string array. When the value is ignored or set using the * alias, all of the components are registered. In case all components are imported, particular components can still be excluded with the exclude option. By default, for compatibility reasons, Chart and Editor components are excluded. To include them simply set the exclude option to an empty list. Use the prefix option to give a prefix to the registered component names. Component registration can be customized further by implementing the name function that gets an object representing the import metadata. name is the label of the component, as is the default export name and from is the import path.
+
+## directives
+
+When autoImport is disabled, use the include and exclude for manual registration. The names of the directives to import and register are provided using the include property. When the value is ignored or set using the * alias, all of the directives are registered. Similar to components, certain directives can be excluded and name registration can be customized.
+
+## composables
+
+Determines the composables to use, when default value is ignored or set as * all composables are imported.
+
+## Examples
+
+Nuxt based samples with different options are available at PrimeVue examples repository.
+
+## Next Steps
+
+Welcome to the Prime UI Ecosystem! Once you have PrimeVue up and running, we recommend exploring the following resources to gain a deeper understanding of the library. Global configuration Customization of styles Pass through attributes Getting support