\n\u003C/UFormGroup>\n```\n\n```\n\u003Cdiv class=“relative”>\n \u003Cinput>…\n\u003C/div>\n```\n\nHowever in version 3 it is\n\n```\n\u003CUFormField>\n \u003CUInput />\n\u003C/UFormField >\n```\n\n```\n\u003Cdiv class=“relative inline-flex items-center”>\n \u003Cinput>…\n\u003C/div>\n```\n\nThis is causing the `\u003Cinput>` to not expand to the full width of the parent container. Is there a way to edit this in Nuxt UI 3 to make it fully expand to the parent container?\n\n",[2884,2887],{"name":2885,"color":2886},"question","d876e3",{"name":2871,"color":2872},3955,"UInput not flexing when upgrading from v2 to v3","2025-04-22T14:14:04Z","https://github.com/nuxt/ui/issues/3955",0.6545341,{"description":2894,"labels":2895,"number":2898,"owner":2874,"repository":2875,"state":2876,"title":2899,"updated_at":2900,"url":2901,"score":2902},"### Environment\n\n- Operating System: Linux\n- Node Version: v23.3.0\n- Nuxt Version: 3.15.1\n- CLI Version: 3.18.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.13.2\n- Builder: -\n- User Config: devtools, modules, css, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.4\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.15.1\n\n### Reproduction\n\nhttps://github.com/fl5brkv/nuxt-issue\n\n### Description\n\nI installed nuxt ui 3 from the official nuxt ui starter, just wanted to try the calendar, but it doesnt work. Throwing me warnings in console.log.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n[Vue warn]: Failed to resolve component: UCalendar\nIf this is a native custom element, make sure to exclude it from component resolution via compilerOptions.isCustomElement. \n at \u003CIndex onVnodeUnmounted=fn\u003ConVnodeUnmounted> ref=Ref\u003C undefined > > \n at \u003CAnonymous key=\"/\" vnode= Object route= Object ... > \n at \u003CRouterView name=undefined route=undefined > \n at \u003CNuxtPage > \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider > \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp > \n at \u003CApp key=4 > \n at \u003CNuxtRoot>\n\nruntime-core.esm-bundler.js?v=b66559bc:50 [Vue warn]: Hydration node mismatch:\n- rendered on server: \u003C!----> \n- expected on client: UCalendar \n at \u003CIndex onVnodeUnmounted=fn\u003ConVnodeUnmounted> ref=Ref\u003C undefined > > \n at \u003CAnonymous key=\"/\" vnode= Object route= Object ... > \n at \u003CRouterView name=undefined route=undefined > \n at \u003CNuxtPage > \n at \u003CToastProvider swipe-direction=\"right\" duration=5000 > \n at \u003CToaster key=0 > \n at \u003CTooltipProvider > \n at \u003CConfigProvider use-id=fn\u003Cuse-id> dir=\"ltr\" > \n at \u003CApp > \n at \u003CApp key=4 > \n at \u003CNuxtRoot>\n```",[2896,2897],{"name":2868,"color":2869},{"name":2871,"color":2872},3044,"\u003CUCalendar /> isn't rendering","2025-01-08T09:24:13Z","https://github.com/nuxt/ui/issues/3044",0.6587616,{"description":2904,"labels":2905,"number":2922,"owner":2874,"repository":2874,"state":2876,"title":2923,"updated_at":2924,"url":2925,"score":2926},"### Environment\r\n\r\n- Operating System: `Darwin`\r\n- Node Version: `v20.9.0`\r\n- Nuxt Version: `3.9.1`\r\n- CLI Version: `3.10.0`\r\n- Nitro Version: `2.8.1`\r\n- Package Manager: `pnpm@8.10.4`\r\n- Builder: `-`\r\n- User Config: `devtools`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\r\n\r\n### Reproduction\r\n\r\nNot working (Nuxt): https://stackblitz.com/edit/github-a6umaw?file=app.vue,components%2FFlashingSquare.vue\r\nWorking (Vue SSR): https://stackblitz.com/edit/github-hhybci?file=src%2Fpages%2FHome.vue,src%2Fcomponents%2FFlashingSquare.vue\r\n\r\n### Describe the bug\r\n\r\nWhen using the `:deep` CSS selector, the styles are not applied in the correct order during loading, causing them to be overwritten after the page loads. When I tried reproducing this issue in Vue SSR, it worked correctly.\r\n\r\n\r\n### Additional context\r\n\r\nWorks fine with `ssr: false`\r\n\r\n### Logs\r\n\r\n_No response_",[2906,2909,2912,2913,2916,2919],{"name":2907,"color":2908},"3.x","29bc7f",{"name":2910,"color":2911},"workaround available","11376d",{"name":2868,"color":2869},{"name":2914,"color":2915},"🔨 p3-minor","FBCA04",{"name":2917,"color":2918},"✨ good reproduction","fbca04",{"name":2920,"color":2921},"inline styles","68AF97",25229,"Css `:deep()` selector not working correctly with SSR","2024-02-15T14:30:05Z","https://github.com/nuxt/nuxt/issues/25229",0.66804624,{"description":2928,"labels":2929,"number":2935,"owner":2874,"repository":2875,"state":2876,"title":2936,"updated_at":2937,"url":2938,"score":2939},"### Environment\n\nOperating System: Darwin\nNode Version: v20.18.0\nNuxt Version: 3.14.1592\nPackage Manager: pnpm@9.14.4\nBuilder: -\nUser Config: default\nRuntime Modules: @nuxt/ui@3.0.0-alpha.10\nBuild Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.10\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/nifty-ride-lx6qlg\n\n### Description\n\nThe same problem occurs in official documents. https://ui3.nuxt.dev/components/toast\n1. Open the Toast component of the document.\n2. Click the \"Show toast\" button to show toast.\n3. Click X to close the toast when it appears.\n4. Click the \"Show toast\" button again, and the toast that appears does not have a progress bar and does not automatically close.\n\nMy production environment project also has this problem, I hope it can be solved as soon as possible.\nAlso, the progress bar sometimes flashes, so i can expect new configurations to setting the progress bar showing is true or false.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2930,2931,2932],{"name":2868,"color":2869},{"name":2871,"color":2872},{"name":2933,"color":2934},"triage","ffffff",3003,"The Toast component loses the progress bar and does not automatically close","2025-03-24T13:48:53Z","https://github.com/nuxt/ui/issues/3003",0.6687194,{"description":2941,"labels":2942,"number":2951,"owner":2874,"repository":2874,"state":2876,"title":2952,"updated_at":2953,"url":2954,"score":2955},"### Version\r\n\r\n[v2.4.3](https://github.com/nuxt.js/releases/tag/v2.4.3)\r\n\r\n### Reproduction link\r\n\r\n[https://github.com/0xl2oot/vuetify-nuxt-demo](https://github.com/0xl2oot/vuetify-nuxt-demo)\r\n\r\n### Steps to reproduce\r\n\r\nhttps://github.com/0xl2oot/vuetify-nuxt-demo\r\n\r\nthe problem is when I use Nuxt and Vuetify, in universal and production mode, refresh the page, the Vuetify theme doesn't work well.\r\n\r\nfollow my readme and put the generated files into Nginx, then the bug come out.\r\n\r\n### What is expected ?\r\n\r\nthe theme color working\r\n\r\n\r\n### What is actually happening?\r\n\r\nthe theme color not working\r\n\r\n\r\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\r\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c8687\">#c8687\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2943,2945,2948],{"name":2944,"color":2934},"stale",{"name":2946,"color":2947},"pending triage","E99695",{"name":2949,"color":2950},"2.x","d4c5f9",5064,"production and universal mode rendering problem","2023-01-22T15:33:01Z","https://github.com/nuxt/nuxt/issues/5064",0.6691982,{"description":2957,"labels":2958,"number":2963,"owner":2874,"repository":2874,"state":2876,"title":2964,"updated_at":2965,"url":2966,"score":2967},"### Environment\n\nSystem:\r\n OS: Windows 10 10.0.19045\r\n CPU: (8) x64 Intel(R) Core(TM) i7-1065G7 CPU @ 1.30GHz \r\n Memory: 4.65 GB / 15.78 GB\r\n Binaries:\r\n Node: 16.18.0 - C:\\Program Files\\nodejs\\node.EXE\r\n Yarn: 1.22.15 - ~\\AppData\\Roaming\\npm\\yarn.CMD\r\n npm: 8.19.2 - C:\\Program Files\\nodejs\\npm.CMD\r\n Browsers:\r\n Edge: Spartan (44.19041.1266.0), Chromium (110.0.1587.46)\r\n Internet Explorer: 11.0.19041.1566\r\n npmPackages:\r\n nuxt: ^2.15.8 => 2.15.8\n\n### Reproduction\n\nhttps://nstaa.adngroup.com/\n\n### Describe the bug\n\nThis is at least my tenth nuxt app that I'm developing in ssr mode and this one doesn't seem to build the server-side HTML. When I first view the page with my browser and look at the source, I don't see the content displaying on the browser.\r\n\r\nThe site in question is: https://nstaa.adngroup.com/\r\n\r\nHere is mu nuxt.config file :\r\n\r\n```\r\nimport colors from 'vuetify/es5/util/colors'\r\nimport smConfig from \"./sm.json\"\r\n\r\nexport default {\r\n server: {\r\n port: process.env.PORT\r\n },\r\n publicRuntimeConfig: {\r\n environnement: process.env.ENVIRONNEMENT,\r\n urlFront: process.env.URL_FRONT,\r\n urlBack: process.env.URL_BACK,\r\n urlAuth: process.env.URL_AUTH,\r\n urlPdf:process.env.URL_PDF,\r\n urlFactures:process.env.URL_FACTURES,\r\n axios: {\r\n browserBaseURL: process.env.URL_BACK\r\n },\r\n recaptcha: {\r\n siteKey: process.env.RECAPTCHA_SITE_KEY\r\n }\r\n }, \r\n privateRuntimeConfig: {\r\n axios: {\r\n baseURL: process.env.URL_BACK\r\n }\r\n },\r\n // Global page headers: https://go.nuxtjs.dev/config-head\r\n head: {\r\n titleTemplate: '%s - nstaa.adngroup.com',\r\n title: 'nstaa.adngroup.com',\r\n htmlAttrs: {\r\n lang: 'en',\r\n },\r\n meta: [\r\n { charset: 'utf-8' },\r\n { name: 'viewport', content: 'width=device-width, initial-scale=1' },\r\n { hid: 'description', name: 'description', content: '' },\r\n { name: 'format-detection', content: 'telephone=no' },\r\n ],\r\n link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],\r\n },\r\n\r\n // Global CSS: https://go.nuxtjs.dev/config-css\r\n css: [\r\n '@/assets/main.css', // Polices locales ajoutées\r\n ],\r\n\r\n // Plugins to run before rendering page: https://go.nuxtjs.dev/config-plugins\r\n plugins: [\r\n { src: '~/plugins/my.js' }, \r\n { src: '~/plugins/i18n.js' },\r\n { src: '~/plugins/chart.js', mode: 'client'},\r\n { src: '~/plugins/axios.js' },\r\n { src: '~/plugins/vue-stripe.js', mode: 'client' },\r\n { src: '~/plugins/persistedState.client.js', mode: 'client' },\r\n ],\r\n\r\n // Auto import components: https://go.nuxtjs.dev/config-components\r\n components: true,\r\n\r\n // Modules for dev and build (recommended): https://go.nuxtjs.dev/config-modules\r\n buildModules: [\r\n // https://go.nuxtjs.dev/eslint\r\n '@nuxtjs/eslint-module',\r\n // https://go.nuxtjs.dev/vuetify\r\n '@nuxtjs/vuetify',\r\n '@nuxtjs/prismic',\r\n ],\r\n\r\n // Modules: https://go.nuxtjs.dev/config-modules\r\n modules: [\r\n // https://go.nuxtjs.dev/axios\r\n '@nuxtjs/axios', \r\n '@nuxtjs/i18n',\r\n '@nuxtjs/auth-next',\r\n 'nuxt-sm',\r\n '@nuxtjs/recaptcha',\r\n '@nuxtjs/moment',\r\n '@nuxtjs/google-gtag',\r\n ],\r\n\r\n // Axios module configuration: https://go.nuxtjs.dev/config-axios\r\n axios: {\r\n // Workaround to avoid enforcing hard-coded localhost:3000: https://github.com/nuxt-community/axios-module/issues/308\r\n baseURL: '/',\r\n },\r\n\r\n // Vuetify module configuration: https://go.nuxtjs.dev/config-vuetify\r\n vuetify: {\r\n customVariables: ['~/assets/variables.scss'],\r\n treeShake: true,\r\n theme: {\r\n dark: false,\r\n themes: {\r\n light: {\r\n primary: \"#002B4D\",\r\n accent: \"#BCD9EA\",\r\n secondary: \"#F2F9FA\",\r\n info: colors.teal.lighten1,\r\n warning: colors.amber.base,\r\n error: colors.deepOrange.accent4,\r\n success: colors.green.accent3,\r\n },\r\n },\r\n },\r\n },\r\n\r\n router: {\r\n },\r\n \r\n i18n: {\r\n lazy: true,\r\n vuex:{ moduleName: 'i18n', syncRouteParams: true },\r\n locales: [ \r\n {\r\n name: 'French',\r\n code: 'fr',\r\n iso: 'fr-fr',\r\n file: 'fr.json'\r\n }, \r\n {\r\n name: 'English',\r\n code: 'en',\r\n iso: 'en-us',\r\n file: 'en.json'\r\n }\r\n ],\r\n langDir: 'lang/',\r\n defaultLocale: 'fr',\r\n parsePages: true,\r\n },\r\n\r\n prismic: {\r\n endpoint: smConfig.apiEndpoint|| \"\",\r\n modern: true,\r\n preview:false,\r\n linkResolver: '@/plugins/link-resolver',\r\n htmlSerializer: '@/plugins/html-serializer',\r\n /* see configuration for more */\r\n },\r\n\r\n recaptcha: {\r\n hideBadge: false, // Hide badge element (v3 & v2 via size=invisible)\r\n mode: 'base', // Mode: 'base', 'enterprise'\r\n version: 3, // Version\r\n },\r\n\r\n moment: {\r\n defaultLocale: 'fr',\r\n locales: ['fr']\r\n },\r\n\r\n 'google-gtag':{\r\n id: process.env.GOOGLE_ANALYTICS_ID, // required\r\n debug: false, // enable to track in dev mode\r\n },\r\n\r\n auth: {\r\n watchLoggedIn: true,\r\n resetOnError: true,\r\n redirect: {\r\n login: \"/admin/login\",\r\n logout: \"/admin/login\",\r\n callback: \"/callback\",\r\n home: '/admin/', // Pour ne pas être redirigé vers la home suite authentification\r\n },\r\n strategies: {\r\n local: {\r\n token: {\r\n property: \"tokens.access.token\",\r\n },\r\n user: {\r\n property: false,\r\n autoFetch: false\r\n },\r\n endpoints: {\r\n login: {\r\n url: `${process.env.URL_AUTH}auth/login`,\r\n method: \"post\", \r\n },\r\n user: { \r\n url: `${process.env.URL_AUTH}auth/user`,\r\n method: 'get'\r\n },\r\n logout: false,\r\n },\r\n },\r\n },\r\n },\r\n \r\n build: {\r\n transpile: [\"vue-slicezone\", \"nuxt-sm\"]\r\n },\r\n}\r\n\r\n```\r\n\r\nAnd my homePage : \r\n\r\n```\r\n\u003Ctemplate>\r\n \u003Cslice-zone :components=\"components\" :slices=\"prismicDocument.data.slices\" />\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\nimport { components } from \"~/slices\";\r\n\r\nexport default {\r\n name: \"IndexPage\",\r\n async asyncData({ app, $axios, $config: { urlFront }, $prismic, params, error, i18n }) {\r\n let localeForPrismic = \"fr-fr\";\r\n if (i18n.locale === \"en\") {\r\n localeForPrismic = \"en-us\";\r\n }\r\n const prismicDocument = await $prismic.api.getSingle(\"homecustomtype\", {\r\n lang: localeForPrismic,\r\n });\r\n\r\n // Récupération du SEO\r\n const seo = app.$prismicExtractSeoFromSlices(prismicDocument.data.slices1);\r\n\r\n return { prismicDocument, seo };\r\n },\r\n data: () => {\r\n return { components };\r\n },\r\n head() {\r\n return {\r\n title: this.seo.title,\r\n };\r\n },\r\n};\r\n\u003C/script>\r\n```\r\n\r\nOn my other sites, I use exactly the same operation for my pages whose content comes from Prismic for info.\r\n\r\nI can't figure out why the content is not rendered server-side...\r\n\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2959,2960,2961],{"name":2946,"color":2947},{"name":2949,"color":2950},{"name":2962,"color":2915},"needs reproduction",19130,"ssr mode not working on Nuxt2","2023-02-17T21:46:21Z","https://github.com/nuxt/nuxt/issues/19130",0.6741178,{"description":2969,"labels":2970,"number":2973,"owner":2874,"repository":2874,"state":2876,"title":2974,"updated_at":2975,"url":2976,"score":2977},"### Version\n\n[v1.4.2](https://github.com/nuxt.js/releases/tag/v1.4.2)\n\n### Reproduction link\n\n[https://github.com/nuxt/nuxt.js/tree/dev/examples/with-vuetify](https://github.com/nuxt/nuxt.js/tree/dev/examples/with-vuetify)\n\n### Steps to reproduce\n\nI cloned the whole Nuxt repo at: https://github.com/nuxt/nuxt.js\n\nThen navigated to: `nuxt.js/examples/with-vuetify`\n\nThen installed dependencies with `yarn install` and ran the server with `yarn dev`.\n\nThen opened `http://localhost:3000` and saw that no colors are being presented. It's all black and white.\n\nIf I have something like `\u003Cv-btn color=\"primary\">Something\u003C/v-btn>` the text is not visible as it is colored white.\n\n### What is expected ?\n\n\n\n\n### What is actually happening?\n\n\n\n\n### Additional comments?\n\nI'm on Linux Manjaro.\nNode 10.9.0.\nit's the same with Nuxt 1.4.2 or nuxt-edge.\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This bug report is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c7607\">#c7607\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2971,2972],{"name":2946,"color":2947},{"name":2949,"color":2950},3777,"Vuetify theme colors are not rendered properly","2023-01-22T15:30:05Z","https://github.com/nuxt/nuxt/issues/3777",0.6784013,{"description":2979,"labels":2980,"number":2982,"owner":2874,"repository":2875,"state":2876,"title":2983,"updated_at":2984,"url":2985,"score":2986},"### Description\r\n\r\nis there an intellisense / autocomplete options for NuxtUI components? i dont see any tooltip thing here when i type...\r\n\r\n",[2981],{"name":2885,"color":2886},2177,"is there no INTELLISENSE / AUTO COMPLETE for typing?","2024-11-12T09:28:56Z","https://github.com/nuxt/ui/issues/2177",0.67924047,{"description":2988,"labels":2989,"number":2995,"owner":2874,"repository":2875,"state":2876,"title":2996,"updated_at":2997,"url":2998,"score":2999},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v22.9.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.16.0\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.8.3\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.2, @nuxtjs/seo@2.0.2, @nuxtjs/plausible@1.2.0\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.9\n\n### Reproduction\n\nOn a brand new project:\n\n```\nnpx nuxi@latest init my-app\ncd my-app\nnpm install @nuxt/ui@next\n```\n\nThen\n/app/app.vue\n```vue\n\u003Ctemplate>\n\t\u003CNuxtLayout>\n\t\t\u003CNuxtPage />\n\t\u003C/NuxtLayout>\n\u003C/template>\n```\n\nnuxt.config.ts\n```js\n// https://nuxt.com/docs/api/configuration/nuxt-config\nexport default defineNuxtConfig({\n\tcompatibilityDate: \"2024-11-01\",\n modules: ['@nuxt/ui', '@nuxt/eslint', '@nuxtjs/seo'],\n css: ['~/assets/css/main.css'],\n\n\tdevtools: { enabled: true },\n\tfuture: {\n\t\tcompatibilityVersion: 4,\n\t},\n\tui: {\n // error here\n\t\tcolorMode: false,\n\t},\n});\n\n```\n\n### Description\n\nWhen changing the ui.colorMode to false AND using the `pages` folder, it crashes the whole app (error below).\n\n\n```\n500\n[vite-node] [plugin:nuxt:imports-transform] [VITE_ERROR] /@fs/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?macro=true\n\n/* Injection by vite-plugin-vue-inspector Start */\nimport { createVNode as __createVNode } from 'vue'\nfunction _interopVNode(vnode) {\n if (vnode && vnode.props && 'data-v-inspector' in vnode.props) {\n const data = vnode.props['data-v-inspector']\n delete vnode.props['data-v-inspector']\n Object.defineProperty(vnode.props, '__v_inspector', { value: data, enumerable: false })\n }\n return vnode\n}\nfunction _createVNode(...args) { return _interopVNode(__createVNode(...args)) }\n/* Injection by vite-plugin-vue-inspector End */\nimport { defineComponent as _defineComponent } from \"vue\";\nimport { onUnmounted, onMounted, reactive } from \"vue\";\nimport { pascalCase } from \"scule\";\nimport { defineAsyncComponent, useColorMode, useRoute } from \"#imports\";\nconst _sfc_main = /* @__PURE__ */ _defineComponent({\n __name: \"DevtoolsRenderer\",\n setup(__props, { expose: __expose }) {\n __expose();\n const route = useRoute();\n const component = route.query?.example ? defineAsyncComponent(() => import(`./examples/${route.query.example}.vue`)) : route.params?.slug && defineAsyncComponent(() => import(`../../runtime/components/${pascalCase(route.params.slug)}.vue`));\n const state = reactive({});\n function onUpdateRenderer(event) {\n state.props = { ...event.data.props };\n state.slots = { ...event.data.slots };\n }\n const colorMode = useColorMode();\n function setColorMode(event) {\n colorMode.preference = event.isDark ? \"dark\" : \"light\";\n }\n onMounted(() => {\n (void 0).parent.addEventListener(\"nuxt-ui-devtools:update-renderer\", onUpdateRenderer);\n (void 0).parent.addEventListener(\"nuxt-ui-devtools:set-color-mode\", setColorMode);\n });\n onUnmounted(() => {\n (void 0).parent.removeEventListener(\"nuxt-ui-devtools:update-renderer\", onUpdateRenderer);\n (void 0).parent.removeEventListener(\"nuxt-ui-devtools:set-color-mode\", setColorMode);\n });\n onMounted(async () => {\n const event = new Event(\"nuxt-ui-devtools:component-loaded\");\n (void 0).parent.dispatchEvent(event);\n });\n onMounted(() => {\n if (!route.query?.example) return;\n });\n const __returned__ = { route, component, state, onUpdateRenderer, colorMode, setColorMode };\n Object.defineProperty(__returned__, \"__isScriptSetup\", { enumerable: false, value: true });\n return __returned__;\n }\n});\nimport { resolveComponent as _resolveComponent, resolveDynamicComponent as _resolveDynamicComponent, mergeProps as _mergeProps, withCtx as _withCtx, openBlock as _openBlock, createBlock as _createBlock, createCommentVNode as _createCommentVNode } from \"vue\";\nimport { ssrRenderVNode as _ssrRenderVNode, ssrRenderComponent as _ssrRenderComponent, ssrRenderAttrs as _ssrRenderAttrs } from \"vue/server-renderer\";\nfunction _sfc_ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {\n const _component_UApp = _resolveComponent(\"UApp\");\n _push(`\u003Cdiv${_ssrRenderAttrs(_mergeProps({\n id: \"ui-devtools-renderer\",\n class: \"nuxt-ui-component-renderer\",\n \"data-v-inspector\": \"../node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue:44:3\"\n }, _attrs))}>`);\n _push(_ssrRenderComponent(_component_UApp, { toaster: null }, {\n default: _withCtx((_, _push2, _parent2, _scopeId) => {\n if (_push2) {\n if ($setup.component) {\n _ssrRenderVNode(_push2, _createVNode(_resolveDynamicComponent($setup.component), _mergeProps($setup.state.props, {\n class: $setup.state?.slots?.base,\n ui: $setup.state.slots\n }), null), _parent2, _scopeId);\n } else {\n _push2(`\u003C!---->`);\n }\n } else {\n return [\n $setup.component ? (_openBlock(), _createBlock(_resolveDynamicComponent($setup.component), _mergeProps({ key: 0 }, $setup.state.props, {\n class: $setup.state?.slots?.base,\n ui: $setup.state.slots\n }), null, 16, [\"class\", \"ui\"])) : _createCommentVNode(\"v-if\", true)\n ];\n }\n }),\n _: 1\n /* STABLE */\n }, _parent));\n _push(`\u003C/div>`);\n}\nimport \"/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?vue&type=style&index=0&lang.css\";\nimport { useSSRContext as __vite_useSSRContext } from \"vue\";\nconst _sfc_setup = _sfc_main.setup;\n_sfc_main.setup = (props, ctx) => {\n const ssrContext = __vite_useSSRContext();\n (ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add(\"../../node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue\");\n return _sfc_setup ? _sfc_setup(props, ctx) : void 0;\n};\nimport _export_sfc from \"\\0plugin-vue:export-helper\";\nexport default /* @__PURE__ */ _export_sfc(_sfc_main, [[\"ssrRender\", _sfc_ssrRender], [\"__file\", \"/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue\"]]);\n\nat /@fs/Users/jeannen/Dev/apps/node_modules/@nuxt/ui/dist/devtools/runtime/DevtoolsRenderer.vue?macro=true\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2990,2991,2994],{"name":2868,"color":2869},{"name":2992,"color":2993},"duplicate","cfd3d7",{"name":2871,"color":2872},2823,"`colorMode: false` + /pages/ crash the app","2024-12-03T09:33:17Z","https://github.com/nuxt/ui/issues/2823",0.68130136,["Reactive",3001],{},["Set"],["ShallowReactive",3004],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fyl90M_JZfZQ2x2dGvniUnmINP29cXV-lgOWa_DvNfY8":-1},"/nuxt/nuxt.com/1378"]