[{"data":1,"prerenderedAt":5442},["ShallowReactive",2],{"navigation":3,"-docs-getting-started-migration-v3":958,"-docs-getting-started-migration-v3-description":5432},[4],{"title":5,"path":6,"stem":7,"children":8,"page":36},"Docs","\u002Fdocs","docs",[9,163,816,857],{"title":10,"path":11,"stem":12,"children":13,"framework":16,"category":16,"description":16,"icon":30},"Get Started","\u002Fdocs\u002Fgetting-started","docs\u002F1.getting-started\u002F1.index",[14,19,37,47,53,76,141],{"title":15,"path":11,"stem":12,"framework":16,"category":16,"description":17,"icon":18},"Introduction",null,"Nuxt UI is a comprehensive Vue UI component library (Nuxt optional), offering 125+ accessible, Tailwind CSS components for building modern web applications.","i-lucide-house",{"title":20,"framework":16,"category":16,"description":16,"shadow":21,"path":22,"stem":23,"children":24,"page":36},"Installation",true,"\u002Fdocs\u002Fgetting-started\u002Finstallation","docs\u002F1.getting-started\u002F2.installation",[25,31],{"title":20,"path":26,"stem":27,"framework":28,"category":16,"description":29,"icon":30},"\u002Fdocs\u002Fgetting-started\u002Finstallation\u002Fnuxt","docs\u002F1.getting-started\u002F2.installation\u002F1.nuxt","nuxt","Learn how to install and configure Nuxt UI in your Nuxt application.","i-lucide-square-play",{"title":20,"path":32,"stem":33,"framework":34,"category":16,"description":35,"icon":30},"\u002Fdocs\u002Fgetting-started\u002Finstallation\u002Fvue","docs\u002F1.getting-started\u002F2.installation\u002F2.vue","vue","Learn how to install and configure Nuxt UI in your Vue application, compatible with both plain Vite and Inertia.",false,{"title":38,"framework":16,"category":16,"description":16,"icon":39,"shadow":21,"path":40,"stem":41,"children":42,"page":36},"Migration","i-lucide-arrow-right-left","\u002Fdocs\u002Fgetting-started\u002Fmigration","docs\u002F1.getting-started\u002F3.migration",[43],{"title":38,"path":44,"stem":45,"framework":16,"category":16,"description":46,"icon":39},"\u002Fdocs\u002Fgetting-started\u002Fmigration\u002Fv4","docs\u002F1.getting-started\u002F3.migration\u002F1.v4","A comprehensive guide to migrate your application from Nuxt UI v3 to Nuxt UI v4.",{"title":48,"path":49,"stem":50,"framework":16,"category":16,"description":51,"icon":52},"Contribution","\u002Fdocs\u002Fgetting-started\u002Fcontribution","docs\u002F1.getting-started\u002F4.contribution","A comprehensive guide on contributing to Nuxt UI, including project structure, development workflow, and best practices.","i-lucide-handshake",{"title":54,"path":55,"stem":56,"children":57,"page":36},"Theme","\u002Fdocs\u002Fgetting-started\u002Ftheme","docs\u002F1.getting-started\u002F5.theme",[58,64,70],{"title":59,"path":60,"stem":61,"framework":16,"category":16,"description":62,"icon":63},"Design System","\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fdesign-system","docs\u002F1.getting-started\u002F5.theme\u002F1.design-system","Nuxt UI's design system uses Tailwind CSS for simple theming and easy customization.","i-lucide-palette",{"title":65,"path":66,"stem":67,"framework":16,"category":16,"description":68,"icon":69},"CSS Variables","\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fcss-variables","docs\u002F1.getting-started\u002F5.theme\u002F2.css-variables","Nuxt UI uses CSS variables as design tokens for flexible, consistent theming with built-in light and dark mode support.","i-lucide-swatch-book",{"title":71,"path":72,"stem":73,"framework":16,"category":16,"description":74,"icon":75},"Components","\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fcomponents","docs\u002F1.getting-started\u002F5.theme\u002F3.components","Learn how to customize Nuxt UI components with the Tailwind Variants API for advanced, flexible, and maintainable styling.","i-lucide-layout-grid",{"title":77,"framework":16,"category":16,"description":16,"path":78,"stem":79,"children":80,"page":36},"Integrations","\u002Fdocs\u002Fgetting-started\u002Fintegrations","docs\u002F1.getting-started\u002F6.integrations",[81,95,101,115,129,135],{"title":82,"framework":16,"category":16,"description":16,"shadow":21,"path":83,"stem":84,"children":85,"page":36},"Icons","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Ficons","docs\u002F1.getting-started\u002F6.integrations\u002F1.icons",[86,91],{"title":82,"path":87,"stem":88,"framework":28,"category":16,"description":89,"icon":90},"\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Ficons\u002Fnuxt","docs\u002F1.getting-started\u002F6.integrations\u002F1.icons\u002F1.nuxt","Nuxt UI integrates with Nuxt Icon to access over 200,000+ icons from Iconify.","i-lucide-smile",{"title":82,"path":92,"stem":93,"framework":34,"category":16,"description":94,"icon":90},"\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Ficons\u002Fvue","docs\u002F1.getting-started\u002F6.integrations\u002F1.icons\u002F2.vue","Nuxt UI integrates with Iconify to access over 200,000+ icons.",{"title":96,"path":97,"stem":98,"framework":28,"category":16,"description":99,"icon":100},"Fonts","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Ffonts","docs\u002F1.getting-started\u002F6.integrations\u002F2.fonts","Nuxt UI integrates with Nuxt Fonts to provide plug-and-play font optimization.","i-lucide-a-large-small",{"title":102,"framework":16,"category":16,"description":16,"shadow":21,"path":103,"stem":104,"children":105,"page":36},"Color Mode","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fcolor-mode","docs\u002F1.getting-started\u002F6.integrations\u002F3.color-mode",[106,111],{"title":102,"path":107,"stem":108,"framework":28,"category":16,"description":109,"icon":110},"\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fcolor-mode\u002Fnuxt","docs\u002F1.getting-started\u002F6.integrations\u002F3.color-mode\u002F1.nuxt","Nuxt UI integrates with Nuxt Color Mode to allow for easy switching between light and dark themes.","i-lucide-sun-moon",{"title":102,"path":112,"stem":113,"framework":34,"category":16,"description":114,"icon":110},"\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fcolor-mode\u002Fvue","docs\u002F1.getting-started\u002F6.integrations\u002F3.color-mode\u002F2.vue","Nuxt UI integrates with VueUse to allow for easy switching between light and dark themes.",{"title":116,"framework":16,"category":16,"description":16,"shadow":21,"path":117,"stem":118,"children":119,"page":36},"I18n","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fi18n","docs\u002F1.getting-started\u002F6.integrations\u002F4.i18n",[120,126],{"title":121,"path":122,"stem":123,"framework":28,"category":16,"description":124,"icon":125},"Internationalization (i18n)","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fi18n\u002Fnuxt","docs\u002F1.getting-started\u002F6.integrations\u002F4.i18n\u002F1.nuxt","Nuxt UI supports 50+ locales and multi-directional (LTR\u002FRTL) internationalization.","i-lucide-languages",{"title":121,"path":127,"stem":128,"framework":34,"category":16,"description":124,"icon":125},"\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fi18n\u002Fvue","docs\u002F1.getting-started\u002F6.integrations\u002F4.i18n\u002F2.vue",{"title":130,"path":131,"stem":132,"framework":28,"category":16,"description":133,"icon":134},"Content","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fcontent","docs\u002F1.getting-started\u002F6.integrations\u002F5.content","Nuxt UI integrates with Nuxt Content to deliver beautiful typography and consistent component styling.","i-simple-icons-markdown",{"title":136,"path":137,"stem":138,"framework":34,"category":16,"description":139,"icon":140},"SSR","\u002Fdocs\u002Fgetting-started\u002Fintegrations\u002Fssr","docs\u002F1.getting-started\u002F6.integrations\u002F6.ssr","Nuxt UI has first-party support for Vue SSR. This guide will help you have it fully enabled.","i-lucide-server",{"title":142,"framework":16,"category":16,"description":16,"path":143,"stem":144,"children":145,"page":36},"Agents","\u002Fdocs\u002Fgetting-started\u002Fai","docs\u002F1.getting-started\u002F7.ai",[146,151,157],{"title":147,"path":148,"stem":149,"framework":16,"category":16,"description":150,"icon":140},"MCP Server","\u002Fdocs\u002Fgetting-started\u002Fai\u002Fmcp","docs\u002F1.getting-started\u002F7.ai\u002F1.mcp","Use Nuxt UI components in your AI assistants with Model Context Protocol support.",{"title":152,"path":153,"stem":154,"framework":16,"category":16,"description":155,"icon":156},"LLMs.txt","\u002Fdocs\u002Fgetting-started\u002Fai\u002Fllms-txt","docs\u002F1.getting-started\u002F7.ai\u002F2.llms-txt","How to get AI tools like Cursor, Windsurf, GitHub Copilot, ChatGPT, and Claude to understand Nuxt UI components, theming, and best practices.","i-lucide-bot",{"title":158,"path":159,"stem":160,"framework":16,"category":16,"description":161,"icon":162},"Skills","\u002Fdocs\u002Fgetting-started\u002Fai\u002Fskills","docs\u002F1.getting-started\u002F7.ai\u002F3.skills","Install Nuxt UI skills to give AI coding agents deep knowledge of components, theming, and best practices.","i-lucide-sparkles",{"title":71,"framework":16,"category":16,"description":16,"icon":164,"path":165,"stem":166,"children":167,"page":36},"i-lucide-square-code","\u002Fdocs\u002Fcomponents","docs\u002F2.components",[168,174,180,186,192,197,202,207,212,217,222,228,233,238,243,248,253,258,264,269,274,279,284,289,295,300,305,311,316,321,326,332,337,342,347,352,357,362,367,373,378,383,388,393,399,405,410,415,420,425,430,435,440,445,450,455,460,466,471,476,481,486,491,496,501,506,511,516,521,526,531,536,541,546,551,556,561,566,571,576,581,587,592,597,602,607,612,617,622,627,632,637,642,647,652,657,662,667,672,677,682,687,692,697,702,707,712,717,722,727,732,737,742,747,752,757,762,767,772,777,782,787,791,796,801,806,811],{"title":169,"path":170,"stem":171,"framework":16,"category":172,"description":173},"Accordion","\u002Fdocs\u002Fcomponents\u002Faccordion","docs\u002F2.components\u002Faccordion","data","A stacked set of collapsible panels.",{"title":175,"path":176,"stem":177,"framework":16,"category":178,"description":179},"Alert","\u002Fdocs\u002Fcomponents\u002Falert","docs\u002F2.components\u002Falert","element","A callout to draw user's attention.",{"title":181,"path":182,"stem":183,"framework":16,"category":184,"description":185},"App","\u002Fdocs\u002Fcomponents\u002Fapp","docs\u002F2.components\u002Fapp","layout","Wraps your app to provide global configurations and more.",{"title":187,"path":188,"stem":189,"framework":16,"category":190,"description":191},"AuthForm","\u002Fdocs\u002Fcomponents\u002Fauth-form","docs\u002F2.components\u002Fauth-form","page","A customizable Form to create login, register or password reset forms.",{"title":193,"path":194,"stem":195,"framework":16,"category":178,"description":196},"Avatar","\u002Fdocs\u002Fcomponents\u002Favatar","docs\u002F2.components\u002Favatar","An img element with fallback and Nuxt Image support.",{"title":198,"path":199,"stem":200,"framework":16,"category":178,"description":201},"AvatarGroup","\u002Fdocs\u002Fcomponents\u002Favatar-group","docs\u002F2.components\u002Favatar-group","Stack multiple avatars in a group.",{"title":203,"path":204,"stem":205,"framework":16,"category":178,"description":206},"Badge","\u002Fdocs\u002Fcomponents\u002Fbadge","docs\u002F2.components\u002Fbadge","A short text to represent a status or a category.",{"title":208,"path":209,"stem":210,"framework":16,"category":178,"description":211},"Banner","\u002Fdocs\u002Fcomponents\u002Fbanner","docs\u002F2.components\u002Fbanner","Display a banner at the top of your website to inform users about important information.",{"title":213,"path":214,"stem":215,"framework":16,"category":190,"description":216},"BlogPost","\u002Fdocs\u002Fcomponents\u002Fblog-post","docs\u002F2.components\u002Fblog-post","A customizable article to display in a blog page.",{"title":218,"path":219,"stem":220,"framework":16,"category":190,"description":221},"BlogPosts","\u002Fdocs\u002Fcomponents\u002Fblog-posts","docs\u002F2.components\u002Fblog-posts","Display a list of blog posts in a responsive grid layout.",{"title":223,"path":224,"stem":225,"framework":16,"category":226,"description":227},"Breadcrumb","\u002Fdocs\u002Fcomponents\u002Fbreadcrumb","docs\u002F2.components\u002Fbreadcrumb","navigation","A hierarchy of links to navigate through a website.",{"title":229,"path":230,"stem":231,"framework":16,"category":178,"description":232},"Button","\u002Fdocs\u002Fcomponents\u002Fbutton","docs\u002F2.components\u002Fbutton","A button element that can act as a link or trigger an action.",{"title":234,"path":235,"stem":236,"framework":16,"category":178,"description":237},"Calendar","\u002Fdocs\u002Fcomponents\u002Fcalendar","docs\u002F2.components\u002Fcalendar","A calendar component for selecting single dates, multiple dates or date ranges.",{"title":239,"path":240,"stem":241,"framework":16,"category":178,"description":242},"Card","\u002Fdocs\u002Fcomponents\u002Fcard","docs\u002F2.components\u002Fcard","Display content in a card with a header, body and footer.",{"title":244,"path":245,"stem":246,"framework":16,"category":172,"description":247},"Carousel","\u002Fdocs\u002Fcomponents\u002Fcarousel","docs\u002F2.components\u002Fcarousel","A carousel with motion and swipe built using Embla.",{"title":249,"path":250,"stem":251,"framework":16,"category":190,"description":252},"ChangelogVersion","\u002Fdocs\u002Fcomponents\u002Fchangelog-version","docs\u002F2.components\u002Fchangelog-version","A customizable article to display in a changelog.",{"title":254,"path":255,"stem":256,"framework":16,"category":190,"description":257},"ChangelogVersions","\u002Fdocs\u002Fcomponents\u002Fchangelog-versions","docs\u002F2.components\u002Fchangelog-versions","Display a list of changelog versions in a timeline.",{"title":259,"path":260,"stem":261,"framework":16,"category":262,"description":263},"Chat","\u002Fdocs\u002Fcomponents\u002Fchat","docs\u002F2.components\u002Fchat","chat","Build AI chat interfaces with streaming, reasoning, and tool calling.",{"title":265,"path":266,"stem":267,"framework":16,"category":262,"description":268},"ChatMessage","\u002Fdocs\u002Fcomponents\u002Fchat-message","docs\u002F2.components\u002Fchat-message","Display a chat message with icon, avatar, and actions.",{"title":270,"path":271,"stem":272,"framework":16,"category":262,"description":273},"ChatMessages","\u002Fdocs\u002Fcomponents\u002Fchat-messages","docs\u002F2.components\u002Fchat-messages","Display a list of chat messages, designed to work seamlessly with Vercel AI SDK.",{"title":275,"path":276,"stem":277,"framework":16,"category":262,"description":278},"ChatPalette","\u002Fdocs\u002Fcomponents\u002Fchat-palette","docs\u002F2.components\u002Fchat-palette","A chat palette to create a chatbot interface inside an overlay.",{"title":280,"path":281,"stem":282,"framework":16,"category":262,"description":283},"ChatPrompt","\u002Fdocs\u002Fcomponents\u002Fchat-prompt","docs\u002F2.components\u002Fchat-prompt","An enhanced Textarea for submitting prompts in AI chat interfaces.",{"title":285,"path":286,"stem":287,"framework":16,"category":262,"description":288},"ChatPromptSubmit","\u002Fdocs\u002Fcomponents\u002Fchat-prompt-submit","docs\u002F2.components\u002Fchat-prompt-submit","A Button for submitting chat prompts with automatic status handling.",{"title":290,"path":291,"stem":292,"framework":16,"category":262,"description":293,"badge":294},"ChatReasoning","\u002Fdocs\u002Fcomponents\u002Fchat-reasoning","docs\u002F2.components\u002Fchat-reasoning","Display a collapsible AI reasoning or thinking process.","New",{"title":296,"path":297,"stem":298,"framework":16,"category":262,"description":299,"badge":294},"ChatShimmer","\u002Fdocs\u002Fcomponents\u002Fchat-shimmer","docs\u002F2.components\u002Fchat-shimmer","Display a text shimmer animation effect.",{"title":301,"path":302,"stem":303,"framework":16,"category":262,"description":304,"badge":294},"ChatTool","\u002Fdocs\u002Fcomponents\u002Fchat-tool","docs\u002F2.components\u002Fchat-tool","Display a collapsible AI tool invocation status.",{"title":306,"path":307,"stem":308,"framework":16,"category":309,"description":310},"Checkbox","\u002Fdocs\u002Fcomponents\u002Fcheckbox","docs\u002F2.components\u002Fcheckbox","form","An input element to toggle between checked and unchecked states.",{"title":312,"path":313,"stem":314,"framework":16,"category":309,"description":315},"CheckboxGroup","\u002Fdocs\u002Fcomponents\u002Fcheckbox-group","docs\u002F2.components\u002Fcheckbox-group","A set of checklist buttons to select multiple option from a list.",{"title":317,"path":318,"stem":319,"framework":16,"category":178,"description":320},"Chip","\u002Fdocs\u002Fcomponents\u002Fchip","docs\u002F2.components\u002Fchip","An indicator of a numeric value or a state.",{"title":322,"path":323,"stem":324,"framework":16,"category":178,"description":325},"Collapsible","\u002Fdocs\u002Fcomponents\u002Fcollapsible","docs\u002F2.components\u002Fcollapsible","A collapsible element to toggle visibility of its content.",{"title":327,"path":328,"stem":329,"framework":16,"category":330,"description":331},"ColorModeAvatar","\u002Fdocs\u002Fcomponents\u002Fcolor-mode-avatar","docs\u002F2.components\u002Fcolor-mode-avatar","color-mode","An Avatar with a different source for light and dark mode.",{"title":333,"path":334,"stem":335,"framework":16,"category":330,"description":336},"ColorModeButton","\u002Fdocs\u002Fcomponents\u002Fcolor-mode-button","docs\u002F2.components\u002Fcolor-mode-button","A Button to switch between light and dark mode.",{"title":338,"path":339,"stem":340,"framework":16,"category":330,"description":341},"ColorModeImage","\u002Fdocs\u002Fcomponents\u002Fcolor-mode-image","docs\u002F2.components\u002Fcolor-mode-image","An image element with a different source for light and dark mode.",{"title":343,"path":344,"stem":345,"framework":16,"category":330,"description":346},"ColorModeSelect","\u002Fdocs\u002Fcomponents\u002Fcolor-mode-select","docs\u002F2.components\u002Fcolor-mode-select","A Select to switch between system, dark & light mode.",{"title":348,"path":349,"stem":350,"framework":16,"category":330,"description":351},"ColorModeSwitch","\u002Fdocs\u002Fcomponents\u002Fcolor-mode-switch","docs\u002F2.components\u002Fcolor-mode-switch","A switch to toggle between light and dark mode.",{"title":353,"path":354,"stem":355,"framework":16,"category":309,"description":356},"ColorPicker","\u002Fdocs\u002Fcomponents\u002Fcolor-picker","docs\u002F2.components\u002Fcolor-picker","A component to select a color.",{"title":358,"path":359,"stem":360,"framework":16,"category":226,"description":361},"CommandPalette","\u002Fdocs\u002Fcomponents\u002Fcommand-palette","docs\u002F2.components\u002Fcommand-palette","A command palette with full-text search powered by Fuse.js for efficient fuzzy matching.",{"title":363,"path":364,"stem":365,"framework":16,"category":184,"description":366},"Container","\u002Fdocs\u002Fcomponents\u002Fcontainer","docs\u002F2.components\u002Fcontainer","A container lets you center and constrain the width of your content.",{"title":368,"path":369,"stem":370,"framework":28,"category":371,"description":372},"ContentNavigation","\u002Fdocs\u002Fcomponents\u002Fcontent-navigation","docs\u002F2.components\u002Fcontent-navigation","content","An accordion-style navigation component for organizing page links.",{"title":374,"path":375,"stem":376,"framework":28,"category":371,"description":377},"ContentSearch","\u002Fdocs\u002Fcomponents\u002Fcontent-search","docs\u002F2.components\u002Fcontent-search","A ready to use CommandPalette to add to your documentation.",{"title":379,"path":380,"stem":381,"framework":28,"category":371,"description":382},"ContentSearchButton","\u002Fdocs\u002Fcomponents\u002Fcontent-search-button","docs\u002F2.components\u002Fcontent-search-button","A pre-styled Button to open the ContentSearch modal.",{"title":384,"path":385,"stem":386,"framework":28,"category":371,"description":387},"ContentSurround","\u002Fdocs\u002Fcomponents\u002Fcontent-surround","docs\u002F2.components\u002Fcontent-surround","A pair of prev and next links to navigate between pages.",{"title":389,"path":390,"stem":391,"framework":28,"category":371,"description":392},"ContentToc","\u002Fdocs\u002Fcomponents\u002Fcontent-toc","docs\u002F2.components\u002Fcontent-toc","A sticky Table of Contents with automatic active anchor link highlighting.",{"title":394,"path":395,"stem":396,"framework":16,"category":397,"description":398},"ContextMenu","\u002Fdocs\u002Fcomponents\u002Fcontext-menu","docs\u002F2.components\u002Fcontext-menu","overlay","A menu to display actions when right-clicking on an element.",{"title":400,"path":401,"stem":402,"framework":16,"category":403,"description":404},"DashboardGroup","\u002Fdocs\u002Fcomponents\u002Fdashboard-group","docs\u002F2.components\u002Fdashboard-group","dashboard","A fixed layout component that provides context for dashboard components with sidebar state management and persistence.",{"title":406,"path":407,"stem":408,"framework":16,"category":403,"description":409},"DashboardNavbar","\u002Fdocs\u002Fcomponents\u002Fdashboard-navbar","docs\u002F2.components\u002Fdashboard-navbar","A responsive navbar to display in a dashboard.",{"title":411,"path":412,"stem":413,"framework":16,"category":403,"description":414},"DashboardPanel","\u002Fdocs\u002Fcomponents\u002Fdashboard-panel","docs\u002F2.components\u002Fdashboard-panel","A resizable panel to display in a dashboard.",{"title":416,"path":417,"stem":418,"framework":16,"category":403,"description":419},"DashboardResizeHandle","\u002Fdocs\u002Fcomponents\u002Fdashboard-resize-handle","docs\u002F2.components\u002Fdashboard-resize-handle","A handle to resize a sidebar or panel.",{"title":421,"path":422,"stem":423,"framework":16,"category":403,"description":424},"DashboardSearch","\u002Fdocs\u002Fcomponents\u002Fdashboard-search","docs\u002F2.components\u002Fdashboard-search","A ready to use CommandPalette to add to your dashboard.",{"title":426,"path":427,"stem":428,"framework":16,"category":403,"description":429},"DashboardSearchButton","\u002Fdocs\u002Fcomponents\u002Fdashboard-search-button","docs\u002F2.components\u002Fdashboard-search-button","A pre-styled Button to open the DashboardSearch modal.",{"title":431,"path":432,"stem":433,"framework":16,"category":403,"description":434},"DashboardSidebar","\u002Fdocs\u002Fcomponents\u002Fdashboard-sidebar","docs\u002F2.components\u002Fdashboard-sidebar","A resizable and collapsible sidebar to display in a dashboard.",{"title":436,"path":437,"stem":438,"framework":16,"category":403,"description":439},"DashboardSidebarCollapse","\u002Fdocs\u002Fcomponents\u002Fdashboard-sidebar-collapse","docs\u002F2.components\u002Fdashboard-sidebar-collapse","A Button to collapse the sidebar on desktop.",{"title":441,"path":442,"stem":443,"framework":16,"category":403,"description":444},"DashboardSidebarToggle","\u002Fdocs\u002Fcomponents\u002Fdashboard-sidebar-toggle","docs\u002F2.components\u002Fdashboard-sidebar-toggle","A Button to toggle the sidebar on mobile.",{"title":446,"path":447,"stem":448,"framework":16,"category":403,"description":449},"DashboardToolbar","\u002Fdocs\u002Fcomponents\u002Fdashboard-toolbar","docs\u002F2.components\u002Fdashboard-toolbar","A toolbar to display under the navbar in a dashboard.",{"title":451,"path":452,"stem":453,"framework":16,"category":397,"description":454},"Drawer","\u002Fdocs\u002Fcomponents\u002Fdrawer","docs\u002F2.components\u002Fdrawer","A drawer that smoothly slides in & out of the screen.",{"title":456,"path":457,"stem":458,"framework":16,"category":397,"description":459},"DropdownMenu","\u002Fdocs\u002Fcomponents\u002Fdropdown-menu","docs\u002F2.components\u002Fdropdown-menu","A menu to display actions when clicking on an element.",{"title":461,"path":462,"stem":463,"framework":16,"category":464,"description":465},"Editor","\u002Fdocs\u002Fcomponents\u002Feditor","docs\u002F2.components\u002Feditor","editor","A rich text editor component based on TipTap with support for markdown, HTML, and JSON content types.",{"title":467,"path":468,"stem":469,"framework":16,"category":464,"description":470},"EditorDragHandle","\u002Fdocs\u002Fcomponents\u002Feditor-drag-handle","docs\u002F2.components\u002Feditor-drag-handle","A draggable handle for reordering and selecting blocks in the editor.",{"title":472,"path":473,"stem":474,"framework":16,"category":464,"description":475},"EditorEmojiMenu","\u002Fdocs\u002Fcomponents\u002Feditor-emoji-menu","docs\u002F2.components\u002Feditor-emoji-menu","An emoji picker menu that displays emoji suggestions when typing the : character in the editor.",{"title":477,"path":478,"stem":479,"framework":16,"category":464,"description":480},"EditorMentionMenu","\u002Fdocs\u002Fcomponents\u002Feditor-mention-menu","docs\u002F2.components\u002Feditor-mention-menu","A mention menu that displays user suggestions when typing a trigger character in the editor.",{"title":482,"path":483,"stem":484,"framework":16,"category":464,"description":485},"EditorSuggestionMenu","\u002Fdocs\u002Fcomponents\u002Feditor-suggestion-menu","docs\u002F2.components\u002Feditor-suggestion-menu","A command menu that displays formatting and action suggestions when typing the \u002F character in the editor.",{"title":487,"path":488,"stem":489,"framework":16,"category":464,"description":490},"EditorToolbar","\u002Fdocs\u002Fcomponents\u002Feditor-toolbar","docs\u002F2.components\u002Feditor-toolbar","A customizable toolbar for editor actions that can be displayed as fixed, bubble, or floating menu.",{"title":492,"path":493,"stem":494,"framework":16,"category":172,"description":495},"Empty","\u002Fdocs\u002Fcomponents\u002Fempty","docs\u002F2.components\u002Fempty","A component to display an empty state.",{"title":497,"path":498,"stem":499,"framework":16,"category":184,"description":500},"Error","\u002Fdocs\u002Fcomponents\u002Ferror","docs\u002F2.components\u002Ferror","A pre-built error component with NuxtError support.",{"title":502,"path":503,"stem":504,"framework":16,"category":178,"description":505},"FieldGroup","\u002Fdocs\u002Fcomponents\u002Ffield-group","docs\u002F2.components\u002Ffield-group","Group multiple button-like elements together.",{"title":507,"path":508,"stem":509,"framework":16,"category":309,"description":510},"FileUpload","\u002Fdocs\u002Fcomponents\u002Ffile-upload","docs\u002F2.components\u002Ffile-upload","An input element to upload files.",{"title":512,"path":513,"stem":514,"framework":16,"category":184,"description":515},"Footer","\u002Fdocs\u002Fcomponents\u002Ffooter","docs\u002F2.components\u002Ffooter","A responsive footer component.",{"title":517,"path":518,"stem":519,"framework":16,"category":226,"description":520},"FooterColumns","\u002Fdocs\u002Fcomponents\u002Ffooter-columns","docs\u002F2.components\u002Ffooter-columns","A list of links as columns to display in your Footer.",{"title":522,"path":523,"stem":524,"framework":16,"category":309,"description":525},"Form","\u002Fdocs\u002Fcomponents\u002Fform","docs\u002F2.components\u002Fform","A form component with built-in validation and submission handling.",{"title":527,"path":528,"stem":529,"framework":16,"category":309,"description":530},"FormField","\u002Fdocs\u002Fcomponents\u002Fform-field","docs\u002F2.components\u002Fform-field","A wrapper for form elements that provides validation and error handling.",{"title":532,"path":533,"stem":534,"framework":16,"category":184,"description":535},"Header","\u002Fdocs\u002Fcomponents\u002Fheader","docs\u002F2.components\u002Fheader","A responsive header component.",{"title":537,"path":538,"stem":539,"framework":16,"category":178,"description":540},"Icon","\u002Fdocs\u002Fcomponents\u002Ficon","docs\u002F2.components\u002Ficon","A component to display any icon from Iconify or another component.",{"title":542,"path":543,"stem":544,"framework":16,"category":309,"description":545},"Input","\u002Fdocs\u002Fcomponents\u002Finput","docs\u002F2.components\u002Finput","An input element to enter text.",{"title":547,"path":548,"stem":549,"framework":16,"category":309,"description":550},"InputDate","\u002Fdocs\u002Fcomponents\u002Finput-date","docs\u002F2.components\u002Finput-date","An input component for date selection.",{"title":552,"path":553,"stem":554,"framework":16,"category":309,"description":555},"InputMenu","\u002Fdocs\u002Fcomponents\u002Finput-menu","docs\u002F2.components\u002Finput-menu","An autocomplete input with real-time suggestions.",{"title":557,"path":558,"stem":559,"framework":16,"category":309,"description":560},"InputNumber","\u002Fdocs\u002Fcomponents\u002Finput-number","docs\u002F2.components\u002Finput-number","An input for numerical values with a customizable range.",{"title":562,"path":563,"stem":564,"framework":16,"category":309,"description":565},"InputTags","\u002Fdocs\u002Fcomponents\u002Finput-tags","docs\u002F2.components\u002Finput-tags","An input element that displays interactive tags.",{"title":567,"path":568,"stem":569,"framework":16,"category":309,"description":570},"InputTime","\u002Fdocs\u002Fcomponents\u002Finput-time","docs\u002F2.components\u002Finput-time","An input for selecting a time.",{"title":572,"path":573,"stem":574,"framework":16,"category":178,"description":575},"Kbd","\u002Fdocs\u002Fcomponents\u002Fkbd","docs\u002F2.components\u002Fkbd","A kbd element to display a keyboard key.",{"title":577,"path":578,"stem":579,"framework":16,"category":226,"description":580},"Link","\u002Fdocs\u002Fcomponents\u002Flink","docs\u002F2.components\u002Flink","A wrapper around \u003CNuxtLink> with extra props.",{"title":582,"path":583,"stem":584,"framework":16,"category":585,"description":586},"LocaleSelect","\u002Fdocs\u002Fcomponents\u002Flocale-select","docs\u002F2.components\u002Flocale-select","i18n","A Select to switch between locales.",{"title":588,"path":589,"stem":590,"framework":16,"category":184,"description":591},"Main","\u002Fdocs\u002Fcomponents\u002Fmain","docs\u002F2.components\u002Fmain","A main element that fills the available viewport height.",{"title":593,"path":594,"stem":595,"framework":16,"category":172,"description":596},"Marquee","\u002Fdocs\u002Fcomponents\u002Fmarquee","docs\u002F2.components\u002Fmarquee","A component to create infinite scrolling content.",{"title":598,"path":599,"stem":600,"framework":16,"category":397,"description":601},"Modal","\u002Fdocs\u002Fcomponents\u002Fmodal","docs\u002F2.components\u002Fmodal","A dialog window that can be used to display a message or request user input.",{"title":603,"path":604,"stem":605,"framework":16,"category":226,"description":606},"NavigationMenu","\u002Fdocs\u002Fcomponents\u002Fnavigation-menu","docs\u002F2.components\u002Fnavigation-menu","A list of links that can be displayed horizontally or vertically.",{"title":608,"path":609,"stem":610,"framework":16,"category":190,"description":611},"Page","\u002Fdocs\u002Fcomponents\u002Fpage","docs\u002F2.components\u002Fpage","A grid layout for your pages with left and right columns.",{"title":613,"path":614,"stem":615,"framework":16,"category":190,"description":616},"PageAnchors","\u002Fdocs\u002Fcomponents\u002Fpage-anchors","docs\u002F2.components\u002Fpage-anchors","A list of anchors to be displayed in the page.",{"title":618,"path":619,"stem":620,"framework":16,"category":190,"description":621},"PageAside","\u002Fdocs\u002Fcomponents\u002Fpage-aside","docs\u002F2.components\u002Fpage-aside","A sticky aside to display your page navigation.",{"title":623,"path":624,"stem":625,"framework":16,"category":190,"description":626},"PageBody","\u002Fdocs\u002Fcomponents\u002Fpage-body","docs\u002F2.components\u002Fpage-body","The main content of your page.",{"title":628,"path":629,"stem":630,"framework":16,"category":190,"description":631},"PageCard","\u002Fdocs\u002Fcomponents\u002Fpage-card","docs\u002F2.components\u002Fpage-card","A pre-styled card component that displays a title, description and optional link.",{"title":633,"path":634,"stem":635,"framework":16,"category":190,"description":636},"PageColumns","\u002Fdocs\u002Fcomponents\u002Fpage-columns","docs\u002F2.components\u002Fpage-columns","A responsive multi-column layout system for organizing content side-by-side.",{"title":638,"path":639,"stem":640,"framework":16,"category":190,"description":641},"PageCTA","\u002Fdocs\u002Fcomponents\u002Fpage-cta","docs\u002F2.components\u002Fpage-cta","A call to action section to display in your pages.",{"title":643,"path":644,"stem":645,"framework":16,"category":190,"description":646},"PageFeature","\u002Fdocs\u002Fcomponents\u002Fpage-feature","docs\u002F2.components\u002Fpage-feature","A component to showcase key features of your application.",{"title":648,"path":649,"stem":650,"framework":16,"category":190,"description":651},"PageGrid","\u002Fdocs\u002Fcomponents\u002Fpage-grid","docs\u002F2.components\u002Fpage-grid","A responsive grid system for displaying content in a flexible layout.",{"title":653,"path":654,"stem":655,"framework":16,"category":190,"description":656},"PageHeader","\u002Fdocs\u002Fcomponents\u002Fpage-header","docs\u002F2.components\u002Fpage-header","A responsive header for your pages.",{"title":658,"path":659,"stem":660,"framework":16,"category":190,"description":661},"PageHero","\u002Fdocs\u002Fcomponents\u002Fpage-hero","docs\u002F2.components\u002Fpage-hero","A responsive hero for your pages.",{"title":663,"path":664,"stem":665,"framework":16,"category":190,"description":666},"PageLinks","\u002Fdocs\u002Fcomponents\u002Fpage-links","docs\u002F2.components\u002Fpage-links","A list of links to be displayed in the page.",{"title":668,"path":669,"stem":670,"framework":16,"category":190,"description":671},"PageList","\u002Fdocs\u002Fcomponents\u002Fpage-list","docs\u002F2.components\u002Fpage-list","A vertical list layout for displaying content in a stacked format.",{"title":673,"path":674,"stem":675,"framework":16,"category":190,"description":676},"PageLogos","\u002Fdocs\u002Fcomponents\u002Fpage-logos","docs\u002F2.components\u002Fpage-logos","A list of logos or images to display on your pages.",{"title":678,"path":679,"stem":680,"framework":16,"category":190,"description":681},"PageSection","\u002Fdocs\u002Fcomponents\u002Fpage-section","docs\u002F2.components\u002Fpage-section","A responsive section for your pages.",{"title":683,"path":684,"stem":685,"framework":16,"category":226,"description":686},"Pagination","\u002Fdocs\u002Fcomponents\u002Fpagination","docs\u002F2.components\u002Fpagination","A list of buttons or links to navigate through pages.",{"title":688,"path":689,"stem":690,"framework":16,"category":309,"description":691},"PinInput","\u002Fdocs\u002Fcomponents\u002Fpin-input","docs\u002F2.components\u002Fpin-input","An input element to enter a pin.",{"title":693,"path":694,"stem":695,"framework":16,"category":397,"description":696},"Popover","\u002Fdocs\u002Fcomponents\u002Fpopover","docs\u002F2.components\u002Fpopover","A non-modal dialog that floats around a trigger element.",{"title":698,"path":699,"stem":700,"framework":16,"category":190,"description":701},"PricingPlan","\u002Fdocs\u002Fcomponents\u002Fpricing-plan","docs\u002F2.components\u002Fpricing-plan","A customizable pricing plan to display in a pricing page.",{"title":703,"path":704,"stem":705,"framework":16,"category":190,"description":706},"PricingPlans","\u002Fdocs\u002Fcomponents\u002Fpricing-plans","docs\u002F2.components\u002Fpricing-plans","Display a list of pricing plans in a responsive grid layout.",{"title":708,"path":709,"stem":710,"framework":16,"category":190,"description":711},"PricingTable","\u002Fdocs\u002Fcomponents\u002Fpricing-table","docs\u002F2.components\u002Fpricing-table","A responsive pricing table component that displays tiered pricing plans with feature comparisons.",{"title":713,"path":714,"stem":715,"framework":16,"category":178,"description":716},"Progress","\u002Fdocs\u002Fcomponents\u002Fprogress","docs\u002F2.components\u002Fprogress","An indicator showing the progress of a task.",{"title":718,"path":719,"stem":720,"framework":16,"category":309,"description":721},"RadioGroup","\u002Fdocs\u002Fcomponents\u002Fradio-group","docs\u002F2.components\u002Fradio-group","A set of radio buttons to select a single option from a list.",{"title":723,"path":724,"stem":725,"framework":16,"category":172,"description":726},"ScrollArea","\u002Fdocs\u002Fcomponents\u002Fscroll-area","docs\u002F2.components\u002Fscroll-area","A flexible scroll container with virtualization support.",{"title":728,"path":729,"stem":730,"framework":16,"category":309,"description":731},"Select","\u002Fdocs\u002Fcomponents\u002Fselect","docs\u002F2.components\u002Fselect","A select element to choose from a list of options.",{"title":733,"path":734,"stem":735,"framework":16,"category":309,"description":736},"SelectMenu","\u002Fdocs\u002Fcomponents\u002Fselect-menu","docs\u002F2.components\u002Fselect-menu","An advanced searchable select element.",{"title":738,"path":739,"stem":740,"framework":16,"category":178,"description":741},"Separator","\u002Fdocs\u002Fcomponents\u002Fseparator","docs\u002F2.components\u002Fseparator","Separates content horizontally or vertically.",{"title":743,"path":744,"stem":745,"framework":16,"category":184,"description":746,"badge":294},"Sidebar","\u002Fdocs\u002Fcomponents\u002Fsidebar","docs\u002F2.components\u002Fsidebar","A collapsible sidebar with multiple visual variants.",{"title":748,"path":749,"stem":750,"framework":16,"category":178,"description":751},"Skeleton","\u002Fdocs\u002Fcomponents\u002Fskeleton","docs\u002F2.components\u002Fskeleton","A placeholder to show while content is loading.",{"title":753,"path":754,"stem":755,"framework":16,"category":397,"description":756},"Slideover","\u002Fdocs\u002Fcomponents\u002Fslideover","docs\u002F2.components\u002Fslideover","A dialog that slides in from any side of the screen.",{"title":758,"path":759,"stem":760,"framework":16,"category":309,"description":761},"Slider","\u002Fdocs\u002Fcomponents\u002Fslider","docs\u002F2.components\u002Fslider","An input to select a numeric value within a range.",{"title":763,"path":764,"stem":765,"framework":16,"category":226,"description":766},"Stepper","\u002Fdocs\u002Fcomponents\u002Fstepper","docs\u002F2.components\u002Fstepper","A set of steps that are used to indicate progress through a multi-step process.",{"title":768,"path":769,"stem":770,"framework":16,"category":309,"description":771},"Switch","\u002Fdocs\u002Fcomponents\u002Fswitch","docs\u002F2.components\u002Fswitch","A control that toggles between two states.",{"title":773,"path":774,"stem":775,"framework":16,"category":172,"description":776},"Table","\u002Fdocs\u002Fcomponents\u002Ftable","docs\u002F2.components\u002Ftable","A responsive table element to display data in rows and columns.",{"title":778,"path":779,"stem":780,"framework":16,"category":226,"description":781},"Tabs","\u002Fdocs\u002Fcomponents\u002Ftabs","docs\u002F2.components\u002Ftabs","A set of tab panels that are displayed one at a time.",{"title":783,"path":784,"stem":785,"framework":16,"category":309,"description":786},"Textarea","\u002Fdocs\u002Fcomponents\u002Ftextarea","docs\u002F2.components\u002Ftextarea","A textarea element to input multi-line text.",{"title":54,"path":788,"stem":789,"framework":16,"category":184,"description":790},"\u002Fdocs\u002Fcomponents\u002Ftheme","docs\u002F2.components\u002Ftheme","A headless component to theme child components.",{"title":792,"path":793,"stem":794,"framework":16,"category":172,"description":795},"Timeline","\u002Fdocs\u002Fcomponents\u002Ftimeline","docs\u002F2.components\u002Ftimeline","A component that displays a sequence of events with dates, titles, icons or avatars.",{"title":797,"path":798,"stem":799,"framework":16,"category":397,"description":800},"Toast","\u002Fdocs\u002Fcomponents\u002Ftoast","docs\u002F2.components\u002Ftoast","A succinct message to provide information or feedback to the user.",{"title":802,"path":803,"stem":804,"framework":16,"category":397,"description":805},"Tooltip","\u002Fdocs\u002Fcomponents\u002Ftooltip","docs\u002F2.components\u002Ftooltip","A popup that reveals information when hovering over an element.",{"title":807,"path":808,"stem":809,"framework":16,"category":172,"description":810},"Tree","\u002Fdocs\u002Fcomponents\u002Ftree","docs\u002F2.components\u002Ftree","A tree view component to display and interact with hierarchical data structures.",{"title":812,"path":813,"stem":814,"framework":16,"category":172,"description":815},"User","\u002Fdocs\u002Fcomponents\u002Fuser","docs\u002F2.components\u002Fuser","Display user information with name, description and avatar.",{"title":817,"framework":16,"category":16,"description":16,"icon":818,"path":819,"stem":820,"children":821,"page":36},"Composables","i-lucide-square-function","\u002Fdocs\u002Fcomposables","docs\u002F3.composables",[822,827,832,837,842,847,852],{"title":823,"path":824,"stem":825,"framework":16,"category":16,"description":826},"defineLocale","\u002Fdocs\u002Fcomposables\u002Fdefine-locale","docs\u002F3.composables\u002Fdefine-locale","A utility to create a custom locale for your app.",{"title":828,"path":829,"stem":830,"framework":16,"category":16,"description":831},"defineShortcuts","\u002Fdocs\u002Fcomposables\u002Fdefine-shortcuts","docs\u002F3.composables\u002Fdefine-shortcuts","A composable to define keyboard shortcuts in your app.",{"title":833,"path":834,"stem":835,"framework":16,"category":16,"description":836},"extendLocale","\u002Fdocs\u002Fcomposables\u002Fextend-locale","docs\u002F3.composables\u002Fextend-locale","A utility to extend an existing locale with custom translations.",{"title":838,"path":839,"stem":840,"framework":16,"category":16,"description":841},"extractShortcuts","\u002Fdocs\u002Fcomposables\u002Fextract-shortcuts","docs\u002F3.composables\u002Fextract-shortcuts","A utility to extract keyboard shortcuts from menu items.",{"title":843,"path":844,"stem":845,"framework":16,"category":16,"description":846},"useOverlay","\u002Fdocs\u002Fcomposables\u002Fuse-overlay","docs\u002F3.composables\u002Fuse-overlay","A composable to programmatically control overlays.",{"title":848,"path":849,"stem":850,"framework":16,"category":16,"description":851,"badge":294},"useScrollShadow","\u002Fdocs\u002Fcomposables\u002Fuse-scroll-shadow","docs\u002F3.composables\u002Fuse-scroll-shadow","A composable to apply scroll shadow effects on any scrollable element.",{"title":853,"path":854,"stem":855,"framework":16,"category":16,"description":856},"useToast","\u002Fdocs\u002Fcomposables\u002Fuse-toast","docs\u002F3.composables\u002Fuse-toast","A composable to display toast notifications in your app.",{"title":858,"path":859,"stem":860,"children":861,"framework":28,"category":16,"description":16,"icon":957},"Typography","\u002Fdocs\u002Ftypography","docs\u002F4.typography\u002F1.index",[862,864,869,874,879,884,889,893,898,902,907,912,917,922,927,931,936,940,944,948,953],{"title":15,"path":859,"stem":860,"framework":28,"category":16,"description":863},"Beautiful typography components and utilities to style your content with Nuxt UI.",{"title":865,"path":866,"stem":867,"framework":28,"category":16,"description":868},"Headers and text","\u002Fdocs\u002Ftypography\u002Fheaders-and-text","docs\u002F4.typography\u002F2.headers-and-text","Beautifully styled headings, paragraphs, text formatting, and links for optimal readability.",{"title":870,"path":871,"stem":872,"framework":28,"category":16,"description":873},"Lists and tables","\u002Fdocs\u002Ftypography\u002Flists-and-tables","docs\u002F4.typography\u002F3.lists-and-tables","Organize information with styled lists and responsive tables for clear, consistent readability.",{"title":875,"path":876,"stem":877,"framework":28,"category":16,"description":878},"Images and embeds","\u002Fdocs\u002Ftypography\u002Fimages-and-embeds","docs\u002F4.typography\u002F4.images-and-embeds","Responsive images, videos, and rich media embeds to enhance and illustrate your documentation.",{"title":880,"path":881,"stem":882,"framework":28,"category":16,"description":883},"Code","\u002Fdocs\u002Ftypography\u002Fcode","docs\u002F4.typography\u002F5.code","Display inline code and syntax-highlighted code blocks with copy-to-clipboard support.",{"title":169,"path":885,"stem":886,"framework":28,"category":887,"description":888},"\u002Fdocs\u002Ftypography\u002Faccordion","docs\u002F4.typography\u002Faccordion","components","Create expandable content sections for better information organization.",{"title":203,"path":890,"stem":891,"framework":28,"category":887,"description":892},"\u002Fdocs\u002Ftypography\u002Fbadge","docs\u002F4.typography\u002Fbadge","Display version numbers, status labels, and tags within your content.",{"title":894,"path":895,"stem":896,"framework":28,"category":887,"description":897},"Callout","\u002Fdocs\u002Ftypography\u002Fcallout","docs\u002F4.typography\u002Fcallout","Highlight important information with eye-catching colored boxes and icons.",{"title":239,"path":899,"stem":900,"framework":28,"category":887,"description":901},"\u002Fdocs\u002Ftypography\u002Fcard","docs\u002F4.typography\u002Fcard","Create highlighted content blocks with optional links and navigation.",{"title":903,"path":904,"stem":905,"framework":28,"category":887,"description":906},"CardGroup","\u002Fdocs\u002Ftypography\u002Fcard-group","docs\u002F4.typography\u002Fcard-group","Organize multiple cards in responsive grid layouts for better content presentation.",{"title":908,"path":909,"stem":910,"framework":28,"category":887,"description":911},"CodeCollapse","\u002Fdocs\u002Ftypography\u002Fcode-collapse","docs\u002F4.typography\u002Fcode-collapse","Make long code blocks collapsible to save space and improve readability.",{"title":913,"path":914,"stem":915,"framework":28,"category":887,"description":916},"CodeGroup","\u002Fdocs\u002Ftypography\u002Fcode-group","docs\u002F4.typography\u002Fcode-group","Group multiple code examples in tabbed interfaces for easy comparison.",{"title":918,"path":919,"stem":920,"framework":28,"category":887,"description":921},"CodePreview","\u002Fdocs\u002Ftypography\u002Fcode-preview","docs\u002F4.typography\u002Fcode-preview","Display code examples with a preview and their source for clearer documentation.",{"title":923,"path":924,"stem":925,"framework":28,"category":887,"description":926},"CodeTree","\u002Fdocs\u002Ftypography\u002Fcode-tree","docs\u002F4.typography\u002Fcode-tree","Visualize file and folder structures with syntax-highlighted code.",{"title":322,"path":928,"stem":929,"framework":28,"category":887,"description":930},"\u002Fdocs\u002Ftypography\u002Fcollapsible","docs\u002F4.typography\u002Fcollapsible","Toggle content visibility with smooth expand and collapse animations.",{"title":932,"path":933,"stem":934,"framework":28,"category":887,"description":935},"Field","\u002Fdocs\u002Ftypography\u002Ffield","docs\u002F4.typography\u002Ffield","Document API parameters, props, and configuration options clearly.",{"title":502,"path":937,"stem":938,"framework":28,"category":887,"description":939},"\u002Fdocs\u002Ftypography\u002Ffield-group","docs\u002F4.typography\u002Ffield-group","Group related fields together for comprehensive API documentation.",{"title":537,"path":941,"stem":942,"framework":28,"category":887,"description":943},"\u002Fdocs\u002Ftypography\u002Ficon","docs\u002F4.typography\u002Ficon","Display icons from popular icon libraries to enhance your content.",{"title":572,"path":945,"stem":946,"framework":28,"category":887,"description":947},"\u002Fdocs\u002Ftypography\u002Fkbd","docs\u002F4.typography\u002Fkbd","Display keyboard shortcuts and key combinations with proper styling.",{"title":949,"path":950,"stem":951,"framework":28,"category":887,"description":952},"Steps","\u002Fdocs\u002Ftypography\u002Fsteps","docs\u002F4.typography\u002Fsteps","Transform headings into numbered step-by-step guides and tutorials.",{"title":778,"path":954,"stem":955,"framework":28,"category":887,"description":956},"\u002Fdocs\u002Ftypography\u002Ftabs","docs\u002F4.typography\u002Ftabs","Organize related content in interactive tabbed interfaces.","i-lucide-square-pilcrow",{"id":959,"title":960,"body":961,"category":16,"description":5422,"extension":5423,"framework":16,"index":36,"links":5424,"meta":5427,"navigation":36,"path":5428,"seo":5429,"stem":5430,"__hash__":5431},"docs\u002Fdocs\u002F1.getting-started\u002F3.migration\u002F2.v3.md","Migration to v3",{"type":962,"value":963,"toc":5408},"minimark",[964,968,991,994,999,1333,1337,1340,1344,1362,1486,1489,1499,1532,1588,1608,1664,1672,1691,1697,1710,1779,1783,1797,1808,1929,1940,1967,1977,1981,1984,2134,2137,2529,2533,2536,2551,2596,2615,2627,2680,2698,2715,2770,2782,2809,2828,2840,2942,2954,2971,3033,3041,3053,3080,3088,3102,3129,3143,3170,3180,3198,3225,3244,3271,3295,3349,3363,3420,3434,3452,3479,3498,3525,3532,3582,3596,3623,3633,3658,3670,3697,3710,3737,3749,3776,3788,3815,3831,3913,3924,3951,3974,4166,4180,4191,4236,4252,4270,4297,4309,4364,4371,4412,4431,4458,4470,4497,4509,4520,4586,4594,4613,4640,4660,4687,4706,4733,4746,4773,4791,4837,4841,4855,4891,4905,4908,4937,4991,4994,5094,5104,5275,5279,5290,5396,5399,5404],[965,966,967],"p",{},"Nuxt UI v3 is a new major version rebuilt from the ground up, introducing a modern architecture with significant performance improvements and an enhanced developer experience. This major release includes several breaking changes alongside powerful new features and capabilities:",[969,970,971,979,985],"ul",{},[972,973,974,978],"li",{},[975,976,977],"strong",{},"Tailwind CSS v4",": Migration from JavaScript to CSS-based configuration",[972,980,981,984],{},[975,982,983],{},"Reka UI",": Replacing Headless UI as the underlying component library",[972,986,987,990],{},[975,988,989],{},"Tailwind Variants",": New styling API for component variants",[965,992,993],{},"This guide provides step by step instructions to migrate your application from v2 to v3.",[995,996,998],"h2",{"id":997},"migrate-your-project","Migrate your project",[1000,1001,1002,1007,1010,1022,1037,1132,1137,1153,1157,1162,1224,1230,1263,1273],"steps",{},[1003,1004,1006],"h3",{"id":1005},"update-tailwind-css","Update Tailwind CSS",[965,1008,1009],{},"Tailwind CSS v4 introduces significant changes to its configuration approach. The official Tailwind upgrade tool will help automate most of the migration process.",[1011,1012,1015],"note",{"to":1013,"target":1014},"https:\u002F\u002Ftailwindcss.com\u002Fdocs\u002Fupgrade-guide#changes-from-v3","_blank",[965,1016,1017,1018,1021],{},"For a detailed walkthrough of all changes, refer to the official ",[975,1019,1020],{},"Tailwind CSS v4 upgrade guide",".",[1023,1024,1025],"ol",{},[972,1026,1027,1028,1032,1033,1036],{},"Create a ",[1029,1030,1031],"code",{},"main.css"," file and import it in your ",[1029,1034,1035],{},"nuxt.config.ts"," file:",[1038,1039,1040,1073],"code-group",{},[1041,1042,1048],"pre",{"className":1043,"code":1044,"filename":1045,"language":1046,"meta":1047,"style":1047},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","@import \"tailwindcss\";\n","app\u002Fassets\u002Fcss\u002Fmain.css","css","",[1029,1049,1050],{"__ignoreMap":1047},[1051,1052,1055,1059,1063,1067,1070],"span",{"class":1053,"line":1054},"line",1,[1051,1056,1058],{"class":1057},"s7zQu","@import",[1051,1060,1062],{"class":1061},"sMK4o"," \"",[1051,1064,1066],{"class":1065},"sfazB","tailwindcss",[1051,1068,1069],{"class":1061},"\"",[1051,1071,1072],{"class":1061},";\n",[1041,1074,1078],{"className":1075,"code":1076,"filename":1035,"language":1077,"meta":1047,"style":1047},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  css: ['~\u002Fassets\u002Fcss\u002Fmain.css']\n})\n","ts",[1029,1079,1080,1099,1123],{"__ignoreMap":1047},[1051,1081,1082,1085,1088,1092,1096],{"class":1053,"line":1054},[1051,1083,1084],{"class":1057},"export",[1051,1086,1087],{"class":1057}," default",[1051,1089,1091],{"class":1090},"s2Zo4"," defineNuxtConfig",[1051,1093,1095],{"class":1094},"sTEyZ","(",[1051,1097,1098],{"class":1061},"{\n",[1051,1100,1102,1106,1109,1112,1115,1118,1120],{"class":1053,"line":1101},2,[1051,1103,1105],{"class":1104},"swJcz","  css",[1051,1107,1108],{"class":1061},":",[1051,1110,1111],{"class":1094}," [",[1051,1113,1114],{"class":1061},"'",[1051,1116,1117],{"class":1065},"~\u002Fassets\u002Fcss\u002Fmain.css",[1051,1119,1114],{"class":1061},[1051,1121,1122],{"class":1094},"]\n",[1051,1124,1126,1129],{"class":1053,"line":1125},3,[1051,1127,1128],{"class":1061},"}",[1051,1130,1131],{"class":1094},")\n",[1023,1133,1134],{"start":1101},[972,1135,1136],{},"Run the Tailwind CSS upgrade tool:",[1041,1138,1142],{"className":1139,"code":1140,"language":1141,"meta":1047,"style":1047},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npx @tailwindcss\u002Fupgrade\n","bash",[1029,1143,1144],{"__ignoreMap":1047},[1051,1145,1146,1150],{"class":1053,"line":1054},[1051,1147,1149],{"class":1148},"sBMFI","npx",[1051,1151,1152],{"class":1065}," @tailwindcss\u002Fupgrade\n",[1003,1154,1156],{"id":1155},"update-nuxt-ui","Update Nuxt UI",[1023,1158,1159],{"start":1125},[972,1160,1161],{},"Install the latest version of the package:",[1038,1163,1165,1181,1195,1210],{"sync":1164},"pm",[1041,1166,1169],{"className":1139,"code":1167,"filename":1168,"language":1141,"meta":1047,"style":1047},"pnpm add @nuxt\u002Fui\n","pnpm",[1029,1170,1171],{"__ignoreMap":1047},[1051,1172,1173,1175,1178],{"class":1053,"line":1054},[1051,1174,1168],{"class":1148},[1051,1176,1177],{"class":1065}," add",[1051,1179,1180],{"class":1065}," @nuxt\u002Fui\n",[1041,1182,1185],{"className":1139,"code":1183,"filename":1184,"language":1141,"meta":1047,"style":1047},"yarn add @nuxt\u002Fui\n","yarn",[1029,1186,1187],{"__ignoreMap":1047},[1051,1188,1189,1191,1193],{"class":1053,"line":1054},[1051,1190,1184],{"class":1148},[1051,1192,1177],{"class":1065},[1051,1194,1180],{"class":1065},[1041,1196,1199],{"className":1139,"code":1197,"filename":1198,"language":1141,"meta":1047,"style":1047},"npm install @nuxt\u002Fui\n","npm",[1029,1200,1201],{"__ignoreMap":1047},[1051,1202,1203,1205,1208],{"class":1053,"line":1054},[1051,1204,1198],{"class":1148},[1051,1206,1207],{"class":1065}," install",[1051,1209,1180],{"class":1065},[1041,1211,1214],{"className":1139,"code":1212,"filename":1213,"language":1141,"meta":1047,"style":1047},"bun add @nuxt\u002Fui\n","bun",[1029,1215,1216],{"__ignoreMap":1047},[1051,1217,1218,1220,1222],{"class":1053,"line":1054},[1051,1219,1213],{"class":1148},[1051,1221,1177],{"class":1065},[1051,1223,1180],{"class":1065},[1023,1225,1227],{"start":1226},4,[972,1228,1229],{},"Import it in your CSS:",[1041,1231,1234],{"className":1043,"code":1232,"filename":1045,"highlights":1233,"language":1046,"meta":1047,"style":1047},"@import \"tailwindcss\";\n@import \"@nuxt\u002Fui\";\n",[1101],[1029,1235,1236,1248],{"__ignoreMap":1047},[1051,1237,1238,1240,1242,1244,1246],{"class":1053,"line":1054},[1051,1239,1058],{"class":1057},[1051,1241,1062],{"class":1061},[1051,1243,1066],{"class":1065},[1051,1245,1069],{"class":1061},[1051,1247,1072],{"class":1061},[1051,1249,1252,1254,1256,1259,1261],{"class":1250,"line":1101},[1053,1251],"highlight",[1051,1253,1058],{"class":1057},[1051,1255,1062],{"class":1061},[1051,1257,1258],{"class":1065},"@nuxt\u002Fui",[1051,1260,1069],{"class":1061},[1051,1262,1072],{"class":1061},[1023,1264,1266],{"start":1265},5,[972,1267,1268,1269,1272],{},"Wrap your app with the ",[1270,1271,181],"a",{"href":182}," component:",[1041,1274,1279],{"className":1275,"code":1276,"filename":1277,"highlights":1278,"language":34,"meta":1047,"style":1047},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n  \u003CUApp>\n    \u003CNuxtPage \u002F>\n  \u003C\u002FUApp>\n\u003C\u002Ftemplate>\n","app.vue",[1101,1226],[1029,1280,1281,1292,1303,1314,1324],{"__ignoreMap":1047},[1051,1282,1283,1286,1289],{"class":1053,"line":1054},[1051,1284,1285],{"class":1061},"\u003C",[1051,1287,1288],{"class":1104},"template",[1051,1290,1291],{"class":1061},">\n",[1051,1293,1295,1298,1301],{"class":1294,"line":1101},[1053,1251],[1051,1296,1297],{"class":1061},"  \u003C",[1051,1299,1300],{"class":1104},"UApp",[1051,1302,1291],{"class":1061},[1051,1304,1305,1308,1311],{"class":1053,"line":1125},[1051,1306,1307],{"class":1061},"    \u003C",[1051,1309,1310],{"class":1104},"NuxtPage",[1051,1312,1313],{"class":1061}," \u002F>\n",[1051,1315,1317,1320,1322],{"class":1316,"line":1226},[1053,1251],[1051,1318,1319],{"class":1061},"  \u003C\u002F",[1051,1321,1300],{"class":1104},[1051,1323,1291],{"class":1061},[1051,1325,1326,1329,1331],{"class":1053,"line":1265},[1051,1327,1328],{"class":1061},"\u003C\u002F",[1051,1330,1288],{"class":1104},[1051,1332,1291],{"class":1061},[995,1334,1336],{"id":1335},"changes-from-v2","Changes from v2",[965,1338,1339],{},"Now that you have updated your project, you can start migrating your code. Here's a comprehensive list of all the breaking changes in Nuxt UI v3.",[1003,1341,1343],{"id":1342},"updated-design-system","Updated design system",[965,1345,1346,1347,1350,1351,1350,1354,1357,1358,1361],{},"In Nuxt UI v2, we had a mix between a design system with ",[1029,1348,1349],{},"primary",", ",[1029,1352,1353],{},"gray",[1029,1355,1356],{},"error"," aliases and all the colors from Tailwind CSS. We've replaced it with a proper ",[1270,1359,1360],{"href":60},"design system"," with 7 color aliases:",[1363,1364,1365,1381],"table",{},[1366,1367,1368],"thead",{},[1369,1370,1371,1375,1378],"tr",{},[1372,1373,1374],"th",{},"Color",[1372,1376,1377],{},"Default",[1372,1379,1380],{},"Description",[1382,1383,1384,1399,1414,1428,1442,1457,1471],"tbody",{},[1369,1385,1386,1391,1396],{},[1387,1388,1389],"td",{},[1029,1390,1349],{"color":1349},[1387,1392,1393],{},[1029,1394,1395],{},"green",[1387,1397,1398],{},"Main brand color, used as the default color for components.",[1369,1400,1401,1406,1411],{},[1387,1402,1403],{},[1029,1404,1405],{"color":1405},"secondary",[1387,1407,1408],{},[1029,1409,1410],{},"blue",[1387,1412,1413],{},"Secondary color to complement the primary color.",[1369,1415,1416,1421,1425],{},[1387,1417,1418],{},[1029,1419,1420],{"color":1420},"success",[1387,1422,1423],{},[1029,1424,1395],{},[1387,1426,1427],{},"Used for success states.",[1369,1429,1430,1435,1439],{},[1387,1431,1432],{},[1029,1433,1434],{"color":1434},"info",[1387,1436,1437],{},[1029,1438,1410],{},[1387,1440,1441],{},"Used for informational states.",[1369,1443,1444,1449,1454],{},[1387,1445,1446],{},[1029,1447,1448],{"color":1448},"warning",[1387,1450,1451],{},[1029,1452,1453],{},"yellow",[1387,1455,1456],{},"Used for warning states.",[1369,1458,1459,1463,1468],{},[1387,1460,1461],{},[1029,1462,1356],{"color":1356},[1387,1464,1465],{},[1029,1466,1467],{},"red",[1387,1469,1470],{},"Used for form error validation states.",[1369,1472,1473,1478,1483],{},[1387,1474,1475],{},[1029,1476,1477],{},"neutral",[1387,1479,1480],{},[1029,1481,1482],{},"slate",[1387,1484,1485],{},"Neutral color for backgrounds, text, etc.",[965,1487,1488],{},"This change introduces several breaking changes that you need to be aware of:",[969,1490,1491],{},[972,1492,1493,1494,1496,1497],{},"The ",[1029,1495,1353],{}," color has been renamed to ",[1029,1498,1477],{},[1041,1500,1504],{"className":1501,"code":1502,"language":1503,"meta":1047,"style":1047},"language-diff shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Ctemplate>\n- \u003Cp class=\"text-gray-500 dark:text-gray-400\" \u002F>\n+ \u003Cp class=\"text-neutral-500 dark:text-neutral-400\" \u002F>\n\u003C\u002Ftemplate>\n","diff",[1029,1505,1506,1511,1519,1527],{"__ignoreMap":1047},[1051,1507,1508],{"class":1053,"line":1054},[1051,1509,1510],{"class":1094},"\u003Ctemplate>\n",[1051,1512,1513,1516],{"class":1053,"line":1101},[1051,1514,1515],{"class":1061},"-",[1051,1517,1518],{"class":1104}," \u003Cp class=\"text-gray-500 dark:text-gray-400\" \u002F>\n",[1051,1520,1521,1524],{"class":1053,"line":1125},[1051,1522,1523],{"class":1061},"+",[1051,1525,1526],{"class":1065}," \u003Cp class=\"text-neutral-500 dark:text-neutral-400\" \u002F>\n",[1051,1528,1529],{"class":1053,"line":1226},[1051,1530,1531],{"class":1094},"\u003C\u002Ftemplate>\n",[1011,1533,1534,1541],{},[965,1535,1536,1537,1540],{},"You can also use the new ",[1270,1538,1539],{"href":66},"design tokens"," to handle light and dark mode:",[1041,1542,1544],{"className":1501,"code":1543,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003Cp class=\"text-gray-500 dark:text-gray-400\" \u002F>\n+ \u003Cp class=\"text-muted\" \u002F>\n\n- \u003Cp class=\"text-gray-900 dark:text-white\" \u002F>\n+ \u003Cp class=\"text-highlighted\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,1545,1546,1550,1556,1563,1568,1575,1583],{"__ignoreMap":1047},[1051,1547,1548],{"class":1053,"line":1054},[1051,1549,1510],{"class":1094},[1051,1551,1552,1554],{"class":1053,"line":1101},[1051,1553,1515],{"class":1061},[1051,1555,1518],{"class":1104},[1051,1557,1558,1560],{"class":1053,"line":1125},[1051,1559,1523],{"class":1061},[1051,1561,1562],{"class":1065}," \u003Cp class=\"text-muted\" \u002F>\n",[1051,1564,1565],{"class":1053,"line":1226},[1051,1566,1567],{"emptyLinePlaceholder":21},"\n",[1051,1569,1570,1572],{"class":1053,"line":1265},[1051,1571,1515],{"class":1061},[1051,1573,1574],{"class":1104}," \u003Cp class=\"text-gray-900 dark:text-white\" \u002F>\n",[1051,1576,1578,1580],{"class":1053,"line":1577},6,[1051,1579,1523],{"class":1061},[1051,1581,1582],{"class":1065}," \u003Cp class=\"text-highlighted\" \u002F>\n",[1051,1584,1586],{"class":1053,"line":1585},7,[1051,1587,1531],{"class":1094},[969,1589,1590],{},[972,1591,1493,1592,1350,1594,1597,1598,1601,1602,1605,1606,1108],{},[1029,1593,1353],{},[1029,1595,1596],{},"black"," and ",[1029,1599,1600],{},"white"," in the ",[1029,1603,1604],{},"color"," props have been removed in favor of ",[1029,1607,1477],{},[1041,1609,1611],{"className":1501,"code":1610,"language":1503,"meta":1047,"style":1047},"- \u003CUButton color=\"black\" \u002F>\n+ \u003CUButton color=\"neutral\" \u002F>\n\n- \u003CUButton color=\"gray\" \u002F>\n+ \u003CUButton color=\"neutral\" variant=\"subtle\" \u002F>\n\n- \u003CUButton color=\"white\" \u002F>\n+ \u003CUButton color=\"neutral\" variant=\"outline\" \u002F>\n",[1029,1612,1613,1620,1627,1631,1638,1645,1649,1656],{"__ignoreMap":1047},[1051,1614,1615,1617],{"class":1053,"line":1054},[1051,1616,1515],{"class":1061},[1051,1618,1619],{"class":1104}," \u003CUButton color=\"black\" \u002F>\n",[1051,1621,1622,1624],{"class":1053,"line":1101},[1051,1623,1523],{"class":1061},[1051,1625,1626],{"class":1065}," \u003CUButton color=\"neutral\" \u002F>\n",[1051,1628,1629],{"class":1053,"line":1125},[1051,1630,1567],{"emptyLinePlaceholder":21},[1051,1632,1633,1635],{"class":1053,"line":1226},[1051,1634,1515],{"class":1061},[1051,1636,1637],{"class":1104}," \u003CUButton color=\"gray\" \u002F>\n",[1051,1639,1640,1642],{"class":1053,"line":1265},[1051,1641,1523],{"class":1061},[1051,1643,1644],{"class":1065}," \u003CUButton color=\"neutral\" variant=\"subtle\" \u002F>\n",[1051,1646,1647],{"class":1053,"line":1577},[1051,1648,1567],{"emptyLinePlaceholder":21},[1051,1650,1651,1653],{"class":1053,"line":1585},[1051,1652,1515],{"class":1061},[1051,1654,1655],{"class":1104}," \u003CUButton color=\"white\" \u002F>\n",[1051,1657,1659,1661],{"class":1053,"line":1658},8,[1051,1660,1523],{"class":1061},[1051,1662,1663],{"class":1065}," \u003CUButton color=\"neutral\" variant=\"outline\" \u002F>\n",[969,1665,1666],{},[972,1667,1668,1669,1671],{},"You can no longer use Tailwind CSS colors in the ",[1029,1670,1604],{}," props, use the new aliases instead:",[1041,1673,1675],{"className":1501,"code":1674,"language":1503,"meta":1047,"style":1047},"- \u003CUButton color=\"red\" \u002F>\n+ \u003CUButton color=\"error\" \u002F>\n",[1029,1676,1677,1684],{"__ignoreMap":1047},[1051,1678,1679,1681],{"class":1053,"line":1054},[1051,1680,1515],{"class":1061},[1051,1682,1683],{"class":1104}," \u003CUButton color=\"red\" \u002F>\n",[1051,1685,1686,1688],{"class":1053,"line":1101},[1051,1687,1523],{"class":1061},[1051,1689,1690],{"class":1065}," \u003CUButton color=\"error\" \u002F>\n",[1011,1692,1694],{"to":1693},"\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fdesign-system#colors",[965,1695,1696],{},"Learn how to extend the design system to add new color aliases.",[969,1698,1699],{},[972,1700,1701,1702,1705,1706,1709],{},"The color configuration in ",[1029,1703,1704],{},"app.config.ts"," has been moved into a ",[1029,1707,1708],{},"colors"," object:",[1041,1711,1713],{"className":1501,"code":1712,"language":1503,"meta":1047,"style":1047},"export default defineAppConfig({\n  ui: {\n-   primary: 'green',\n-   gray: 'cool'\n+   colors: {\n+     primary: 'green',\n+     neutral: 'slate'\n+   }\n  }\n})\n",[1029,1714,1715,1720,1725,1732,1739,1746,1753,1760,1767,1773],{"__ignoreMap":1047},[1051,1716,1717],{"class":1053,"line":1054},[1051,1718,1719],{"class":1094},"export default defineAppConfig({\n",[1051,1721,1722],{"class":1053,"line":1101},[1051,1723,1724],{"class":1094},"  ui: {\n",[1051,1726,1727,1729],{"class":1053,"line":1125},[1051,1728,1515],{"class":1061},[1051,1730,1731],{"class":1104},"   primary: 'green',\n",[1051,1733,1734,1736],{"class":1053,"line":1226},[1051,1735,1515],{"class":1061},[1051,1737,1738],{"class":1104},"   gray: 'cool'\n",[1051,1740,1741,1743],{"class":1053,"line":1265},[1051,1742,1523],{"class":1061},[1051,1744,1745],{"class":1065},"   colors: {\n",[1051,1747,1748,1750],{"class":1053,"line":1577},[1051,1749,1523],{"class":1061},[1051,1751,1752],{"class":1065},"     primary: 'green',\n",[1051,1754,1755,1757],{"class":1053,"line":1585},[1051,1756,1523],{"class":1061},[1051,1758,1759],{"class":1065},"     neutral: 'slate'\n",[1051,1761,1762,1764],{"class":1053,"line":1658},[1051,1763,1523],{"class":1061},[1051,1765,1766],{"class":1065},"   }\n",[1051,1768,1770],{"class":1053,"line":1769},9,[1051,1771,1772],{"class":1094},"  }\n",[1051,1774,1776],{"class":1053,"line":1775},10,[1051,1777,1778],{"class":1094},"})\n",[1003,1780,1782],{"id":1781},"updated-theming-system","Updated theming system",[965,1784,1785,1786,1789,1790,1792,1793,1796],{},"Nuxt UI components are now styled using the ",[1270,1787,1788],{"href":72},"Tailwind Variants API",", which makes all the overrides you made using the ",[1029,1791,1704],{}," and the ",[1029,1794,1795],{},"ui"," prop obsolete.",[969,1798,1799],{},[972,1800,1801,1802,1807],{},"Update your ",[1270,1803,1805],{"href":1804},"\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fcomponents#global-config",[1029,1806,1704],{}," to override components with their new theme:",[1041,1809,1811],{"className":1501,"code":1810,"language":1503,"meta":1047,"style":1047},"export default defineAppConfig({\n   ui: {\n     button: {\n-       font: 'font-bold',\n-       default: {\n-         size: 'md',\n-         color: 'primary'\n-       }\n+       slots: {\n+         base: 'font-medium'\n+       },\n+       defaultVariants: {\n+         size: 'md',\n+         color: 'primary'\n+       }\n     }\n   }\n})\n",[1029,1812,1813,1817,1822,1827,1834,1841,1848,1855,1862,1869,1876,1884,1892,1899,1906,1913,1919,1924],{"__ignoreMap":1047},[1051,1814,1815],{"class":1053,"line":1054},[1051,1816,1719],{"class":1094},[1051,1818,1819],{"class":1053,"line":1101},[1051,1820,1821],{"class":1094},"   ui: {\n",[1051,1823,1824],{"class":1053,"line":1125},[1051,1825,1826],{"class":1094},"     button: {\n",[1051,1828,1829,1831],{"class":1053,"line":1226},[1051,1830,1515],{"class":1061},[1051,1832,1833],{"class":1104},"       font: 'font-bold',\n",[1051,1835,1836,1838],{"class":1053,"line":1265},[1051,1837,1515],{"class":1061},[1051,1839,1840],{"class":1104},"       default: {\n",[1051,1842,1843,1845],{"class":1053,"line":1577},[1051,1844,1515],{"class":1061},[1051,1846,1847],{"class":1104},"         size: 'md',\n",[1051,1849,1850,1852],{"class":1053,"line":1585},[1051,1851,1515],{"class":1061},[1051,1853,1854],{"class":1104},"         color: 'primary'\n",[1051,1856,1857,1859],{"class":1053,"line":1658},[1051,1858,1515],{"class":1061},[1051,1860,1861],{"class":1104},"       }\n",[1051,1863,1864,1866],{"class":1053,"line":1769},[1051,1865,1523],{"class":1061},[1051,1867,1868],{"class":1065},"       slots: {\n",[1051,1870,1871,1873],{"class":1053,"line":1775},[1051,1872,1523],{"class":1061},[1051,1874,1875],{"class":1065},"         base: 'font-medium'\n",[1051,1877,1879,1881],{"class":1053,"line":1878},11,[1051,1880,1523],{"class":1061},[1051,1882,1883],{"class":1065},"       },\n",[1051,1885,1887,1889],{"class":1053,"line":1886},12,[1051,1888,1523],{"class":1061},[1051,1890,1891],{"class":1065},"       defaultVariants: {\n",[1051,1893,1895,1897],{"class":1053,"line":1894},13,[1051,1896,1523],{"class":1061},[1051,1898,1847],{"class":1065},[1051,1900,1902,1904],{"class":1053,"line":1901},14,[1051,1903,1523],{"class":1061},[1051,1905,1854],{"class":1065},[1051,1907,1909,1911],{"class":1053,"line":1908},15,[1051,1910,1523],{"class":1061},[1051,1912,1861],{"class":1065},[1051,1914,1916],{"class":1053,"line":1915},16,[1051,1917,1918],{"class":1094},"     }\n",[1051,1920,1922],{"class":1053,"line":1921},17,[1051,1923,1766],{"class":1094},[1051,1925,1927],{"class":1053,"line":1926},18,[1051,1928,1778],{"class":1094},[969,1930,1931],{},[972,1932,1801,1933,1939],{},[1270,1934,1936,1938],{"href":1935},"\u002Fdocs\u002Fgetting-started\u002Ftheme\u002Fcomponents#ui-prop",[1029,1937,1795],{}," props"," to override each component's slots using their new theme:",[1041,1941,1943],{"className":1501,"code":1942,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUButton :ui=\"{ font: 'font-bold' }\" \u002F>\n+ \u003CUButton :ui=\"{ base: 'font-bold' }\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,1944,1945,1949,1956,1963],{"__ignoreMap":1047},[1051,1946,1947],{"class":1053,"line":1054},[1051,1948,1510],{"class":1094},[1051,1950,1951,1953],{"class":1053,"line":1101},[1051,1952,1515],{"class":1061},[1051,1954,1955],{"class":1104}," \u003CUButton :ui=\"{ font: 'font-bold' }\" \u002F>\n",[1051,1957,1958,1960],{"class":1053,"line":1125},[1051,1959,1523],{"class":1061},[1051,1961,1962],{"class":1065}," \u003CUButton :ui=\"{ base: 'font-bold' }\" \u002F>\n",[1051,1964,1965],{"class":1053,"line":1226},[1051,1966,1531],{"class":1094},[1968,1969,1971],"tip",{"to":1970},"\u002Fdocs\u002Fcomponents\u002Fbutton#theme",[965,1972,1973,1974,1976],{},"We can't detail all the changes here but you can check each component's theme in the ",[975,1975,54],{}," section.",[1003,1978,1980],{"id":1979},"renamed-components","Renamed components",[965,1982,1983],{},"We've renamed some Nuxt UI components to align with the Reka UI naming convention:",[1363,1985,1986,1996],{},[1366,1987,1988],{},[1369,1989,1990,1993],{},[1372,1991,1992],{},"v2",[1372,1994,1995],{},"v3",[1382,1997,1998,2011,2024,2037,2050,2063,2073,2086,2101,2118],{},[1369,1999,2000,2005],{},[1387,2001,2002],{},[1029,2003,2004],{},"Divider",[1387,2006,2007],{},[1270,2008,2009],{"href":739},[1029,2010,738],{},[1369,2012,2013,2018],{},[1387,2014,2015],{},[1029,2016,2017],{},"Dropdown",[1387,2019,2020],{},[1270,2021,2022],{"href":457},[1029,2023,456],{},[1369,2025,2026,2031],{},[1387,2027,2028],{},[1029,2029,2030],{},"FormGroup",[1387,2032,2033],{},[1270,2034,2035],{"href":528},[1029,2036,527],{},[1369,2038,2039,2044],{},[1387,2040,2041],{},[1029,2042,2043],{},"Range",[1387,2045,2046],{},[1270,2047,2048],{"href":759},[1029,2049,758],{},[1369,2051,2052,2057],{},[1387,2053,2054],{},[1029,2055,2056],{},"Toggle",[1387,2058,2059],{},[1270,2060,2061],{"href":769},[1029,2062,768],{},[1369,2064,2065,2070],{},[1387,2066,2067],{},[1029,2068,2069],{},"Meter",[1387,2071,2072],{},"Removed",[1369,2074,2075,2080],{},[1387,2076,2077],{},[1029,2078,2079],{},"Notification",[1387,2081,2082],{},[1270,2083,2084],{"href":798},[1029,2085,797],{},[1369,2087,2088,2093],{},[1387,2089,2090],{},[1029,2091,2092],{},"Radio",[1387,2094,2095,2096,2100],{},"Removed (use ",[1270,2097,2098],{"href":719},[1029,2099,718],{}," instead)",[1369,2102,2103,2108],{},[1387,2104,2105],{},[1029,2106,2107],{},"VerticalNavigation",[1387,2109,2110,2114,2115],{},[1270,2111,2112],{"href":604},[1029,2113,603],{}," with ",[1029,2116,2117],{},"orientation=\"vertical\"",[1369,2119,2120,2125],{},[1387,2121,2122],{},[1029,2123,2124],{},"HorizontalNavigation",[1387,2126,2127,2114,2131],{},[1270,2128,2129],{"href":604},[1029,2130,603],{},[1029,2132,2133],{},"orientation=\"horizontal\"",[965,2135,2136],{},"Here are the Nuxt UI Pro components that have been renamed or removed:",[1363,2138,2139,2148],{},[1366,2140,2141],{},[1369,2142,2143,2146],{},[1372,2144,2145],{},"v1",[1372,2147,1995],{},[1382,2149,2150,2163,2176,2189,2202,2215,2228,2237,2250,2263,2276,2289,2302,2315,2328,2341,2354,2367,2380,2393,2406,2419,2433,2446,2459,2472,2485,2498,2511],{},[1369,2151,2152,2157],{},[1387,2153,2154],{},[1029,2155,2156],{},"BlogList",[1387,2158,2159],{},[1270,2160,2161],{"href":219},[1029,2162,218],{},[1369,2164,2165,2170],{},[1387,2166,2167],{},[1029,2168,2169],{},"ColorModeToggle",[1387,2171,2172],{},[1270,2173,2174],{"href":349},[1029,2175,348],{},[1369,2177,2178,2183],{},[1387,2179,2180],{},[1029,2181,2182],{},"DashboardCard",[1387,2184,2095,2185,2100],{},[1270,2186,2187],{"href":629},[1029,2188,628],{},[1369,2190,2191,2196],{},[1387,2192,2193],{},[1029,2194,2195],{},"DashboardLayout",[1387,2197,2198],{},[1270,2199,2200],{"href":401},[1029,2201,400],{},[1369,2203,2204,2209],{},[1387,2205,2206],{},[1029,2207,2208],{},"DashboardModal",[1387,2210,2095,2211,2100],{},[1270,2212,2213],{"href":599},[1029,2214,598],{},[1369,2216,2217,2222],{},[1387,2218,2219],{},[1029,2220,2221],{},"DashboardNavbarToggle",[1387,2223,2224],{},[1270,2225,2226],{"href":442},[1029,2227,441],{},[1369,2229,2230,2235],{},[1387,2231,2232],{},[1029,2233,2234],{},"DashboardPage",[1387,2236,2072],{},[1369,2238,2239,2244],{},[1387,2240,2241],{},[1029,2242,2243],{},"DashboardPanelContent",[1387,2245,2095,2246,2249],{},[1029,2247,2248],{},"#body"," slot instead)",[1369,2251,2252,2257],{},[1387,2253,2254],{},[1029,2255,2256],{},"DashboardPanelHandle",[1387,2258,2259],{},[1270,2260,2261],{"href":417},[1029,2262,416],{},[1369,2264,2265,2270],{},[1387,2266,2267],{},[1029,2268,2269],{},"DashboardSection",[1387,2271,2095,2272,2100],{},[1270,2273,2274],{"href":629},[1029,2275,628],{},[1369,2277,2278,2283],{},[1387,2279,2280],{},[1029,2281,2282],{},"DashboardSidebarLinks",[1387,2284,2095,2285,2100],{},[1270,2286,2287],{"href":604},[1029,2288,603],{},[1369,2290,2291,2296],{},[1387,2292,2293],{},[1029,2294,2295],{},"DashboardSlideover",[1387,2297,2095,2298,2100],{},[1270,2299,2300],{"href":754},[1029,2301,753],{},[1369,2303,2304,2309],{},[1387,2305,2306],{},[1029,2307,2308],{},"FooterLinks",[1387,2310,2095,2311,2100],{},[1270,2312,2313],{"href":604},[1029,2314,603],{},[1369,2316,2317,2322],{},[1387,2318,2319],{},[1029,2320,2321],{},"HeaderLinks",[1387,2323,2095,2324,2100],{},[1270,2325,2326],{"href":604},[1029,2327,603],{},[1369,2329,2330,2335],{},[1387,2331,2332],{},[1029,2333,2334],{},"LandingCard",[1387,2336,2095,2337,2100],{},[1270,2338,2339],{"href":629},[1029,2340,628],{},[1369,2342,2343,2348],{},[1387,2344,2345],{},[1029,2346,2347],{},"LandingCTA",[1387,2349,2350],{},[1270,2351,2352],{"href":639},[1029,2353,638],{},[1369,2355,2356,2361],{},[1387,2357,2358],{},[1029,2359,2360],{},"LandingFAQ",[1387,2362,2095,2363,2100],{},[1270,2364,2365],{"href":170},[1029,2366,169],{},[1369,2368,2369,2374],{},[1387,2370,2371],{},[1029,2372,2373],{},"LandingGrid",[1387,2375,2095,2376,2100],{},[1270,2377,2378],{"href":649},[1029,2379,648],{},[1369,2381,2382,2387],{},[1387,2383,2384],{},[1029,2385,2386],{},"LandingHero",[1387,2388,2095,2389,2100],{},[1270,2390,2391],{"href":659},[1029,2392,658],{},[1369,2394,2395,2400],{},[1387,2396,2397],{},[1029,2398,2399],{},"LandingLogos",[1387,2401,2402],{},[1270,2403,2404],{"href":674},[1029,2405,673],{},[1369,2407,2408,2413],{},[1387,2409,2410],{},[1029,2411,2412],{},"LandingSection",[1387,2414,2415],{},[1270,2416,2417],{"href":679},[1029,2418,678],{},[1369,2420,2421,2426],{},[1387,2422,2423],{},[1029,2424,2425],{},"LandingTestimonial",[1387,2427,2095,2428,2100],{},[1270,2429,2431],{"href":2430},"\u002Fdocs\u002Fcomponents\u002Fpage-card#as-a-testimonial",[1029,2432,628],{},[1369,2434,2435,2440],{},[1387,2436,2437],{},[1029,2438,2439],{},"NavigationAccordion",[1387,2441,2442],{},[1270,2443,2444],{"href":369},[1029,2445,368],{},[1369,2447,2448,2453],{},[1387,2449,2450],{},[1029,2451,2452],{},"NavigationLinks",[1387,2454,2455],{},[1270,2456,2457],{"href":369},[1029,2458,368],{},[1369,2460,2461,2466],{},[1387,2462,2463],{},[1029,2464,2465],{},"NavigationTree",[1387,2467,2468],{},[1270,2469,2470],{"href":369},[1029,2471,368],{},[1369,2473,2474,2479],{},[1387,2475,2476],{},[1029,2477,2478],{},"PageError",[1387,2480,2481],{},[1270,2482,2483],{"href":498},[1029,2484,497],{},[1369,2486,2487,2492],{},[1387,2488,2489],{},[1029,2490,2491],{},"PricingCard",[1387,2493,2494],{},[1270,2495,2496],{"href":699},[1029,2497,698],{},[1369,2499,2500,2505],{},[1387,2501,2502],{},[1029,2503,2504],{},"PricingGrid",[1387,2506,2507],{},[1270,2508,2509],{"href":704},[1029,2510,703],{},[1369,2512,2513,2518],{},[1387,2514,2515],{},[1029,2516,2517],{},"PricingSwitch",[1387,2519,2095,2520,2524,2525,2100],{},[1270,2521,2522],{"href":769},[1029,2523,768],{}," or ",[1270,2526,2527],{"href":779},[1029,2528,778],{},[1003,2530,2532],{"id":2531},"changed-components","Changed components",[965,2534,2535],{},"In addition to the renamed components, there are lots of changes to the components API. Let's detail the most important ones:",[969,2537,2538],{},[972,2539,1493,2540,1597,2543,2546,2547,2550],{},[1029,2541,2542],{},"links",[1029,2544,2545],{},"options"," props have been renamed to ",[1029,2548,2549],{},"items"," for consistency:",[1041,2552,2554],{"className":1501,"code":2553,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUSelect :options=\"countries\" \u002F>\n+ \u003CUSelect :items=\"countries\" \u002F>\n\n- \u003CUHorizontalNavigation :links=\"links\" \u002F>\n+ \u003CUNavigationMenu :items=\"links\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,2555,2556,2560,2567,2574,2578,2585,2592],{"__ignoreMap":1047},[1051,2557,2558],{"class":1053,"line":1054},[1051,2559,1510],{"class":1094},[1051,2561,2562,2564],{"class":1053,"line":1101},[1051,2563,1515],{"class":1061},[1051,2565,2566],{"class":1104}," \u003CUSelect :options=\"countries\" \u002F>\n",[1051,2568,2569,2571],{"class":1053,"line":1125},[1051,2570,1523],{"class":1061},[1051,2572,2573],{"class":1065}," \u003CUSelect :items=\"countries\" \u002F>\n",[1051,2575,2576],{"class":1053,"line":1226},[1051,2577,1567],{"emptyLinePlaceholder":21},[1051,2579,2580,2582],{"class":1053,"line":1265},[1051,2581,1515],{"class":1061},[1051,2583,2584],{"class":1104}," \u003CUHorizontalNavigation :links=\"links\" \u002F>\n",[1051,2586,2587,2589],{"class":1053,"line":1577},[1051,2588,1523],{"class":1061},[1051,2590,2591],{"class":1065}," \u003CUNavigationMenu :items=\"links\" \u002F>\n",[1051,2593,2594],{"class":1053,"line":1585},[1051,2595,1531],{"class":1094},[1011,2597,2598],{},[965,2599,2600,2601,1350,2603,1350,2605,1350,2607,1350,2609,1350,2611,1350,2613,1021],{},"This change affects the following components: ",[1029,2602,223],{},[1029,2604,2124],{},[1029,2606,552],{},[1029,2608,718],{},[1029,2610,728],{},[1029,2612,733],{},[1029,2614,2107],{},[969,2616,2617],{},[972,2618,1493,2619,2622,2623,2626],{},[1029,2620,2621],{},"click"," field in different components has been removed in favor of the native Vue ",[1029,2624,2625],{},"onClick"," event:",[1041,2628,2630],{"className":1501,"code":2629,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nconst items = [{\n  label: 'Edit',\n-  click: () => {\n+  onClick: () => {\n    console.log('Edit')\n  }\n}]\n\u003C\u002Fscript>\n",[1029,2631,2632,2637,2642,2647,2654,2661,2666,2670,2675],{"__ignoreMap":1047},[1051,2633,2634],{"class":1053,"line":1054},[1051,2635,2636],{"class":1094},"\u003Cscript setup lang=\"ts\">\n",[1051,2638,2639],{"class":1053,"line":1101},[1051,2640,2641],{"class":1094},"const items = [{\n",[1051,2643,2644],{"class":1053,"line":1125},[1051,2645,2646],{"class":1094},"  label: 'Edit',\n",[1051,2648,2649,2651],{"class":1053,"line":1226},[1051,2650,1515],{"class":1061},[1051,2652,2653],{"class":1104},"  click: () => {\n",[1051,2655,2656,2658],{"class":1053,"line":1265},[1051,2657,1523],{"class":1061},[1051,2659,2660],{"class":1065},"  onClick: () => {\n",[1051,2662,2663],{"class":1053,"line":1577},[1051,2664,2665],{"class":1094},"    console.log('Edit')\n",[1051,2667,2668],{"class":1053,"line":1585},[1051,2669,1772],{"class":1094},[1051,2671,2672],{"class":1053,"line":1658},[1051,2673,2674],{"class":1094},"}]\n",[1051,2676,2677],{"class":1053,"line":1769},[1051,2678,2679],{"class":1094},"\u003C\u002Fscript>\n",[1011,2681,2682],{},[965,2683,2684,2685,2687,2688,2690,2691,1350,2693,1350,2695,2697],{},"This change affects the ",[1029,2686,797],{}," component as well as all component that have ",[1029,2689,2549],{}," links like ",[1029,2692,603],{},[1029,2694,456],{},[1029,2696,358],{},", etc.",[969,2699,2700],{},[972,2701,2702,2703,1350,2706,1597,2709,2712,2713,1272],{},"The global ",[1029,2704,2705],{},"Modals",[1029,2707,2708],{},"Slideovers",[1029,2710,2711],{},"Notifications"," components have been removed in favor of the ",[1270,2714,181],{"href":182},[1041,2716,2718],{"className":1501,"code":2717,"filename":1277,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n+  \u003CUApp>\n+    \u003CNuxtPage \u002F>\n+  \u003C\u002FUApp>\n-  \u003CUModals \u002F>\n-  \u003CUSlideovers \u002F>\n-  \u003CUNotifications \u002F>\n\u003C\u002Ftemplate>\n",[1029,2719,2720,2724,2731,2738,2745,2752,2759,2766],{"__ignoreMap":1047},[1051,2721,2722],{"class":1053,"line":1054},[1051,2723,1510],{"class":1094},[1051,2725,2726,2728],{"class":1053,"line":1101},[1051,2727,1523],{"class":1061},[1051,2729,2730],{"class":1065},"  \u003CUApp>\n",[1051,2732,2733,2735],{"class":1053,"line":1125},[1051,2734,1523],{"class":1061},[1051,2736,2737],{"class":1065},"    \u003CNuxtPage \u002F>\n",[1051,2739,2740,2742],{"class":1053,"line":1226},[1051,2741,1523],{"class":1061},[1051,2743,2744],{"class":1065},"  \u003C\u002FUApp>\n",[1051,2746,2747,2749],{"class":1053,"line":1265},[1051,2748,1515],{"class":1061},[1051,2750,2751],{"class":1104},"  \u003CUModals \u002F>\n",[1051,2753,2754,2756],{"class":1053,"line":1577},[1051,2755,1515],{"class":1061},[1051,2757,2758],{"class":1104},"  \u003CUSlideovers \u002F>\n",[1051,2760,2761,2763],{"class":1053,"line":1585},[1051,2762,1515],{"class":1061},[1051,2764,2765],{"class":1104},"  \u003CUNotifications \u002F>\n",[1051,2767,2768],{"class":1053,"line":1658},[1051,2769,1531],{"class":1094},[969,2771,2772],{},[972,2773,1493,2774,2777,2778,2781],{},[1029,2775,2776],{},"v-model:open"," directive and ",[1029,2779,2780],{},"default-open"," prop are now used to control visibility:",[1041,2783,2785],{"className":1501,"code":2784,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUModal v-model=\"open\" \u002F>\n+ \u003CUModal v-model:open=\"open\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,2786,2787,2791,2798,2805],{"__ignoreMap":1047},[1051,2788,2789],{"class":1053,"line":1054},[1051,2790,1510],{"class":1094},[1051,2792,2793,2795],{"class":1053,"line":1101},[1051,2794,1515],{"class":1061},[1051,2796,2797],{"class":1104}," \u003CUModal v-model=\"open\" \u002F>\n",[1051,2799,2800,2802],{"class":1053,"line":1125},[1051,2801,1523],{"class":1061},[1051,2803,2804],{"class":1065}," \u003CUModal v-model:open=\"open\" \u002F>\n",[1051,2806,2807],{"class":1053,"line":1226},[1051,2808,1531],{"class":1094},[1011,2810,2811],{},[965,2812,2600,2813,1350,2815,1597,2817,2819,2820,1350,2822,1350,2824,1597,2826,1021],{},[1029,2814,394],{},[1029,2816,598],{},[1029,2818,753],{}," and enables controlling visibility for ",[1029,2821,552],{},[1029,2823,728],{},[1029,2825,733],{},[1029,2827,802],{},[969,2829,2830],{},[972,2831,2832,2833,2836,2837,2839],{},"The default slot is now used for the trigger and the content goes inside the ",[1029,2834,2835],{},"#content"," slot (you don't need to use a ",[1029,2838,2776],{}," directive with this method):",[1041,2841,2843],{"className":1501,"code":2842,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\n- const open = ref(false)\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n- \u003CUButton label=\"Open\" @click=\"open = true\" \u002F>\n\n- \u003CUModal v-model=\"open\">\n+ \u003CUModal>\n+   \u003CUButton label=\"Open\" \u002F>\n\n+   \u003Ctemplate #content>\n      \u003Cdiv class=\"p-4\">\n        \u003CPlaceholder class=\"h-48\" \u002F>\n      \u003C\u002Fdiv>\n+   \u003C\u002Ftemplate>\n  \u003C\u002FUModal>\n\u003C\u002Ftemplate>\n",[1029,2844,2845,2849,2856,2860,2864,2868,2875,2879,2886,2893,2900,2904,2911,2916,2921,2926,2933,2938],{"__ignoreMap":1047},[1051,2846,2847],{"class":1053,"line":1054},[1051,2848,2636],{"class":1094},[1051,2850,2851,2853],{"class":1053,"line":1101},[1051,2852,1515],{"class":1061},[1051,2854,2855],{"class":1104}," const open = ref(false)\n",[1051,2857,2858],{"class":1053,"line":1125},[1051,2859,2679],{"class":1094},[1051,2861,2862],{"class":1053,"line":1226},[1051,2863,1567],{"emptyLinePlaceholder":21},[1051,2865,2866],{"class":1053,"line":1265},[1051,2867,1510],{"class":1094},[1051,2869,2870,2872],{"class":1053,"line":1577},[1051,2871,1515],{"class":1061},[1051,2873,2874],{"class":1104}," \u003CUButton label=\"Open\" @click=\"open = true\" \u002F>\n",[1051,2876,2877],{"class":1053,"line":1585},[1051,2878,1567],{"emptyLinePlaceholder":21},[1051,2880,2881,2883],{"class":1053,"line":1658},[1051,2882,1515],{"class":1061},[1051,2884,2885],{"class":1104}," \u003CUModal v-model=\"open\">\n",[1051,2887,2888,2890],{"class":1053,"line":1769},[1051,2889,1523],{"class":1061},[1051,2891,2892],{"class":1065}," \u003CUModal>\n",[1051,2894,2895,2897],{"class":1053,"line":1775},[1051,2896,1523],{"class":1061},[1051,2898,2899],{"class":1065},"   \u003CUButton label=\"Open\" \u002F>\n",[1051,2901,2902],{"class":1053,"line":1878},[1051,2903,1567],{"emptyLinePlaceholder":21},[1051,2905,2906,2908],{"class":1053,"line":1886},[1051,2907,1523],{"class":1061},[1051,2909,2910],{"class":1065},"   \u003Ctemplate #content>\n",[1051,2912,2913],{"class":1053,"line":1894},[1051,2914,2915],{"class":1094},"      \u003Cdiv class=\"p-4\">\n",[1051,2917,2918],{"class":1053,"line":1901},[1051,2919,2920],{"class":1094},"        \u003CPlaceholder class=\"h-48\" \u002F>\n",[1051,2922,2923],{"class":1053,"line":1908},[1051,2924,2925],{"class":1094},"      \u003C\u002Fdiv>\n",[1051,2927,2928,2930],{"class":1053,"line":1915},[1051,2929,1523],{"class":1061},[1051,2931,2932],{"class":1065},"   \u003C\u002Ftemplate>\n",[1051,2934,2935],{"class":1053,"line":1921},[1051,2936,2937],{"class":1094},"  \u003C\u002FUModal>\n",[1051,2939,2940],{"class":1053,"line":1926},[1051,2941,1531],{"class":1094},[1011,2943,2944],{},[965,2945,2600,2946,1350,2948,1350,2950,1350,2952,1021],{},[1029,2947,598],{},[1029,2949,693],{},[1029,2951,753],{},[1029,2953,802],{},[969,2955,2956],{},[972,2957,2958,2959,1350,2962,1597,2964,2967,2968,2970],{},"A ",[1029,2960,2961],{},"#header",[1029,2963,2248],{},[1029,2965,2966],{},"#footer"," slots have been added inside the ",[1029,2969,2835],{}," slot like:",[1041,2972,2974],{"className":1501,"code":2973,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUModal>\n+ \u003CUModal title=\"Title\" description=\"Description\">\n-   \u003Cdiv class=\"p-4\">\n+   \u003Ctemplate #body>\n      \u003CPlaceholder class=\"h-48\" \u002F>\n+   \u003C\u002Ftemplate>\n-   \u003C\u002Fdiv>\n  \u003C\u002FUModal>\n\u003C\u002Ftemplate>\n",[1029,2975,2976,2980,2986,2993,3000,3007,3012,3018,3025,3029],{"__ignoreMap":1047},[1051,2977,2978],{"class":1053,"line":1054},[1051,2979,1510],{"class":1094},[1051,2981,2982,2984],{"class":1053,"line":1101},[1051,2983,1515],{"class":1061},[1051,2985,2892],{"class":1104},[1051,2987,2988,2990],{"class":1053,"line":1125},[1051,2989,1523],{"class":1061},[1051,2991,2992],{"class":1065}," \u003CUModal title=\"Title\" description=\"Description\">\n",[1051,2994,2995,2997],{"class":1053,"line":1226},[1051,2996,1515],{"class":1061},[1051,2998,2999],{"class":1104},"   \u003Cdiv class=\"p-4\">\n",[1051,3001,3002,3004],{"class":1053,"line":1265},[1051,3003,1523],{"class":1061},[1051,3005,3006],{"class":1065},"   \u003Ctemplate #body>\n",[1051,3008,3009],{"class":1053,"line":1577},[1051,3010,3011],{"class":1094},"      \u003CPlaceholder class=\"h-48\" \u002F>\n",[1051,3013,3014,3016],{"class":1053,"line":1585},[1051,3015,1523],{"class":1061},[1051,3017,2932],{"class":1065},[1051,3019,3020,3022],{"class":1053,"line":1658},[1051,3021,1515],{"class":1061},[1051,3023,3024],{"class":1104},"   \u003C\u002Fdiv>\n",[1051,3026,3027],{"class":1053,"line":1769},[1051,3028,2937],{"class":1094},[1051,3030,3031],{"class":1053,"line":1775},[1051,3032,1531],{"class":1094},[1011,3034,3035],{},[965,3036,2600,3037,1350,3039,1021],{},[1029,3038,598],{},[1029,3040,753],{},[969,3042,3043],{},[972,3044,1493,3045,3048,3049,3052],{},[1029,3046,3047],{},"prevent-close"," prop has been removed in favor of the ",[1029,3050,3051],{},"dismissible"," prop:",[1041,3054,3056],{"className":1501,"code":3055,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUModal prevent-close \u002F>\n+ \u003CUModal :dismissible=\"false\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3057,3058,3062,3069,3076],{"__ignoreMap":1047},[1051,3059,3060],{"class":1053,"line":1054},[1051,3061,1510],{"class":1094},[1051,3063,3064,3066],{"class":1053,"line":1101},[1051,3065,1515],{"class":1061},[1051,3067,3068],{"class":1104}," \u003CUModal prevent-close \u002F>\n",[1051,3070,3071,3073],{"class":1053,"line":1125},[1051,3072,1523],{"class":1061},[1051,3074,3075],{"class":1065}," \u003CUModal :dismissible=\"false\" \u002F>\n",[1051,3077,3078],{"class":1053,"line":1226},[1051,3079,1531],{"class":1094},[1011,3081,3082],{},[965,3083,2600,3084,1350,3086,1021],{},[1029,3085,598],{},[1029,3087,753],{},[969,3089,3090],{},[972,3091,1493,3092,3094,3095,3098,3099,1108],{},[1029,3093,683],{}," component ",[1029,3096,3097],{},"v-model"," directive has been renamed to ",[1029,3100,3101],{},"v-model:page",[1041,3103,3105],{"className":1501,"code":3104,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUPagination v-model=\"page\" \u002F>\n+ \u003CUPagination v-model:page=\"page\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3106,3107,3111,3118,3125],{"__ignoreMap":1047},[1051,3108,3109],{"class":1053,"line":1054},[1051,3110,1510],{"class":1094},[1051,3112,3113,3115],{"class":1053,"line":1101},[1051,3114,1515],{"class":1061},[1051,3116,3117],{"class":1104}," \u003CUPagination v-model=\"page\" \u002F>\n",[1051,3119,3120,3122],{"class":1053,"line":1125},[1051,3121,1523],{"class":1061},[1051,3123,3124],{"class":1065}," \u003CUPagination v-model:page=\"page\" \u002F>\n",[1051,3126,3127],{"class":1053,"line":1226},[1051,3128,1531],{"class":1094},[969,3130,3131],{},[972,3132,1493,3133,3136,3137,3139,3140,2626],{},[1029,3134,3135],{},"change"," event now emits the native ",[1029,3138,3135],{}," event, not the new value, which is now emitted in the ",[1029,3141,3142],{},"update:modelValue",[1041,3144,3146],{"className":1501,"code":3145,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUSelectMenu v-model=\"country\" :items=\"countries\" @change=\"console.log(newVal)\" \u002F>\n+ \u003CUSelectMenu v-model=\"country\" :items=\"countries\" @update:modelValue=\"console.log(newVal)\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3147,3148,3152,3159,3166],{"__ignoreMap":1047},[1051,3149,3150],{"class":1053,"line":1054},[1051,3151,1510],{"class":1094},[1051,3153,3154,3156],{"class":1053,"line":1101},[1051,3155,1515],{"class":1061},[1051,3157,3158],{"class":1104}," \u003CUSelectMenu v-model=\"country\" :items=\"countries\" @change=\"console.log(newVal)\" \u002F>\n",[1051,3160,3161,3163],{"class":1053,"line":1125},[1051,3162,1523],{"class":1061},[1051,3164,3165],{"class":1065}," \u003CUSelectMenu v-model=\"country\" :items=\"countries\" @update:modelValue=\"console.log(newVal)\" \u002F>\n",[1051,3167,3168],{"class":1053,"line":1226},[1051,3169,1531],{"class":1094},[1011,3171,3172],{},[965,3173,2600,3174,1350,3176,1350,3178,1021],{},[1029,3175,728],{},[1029,3177,733],{},[1029,3179,718],{},[969,3181,3182],{},[972,3183,1493,3184,3094,3186,3189,3190,3193,3194,3197],{},[1029,3185,733],{},[1029,3187,3188],{},"searchable"," prop has been renamed to ",[1029,3191,3192],{},"search-input"," and now defaults to ",[1029,3195,3196],{},"true",". To preserve v2 behavior (no search input):",[1041,3199,3201],{"className":1501,"code":3200,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUSelectMenu :items=\"items\" \u002F>\n+ \u003CUSelectMenu :search-input=\"false\" :items=\"items\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3202,3203,3207,3214,3221],{"__ignoreMap":1047},[1051,3204,3205],{"class":1053,"line":1054},[1051,3206,1510],{"class":1094},[1051,3208,3209,3211],{"class":1053,"line":1101},[1051,3210,1515],{"class":1061},[1051,3212,3213],{"class":1104}," \u003CUSelectMenu :items=\"items\" \u002F>\n",[1051,3215,3216,3218],{"class":1053,"line":1125},[1051,3217,1523],{"class":1061},[1051,3219,3220],{"class":1065}," \u003CUSelectMenu :search-input=\"false\" :items=\"items\" \u002F>\n",[1051,3222,3223],{"class":1053,"line":1226},[1051,3224,1531],{"class":1094},[969,3226,3227],{},[972,3228,1493,3229,3231,3232,3235,3236,3239,3240,3243],{},[1029,3230,169],{}," component has been redesigned. The ",[1029,3233,3234],{},"multiple"," prop has been replaced by the ",[1029,3237,3238],{},"type"," prop (defaults to ",[1029,3241,3242],{},"single","):",[1041,3245,3247],{"className":1501,"code":3246,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAccordion multiple :items=\"items\" \u002F>\n+ \u003CUAccordion type=\"multiple\" :items=\"items\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3248,3249,3253,3260,3267],{"__ignoreMap":1047},[1051,3250,3251],{"class":1053,"line":1054},[1051,3252,1510],{"class":1094},[1051,3254,3255,3257],{"class":1053,"line":1101},[1051,3256,1515],{"class":1061},[1051,3258,3259],{"class":1104}," \u003CUAccordion multiple :items=\"items\" \u002F>\n",[1051,3261,3262,3264],{"class":1053,"line":1125},[1051,3263,1523],{"class":1061},[1051,3265,3266],{"class":1065}," \u003CUAccordion type=\"multiple\" :items=\"items\" \u002F>\n",[1051,3268,3269],{"class":1053,"line":1226},[1051,3270,1531],{"class":1094},[969,3272,3273],{},[972,3274,1493,3275,3094,3277,3279,3280,3283,3284,3287,3288,3291,3292,3294],{},[1029,3276,169],{},[1029,3278,2780],{}," prop and ",[1029,3281,3282],{},"defaultOpen"," ",[975,3285,3286],{},"item"," property have been removed. State is now controlled using ",[1029,3289,3290],{},"default-value"," (uncontrolled) or ",[1029,3293,3097],{}," (controlled):",[1041,3296,3298],{"className":1501,"code":3297,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAccordion default-open multiple :items=\"items\" \u002F>\n+ \u003CUAccordion\n+   type=\"multiple\"\n+   :default-value=\"['0', '1']\"\n+   :items=\"items\"\n+ \u002F>\n\u003C\u002Ftemplate>\n",[1029,3299,3300,3304,3311,3318,3325,3332,3339,3345],{"__ignoreMap":1047},[1051,3301,3302],{"class":1053,"line":1054},[1051,3303,1510],{"class":1094},[1051,3305,3306,3308],{"class":1053,"line":1101},[1051,3307,1515],{"class":1061},[1051,3309,3310],{"class":1104}," \u003CUAccordion default-open multiple :items=\"items\" \u002F>\n",[1051,3312,3313,3315],{"class":1053,"line":1125},[1051,3314,1523],{"class":1061},[1051,3316,3317],{"class":1065}," \u003CUAccordion\n",[1051,3319,3320,3322],{"class":1053,"line":1226},[1051,3321,1523],{"class":1061},[1051,3323,3324],{"class":1065},"   type=\"multiple\"\n",[1051,3326,3327,3329],{"class":1053,"line":1265},[1051,3328,1523],{"class":1061},[1051,3330,3331],{"class":1065},"   :default-value=\"['0', '1']\"\n",[1051,3333,3334,3336],{"class":1053,"line":1577},[1051,3335,1523],{"class":1061},[1051,3337,3338],{"class":1065},"   :items=\"items\"\n",[1051,3340,3341,3343],{"class":1053,"line":1585},[1051,3342,1523],{"class":1061},[1051,3344,1313],{"class":1065},[1051,3346,3347],{"class":1053,"line":1658},[1051,3348,1531],{"class":1094},[969,3350,3351],{},[972,3352,1493,3353,3094,3355,3358,3359,1597,3361,1108],{},[1029,3354,169],{},[1029,3356,3357],{},"#item"," slot has been removed in favor of ",[1029,3360,2835],{},[1029,3362,2248],{},[1041,3364,3366],{"className":1501,"code":3365,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003Ctemplate #item=\"{ item }\">\n-   {{ item.content }}\n- \u003C\u002Ftemplate>\n\n+ \u003Ctemplate #content=\"{ item }\">\n+   {{ item.content }}\n+ \u003C\u002Ftemplate>\n\u003C\u002Ftemplate>\n",[1029,3367,3368,3372,3379,3386,3393,3397,3404,3410,3416],{"__ignoreMap":1047},[1051,3369,3370],{"class":1053,"line":1054},[1051,3371,1510],{"class":1094},[1051,3373,3374,3376],{"class":1053,"line":1101},[1051,3375,1515],{"class":1061},[1051,3377,3378],{"class":1104}," \u003Ctemplate #item=\"{ item }\">\n",[1051,3380,3381,3383],{"class":1053,"line":1125},[1051,3382,1515],{"class":1061},[1051,3384,3385],{"class":1104},"   {{ item.content }}\n",[1051,3387,3388,3390],{"class":1053,"line":1226},[1051,3389,1515],{"class":1061},[1051,3391,3392],{"class":1104}," \u003C\u002Ftemplate>\n",[1051,3394,3395],{"class":1053,"line":1265},[1051,3396,1567],{"emptyLinePlaceholder":21},[1051,3398,3399,3401],{"class":1053,"line":1577},[1051,3400,1523],{"class":1061},[1051,3402,3403],{"class":1065}," \u003Ctemplate #content=\"{ item }\">\n",[1051,3405,3406,3408],{"class":1053,"line":1585},[1051,3407,1523],{"class":1061},[1051,3409,3385],{"class":1065},[1051,3411,3412,3414],{"class":1053,"line":1658},[1051,3413,1523],{"class":1061},[1051,3415,3392],{"class":1065},[1051,3417,3418],{"class":1053,"line":1769},[1051,3419,1531],{"class":1094},[1011,3421,3422],{},[965,3423,3424,3425,1350,3428,1350,3431,3433],{},"The default slot now only customizes the trigger, with additional slots for finer control (",[1029,3426,3427],{},"#leading",[1029,3429,3430],{},"#trailing",[1029,3432,2248],{},").",[969,3435,3436],{},[972,3437,1493,3438,3094,3440,3189,3443,3193,3446,3448,3449,1108],{},[1029,3439,169],{},[1029,3441,3442],{},"unmount",[1029,3444,3445],{},"unmount-on-hide",[1029,3447,3196],{},". To preserve v2 behavior (keep content mounted), use ",[1029,3450,3451],{},":unmount-on-hide=\"false\"",[1041,3453,3455],{"className":1501,"code":3454,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAccordion :items=\"items\" \u002F>\n+ \u003CUAccordion :unmount-on-hide=\"false\" :items=\"items\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3456,3457,3461,3468,3475],{"__ignoreMap":1047},[1051,3458,3459],{"class":1053,"line":1054},[1051,3460,1510],{"class":1094},[1051,3462,3463,3465],{"class":1053,"line":1101},[1051,3464,1515],{"class":1061},[1051,3466,3467],{"class":1104}," \u003CUAccordion :items=\"items\" \u002F>\n",[1051,3469,3470,3472],{"class":1053,"line":1125},[1051,3471,1523],{"class":1061},[1051,3473,3474],{"class":1065}," \u003CUAccordion :unmount-on-hide=\"false\" :items=\"items\" \u002F>\n",[1051,3476,3477],{"class":1053,"line":1226},[1051,3478,1531],{"class":1094},[969,3480,3481],{},[972,3482,1493,3483,3485,3486,3492,3493,3189,3496,1108],{},[1029,3484,773],{}," component now uses ",[1270,3487,3491],{"href":3488,"rel":3489,"target":1014},"https:\u002F\u002Ftanstack.com\u002Ftable\u002Flatest",[3490],"nofollow","TanStack Table"," under the hood. The ",[1029,3494,3495],{},"rows",[1029,3497,172],{},[1041,3499,3501],{"className":1501,"code":3500,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUTable :rows=\"rows\" \u002F>\n+ \u003CUTable :data=\"data\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3502,3503,3507,3514,3521],{"__ignoreMap":1047},[1051,3504,3505],{"class":1053,"line":1054},[1051,3506,1510],{"class":1094},[1051,3508,3509,3511],{"class":1053,"line":1101},[1051,3510,1515],{"class":1061},[1051,3512,3513],{"class":1104}," \u003CUTable :rows=\"rows\" \u002F>\n",[1051,3515,3516,3518],{"class":1053,"line":1125},[1051,3517,1523],{"class":1061},[1051,3519,3520],{"class":1065}," \u003CUTable :data=\"data\" \u002F>\n",[1051,3522,3523],{"class":1053,"line":1226},[1051,3524,1531],{"class":1094},[969,3526,3527],{},[972,3528,1493,3529,3531],{},[1029,3530,773],{}," component columns definition is now explicit and semantic:",[1041,3533,3535],{"className":1501,"code":3534,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nconst columns = [{\n-  label: 'Status',\n-  key: 'status'\n+  header: 'Status',\n+  accessorKey: 'status'\n}]\n\u003C\u002Fscript>\n",[1029,3536,3537,3541,3546,3553,3560,3567,3574,3578],{"__ignoreMap":1047},[1051,3538,3539],{"class":1053,"line":1054},[1051,3540,2636],{"class":1094},[1051,3542,3543],{"class":1053,"line":1101},[1051,3544,3545],{"class":1094},"const columns = [{\n",[1051,3547,3548,3550],{"class":1053,"line":1125},[1051,3549,1515],{"class":1061},[1051,3551,3552],{"class":1104},"  label: 'Status',\n",[1051,3554,3555,3557],{"class":1053,"line":1226},[1051,3556,1515],{"class":1061},[1051,3558,3559],{"class":1104},"  key: 'status'\n",[1051,3561,3562,3564],{"class":1053,"line":1265},[1051,3563,1523],{"class":1061},[1051,3565,3566],{"class":1065},"  header: 'Status',\n",[1051,3568,3569,3571],{"class":1053,"line":1577},[1051,3570,1523],{"class":1061},[1051,3572,3573],{"class":1065},"  accessorKey: 'status'\n",[1051,3575,3576],{"class":1053,"line":1585},[1051,3577,2674],{"class":1094},[1051,3579,3580],{"class":1053,"line":1658},[1051,3581,2679],{"class":1094},[969,3583,3584],{},[972,3585,1493,3586,3588,3589,3592,3593,1108],{},[1029,3587,773],{}," component row cell slot names have been changed from ",[1029,3590,3591],{},"\u003Ccolumn-accessorKey>-data"," to ",[1029,3594,3595],{},"\u003Ccolumn-accessorKey>-cell",[1041,3597,3599],{"className":1501,"code":3598,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003Ctemplate #column-data=\"{ row }\">\n+ \u003Ctemplate #column-cell=\"{ row }\">\n\u003C\u002Ftemplate>\n",[1029,3600,3601,3605,3612,3619],{"__ignoreMap":1047},[1051,3602,3603],{"class":1053,"line":1054},[1051,3604,1510],{"class":1094},[1051,3606,3607,3609],{"class":1053,"line":1101},[1051,3608,1515],{"class":1061},[1051,3610,3611],{"class":1104}," \u003Ctemplate #column-data=\"{ row }\">\n",[1051,3613,3614,3616],{"class":1053,"line":1125},[1051,3615,1523],{"class":1061},[1051,3617,3618],{"class":1065}," \u003Ctemplate #column-cell=\"{ row }\">\n",[1051,3620,3621],{"class":1053,"line":1226},[1051,3622,1531],{"class":1094},[969,3624,3625],{},[972,3626,1493,3627,3094,3629,3358,3631,1108],{},[1029,3628,778],{},[1029,3630,3357],{},[1029,3632,2835],{},[1041,3634,3636],{"className":1501,"code":3635,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003Ctemplate #item=\"{ item }\">\n+ \u003Ctemplate #content=\"{ item }\">\n\u003C\u002Ftemplate>\n",[1029,3637,3638,3642,3648,3654],{"__ignoreMap":1047},[1051,3639,3640],{"class":1053,"line":1054},[1051,3641,1510],{"class":1094},[1051,3643,3644,3646],{"class":1053,"line":1101},[1051,3645,1515],{"class":1061},[1051,3647,3378],{"class":1104},[1051,3649,3650,3652],{"class":1053,"line":1125},[1051,3651,1523],{"class":1061},[1051,3653,3403],{"class":1065},[1051,3655,3656],{"class":1053,"line":1226},[1051,3657,1531],{"class":1094},[969,3659,3660],{},[972,3661,1493,3662,3094,3664,3667,3668,1108],{},[1029,3663,778],{},[1029,3665,3666],{},"default-index"," prop has been removed in favor of ",[1029,3669,3290],{},[1041,3671,3673],{"className":1501,"code":3672,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUTabs :default-index=\"0\" :items=\"tabs\" \u002F>\n+ \u003CUTabs :default-value=\"0\" :items=\"tabs\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3674,3675,3679,3686,3693],{"__ignoreMap":1047},[1051,3676,3677],{"class":1053,"line":1054},[1051,3678,1510],{"class":1094},[1051,3680,3681,3683],{"class":1053,"line":1101},[1051,3682,1515],{"class":1061},[1051,3684,3685],{"class":1104}," \u003CUTabs :default-index=\"0\" :items=\"tabs\" \u002F>\n",[1051,3687,3688,3690],{"class":1053,"line":1125},[1051,3689,1523],{"class":1061},[1051,3691,3692],{"class":1065}," \u003CUTabs :default-value=\"0\" :items=\"tabs\" \u002F>\n",[1051,3694,3695],{"class":1053,"line":1226},[1051,3696,1531],{"class":1094},[969,3698,3699],{},[972,3700,1493,3701,3094,3703,3189,3705,3193,3707,3709],{},[1029,3702,778],{},[1029,3704,3442],{},[1029,3706,3445],{},[1029,3708,3196],{},". To preserve v2 behavior where content stayed mounted:",[1041,3711,3713],{"className":1501,"code":3712,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUTabs :items=\"tabs\" \u002F>\n+ \u003CUTabs :unmount-on-hide=\"false\" :items=\"tabs\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3714,3715,3719,3726,3733],{"__ignoreMap":1047},[1051,3716,3717],{"class":1053,"line":1054},[1051,3718,1510],{"class":1094},[1051,3720,3721,3723],{"class":1053,"line":1101},[1051,3722,1515],{"class":1061},[1051,3724,3725],{"class":1104}," \u003CUTabs :items=\"tabs\" \u002F>\n",[1051,3727,3728,3730],{"class":1053,"line":1125},[1051,3729,1523],{"class":1061},[1051,3731,3732],{"class":1065}," \u003CUTabs :unmount-on-hide=\"false\" :items=\"tabs\" \u002F>\n",[1051,3734,3735],{"class":1053,"line":1226},[1051,3736,1531],{"class":1094},[969,3738,3739],{},[972,3740,1493,3741,3094,3743,3235,3746,3052],{},[1029,3742,175],{},[1029,3744,3745],{},"close-button",[1029,3747,3748],{},"close",[1041,3750,3752],{"className":1501,"code":3751,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAlert :close-button=\"{ icon: 'i-lucide-x', variant: 'link' }\" \u002F>\n+ \u003CUAlert :close=\"{ icon: 'i-lucide-x', variant: 'link' }\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3753,3754,3758,3765,3772],{"__ignoreMap":1047},[1051,3755,3756],{"class":1053,"line":1054},[1051,3757,1510],{"class":1094},[1051,3759,3760,3762],{"class":1053,"line":1101},[1051,3761,1515],{"class":1061},[1051,3763,3764],{"class":1104}," \u003CUAlert :close-button=\"{ icon: 'i-lucide-x', variant: 'link' }\" \u002F>\n",[1051,3766,3767,3769],{"class":1053,"line":1125},[1051,3768,1523],{"class":1061},[1051,3770,3771],{"class":1065}," \u003CUAlert :close=\"{ icon: 'i-lucide-x', variant: 'link' }\" \u002F>\n",[1051,3773,3774],{"class":1053,"line":1226},[1051,3775,1531],{"class":1094},[969,3777,3778],{},[972,3779,1493,3780,3094,3782,3784,3785,2626],{},[1029,3781,175],{},[1029,3783,3748],{}," event has been replaced by the ",[1029,3786,3787],{},"update:open",[1041,3789,3791],{"className":1501,"code":3790,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAlert @close=\"isOpen = false\" \u002F>\n+ \u003CUAlert @update:open=\"isOpen = false\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3792,3793,3797,3804,3811],{"__ignoreMap":1047},[1051,3794,3795],{"class":1053,"line":1054},[1051,3796,1510],{"class":1094},[1051,3798,3799,3801],{"class":1053,"line":1101},[1051,3800,1515],{"class":1061},[1051,3802,3803],{"class":1104}," \u003CUAlert @close=\"isOpen = false\" \u002F>\n",[1051,3805,3806,3808],{"class":1053,"line":1125},[1051,3807,1523],{"class":1061},[1051,3809,3810],{"class":1065}," \u003CUAlert @update:open=\"isOpen = false\" \u002F>\n",[1051,3812,3813],{"class":1053,"line":1226},[1051,3814,1531],{"class":1094},[969,3816,3817],{},[972,3818,1493,3819,3094,3821,1597,3824,3827,3828,3830],{},[1029,3820,175],{},[1029,3822,3823],{},"#icon",[1029,3825,3826],{},"#avatar"," slots have been replaced by a single ",[1029,3829,3427],{}," slot:",[1041,3832,3834],{"className":1501,"code":3833,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAlert>\n-   \u003Ctemplate #icon>\n-     \u003CUIcon name=\"i-lucide-terminal\" \u002F>\n-   \u003C\u002Ftemplate>\n- \u003C\u002FUAlert>\n\n+ \u003CUAlert>\n+   \u003Ctemplate #leading>\n+     \u003CUIcon name=\"i-lucide-terminal\" \u002F>\n+   \u003C\u002Ftemplate>\n+ \u003C\u002FUAlert>\n\u003C\u002Ftemplate>\n",[1029,3835,3836,3840,3847,3854,3861,3867,3874,3878,3884,3891,3897,3903,3909],{"__ignoreMap":1047},[1051,3837,3838],{"class":1053,"line":1054},[1051,3839,1510],{"class":1094},[1051,3841,3842,3844],{"class":1053,"line":1101},[1051,3843,1515],{"class":1061},[1051,3845,3846],{"class":1104}," \u003CUAlert>\n",[1051,3848,3849,3851],{"class":1053,"line":1125},[1051,3850,1515],{"class":1061},[1051,3852,3853],{"class":1104},"   \u003Ctemplate #icon>\n",[1051,3855,3856,3858],{"class":1053,"line":1226},[1051,3857,1515],{"class":1061},[1051,3859,3860],{"class":1104},"     \u003CUIcon name=\"i-lucide-terminal\" \u002F>\n",[1051,3862,3863,3865],{"class":1053,"line":1265},[1051,3864,1515],{"class":1061},[1051,3866,2932],{"class":1104},[1051,3868,3869,3871],{"class":1053,"line":1577},[1051,3870,1515],{"class":1061},[1051,3872,3873],{"class":1104}," \u003C\u002FUAlert>\n",[1051,3875,3876],{"class":1053,"line":1585},[1051,3877,1567],{"emptyLinePlaceholder":21},[1051,3879,3880,3882],{"class":1053,"line":1658},[1051,3881,1523],{"class":1061},[1051,3883,3846],{"class":1065},[1051,3885,3886,3888],{"class":1053,"line":1769},[1051,3887,1523],{"class":1061},[1051,3889,3890],{"class":1065},"   \u003Ctemplate #leading>\n",[1051,3892,3893,3895],{"class":1053,"line":1775},[1051,3894,1523],{"class":1061},[1051,3896,3860],{"class":1065},[1051,3898,3899,3901],{"class":1053,"line":1878},[1051,3900,1523],{"class":1061},[1051,3902,2932],{"class":1065},[1051,3904,3905,3907],{"class":1053,"line":1886},[1051,3906,1523],{"class":1061},[1051,3908,3873],{"class":1065},[1051,3910,3911],{"class":1053,"line":1894},[1051,3912,1531],{"class":1094},[969,3914,3915],{},[972,3916,1493,3917,3919,3920,3923],{},[1029,3918,522],{}," component now always validates on submit. The ",[1029,3921,3922],{},"validate-on"," prop only controls which input events trigger validation. Pass an empty array to validate only on submit:",[1041,3925,3927],{"className":1501,"code":3926,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUForm :validate-on=\"['submit']\" \u002F>\n+ \u003CUForm :validate-on=\"[]\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,3928,3929,3933,3940,3947],{"__ignoreMap":1047},[1051,3930,3931],{"class":1053,"line":1054},[1051,3932,1510],{"class":1094},[1051,3934,3935,3937],{"class":1053,"line":1101},[1051,3936,1515],{"class":1061},[1051,3938,3939],{"class":1104}," \u003CUForm :validate-on=\"['submit']\" \u002F>\n",[1051,3941,3942,3944],{"class":1053,"line":1125},[1051,3943,1523],{"class":1061},[1051,3945,3946],{"class":1065}," \u003CUForm :validate-on=\"[]\" \u002F>\n",[1051,3948,3949],{"class":1053,"line":1226},[1051,3950,1531],{"class":1094},[969,3952,3953],{},[972,3954,3955,3956,3959,3960,3963,3964,3967,3968,3971,3972,1108],{},"Form components now use ",[1029,3957,3958],{},"inline-flex"," instead of ",[1029,3961,3962],{},"block"," layout, which means they no longer expand to full width by default. Add ",[1029,3965,3966],{},"w-full"," manually with the ",[1029,3969,3970],{},"class"," prop or configure it globally in your ",[1029,3973,1704],{},[1041,3975,3978],{"className":1075,"code":3976,"filename":3977,"language":1077,"meta":1047,"style":1047},"export default defineAppConfig({\n  ui: {\n    input: { slots: { root: 'w-full' } },\n    inputMenu: { slots: { root: 'w-full' } },\n    textarea: { slots: { root: 'w-full' } },\n    select: { slots: { base: 'w-full' } },\n    selectMenu: { slots: { base: 'w-full' } }\n  }\n})\n","app\u002Fapp.config.ts",[1029,3979,3980,3993,4003,4038,4067,4096,4126,4156,4160],{"__ignoreMap":1047},[1051,3981,3982,3984,3986,3989,3991],{"class":1053,"line":1054},[1051,3983,1084],{"class":1057},[1051,3985,1087],{"class":1057},[1051,3987,3988],{"class":1090}," defineAppConfig",[1051,3990,1095],{"class":1094},[1051,3992,1098],{"class":1061},[1051,3994,3995,3998,4000],{"class":1053,"line":1101},[1051,3996,3997],{"class":1104},"  ui",[1051,3999,1108],{"class":1061},[1051,4001,4002],{"class":1061}," {\n",[1051,4004,4005,4008,4010,4013,4016,4018,4020,4023,4025,4028,4030,4032,4035],{"class":1053,"line":1125},[1051,4006,4007],{"class":1104},"    input",[1051,4009,1108],{"class":1061},[1051,4011,4012],{"class":1061}," {",[1051,4014,4015],{"class":1104}," slots",[1051,4017,1108],{"class":1061},[1051,4019,4012],{"class":1061},[1051,4021,4022],{"class":1104}," root",[1051,4024,1108],{"class":1061},[1051,4026,4027],{"class":1061}," '",[1051,4029,3966],{"class":1065},[1051,4031,1114],{"class":1061},[1051,4033,4034],{"class":1061}," }",[1051,4036,4037],{"class":1061}," },\n",[1051,4039,4040,4043,4045,4047,4049,4051,4053,4055,4057,4059,4061,4063,4065],{"class":1053,"line":1226},[1051,4041,4042],{"class":1104},"    inputMenu",[1051,4044,1108],{"class":1061},[1051,4046,4012],{"class":1061},[1051,4048,4015],{"class":1104},[1051,4050,1108],{"class":1061},[1051,4052,4012],{"class":1061},[1051,4054,4022],{"class":1104},[1051,4056,1108],{"class":1061},[1051,4058,4027],{"class":1061},[1051,4060,3966],{"class":1065},[1051,4062,1114],{"class":1061},[1051,4064,4034],{"class":1061},[1051,4066,4037],{"class":1061},[1051,4068,4069,4072,4074,4076,4078,4080,4082,4084,4086,4088,4090,4092,4094],{"class":1053,"line":1265},[1051,4070,4071],{"class":1104},"    textarea",[1051,4073,1108],{"class":1061},[1051,4075,4012],{"class":1061},[1051,4077,4015],{"class":1104},[1051,4079,1108],{"class":1061},[1051,4081,4012],{"class":1061},[1051,4083,4022],{"class":1104},[1051,4085,1108],{"class":1061},[1051,4087,4027],{"class":1061},[1051,4089,3966],{"class":1065},[1051,4091,1114],{"class":1061},[1051,4093,4034],{"class":1061},[1051,4095,4037],{"class":1061},[1051,4097,4098,4101,4103,4105,4107,4109,4111,4114,4116,4118,4120,4122,4124],{"class":1053,"line":1577},[1051,4099,4100],{"class":1104},"    select",[1051,4102,1108],{"class":1061},[1051,4104,4012],{"class":1061},[1051,4106,4015],{"class":1104},[1051,4108,1108],{"class":1061},[1051,4110,4012],{"class":1061},[1051,4112,4113],{"class":1104}," base",[1051,4115,1108],{"class":1061},[1051,4117,4027],{"class":1061},[1051,4119,3966],{"class":1065},[1051,4121,1114],{"class":1061},[1051,4123,4034],{"class":1061},[1051,4125,4037],{"class":1061},[1051,4127,4128,4131,4133,4135,4137,4139,4141,4143,4145,4147,4149,4151,4153],{"class":1053,"line":1585},[1051,4129,4130],{"class":1104},"    selectMenu",[1051,4132,1108],{"class":1061},[1051,4134,4012],{"class":1061},[1051,4136,4015],{"class":1104},[1051,4138,1108],{"class":1061},[1051,4140,4012],{"class":1061},[1051,4142,4113],{"class":1104},[1051,4144,1108],{"class":1061},[1051,4146,4027],{"class":1061},[1051,4148,3966],{"class":1065},[1051,4150,1114],{"class":1061},[1051,4152,4034],{"class":1061},[1051,4154,4155],{"class":1061}," }\n",[1051,4157,4158],{"class":1053,"line":1658},[1051,4159,1772],{"class":1061},[1051,4161,4162,4164],{"class":1053,"line":1769},[1051,4163,1128],{"class":1061},[1051,4165,1131],{"class":1094},[1011,4167,4168],{},[965,4169,2600,4170,1350,4172,1350,4174,1350,4176,1350,4178,1021],{},[1029,4171,542],{},[1029,4173,552],{},[1029,4175,783],{},[1029,4177,728],{},[1029,4179,733],{},[969,4181,4182],{},[972,4183,1493,4184,4187,4188,4190],{},[1029,4185,4186],{},"popper"," prop has been replaced by ",[1029,4189,371],{}," for positioning:",[1041,4192,4194],{"className":1501,"code":4193,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUTooltip :popper=\"{ placement: 'top' }\" \u002F>\n+ \u003CUTooltip :content=\"{ side: 'top' }\" \u002F>\n\n- \u003CUSelectMenu :popper=\"{ placement: 'bottom-start' }\" \u002F>\n+ \u003CUSelectMenu :content=\"{ side: 'bottom', align: 'start' }\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,4195,4196,4200,4207,4214,4218,4225,4232],{"__ignoreMap":1047},[1051,4197,4198],{"class":1053,"line":1054},[1051,4199,1510],{"class":1094},[1051,4201,4202,4204],{"class":1053,"line":1101},[1051,4203,1515],{"class":1061},[1051,4205,4206],{"class":1104}," \u003CUTooltip :popper=\"{ placement: 'top' }\" \u002F>\n",[1051,4208,4209,4211],{"class":1053,"line":1125},[1051,4210,1523],{"class":1061},[1051,4212,4213],{"class":1065}," \u003CUTooltip :content=\"{ side: 'top' }\" \u002F>\n",[1051,4215,4216],{"class":1053,"line":1226},[1051,4217,1567],{"emptyLinePlaceholder":21},[1051,4219,4220,4222],{"class":1053,"line":1265},[1051,4221,1515],{"class":1061},[1051,4223,4224],{"class":1104}," \u003CUSelectMenu :popper=\"{ placement: 'bottom-start' }\" \u002F>\n",[1051,4226,4227,4229],{"class":1053,"line":1577},[1051,4228,1523],{"class":1061},[1051,4230,4231],{"class":1065}," \u003CUSelectMenu :content=\"{ side: 'bottom', align: 'start' }\" \u002F>\n",[1051,4233,4234],{"class":1053,"line":1585},[1051,4235,1531],{"class":1094},[1011,4237,4238],{},[965,4239,2600,4240,1350,4242,1350,4244,1350,4246,1350,4248,1350,4250,1021],{},[1029,4241,802],{},[1029,4243,693],{},[1029,4245,456],{},[1029,4247,394],{},[1029,4249,733],{},[1029,4251,552],{},[969,4253,4254],{},[972,4255,1493,4256,3094,4258,3189,4261,1597,4264,3592,4267,1108],{},[1029,4257,802],{},[1029,4259,4260],{},"shortcuts",[1029,4262,4263],{},"kbds",[1029,4265,4266],{},"prevent",[1029,4268,4269],{},"disabled",[1041,4271,4273],{"className":1501,"code":4272,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUTooltip text=\"Open\" :shortcuts=\"['⌘', 'O']\" \u002F>\n+ \u003CUTooltip text=\"Open\" :kbds=\"['meta', 'O']\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,4274,4275,4279,4286,4293],{"__ignoreMap":1047},[1051,4276,4277],{"class":1053,"line":1054},[1051,4278,1510],{"class":1094},[1051,4280,4281,4283],{"class":1053,"line":1101},[1051,4282,1515],{"class":1061},[1051,4284,4285],{"class":1104}," \u003CUTooltip text=\"Open\" :shortcuts=\"['⌘', 'O']\" \u002F>\n",[1051,4287,4288,4290],{"class":1053,"line":1125},[1051,4289,1523],{"class":1061},[1051,4291,4292],{"class":1065}," \u003CUTooltip text=\"Open\" :kbds=\"['meta', 'O']\" \u002F>\n",[1051,4294,4295],{"class":1053,"line":1226},[1051,4296,1531],{"class":1094},[969,4298,4299],{},[972,4300,1493,4301,3094,4303,4306,4307,1108],{},[1029,4302,693],{},[1029,4304,4305],{},"#panel"," slot has been renamed to ",[1029,4308,2835],{},[1041,4310,4312],{"className":1501,"code":4311,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n  \u003CUPopover>\n    \u003CUButton label=\"Open\" \u002F>\n\n-   \u003Ctemplate #panel>\n+   \u003Ctemplate #content>\n      \u003Cdiv class=\"p-4\">Content\u003C\u002Fdiv>\n    \u003C\u002Ftemplate>\n  \u003C\u002FUPopover>\n\u003C\u002Ftemplate>\n",[1029,4313,4314,4318,4323,4328,4332,4339,4345,4350,4355,4360],{"__ignoreMap":1047},[1051,4315,4316],{"class":1053,"line":1054},[1051,4317,1510],{"class":1094},[1051,4319,4320],{"class":1053,"line":1101},[1051,4321,4322],{"class":1094},"  \u003CUPopover>\n",[1051,4324,4325],{"class":1053,"line":1125},[1051,4326,4327],{"class":1094},"    \u003CUButton label=\"Open\" \u002F>\n",[1051,4329,4330],{"class":1053,"line":1226},[1051,4331,1567],{"emptyLinePlaceholder":21},[1051,4333,4334,4336],{"class":1053,"line":1265},[1051,4335,1515],{"class":1061},[1051,4337,4338],{"class":1104},"   \u003Ctemplate #panel>\n",[1051,4340,4341,4343],{"class":1053,"line":1577},[1051,4342,1523],{"class":1061},[1051,4344,2910],{"class":1065},[1051,4346,4347],{"class":1053,"line":1585},[1051,4348,4349],{"class":1094},"      \u003Cdiv class=\"p-4\">Content\u003C\u002Fdiv>\n",[1051,4351,4352],{"class":1053,"line":1658},[1051,4353,4354],{"class":1094},"    \u003C\u002Ftemplate>\n",[1051,4356,4357],{"class":1053,"line":1769},[1051,4358,4359],{"class":1094},"  \u003C\u002FUPopover>\n",[1051,4361,4362],{"class":1053,"line":1775},[1051,4363,1531],{"class":1094},[969,4365,4366],{},[972,4367,1493,4368,4370],{},[1029,4369,394],{}," component has been completely redesigned. It now uses items and has a proper trigger\u002Fcontent structure:",[1041,4372,4374],{"className":1501,"code":4373,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUContextMenu v-model=\"isOpen\" :virtual-element=\"virtualElement\" \u002F>\n+ \u003CUContextMenu :items=\"items\">\n+   \u003Cdiv>Right-click me\u003C\u002Fdiv>\n+ \u003C\u002FUContextMenu>\n\u003C\u002Ftemplate>\n",[1029,4375,4376,4380,4387,4394,4401,4408],{"__ignoreMap":1047},[1051,4377,4378],{"class":1053,"line":1054},[1051,4379,1510],{"class":1094},[1051,4381,4382,4384],{"class":1053,"line":1101},[1051,4383,1515],{"class":1061},[1051,4385,4386],{"class":1104}," \u003CUContextMenu v-model=\"isOpen\" :virtual-element=\"virtualElement\" \u002F>\n",[1051,4388,4389,4391],{"class":1053,"line":1125},[1051,4390,1523],{"class":1061},[1051,4392,4393],{"class":1065}," \u003CUContextMenu :items=\"items\">\n",[1051,4395,4396,4398],{"class":1053,"line":1226},[1051,4397,1523],{"class":1061},[1051,4399,4400],{"class":1065},"   \u003Cdiv>Right-click me\u003C\u002Fdiv>\n",[1051,4402,4403,4405],{"class":1053,"line":1265},[1051,4404,1523],{"class":1061},[1051,4406,4407],{"class":1065}," \u003C\u002FUContextMenu>\n",[1051,4409,4410],{"class":1053,"line":1577},[1051,4411,1531],{"class":1094},[969,4413,4414],{},[972,4415,1493,4416,3094,4418,4187,4421,1597,4424,4427,4428,1108],{},[1029,4417,713],{},[1029,4419,4420],{},"value",[1029,4422,4423],{},"model-value",[1029,4425,4426],{},"indicator"," by ",[1029,4429,4430],{},"status",[1041,4432,4434],{"className":1501,"code":4433,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUProgress :value=\"50\" indicator \u002F>\n+ \u003CUProgress :model-value=\"50\" status \u002F>\n\u003C\u002Ftemplate>\n",[1029,4435,4436,4440,4447,4454],{"__ignoreMap":1047},[1051,4437,4438],{"class":1053,"line":1054},[1051,4439,1510],{"class":1094},[1051,4441,4442,4444],{"class":1053,"line":1101},[1051,4443,1515],{"class":1061},[1051,4445,4446],{"class":1104}," \u003CUProgress :value=\"50\" indicator \u002F>\n",[1051,4448,4449,4451],{"class":1053,"line":1125},[1051,4450,1523],{"class":1061},[1051,4452,4453],{"class":1065}," \u003CUProgress :model-value=\"50\" status \u002F>\n",[1051,4455,4456],{"class":1053,"line":1226},[1051,4457,1531],{"class":1094},[969,4459,4460],{},[972,4461,1493,4462,3094,4464,3189,4467,1108],{},[1029,4463,244],{},[1029,4465,4466],{},"indicators",[1029,4468,4469],{},"dots",[1041,4471,4473],{"className":1501,"code":4472,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUCarousel :items=\"items\" indicators \u002F>\n+ \u003CUCarousel :items=\"items\" dots \u002F>\n\u003C\u002Ftemplate>\n",[1029,4474,4475,4479,4486,4493],{"__ignoreMap":1047},[1051,4476,4477],{"class":1053,"line":1054},[1051,4478,1510],{"class":1094},[1051,4480,4481,4483],{"class":1053,"line":1101},[1051,4482,1515],{"class":1061},[1051,4484,4485],{"class":1104}," \u003CUCarousel :items=\"items\" indicators \u002F>\n",[1051,4487,4488,4490],{"class":1053,"line":1125},[1051,4489,1523],{"class":1061},[1051,4491,4492],{"class":1065}," \u003CUCarousel :items=\"items\" dots \u002F>\n",[1051,4494,4495],{"class":1053,"line":1226},[1051,4496,1531],{"class":1094},[1011,4498,4499],{},[965,4500,1493,4501,3485,4503,4508],{},[1029,4502,244],{},[1270,4504,4507],{"href":4505,"rel":4506,"target":1014},"https:\u002F\u002Fwww.embla-carousel.com\u002F",[3490],"Embla Carousel"," under the hood.",[969,4510,4511],{},[972,4512,1493,4513,4516,4517,1108],{},[1029,4514,4515],{},"help"," prop\u002Fproperty has been renamed to ",[1029,4518,4519],{},"description",[1041,4521,4523],{"className":1501,"code":4522,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUCheckbox label=\"Remember me\" help=\"Save my login details\" \u002F>\n+ \u003CUCheckbox label=\"Remember me\" description=\"Save my login details\" \u002F>\n\u003C\u002Ftemplate>\n\n\u003Cscript setup lang=\"ts\">\nconst items = [{\n  label: 'Option 1',\n- help: 'Description for option 1'\n+ description: 'Description for option 1'\n}]\n\u003C\u002Fscript>\n",[1029,4524,4525,4529,4536,4543,4547,4551,4555,4559,4564,4571,4578,4582],{"__ignoreMap":1047},[1051,4526,4527],{"class":1053,"line":1054},[1051,4528,1510],{"class":1094},[1051,4530,4531,4533],{"class":1053,"line":1101},[1051,4532,1515],{"class":1061},[1051,4534,4535],{"class":1104}," \u003CUCheckbox label=\"Remember me\" help=\"Save my login details\" \u002F>\n",[1051,4537,4538,4540],{"class":1053,"line":1125},[1051,4539,1523],{"class":1061},[1051,4541,4542],{"class":1065}," \u003CUCheckbox label=\"Remember me\" description=\"Save my login details\" \u002F>\n",[1051,4544,4545],{"class":1053,"line":1226},[1051,4546,1531],{"class":1094},[1051,4548,4549],{"class":1053,"line":1265},[1051,4550,1567],{"emptyLinePlaceholder":21},[1051,4552,4553],{"class":1053,"line":1577},[1051,4554,2636],{"class":1094},[1051,4556,4557],{"class":1053,"line":1585},[1051,4558,2641],{"class":1094},[1051,4560,4561],{"class":1053,"line":1658},[1051,4562,4563],{"class":1094},"  label: 'Option 1',\n",[1051,4565,4566,4568],{"class":1053,"line":1769},[1051,4567,1515],{"class":1061},[1051,4569,4570],{"class":1104}," help: 'Description for option 1'\n",[1051,4572,4573,4575],{"class":1053,"line":1775},[1051,4574,1523],{"class":1061},[1051,4576,4577],{"class":1065}," description: 'Description for option 1'\n",[1051,4579,4580],{"class":1053,"line":1878},[1051,4581,2674],{"class":1094},[1051,4583,4584],{"class":1053,"line":1886},[1051,4585,2679],{"class":1094},[1011,4587,4588],{},[965,4589,2600,4590,1350,4592,1021],{},[1029,4591,306],{},[1029,4593,718],{},[969,4595,4596],{},[972,4597,1493,4598,3094,4600,3189,4603,1597,4606,4609,4610,1108],{},[1029,4599,223],{},[1029,4601,4602],{},"divider",[1029,4604,4605],{},"separator-icon",[1029,4607,4608],{},"#divider"," slot to ",[1029,4611,4612],{},"#separator",[1041,4614,4616],{"className":1501,"code":4615,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUBreadcrumb :links=\"links\" divider=\"i-lucide-arrow-right\" \u002F>\n+ \u003CUBreadcrumb :items=\"items\" separator-icon=\"i-lucide-arrow-right\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,4617,4618,4622,4629,4636],{"__ignoreMap":1047},[1051,4619,4620],{"class":1053,"line":1054},[1051,4621,1510],{"class":1094},[1051,4623,4624,4626],{"class":1053,"line":1101},[1051,4625,1515],{"class":1061},[1051,4627,4628],{"class":1104}," \u003CUBreadcrumb :links=\"links\" divider=\"i-lucide-arrow-right\" \u002F>\n",[1051,4630,4631,4633],{"class":1053,"line":1125},[1051,4632,1523],{"class":1061},[1051,4634,4635],{"class":1065}," \u003CUBreadcrumb :items=\"items\" separator-icon=\"i-lucide-arrow-right\" \u002F>\n",[1051,4637,4638],{"class":1053,"line":1226},[1051,4639,1531],{"class":1094},[969,4641,4642],{},[972,4643,1493,4644,4646,4647,1350,4650,1350,4653,4656,4657,3052],{},[1029,4645,193],{}," component chip props (",[1029,4648,4649],{},"chip-color",[1029,4651,4652],{},"chip-position",[1029,4654,4655],{},"chip-text",") have been consolidated into a single ",[1029,4658,4659],{},"chip",[1041,4661,4663],{"className":1501,"code":4662,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUAvatar src=\"...\" chip-color=\"green\" chip-position=\"top-right\" chip-text=\"\" \u002F>\n+ \u003CUAvatar src=\"...\" :chip=\"{ color: 'success', position: 'top-right' }\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,4664,4665,4669,4676,4683],{"__ignoreMap":1047},[1051,4666,4667],{"class":1053,"line":1054},[1051,4668,1510],{"class":1094},[1051,4670,4671,4673],{"class":1053,"line":1101},[1051,4672,1515],{"class":1061},[1051,4674,4675],{"class":1104}," \u003CUAvatar src=\"...\" chip-color=\"green\" chip-position=\"top-right\" chip-text=\"\" \u002F>\n",[1051,4677,4678,4680],{"class":1053,"line":1125},[1051,4679,1523],{"class":1061},[1051,4681,4682],{"class":1065}," \u003CUAvatar src=\"...\" :chip=\"{ color: 'success', position: 'top-right' }\" \u002F>\n",[1051,4684,4685],{"class":1053,"line":1226},[1051,4686,1531],{"class":1094},[969,4688,4689],{},[972,4690,1493,4691,3094,4693,1597,4696,4699,4700,3959,4703,1108],{},[1029,4692,229],{},[1029,4694,4695],{},"padded",[1029,4697,4698],{},"truncate"," props have been removed. Use ",[1029,4701,4702],{},"square",[1029,4704,4705],{},":padded=\"false\"",[1041,4707,4709],{"className":1501,"code":4708,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUButton :padded=\"false\" \u002F>\n+ \u003CUButton square \u002F>\n\u003C\u002Ftemplate>\n",[1029,4710,4711,4715,4722,4729],{"__ignoreMap":1047},[1051,4712,4713],{"class":1053,"line":1054},[1051,4714,1510],{"class":1094},[1051,4716,4717,4719],{"class":1053,"line":1101},[1051,4718,1515],{"class":1061},[1051,4720,4721],{"class":1104}," \u003CUButton :padded=\"false\" \u002F>\n",[1051,4723,4724,4726],{"class":1053,"line":1125},[1051,4725,1523],{"class":1061},[1051,4727,4728],{"class":1065}," \u003CUButton square \u002F>\n",[1051,4730,4731],{"class":1053,"line":1226},[1051,4732,1531],{"class":1094},[969,4734,4735],{},[972,4736,1493,4737,3094,4739,4742,4743,3243],{},[1029,4738,317],{},[1029,4740,4741],{},"show"," prop is now a model (",[1029,4744,4745],{},"v-model:show",[1041,4747,4749],{"className":1501,"code":4748,"language":1503,"meta":1047,"style":1047},"\u003Ctemplate>\n- \u003CUChip :show=\"isVisible\" \u002F>\n+ \u003CUChip v-model:show=\"isVisible\" \u002F>\n\u003C\u002Ftemplate>\n",[1029,4750,4751,4755,4762,4769],{"__ignoreMap":1047},[1051,4752,4753],{"class":1053,"line":1054},[1051,4754,1510],{"class":1094},[1051,4756,4757,4759],{"class":1053,"line":1101},[1051,4758,1515],{"class":1061},[1051,4760,4761],{"class":1104}," \u003CUChip :show=\"isVisible\" \u002F>\n",[1051,4763,4764,4766],{"class":1053,"line":1125},[1051,4765,1523],{"class":1061},[1051,4767,4768],{"class":1065}," \u003CUChip v-model:show=\"isVisible\" \u002F>\n",[1051,4770,4771],{"class":1053,"line":1226},[1051,4772,1531],{"class":1094},[969,4774,4775],{},[972,4776,1493,4777,3094,4779,4782,4783,4785,4786,3959,4789,1108],{},[1029,4778,358],{},[1029,4780,4781],{},"groups"," prop structure has changed. Each group now has an ",[1029,4784,2549],{}," array and uses ",[1029,4787,4788],{},"onSelect",[1029,4790,2621],{},[1041,4792,4794],{"className":1501,"code":4793,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nconst groups = [{\n  id: 'actions',\n  label: 'Actions',\n- commands: [{ id: 'new', label: 'New file' }]\n+ items: [{ id: 'new', label: 'New file' }]\n}]\n\u003C\u002Fscript>\n",[1029,4795,4796,4800,4805,4810,4815,4822,4829,4833],{"__ignoreMap":1047},[1051,4797,4798],{"class":1053,"line":1054},[1051,4799,2636],{"class":1094},[1051,4801,4802],{"class":1053,"line":1101},[1051,4803,4804],{"class":1094},"const groups = [{\n",[1051,4806,4807],{"class":1053,"line":1125},[1051,4808,4809],{"class":1094},"  id: 'actions',\n",[1051,4811,4812],{"class":1053,"line":1226},[1051,4813,4814],{"class":1094},"  label: 'Actions',\n",[1051,4816,4817,4819],{"class":1053,"line":1265},[1051,4818,1515],{"class":1061},[1051,4820,4821],{"class":1104}," commands: [{ id: 'new', label: 'New file' }]\n",[1051,4823,4824,4826],{"class":1053,"line":1577},[1051,4825,1523],{"class":1061},[1051,4827,4828],{"class":1065}," items: [{ id: 'new', label: 'New file' }]\n",[1051,4830,4831],{"class":1053,"line":1585},[1051,4832,2674],{"class":1094},[1051,4834,4835],{"class":1053,"line":1658},[1051,4836,2679],{"class":1094},[1003,4838,4840],{"id":4839},"changed-composables","Changed composables",[969,4842,4843],{},[972,4844,1493,4845,4848,4849,3189,4852,1108],{},[1029,4846,4847],{},"useToast()"," composable ",[1029,4850,4851],{},"timeout",[1029,4853,4854],{},"duration",[1041,4856,4858],{"className":1501,"code":4857,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nconst toast = useToast()\n\n- toast.add({ title: 'Invitation sent', timeout: 0 })\n+ toast.add({ title: 'Invitation sent', duration: 0 })\n\u003C\u002Fscript>\n",[1029,4859,4860,4864,4869,4873,4880,4887],{"__ignoreMap":1047},[1051,4861,4862],{"class":1053,"line":1054},[1051,4863,2636],{"class":1094},[1051,4865,4866],{"class":1053,"line":1101},[1051,4867,4868],{"class":1094},"const toast = useToast()\n",[1051,4870,4871],{"class":1053,"line":1125},[1051,4872,1567],{"emptyLinePlaceholder":21},[1051,4874,4875,4877],{"class":1053,"line":1226},[1051,4876,1515],{"class":1061},[1051,4878,4879],{"class":1104}," toast.add({ title: 'Invitation sent', timeout: 0 })\n",[1051,4881,4882,4884],{"class":1053,"line":1265},[1051,4883,1523],{"class":1061},[1051,4885,4886],{"class":1065}," toast.add({ title: 'Invitation sent', duration: 0 })\n",[1051,4888,4889],{"class":1053,"line":1577},[1051,4890,2679],{"class":1094},[969,4892,4893],{},[972,4894,1493,4895,1597,4898,4901,4902,4904],{},[1029,4896,4897],{},"useModal",[1029,4899,4900],{},"useSlideover"," composables have been removed in favor of a more generic ",[1029,4903,843],{}," composable:",[965,4906,4907],{},"Some important differences:",[969,4909,4910,4915,4918,4931],{},[972,4911,1493,4912,4914],{},[1029,4913,843],{}," composable is now used to create overlay instances",[972,4916,4917],{},"Overlays that are opened, can be awaited for their result",[972,4919,4920,4921,2524,4924,4927,4928,4930],{},"Overlays can no longer be close using ",[1029,4922,4923],{},"modal.close()",[1029,4925,4926],{},"slideover.close()",", rather, they close automatically: either when a ",[1029,4929,3748],{}," event is fired explicitly from the opened component OR when the overlay closes itself (clicking on backdrop, pressing the ESC key, etc)",[972,4932,4933,4934,4936],{},"To capture the return value in the parent component you must explicitly emit a ",[1029,4935,3748],{}," event with the desired value",[1041,4938,4940],{"className":1501,"code":4939,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nimport { ModalExampleComponent } from '#components'\n\n- const modal = useModal()\n+ const overlay = useOverlay()\n\n- modal.open(ModalExampleComponent)\n+ const modal = overlay.create(ModalExampleComponent)\n\u003C\u002Fscript>\n",[1029,4941,4942,4946,4951,4955,4962,4969,4973,4980,4987],{"__ignoreMap":1047},[1051,4943,4944],{"class":1053,"line":1054},[1051,4945,2636],{"class":1094},[1051,4947,4948],{"class":1053,"line":1101},[1051,4949,4950],{"class":1094},"import { ModalExampleComponent } from '#components'\n",[1051,4952,4953],{"class":1053,"line":1125},[1051,4954,1567],{"emptyLinePlaceholder":21},[1051,4956,4957,4959],{"class":1053,"line":1226},[1051,4958,1515],{"class":1061},[1051,4960,4961],{"class":1104}," const modal = useModal()\n",[1051,4963,4964,4966],{"class":1053,"line":1265},[1051,4965,1523],{"class":1061},[1051,4967,4968],{"class":1065}," const overlay = useOverlay()\n",[1051,4970,4971],{"class":1053,"line":1577},[1051,4972,1567],{"emptyLinePlaceholder":21},[1051,4974,4975,4977],{"class":1053,"line":1585},[1051,4976,1515],{"class":1061},[1051,4978,4979],{"class":1104}," modal.open(ModalExampleComponent)\n",[1051,4981,4982,4984],{"class":1053,"line":1658},[1051,4983,1523],{"class":1061},[1051,4985,4986],{"class":1065}," const modal = overlay.create(ModalExampleComponent)\n",[1051,4988,4989],{"class":1053,"line":1769},[1051,4990,2679],{"class":1094},[965,4992,4993],{},"Props are now passed through a props attribute:",[1041,4995,4997],{"className":1501,"code":4996,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nimport { ModalExampleComponent } from '#components'\n\n- const modal = useModal()\n+ const overlay = useOverlay()\n\nconst count = ref(0)\n\n- modal.open(ModalExampleComponent, {\n-   count: count.value\n- })\n+ const modal = overlay.create(ModalExampleComponent, {\n+   props: {\n+     count: count.value\n+   }\n+ })\n\u003C\u002Fscript>\n",[1029,4998,4999,5003,5007,5011,5017,5023,5027,5032,5036,5043,5050,5057,5064,5071,5078,5084,5090],{"__ignoreMap":1047},[1051,5000,5001],{"class":1053,"line":1054},[1051,5002,2636],{"class":1094},[1051,5004,5005],{"class":1053,"line":1101},[1051,5006,4950],{"class":1094},[1051,5008,5009],{"class":1053,"line":1125},[1051,5010,1567],{"emptyLinePlaceholder":21},[1051,5012,5013,5015],{"class":1053,"line":1226},[1051,5014,1515],{"class":1061},[1051,5016,4961],{"class":1104},[1051,5018,5019,5021],{"class":1053,"line":1265},[1051,5020,1523],{"class":1061},[1051,5022,4968],{"class":1065},[1051,5024,5025],{"class":1053,"line":1577},[1051,5026,1567],{"emptyLinePlaceholder":21},[1051,5028,5029],{"class":1053,"line":1585},[1051,5030,5031],{"class":1094},"const count = ref(0)\n",[1051,5033,5034],{"class":1053,"line":1658},[1051,5035,1567],{"emptyLinePlaceholder":21},[1051,5037,5038,5040],{"class":1053,"line":1769},[1051,5039,1515],{"class":1061},[1051,5041,5042],{"class":1104}," modal.open(ModalExampleComponent, {\n",[1051,5044,5045,5047],{"class":1053,"line":1775},[1051,5046,1515],{"class":1061},[1051,5048,5049],{"class":1104},"   count: count.value\n",[1051,5051,5052,5054],{"class":1053,"line":1878},[1051,5053,1515],{"class":1061},[1051,5055,5056],{"class":1104}," })\n",[1051,5058,5059,5061],{"class":1053,"line":1886},[1051,5060,1523],{"class":1061},[1051,5062,5063],{"class":1065}," const modal = overlay.create(ModalExampleComponent, {\n",[1051,5065,5066,5068],{"class":1053,"line":1894},[1051,5067,1523],{"class":1061},[1051,5069,5070],{"class":1065},"   props: {\n",[1051,5072,5073,5075],{"class":1053,"line":1901},[1051,5074,1523],{"class":1061},[1051,5076,5077],{"class":1065},"     count: count.value\n",[1051,5079,5080,5082],{"class":1053,"line":1908},[1051,5081,1523],{"class":1061},[1051,5083,1766],{"class":1065},[1051,5085,5086,5088],{"class":1053,"line":1915},[1051,5087,1523],{"class":1061},[1051,5089,5056],{"class":1065},[1051,5091,5092],{"class":1053,"line":1921},[1051,5093,2679],{"class":1094},[965,5095,5096,5097,5099,5100,5103],{},"Closing a modal is now done through the ",[1029,5098,3748],{}," event. The ",[1029,5101,5102],{},"modal.open"," method now returns an instance that can be used to await for the result of the modal whenever the modal is closed:",[1041,5105,5107],{"className":1501,"code":5106,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nimport { ModalExampleComponent } from '#components'\n\n- const modal = useModal()\n+ const overlay = useOverlay()\n\n+ const modal = overlay.create(ModalExampleComponent)\n\n- function openModal() {\n-   modal.open(ModalExampleComponent, {\n-     onSuccess() {\n-       toast.add({ title: 'Success!' })\n-     }\n-   })\n- }\n+ async function openModal() {\n+   const instance = modal.open(ModalExampleComponent, {\n+     count: count.value\n+   })\n+\n+   const result = await instance.result\n+\n+   if (result) {\n+     toast.add({ title: 'Success!' })\n+   }\n+ }\n\u003C\u002Fscript>\n",[1029,5108,5109,5113,5117,5121,5127,5133,5137,5143,5147,5154,5161,5168,5175,5181,5188,5194,5201,5208,5214,5221,5227,5235,5240,5248,5256,5263,5270],{"__ignoreMap":1047},[1051,5110,5111],{"class":1053,"line":1054},[1051,5112,2636],{"class":1094},[1051,5114,5115],{"class":1053,"line":1101},[1051,5116,4950],{"class":1094},[1051,5118,5119],{"class":1053,"line":1125},[1051,5120,1567],{"emptyLinePlaceholder":21},[1051,5122,5123,5125],{"class":1053,"line":1226},[1051,5124,1515],{"class":1061},[1051,5126,4961],{"class":1104},[1051,5128,5129,5131],{"class":1053,"line":1265},[1051,5130,1523],{"class":1061},[1051,5132,4968],{"class":1065},[1051,5134,5135],{"class":1053,"line":1577},[1051,5136,1567],{"emptyLinePlaceholder":21},[1051,5138,5139,5141],{"class":1053,"line":1585},[1051,5140,1523],{"class":1061},[1051,5142,4986],{"class":1065},[1051,5144,5145],{"class":1053,"line":1658},[1051,5146,1567],{"emptyLinePlaceholder":21},[1051,5148,5149,5151],{"class":1053,"line":1769},[1051,5150,1515],{"class":1061},[1051,5152,5153],{"class":1104}," function openModal() {\n",[1051,5155,5156,5158],{"class":1053,"line":1775},[1051,5157,1515],{"class":1061},[1051,5159,5160],{"class":1104},"   modal.open(ModalExampleComponent, {\n",[1051,5162,5163,5165],{"class":1053,"line":1878},[1051,5164,1515],{"class":1061},[1051,5166,5167],{"class":1104},"     onSuccess() {\n",[1051,5169,5170,5172],{"class":1053,"line":1886},[1051,5171,1515],{"class":1061},[1051,5173,5174],{"class":1104},"       toast.add({ title: 'Success!' })\n",[1051,5176,5177,5179],{"class":1053,"line":1894},[1051,5178,1515],{"class":1061},[1051,5180,1918],{"class":1104},[1051,5182,5183,5185],{"class":1053,"line":1901},[1051,5184,1515],{"class":1061},[1051,5186,5187],{"class":1104},"   })\n",[1051,5189,5190,5192],{"class":1053,"line":1908},[1051,5191,1515],{"class":1061},[1051,5193,4155],{"class":1104},[1051,5195,5196,5198],{"class":1053,"line":1915},[1051,5197,1523],{"class":1061},[1051,5199,5200],{"class":1065}," async function openModal() {\n",[1051,5202,5203,5205],{"class":1053,"line":1921},[1051,5204,1523],{"class":1061},[1051,5206,5207],{"class":1065},"   const instance = modal.open(ModalExampleComponent, {\n",[1051,5209,5210,5212],{"class":1053,"line":1926},[1051,5211,1523],{"class":1061},[1051,5213,5077],{"class":1065},[1051,5215,5217,5219],{"class":1053,"line":5216},19,[1051,5218,1523],{"class":1061},[1051,5220,5187],{"class":1065},[1051,5222,5224],{"class":1053,"line":5223},20,[1051,5225,5226],{"class":1061},"+\n",[1051,5228,5230,5232],{"class":1053,"line":5229},21,[1051,5231,1523],{"class":1061},[1051,5233,5234],{"class":1065},"   const result = await instance.result\n",[1051,5236,5238],{"class":1053,"line":5237},22,[1051,5239,5226],{"class":1061},[1051,5241,5243,5245],{"class":1053,"line":5242},23,[1051,5244,1523],{"class":1061},[1051,5246,5247],{"class":1065},"   if (result) {\n",[1051,5249,5251,5253],{"class":1053,"line":5250},24,[1051,5252,1523],{"class":1061},[1051,5254,5255],{"class":1065},"     toast.add({ title: 'Success!' })\n",[1051,5257,5259,5261],{"class":1053,"line":5258},25,[1051,5260,1523],{"class":1061},[1051,5262,1766],{"class":1065},[1051,5264,5266,5268],{"class":1053,"line":5265},26,[1051,5267,1523],{"class":1061},[1051,5269,4155],{"class":1065},[1051,5271,5273],{"class":1053,"line":5272},27,[1051,5274,2679],{"class":1094},[1003,5276,5278],{"id":5277},"changed-form-validation","Changed form validation",[969,5280,5281],{},[972,5282,5283,5284,3592,5287,1108],{},"The error object property for targeting form fields has been renamed from ",[1029,5285,5286],{},"path",[1029,5288,5289],{},"name",[1041,5291,5293],{"className":1501,"code":5292,"language":1503,"meta":1047,"style":1047},"\u003Cscript setup lang=\"ts\">\nfunction validate(state: any): FormError[] {\n  const errors = []\n  if (!state.email) {\n    errors.push({\n-     path: 'email',\n+     name: 'email',\n      message: 'Required'\n    })\n  }\n  if (!state.password) {\n    errors.push({\n-     path: 'password',\n+     name: 'password',\n      message: 'Required'\n    })\n  }\n  return errors\n}\n\u003C\u002Fscript>\n",[1029,5294,5295,5299,5304,5309,5314,5319,5326,5333,5338,5343,5347,5352,5356,5363,5370,5374,5378,5382,5387,5392],{"__ignoreMap":1047},[1051,5296,5297],{"class":1053,"line":1054},[1051,5298,2636],{"class":1094},[1051,5300,5301],{"class":1053,"line":1101},[1051,5302,5303],{"class":1094},"function validate(state: any): FormError[] {\n",[1051,5305,5306],{"class":1053,"line":1125},[1051,5307,5308],{"class":1094},"  const errors = []\n",[1051,5310,5311],{"class":1053,"line":1226},[1051,5312,5313],{"class":1094},"  if (!state.email) {\n",[1051,5315,5316],{"class":1053,"line":1265},[1051,5317,5318],{"class":1094},"    errors.push({\n",[1051,5320,5321,5323],{"class":1053,"line":1577},[1051,5322,1515],{"class":1061},[1051,5324,5325],{"class":1104},"     path: 'email',\n",[1051,5327,5328,5330],{"class":1053,"line":1585},[1051,5329,1523],{"class":1061},[1051,5331,5332],{"class":1065},"     name: 'email',\n",[1051,5334,5335],{"class":1053,"line":1658},[1051,5336,5337],{"class":1094},"      message: 'Required'\n",[1051,5339,5340],{"class":1053,"line":1769},[1051,5341,5342],{"class":1094},"    })\n",[1051,5344,5345],{"class":1053,"line":1775},[1051,5346,1772],{"class":1094},[1051,5348,5349],{"class":1053,"line":1878},[1051,5350,5351],{"class":1094},"  if (!state.password) {\n",[1051,5353,5354],{"class":1053,"line":1886},[1051,5355,5318],{"class":1094},[1051,5357,5358,5360],{"class":1053,"line":1894},[1051,5359,1515],{"class":1061},[1051,5361,5362],{"class":1104},"     path: 'password',\n",[1051,5364,5365,5367],{"class":1053,"line":1901},[1051,5366,1523],{"class":1061},[1051,5368,5369],{"class":1065},"     name: 'password',\n",[1051,5371,5372],{"class":1053,"line":1908},[1051,5373,5337],{"class":1094},[1051,5375,5376],{"class":1053,"line":1915},[1051,5377,5342],{"class":1094},[1051,5379,5380],{"class":1053,"line":1921},[1051,5381,1772],{"class":1094},[1051,5383,5384],{"class":1053,"line":1926},[1051,5385,5386],{"class":1094},"  return errors\n",[1051,5388,5389],{"class":1053,"line":5216},[1051,5390,5391],{"class":1094},"}\n",[1051,5393,5394],{"class":1053,"line":5223},[1051,5395,2679],{"class":1094},[5397,5398],"hr",{},[1448,5400,5401],{},[965,5402,5403],{},"This page is a work in progress, we'll improve it regularly.",[5405,5406,5407],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":1047,"searchDepth":1101,"depth":1101,"links":5409},[5410,5414],{"id":997,"depth":1101,"text":998,"children":5411},[5412,5413],{"id":1005,"depth":1125,"text":1006},{"id":1155,"depth":1125,"text":1156},{"id":1335,"depth":1101,"text":1336,"children":5415},[5416,5417,5418,5419,5420,5421],{"id":1342,"depth":1125,"text":1343},{"id":1781,"depth":1125,"text":1782},{"id":1979,"depth":1125,"text":1980},{"id":2531,"depth":1125,"text":2532},{"id":4839,"depth":1125,"text":4840},{"id":5277,"depth":1125,"text":5278},"A comprehensive guide to migrate your application from Nuxt UI v2 to Nuxt UI v3.","md",[5425],{"label":5426,"to":44,"icon":39},"Migration to v4",{},"\u002Fdocs\u002Fgetting-started\u002Fmigration\u002Fv3",{"title":960,"description":5422},"docs\u002F1.getting-started\u002F3.migration\u002F2.v3","j5PhyicGoviFVPwQp2dCzfDTseVFdlEnsKJFGp61YBM",{"data":5433,"body":5434},{},{"type":5435,"children":5436},"root",[5437],{"type":178,"tag":965,"props":5438,"children":5439},{},[5440],{"type":5441,"value":5422},"text",1774901274580]