\n\u003C/template>\n\u003Cscript setup>\nconst items = [\n { label: \"click for one\", onClick: () => alert(\"1\"), to: \"/one\" },\n { label: \"click for two\", onClick: () => alert(\"2\"), to: \"/two\" },\n]\n\u003C/script>\n```\n\nMy need is to have some secondary effects happening besides the navigation when the user clicks on a breadcrumb item.\n\n### Additional context\n\n_No response_",[2887,2889,2892],{"name":2857,"color":2888},"a2eeef",{"name":2890,"color":2891},"v3","49DCB8",{"name":2893,"color":2894},"triage","ffffff",3631,"ui","Support for `onClick` event on Breadcrumb items","2025-03-24T18:08:16Z","https://github.com/nuxt/ui/issues/3631",0.7200128,{"description":2902,"labels":2903,"number":2907,"owner":2860,"repository":2860,"state":2862,"title":2908,"updated_at":2909,"url":2910,"score":2911},"### Environment\n\nThis bug relates to the documentation. \n\n### Reproduction\n\nThis bug relates to the documentation. \n\n### Describe the bug\n\nInside docs examples on [Guide -> Directory Structure -> server/](https://nuxt.com/docs/guide/directory-structure/server) the multiline code blocks are missing opening `{` for the arrow functions. This causes copy pastes to be broken.\r\n\r\nI initially thought this would just be a typo inside the markdown file, but the content itself appears to be fine. This leads me to believe that this is an issue with the code highlighting, possibly, but I'm not 100% sure.\r\n\r\n\r\n\r\nhttps://github.com/nuxt/framework/edit/main/docs/content/1.docs/2.guide/2.directory-structure/1.server.md\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2904,2905,2906],{"name":2871,"color":2872},{"name":2874,"color":2875},{"name":2877,"color":2878},15546,"Docs code examples broken, missing \"{\"","2023-01-19T17:53:56Z","https://github.com/nuxt/nuxt/issues/15546",0.7281822,{"description":2913,"labels":2914,"number":2918,"owner":2860,"repository":2896,"state":2862,"title":2919,"updated_at":2920,"url":2921,"score":2922},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v22.3.0`\r\n- Nuxt Version: `3.13.1`\r\n- CLI Version: `3.13.1`\r\n- Nitro Version: `2.9.7`\r\n- Package Manager: `yarn@1.22.22`\r\n- Builder: `-`\r\n- User Config: `compatibilityDate`, `devtools`, `modules`, `plugins`, `runtimeConfig`, `i18n`\r\n- Runtime Modules: `@nuxt/ui@2.18.4`, `@nuxtjs/i18n@8.5.1`\r\n- Build Modules: `-`\r\n\n\n### Version\n\nv2.18.4\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-jfdc58?file=app.vue,app.config.ts\n\n### Description\n\n## Description\r\nThe Nuxt UI notification component is currently being created and added to the DOM even when no toast has been triggered. This behavior leads to unintended consequences due to the component's z-index:\r\n\r\nThe notification component occupies part of the screen unnecessarily.\r\nIt overlaps other elements on the page due to its z-index, potentially disrupting the user interface.\r\n\r\n## Expected Behavior\r\nThe notification component should only be created and added to the DOM when a toast is actually triggered.\r\n\r\n## Current Behavior\r\nThe notification component is always present in the DOM, regardless of whether a toast has been triggered or not.\r\n\r\n## Steps to Reproduce\r\n\r\n- Implement the Nuxt UI notification component in a project.\r\n- Inspect the DOM without triggering any toasts.\r\n- Observe that the notification component is present and has a z-index applied.\r\n\r\n## Additional Context\r\nThis issue affects the usability and performance of applications using the Nuxt UI notification component. Resolving it would improve both the user experience and the overall efficiency of the component.\r\n\r\n## Possible Solution\r\nConsider implementing a conditional rendering approach where the notification component is only added to the DOM when it's actually needed (i.e., when a toast is triggered).\r\n\u003Cimg width=\"1427\" alt=\"Screenshot 2024-09-04 at 6 29 00 PM\" src=\"https://github.com/user-attachments/assets/da90352f-71e6-4aaf-9bda-7a9e4a3fd056\">\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2915],{"name":2916,"color":2917},"bug","d73a4a",2113,"Notification component created even when toast is not triggered, causing z-index issues","2024-11-09T10:24:37Z","https://github.com/nuxt/ui/issues/2113",0.73428184,{"description":2924,"labels":2925,"number":2929,"owner":2860,"repository":2896,"state":2862,"title":2930,"updated_at":2931,"url":2932,"score":2933},"### Description\r\n\r\nWe use Directus for content. I want to execute a fetch when using the Pagination component but can't figure out how to.\r\n\r\nClicking on a button update the url but it's not reloading the page so `pageNum` is not updated. Is there emits from the component I can use?\r\n\r\nThanks.\r\n\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\nimport type { Article } from '~/types'\r\n\r\nconst route = useRoute()\r\n\r\nconst pageNum = ref(Number(route.query.page ?? 1))\r\nconst maxPages = ref(0)\r\nconst ARTICLES_PER_PAGE = 2\r\n\r\nconst url = ref(/* url to Directus */)\r\n\r\nconst { data: rawArticles, error, execute } = await useFetch(() => url.value)\r\nif (error.value)\r\n console.error(error.value)\r\n\r\nmaxPages.value = Math.ceil(Number(rawArticles.value?.meta?.filter_count ?? 1) / ARTICLES_PER_PAGE)\r\nconst articles: Article[] = ref(rawArticles.value.data)\r\n\r\nwatch(route, () => {\r\n console.log(route.path)\r\n console.log(pageNum.value)\r\n execute()\r\n})\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003CUContainer>\r\n \u003CUPageBody>\r\n \u003CUBlogList>\r\n \u003CUBlogPost [...] />\r\n \u003C/UBlogList>\r\n\r\n \u003CUPagination\r\n size=\"sm\"\r\n :model-value=\"pageNum\"\r\n :total=\"maxPages\"\r\n :page-count=\"1\"\r\n show-last\r\n show-first\r\n :to=\"(page: number) => ({\r\n query: { page },\r\n // Hash is specified here to prevent the page from scrolling to the top\r\n hash: '#links',\r\n })\"\r\n @on-click-page=\"(e) => { console.log('current page', e); execute() }\"\r\n />\r\n \u003C/UPageBody>\r\n \u003C/UContainer>\r\n\u003C/template>\r\n```",[2926],{"name":2927,"color":2928},"question","d876e3",2190,"[Pagination] emits on buttons?","2024-09-12T12:33:01Z","https://github.com/nuxt/ui/issues/2190",0.7409264,{"labels":2935,"number":2938,"owner":2860,"repository":2860,"state":2862,"title":2939,"updated_at":2940,"url":2941,"score":2942},[2936,2937],{"name":2874,"color":2875},{"name":2916,"color":2917},12091,"Logo in readme update","2023-01-19T15:54:20Z","https://github.com/nuxt/nuxt/issues/12091",0.74261975,{"description":2944,"labels":2945,"number":2948,"owner":2860,"repository":2896,"state":2862,"title":2949,"updated_at":2950,"url":2951,"score":2952},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.11.0\n- Nuxt Version: -\n- CLI Version: 3.21.1\n- Nitro Version: -\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.12\n\n### Reproduction\n\nhttps://github.com/nuxt/starter/tree/ui3\n\n### Description\n\nTested both with\n1. the official [nuxt ui v3 starter template](https://github.com/nuxt/starter/tree/ui3)\n2. Following the manual installation steps outlined in https://ui3.nuxt.dev/getting-started/installation/nuxt#use-our-nuxt-starter\n\nAfter a fresh install of the nuxt ui3 starter project (cd7e386) as instructed by the [nuxt documentation](https://ui3.nuxt.dev/getting-started/installation/nuxt#use-our-nuxt-starter), spinning up the dev-server yields errors, rendering the project unusable. Tried with node 20 and 22. Both times, the following error appears:\n\n```\n ERROR Pre-transform error: [@vue/compiler-sfc] Failed to resolve extends base type. 2:44:13 PM\nIf this previously worked in 3.2, you can instruct the compiler to ignore this extend by adding /* @vue-ignore */ before it, for example:\n\ninterface Props extends /* @vue-ignore */ Base {}\n\nNote: both in 3.2 or with the ignore, the properties in the base type are treated as fallthrough attrs at runtime.\n\n/Users/\u003Csnip>/node_modules/@nuxt/ui/dist/runtime/components/Button.vue\n63 | \n64 | const loadingAutoState = ref(false)\n65 | const formLoading = inject\u003CRef\u003Cboolean> | undefined>(formLoadingInjectionKey, undefined)\n | ^^^^^^^^^^^^^^^^^^^^^^^^^^\n66 | \n | ^\n67 | async function onClickWrapper(event: MouseEvent) {\n | ^^^^^\n Plugin: vite:vue\n File: /Users/\u003Csnip>/node_modules/@nuxt/ui/dist/runtime/components/Button.vue\n```\n\nThe result is a 500er page when visiting localhost in the web browser.\n\nI am aware there were other issues with this error message suggesting to install typescript as a devDependency. I believe this is not the solution here because typescript is already a devDependency in the ui3 starter template. Another suggestion was to add a tsconfig.json. This also already exists in the starter template.\n\nFinally, other people are experiencing the same issue, with multiple people posting the same error message in the official Nuxt Discord.\n\n### Additional context\n\nDiscord questions with the same issue\nhttps://discord.com/channels/473401852243869706/1304812159540396055\nhttps://discord.com/channels/473401852243869706/1334142349026267187\n\n\n### Logs\n\n```shell-script\n\n```",[2946,2947],{"name":2916,"color":2917},{"name":2890,"color":2891},3262,"ui v3 can not be started","2025-03-08T12:22:25Z","https://github.com/nuxt/ui/issues/3262",0.7497108,{"description":2954,"labels":2955,"number":2959,"owner":2860,"repository":2860,"state":2862,"title":2960,"updated_at":2961,"url":2962,"score":2963},"\r\ndevelopment has no problem but in production this is what happen need help \r\nthanks\n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://cmty.app/nuxt\">Nuxt\u003C/a> community (\u003Ca href=\"https://cmty.app/nuxt/nuxt.js/issues/c7211\">#c7211\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[2956],{"name":2957,"color":2958},"2.x","d4c5f9",3421,"build error","2023-01-18T16:24:02Z","https://github.com/nuxt/nuxt/issues/3421",0.7497694,{"labels":2965,"number":2968,"owner":2860,"repository":2860,"state":2862,"title":2969,"updated_at":2970,"url":2971,"score":2972},[2966,2967],{"name":2874,"color":2875},{"name":2916,"color":2917},11846,"global imports transform is wrongly stripping code after `https://`","2023-01-19T15:48:19Z","https://github.com/nuxt/nuxt/issues/11846",0.7502267,["Reactive",2974],{},["Set"],["ShallowReactive",2977],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f2kePVexjjw9wFmf756snO_zhst5fWhlXItAGsQPfcqs":-1},"/nuxt/test-utils/918"]