",[1984,1987,1990],{"name":1985,"color":1986},"enhancement","a2eeef",{"name":1988,"color":1989},"v3","49DCB8",{"name":1991,"color":1992},"triage","ffffff",3270,"nuxt","ui","open","[Feature request] Toast hide progress in app.config","2025-02-09T17:11:11Z","https://github.com/nuxt/ui/issues/3270",0.7246604,{"description":2002,"labels":2003,"number":2010,"owner":1994,"repository":1995,"state":1996,"title":2011,"updated_at":2012,"url":2013,"score":2014},"### Description\n\nHi there,\r\n\r\nI installed the project from scratch with the below commands:\r\nFor Nuxt:\r\n`bun x nuxi@latest init test`\r\n\r\nFor Nuxt UI:\r\n`npx nuxi@latest module add ui`\r\n\r\nWhen I run the project with `bun run dev`, I got the below warning:\r\n\r\n\r\nMy `package.json` is as follows:\r\n```\r\n\"dependencies\": {\r\n \"@nuxt/eslint\": \"^0.5.7\",\r\n \"@nuxt/ui\": \"^2.18.6\",\r\n \"@nuxtjs/tailwindcss\": \"^6.12.1\",\r\n \"@pinia/nuxt\": \"^0.5.4\",\r\n \"@vueuse/core\": \"^11.1.0\",\r\n \"@vueuse/nuxt\": \"^11.1.0\",\r\n \"nuxt\": \"^3.13.2\",\r\n \"vue\": \"latest\",\r\n \"vue-router\": \"latest\"\r\n },\r\n \"devDependencies\": {\r\n \"@nuxt/devtools\": \"^1.5.1\",\r\n \"ts-node\": \"^10.9.2\",\r\n \"typescript\": \"^5.6.2\",\r\n \"vue-tsc\": \"^2.1.6\"\r\n }\r\n```\r\n \r\n And my config is:\r\n```\r\nmodules: [\r\n '@nuxt/eslint',\r\n '@nuxtjs/tailwindcss',\r\n '@nuxt/ui',\r\n '@pinia/nuxt',\r\n '@vueuse/nuxt'\r\n ],\r\n vite: {\r\n server: {\r\n hmr: {\r\n clientPort: 3000\r\n }\r\n }\r\n },\r\n ui: {\r\n global: true\r\n }\r\n```\r\n\r\nI'm wondering why...\r\n1. I got the Nuxt 3.8.2 warning\r\n2. There's no auto-completion for Nuxt UI component (I installed Vue - Official extension)\r\n3. Using Nuxt UI components gives error\r\n\r\n\r\n\r\n\r\n",[2004,2007],{"name":2005,"color":2006},"question","d876e3",{"name":2008,"color":2009},"stale","ededed",2249,"Module @nuxt/ui is disabled due to incompatibility issues","2024-11-27T02:06:55Z","https://github.com/nuxt/ui/issues/2249",0.731318,{"description":2016,"labels":2017,"number":2020,"owner":1994,"repository":1995,"state":1996,"title":2021,"updated_at":2022,"url":2023,"score":2024},"### Description\n\nIn the vertical pill variant I want the background of the active item to be white. It's not clear how to achieve this through the `ui` prop\n\n\n\n```\n\u003CUNavigationMenu\n orientation=\"vertical\"\n variant=\"pill\"\n :items=\"items\"\n\n :ui=\"{\n variants: {\n compoundVariants: [\n {\n variant: 'pill',\n active: true,\n highlight: false,\n class: {\n link: 'before:bg-white' // tried this but it's not working\n }\n }\n ]\n }\n }\"\n/>\n```",[2018,2019],{"name":2005,"color":2006},{"name":1988,"color":1989},3517,"How To Style NavigationMenu items","2025-03-14T13:01:49Z","https://github.com/nuxt/ui/issues/3517",0.7395933,{"description":2026,"labels":2027,"number":2034,"owner":1994,"repository":1994,"state":2035,"title":2036,"updated_at":2037,"url":2038,"score":2039},"### Version\r\n\r\n[v2.8.1](https://github.com/nuxt.js/releases/tag/v2.8.1)\r\n\r\n### Reproduction link\r\n\r\n[https://codesandbox.io/embed/codesandbox-nuxt-btkmv](https://codesandbox.io/embed/codesandbox-nuxt-btkmv)\r\n\r\n### Steps to reproduce\r\n\r\nI'm trying to create a PoC to migrate our current SPA to Nuxt (improving SEO) but I'm having difficulties at using Vuexfire and binding Firestore to Vuex.\r\n\r\nFirst of all, I'm using https://github.com/lupas/nuxt-fire to help developing this in a more global way.\r\n\r\nThen, this is the code I'm using:\r\n\r\n*store/index.ts*\r\n\r\n```js\r\nimport { vuexfireMutations, firestoreAction } from 'vuexfire'\r\n\r\nclass Reference {\r\n // eslint-disable-next-line no-restricted-globals\r\n name: string = '';\r\n ref: any;\r\n}\r\n\r\nexport const state = () => ({\r\n assets: []\r\n});\r\n\r\nexport const getters = {\r\n\r\n};\r\n\r\nexport const actions = {\r\n bindRef: firestoreAction(async ({ bindFirestoreRef }, { name, ref }: Reference): Promise\u003Cvoid> => {\r\n bindFirestoreRef(name, ref);\r\n }),\r\n\r\n unbindRef: firestoreAction(({ unbindFirestoreRef }, { name }: Reference): void => {\r\n unbindFirestoreRef(name);\r\n }),\r\n};\r\n\r\nexport const mutations = {\r\n set_assets: (state, payload) => {\r\n state.assets = [...payload];\r\n },\r\n ...vuexfireMutations,\r\n};\r\n```\r\n\r\n*pages/index.ts*\r\n\r\n```js\r\nimport { Component, Vue, Action, State } from 'nuxt-property-decorator';\r\nimport Logo from '~/components/Logo.vue';\r\n// import { auth, db } from '~/plugins/firebase';\r\n\r\n@Component({\r\n components: {\r\n Logo,\r\n },\r\n // middleware: ['testMiddleware']\r\n})\r\nexport default class Index extends Vue {\r\n @Action\r\n bindRef!: any;\r\n\r\n @State('assets')\r\n assets!: any[]\r\n\r\n // async created(): Promise\u003Cvoid> {\r\n // this.bindRef({\r\n // name: 'assets',\r\n // ref: this.$fireStore.collection('assets')\r\n // .where('published', '==', true)\r\n // .orderBy('createdDatetime', 'desc'),\r\n // });\r\n // }\r\n\r\n async fetch ({ store, app }): Promise\u003Cvoid> {\r\n console.log(1);\r\n try {\r\n await store.dispatch('bindRef', {\r\n name: 'assets',\r\n ref: app.$fireStore.collection('assets')\r\n .where('published', '==', true)\r\n .orderBy('createdDatetime', 'desc'),\r\n });\r\n console.log(2)\r\n } catch (e) {\r\n console.log(e)\r\n }\r\n \r\n // try {\r\n // const snapshots = await app.$fireStore.collection('assets')\r\n // .where('published', '==', true)\r\n // .orderBy('createdDatetime', 'desc')\r\n // .get();\r\n // console.log(2)\r\n // store.commit('set_assets', [...snapshots.docs.map(doc => doc.data())])\r\n // } catch (e) {\r\n // console.log(e)\r\n // }\r\n console.log(3);\r\n }\r\n}\r\n```\r\n\r\n*Fetch method*\r\n\r\nThe issue I'm having is that the collection is binded only when I save the changes, hot reloading executes and then I can see the data both, in the website and also in Vue devtools.\r\nIf I refresh the website manually, data won't be displayed in the website nor Vue devtools state management.\r\n\r\nIf I try without the binding and then directly commiting, the data is displayed correctly on the website but not in Vue Dev tools. And obviously, it won't be refreshing live data.\r\n\r\n*created method*\r\n\r\nThis one works correctly but the problem is that it's binding client side, after the component is created (obviously). Not interested in this method since you lose SEO.\r\n\r\n\r\nSo, what am I missing here?\r\n\r\n\r\nPS: sandbox must be configured with your Firebase config in nuxt.config.js\r\n\r\n### What is expected ?\r\n\r\nVuexfire Firestore live data binding\r\n\r\n### What is actually happening?\r\n\r\nIt's not binding the data\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/c9594\">#c9594\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2028,2031],{"name":2029,"color":2030},"pending triage","E99695",{"name":2032,"color":2033},"2.x","d4c5f9",6174,"closed","Vuex & Firebase problems","2023-01-22T15:34:44Z","https://github.com/nuxt/nuxt/issues/6174",0.69185036,{"description":2041,"labels":2042,"number":2046,"owner":1994,"repository":1995,"state":2035,"title":2047,"updated_at":2048,"url":2049,"score":2050},"### Environment\n\n- Operating System: Linux\r\n- Node Version: v18.20.3\r\n- Nuxt Version: 3.13.2\r\n- CLI Version: 3.14.0\r\n- Nitro Version: 2.9.7\r\n- Package Manager: pnpm@8.15.6\r\n- Builder: -\r\n- User Config: -\r\n- Runtime Modules: -\r\n- Build Modules: -\n\n### Version\n\nv2.18.6\n\n### Reproduction\n\nhttps://stackblitz.com/~/github.com/Yves852/nuxt-ui-commandpalette-hover\n\n### Description\n\nHovering the list of element with the mouse don't show visual effects contrary to [doc example](https://ui.nuxt.com/components/command-palette#usage), It's updated with up/down keys.\r\n\r\nCould be related to [1708](https://github.com/nuxt/ui/issues/1708)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2043],{"name":2044,"color":2045},"duplicate","cfd3d7",2284,"CommandPalette: hover not working","2024-11-13T09:11:36Z","https://github.com/nuxt/ui/issues/2284",0.7056634,{"description":2052,"labels":2053,"number":2058,"owner":1994,"repository":1995,"state":2035,"title":2059,"updated_at":2060,"url":2061,"score":2062},"### Environment\n\n------------------------------\n- Operating System: Windows_NT\n- Node Version: v20.10.0\n- Nuxt Version: 3.13.2\n- CLI Version: 3.14.0\n- Nitro Version: 2.9.7\n- Package Manager: yarn@4.5.0\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.x\n\n### Reproduction\n\n```vue\n\u003Ctemplate>\n\u003CUDropdownMenu :items=\"items\">\n \u003CUAvatar\n :src=\"profilePicture\"\n size=\"lg\"\n />\n\u003C/UDropdownMenu>\n\u003C/template>\n\n\u003Cscript setup lang=\"ts\">\nconst profilePicture = ref('/this/image/does/not/exist.jpg')\nconst items = [\n[{\n\tlabel: 'Logout',\n\ticon: 'i-lucide-log-out',\n}]\n]\n\u003C/script>\n```\n\n### Description\n\nWhen the `src` of the image in `UAvatar` fails to get resolved for any reason (non-existent resource, network error, refused connection from the requested host, etc), it no longer triggers the expansion of the `UDropdownMenu`. \n\nNote that this might also affect `UPopover`, but I have not tested it yet. I will be able to test it later today.\n\nP.S. @benjamincanac this was the reason I initially included it in the migration guide, because I did not know it only happens on non-resolved images\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2054,2057],{"name":2055,"color":2056},"bug","d73a4a",{"name":1988,"color":1989},2923,"`UAvatar` with non-resolved `src` fails to trigger `UDropdownMenu`","2025-01-25T13:12:33Z","https://github.com/nuxt/ui/issues/2923",0.71176726,{"description":2064,"labels":2065,"number":2072,"owner":1994,"repository":1994,"state":2035,"title":2073,"updated_at":2074,"url":2075,"score":2076},"### Environment\r\n\r\nNuxi 3.0.0 14:35:05\r\n 14:35:06\r\nRootDir: /var/www/apps/odyc 14:35:06\r\nNuxt project info: 14:35:06\r\n\r\n------------------------------\r\n- Operating System: `Linux`\r\n- Node Version: `v18.12.1`\r\n- Nuxt Version: `3.0.0`\r\n- Nitro Version: `1.0.0`\r\n- Package Manager: `npm@8.19.2`\r\n- Builder: `vite`\r\n- User Config: `runtimeConfig`, `css`, `vite`, `modules`\r\n- Runtime Modules: `()`\r\n- Build Modules: `-`\r\n\r\n### Reproduction\r\n\r\nI have a plugin with firestore : plugins/firebaseAuth.client.ts\r\n\r\n```\r\nimport { initializeApp } from \"firebase/app\";\r\nimport { getFirestore, collection, getDocs } from \"firebase/firestore\";\r\nimport { getAuth, onAuthStateChanged } from \"firebase/auth\";\r\n\r\nexport default defineNuxtPlugin((nuxtApp) => {\r\n\r\n const config = useRuntimeConfig()\r\n\r\n const firebaseConfig = {\r\n apiKey: config.FIREBASE_API_KEY,\r\n authDomain: config.FIREBASE_AUTH_DOMAIN,\r\n projectId: config.FIREBASE_PROJECT_ID,\r\n storageBucket: config.FIREBASE_STORAGE_BUCKET,\r\n messagingSenderId: config.FIREBASE_MESSAGING_SENDER_ID,\r\n appId: config.FIREBASE_APP_ID,\r\n }\r\n\r\n // Initialize Firebase\r\n const app = initializeApp(firebaseConfig)\r\n const auth = getAuth(app)\r\n\r\n const db = getFirestore(app); \r\n console.log(\"db\", db)\r\n\r\n const querySnapshot = getDocs(collection(db, \"supplier_invoice\"));\r\n querySnapshot.then((querySnapshot) => {\r\n querySnapshot.forEach((doc) => {\r\n console.log(doc.data());\r\n });\r\n });\r\n\r\n nuxtApp.vueApp.provide('auth', auth)\r\n nuxtApp.provide('auth', auth)\r\n\r\n nuxtApp.vueApp.provide('db', db)\r\n nuxtApp.provide('db', db)\r\n});\r\n```\r\nI have a page : pages/supplier/index.vue\r\n\r\n```\r\n\u003Cscript setup>\r\nimport { collection, getDocs, doc, setDoc } from \"firebase/firestore\";\r\n\r\ndefinePageMeta({\r\n title: 'Factures fournisseurs'\r\n});\r\n\r\nconst nuxtApp = useNuxtApp()\r\nconsole.log(nuxtApp.$db)\r\n\r\nconst querySnapshot = getDocs(collection(nuxtApp.$db, \"supplier_invoice\"));\r\nquerySnapshot.then((querySnapshot) => {\r\n querySnapshot.forEach((doc) => {\r\n console.log(doc.data());\r\n });\r\n});\r\n\r\n\u003C/script>\r\n```\r\n\r\n\r\n\r\n### Describe the bug\r\n\r\nIn the plugin when i call my collection, it works, But when i try do the same call in the page, it not works !\r\n\r\nThe error is : **Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore**\r\n\r\nThe log of nuxtApp.$db seems to be the same with the log db in the plugin.\r\n\r\n```\r\nconst querySnapshot = getDocs(collection(db, \"supplier_invoice\"));\r\nquerySnapshot.then((querySnapshot) => {\r\n querySnapshot.forEach((doc) => {\r\n console.log(doc.data());\r\n });\r\n});\r\n```\r\n\r\n**So in don't know what happens, some ideas ? Thks**\r\n\r\n### EDIT\r\n\r\nI do some tests, and something like that \"works\" :\r\n\r\n```\r\nasync function getAll() {\r\n const nuxtApp = useNuxtApp()\r\n const querySnapshot = await getDocs(collection(nuxtApp.$db, \"supplier_invoice\"));\r\n const data = []\r\n querySnapshot.forEach((doc) => {\r\n data.push(doc.data())\r\n })\r\n return data;\r\n}\r\n\r\nonMounted(async () => {\r\n const invoices = await getAll()\r\n console.log(invoices)\r\n})\r\n```\r\nand when i remove the `onMounted(async () => {])` it give me the error after browser refresh.\r\n\r\nI can't stay with onMounted cause i want to use invoices in my template, and with this way is not available.\r\n```\r\n\u003Ctr v-for=\"invoice in invoices\" :key=\"invoice.supplier\">\r\n```\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2066,2069],{"name":2067,"color":2068},"3.x","29bc7f",{"name":2070,"color":2071},"needs details","493824",19312,"Expected first argument to collection() to be a CollectionReference, a DocumentReference or FirebaseFirestore","2023-02-28T11:40:55Z","https://github.com/nuxt/nuxt/issues/19312",0.7139171,{"description":2078,"labels":2079,"number":2087,"owner":1994,"repository":1995,"state":2035,"title":2088,"updated_at":2089,"url":2090,"score":2091},"### Environment\n\nBuild error on vercel.app and on local windows 10, both on build and dev.\n\n### Version\n\nv1.4.4 @nuxt/ui-pro - Saas Template\n\n### Reproduction\n\nInstall a clean saas template.\nEnable typescript check in nuxt.config\n\nTry to deploy it on vercel.\n\nAnd try to copy/paste the url in a facebook post.\n\nHere is a 100% clean saas template, without typeCheck enabled:\nhttps://stackblitz.com/~/github.com/LutherApp/codespace-project\n\n(This is a copy of my [github repo](https://github.com/LutherApp/codespace-project))\n\n### Description\n\nOn build there will be \n## errors on the \"title\"-variable\nError-msg:\nObject literal may only specify known properties, and 'title' does not exist in type 'OgImageOptions\u003C\"NuxtSeo\"> | OgImagePrebuilt'. (etc.)\n\n## \"authors\"- and \"title\"-variable in blog/index\n3 x Type 'bla bla bla' is not assignable to type 'bla bla bla'.\n1 x Property 'avatar' is optional in type 'bla bla bla' but required in type 'bla bla bla'.\n\n## Fix\nI was adding this workaround for typecheck in three or four files:\n```\n// @ts-expect-error Object literal may only specify known properties, and 'title' does not exist in type 'OgImageOptions\u003C\"NuxtSeo\"> | OgImagePrebuilt'.\n```\n\nIn blog/index.vue a was adding this lines in the template in front of `UPageBody` (in blog/index.vue):\n``` \n\u003C!--\n @vue-expect-error The variable authors throws four errors;\n 3 x Type 'bla bla bla' is not assignable to type 'bla bla bla'.\n 1 x Property 'avatar' is optional in type 'bla bla bla' but required in type 'bla bla bla'.\n -->\n```\n\n## seo info from the page missing on facebook\nThere is still noe data about the page on facebook. \n(Other nuxt-content I have made earlier have this info when I copy/paste the url to facebook.)\n\n## Any questions to this issue?\nPlease add some questions to get more info about this issues. (This was written faster than normal.)",[2080,2081,2084],{"name":2055,"color":2056},{"name":2082,"color":2083},"pro","5BD3CB",{"name":2085,"color":2086},"upstream","78bddb",2415,"og:fields in my 100% clean saas template doesn't shows on facebook, and your own public saas template don't show the og:image","2024-10-22T09:40:37Z","https://github.com/nuxt/ui/issues/2415",0.72424763,{"description":2093,"labels":2094,"number":2098,"owner":1994,"repository":2099,"state":2035,"title":2100,"updated_at":2101,"url":2102,"score":2103},"### Environment\n\nNot needed\n\n### Reproduction\n\nNot necessary, any SSR/Prerender Nuxt will fail\n\n### Describe the bug\n\nI'm just creating this issue to warn anyone that is using Cloudflare with Nuxt SSR\r\n\r\nDISABLE ASSET MINIFICATION, it breaks Vue hydration\r\n\r\n\r\nI've spent weeks trying to fix it, and it was as simple as unchecking these boxes, hope it helps anyone\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2095],{"name":2096,"color":2097},"documentation","9DE2BA",1457,"nuxt.com","SSR Issues with Coudflare Pages (SOLVED)","2023-12-27T17:11:13Z","https://github.com/nuxt/nuxt.com/issues/1457",0.72729945,{"description":2105,"labels":2106,"number":2110,"owner":1994,"repository":1995,"state":2035,"title":2111,"updated_at":2112,"url":2113,"score":2114},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.18.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.16.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.12.3\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/image@1.8.1, @nuxt/content@2.13.4, @nuxthq/studio@1.1.2, @nuxt/ui-pro@3.0.0-alpha.10, @nuxtjs/plausible@1.2.0, @nuxtjs/seo@2.0.2, @vueuse/nuxt@12.0.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0.alpha10\n\n### Reproduction\n\nhttps://ui3.nuxt.dev/components/button#loading (example with `loading-auto`)\n\n### Description\n\nWhen using a `UIButton` component with an `@click` event, the cursor does not change to `cursor-pointer`, which may confuse users about the button's clickability.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2107,2108,2109],{"name":2055,"color":2056},{"name":2044,"color":2045},{"name":1988,"color":1989},2940,"`cursor-pointer` is missing on `UButton` with an `@click` event","2025-04-02T09:37:12Z","https://github.com/nuxt/ui/issues/2940",0.72987115,["Reactive",2116],{},["Set"],["ShallowReactive",2119],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"hNfB9t5sieREKm1RaFZXgucqyRuHUmmmgnq7bqpu-_w":-1},"/nuxt/nuxt.com/1439"]