\n \u003C/template>\n\n \u003Ctemplate #panel>\n \u003Cdiv class=\"flex h-full content-center pt-[130px]\">\n \u003CUNavigationTree id=\"navtree\" :links=\"links\" default-open />\n \u003C/div>\n \u003C/template>\n \u003C/UHeader>\n\u003C/template>\n```\n\n### Workaround \nFor classes: split links in multiple UHeaderLinks with custom ui prop.\n\n\n\n```vue\n\u003Ctemplate #center>\n \u003Cdiv class=\"flex flex-row flex-nowrap gap-5\">\n \u003CUHeaderLinks\n :links=\"linksA\"\n :ui=\"{\n wrapper: 'hidden lg:flex flex-row flex-nowrap items-center gap-x-8',\n }\"\n />\n \u003CUHeaderLinks\n :links=\"linksB\"\n :ui=\"{\n wrapper: 'hidden lg:flex flex-row flex-nowrap items-center gap-x-8',\n inactive: 'hover:text-primary text-red-500 italic',\n default: {\n popover: {\n ui: {\n wrapper: 'text-red-500 italic',\n },\n },\n },\n }\"\n />\n \u003C/div>\n\u003C/template>\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[1984,1987,1990],{"name":1985,"color":1986},"bug","d73a4a",{"name":1988,"color":1989},"pro","5BD3CB",{"name":1991,"color":1992},"triage","ffffff",2306,"nuxt","ui","open","HeaderLinks: properties class and icon has no effects","2025-02-17T00:12:08Z","https://github.com/nuxt/ui/issues/2306",0.69107187,{"description":2002,"labels":2003,"number":2010,"owner":1994,"repository":1995,"state":1996,"title":2011,"updated_at":2012,"url":2013,"score":2014},"### Description\n\nHello. How can i use provide in programmatically modal usage?",[2004,2007],{"name":2005,"color":2006},"question","d876e3",{"name":2008,"color":2009},"v3","49DCB8",2987,"Provide in modal programmatically usage","2024-12-31T05:16:08Z","https://github.com/nuxt/ui/issues/2987",0.692956,{"description":2016,"labels":2017,"number":2031,"owner":1994,"repository":1994,"state":1996,"title":2032,"updated_at":2033,"url":2034,"score":2035},"### Environment\n\n- Operating System: `Darwin`\r\n- Node Version: `v20.15.1`\r\n- Nuxt Version: `3.12.4`\r\n- CLI Version: `3.12.0`\r\n- Nitro Version: `2.9.7`\r\n- Package Manager: `npm@10.7.0`\r\n- Builder: `-`\r\n- User Config: `compatibilityDate`, `devtools`, `extends`, `alias`, `devServer`\r\n- Runtime Modules: `-`\r\n- Build Modules: `-`\r\n\n\n### Reproduction\n\nhttps://github.com/fabianwohlfart/test__nuxt-layer-default-import\n\n### Describe the bug\n\nThe moment i start my app, when the `app.vue` is inside the layer not the main folder, the imported `slugify` throws an error in the console.\r\n\r\n```\r\nSyntaxError: The requested module '/_nuxt/node_modules/slugify/slugify.js?v=a1686878' does not provide an export named 'default'\r\n```\n\n### Additional context\n\nThis only happens in dev mode.\r\n\r\nDo I have to somehow tell vite to optimize deps from this directory aswell?\n\n### Logs\n\n_No response_",[2018,2021,2024,2025,2028],{"name":2019,"color":2020},"good first issue","fbca04",{"name":2022,"color":2023},"dx","C39D69",{"name":1985,"color":1986},{"name":2026,"color":2027},"vite","3574D1",{"name":2029,"color":2030},"🍰 p2-nice-to-have","0E8A16",28631,"Default imports from layers on another directory fails","2024-11-19T11:52:04Z","https://github.com/nuxt/nuxt/issues/28631",0.69399947,{"description":2037,"labels":2038,"number":2042,"owner":1994,"repository":1995,"state":1996,"title":2043,"updated_at":2044,"url":2045,"score":2046},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.13.1\n- Nuxt Version: 3.16.0\n- CLI Version: 3.23.0\n- Nitro Version: 2.11.6\n- Package Manager: npm@11.1.0\n- Builder: -\n- User Config: app, build, colorMode, compatibilityDate, debug, devtools, future, hooks, i18n, icon, imports, modules, nitro, routeRules, runtimeConfig, security, ssr, sourcemap, css, telemetry, vite\n- Runtime Modules: @nuxt/eslint@1.2.0, @pinia/nuxt@0.10.1, @vueuse/nuxt@13.0.0, @nuxtjs/i18n@9.3.1, nuxt-security@2.2.0, @nuxt/ui@3.0.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/wonderful-violet-jrsqy9\n\n### Description\n\nI get a type error when using an array of strings for the `variant` key inside of `compoundVariants´:\n\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n primary: \"green\",\n neutral: \"slate\",\n },\n select: {\n compoundVariants: [\n {\n color: \"primary\",\n variant: [\"outline\", \"subtle\"],\n class: \"data-[state='open']:ring\",\n },\n ],\n },\n },\n});\n```\n\n```\napp/app.config.ts:11:11 - error TS2322: Type 'string[]' is not assignable to type 'string'.\n\n11 variant: [\"outline\", \"subtle\"],\n ~~~~~~~\n```\n\nIt does work tho, so its only a type issue I think.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2039,2040,2041],{"name":1985,"color":1986},{"name":2008,"color":2009},{"name":1991,"color":1992},3579,"Type error in app config `compoundVariants`","2025-03-16T14:04:52Z","https://github.com/nuxt/ui/issues/3579",0.7000929,{"description":2048,"labels":2049,"number":2052,"owner":1994,"repository":1995,"state":1996,"title":2053,"updated_at":2054,"url":2055,"score":2056},"### Environment\n\nDocumentation error.\n\n### Version\n\nv2.19.2\n\n### Reproduction\n\nNot applicable\n\n### Description\n\nUnder this [subheading](https://ui.nuxt.com/components/form#input-events), there is a link to a file [here](https://github.com/nuxt/ui/blob/dev/docs/components/content/examples/FormExampleElements.vue) but it does not have the key `validate-on` on any of the components. I believe that it should be there.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2050,2051],{"name":1985,"color":1986},{"name":1991,"color":1992},2812,"[docs] UForm's validate-on example is incorrect","2024-11-30T18:18:23Z","https://github.com/nuxt/ui/issues/2812",0.7004626,{"description":2058,"labels":2059,"number":2064,"owner":1994,"repository":1995,"state":2065,"title":2066,"updated_at":2067,"url":2068,"score":2069},"### Description\n\nIs there a way to prevent popovers from closing when clicking outside the popover?",[2060,2061,2063],{"name":2005,"color":2006},{"name":2062,"color":1992},"wontfix-v2",{"name":2008,"color":2009},2245,"closed","Popover close-prevented","2024-11-10T09:20:02Z","https://github.com/nuxt/ui/issues/2245",0.67139417,{"description":2071,"labels":2072,"number":2076,"owner":1994,"repository":2077,"state":2065,"title":2078,"updated_at":2079,"url":2080,"score":2081},"Hello,\r\n\r\nI'v been trying to use msw along with this module in order to mock requests. However, any component using $fetch or useFetch raises a FetchError when mounting.\r\nIs there anything I've been missing here? I know the msw examples using react polyfill the fetch function, but I don't know how to do it in a nuxt environment.\r\n\r\n```\r\n// app.nuxt.test.ts\r\nimport { test } from 'vitest'\r\nimport app from './app.vue'\r\nimport { mount } from '@vue/test-utils'\r\n\r\ntest('my test', () => {\r\n // setup({ server: true })\r\n // global.fetch = fetch\r\n // globalThis.fetch = fetch\r\n // await mount(app)\r\n mount(app)\r\n})\r\n```\r\n\r\n```\r\n// app.vue\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003CNuxtWelcome />\r\n \u003C/div>\r\n\u003C/template>\r\n\u003Cscript setup lang=\"ts\">\r\nconst test = await $fetch('https://google.com')\r\n\u003C/script>\r\n```\r\n\r\n\r\n\r\n",[2073],{"name":2074,"color":2075},"vitest-environment","b60205",557,"test-utils","_fetch is not a function","2023-12-02T00:22:09Z","https://github.com/nuxt/test-utils/issues/557",0.6758714,{"description":2083,"labels":2084,"number":2091,"owner":1994,"repository":2092,"state":2065,"title":2093,"updated_at":2094,"url":2095,"score":2096},"I've explored other font providers, looks like `fontsource` is also quite promising.\r\n\r\nCurrently most of its fonts are from Google Fonts, along with some icons and some other fonts. It's also the service that Cloudflare Fonts is fetching from.\r\n\r\n@danielroe Would you like to include this font provider? If so, I'd like to work on it.\r\n\r\nDocs: https://fontsource.org/docs",[2085,2088],{"name":2086,"color":2087},"enhancement","a2eeef",{"name":2089,"color":2090},"provider","1161A4",65,"fonts","feat: fontsource provider","2024-03-20T13:12:12Z","https://github.com/nuxt/fonts/issues/65",0.6859164,{"description":2098,"labels":2099,"number":2102,"owner":1994,"repository":2103,"state":2065,"title":2104,"updated_at":2105,"url":2106,"score":2107},"",[2100],{"name":2086,"color":2101},"1ad6ff",1384,"nuxt.com","[Home] Hide bots from contributors","2023-10-25T10:54:01Z","https://github.com/nuxt/nuxt.com/issues/1384",0.6925663,{"description":2109,"labels":2110,"number":2113,"owner":1994,"repository":1995,"state":2065,"title":2114,"updated_at":2115,"url":2116,"score":2117},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v20.10.0`\n- Nuxt Version: `3.14.159`\n- CLI Version: `3.15.0`\n- Nitro Version: `2.10.4`\n- Package Manager: `npm@10.9.0`\n- Builder: `-`\n- User Config: `default`\n- Runtime Modules: `@nuxt/ui@3.0.0-alpha.8`, `nuxt-svgo@4.0.9`\n- Build Modules: `-`\n\n### Version\n\nv3.0.0-alpha.8\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-h9x1yj\n\n### Description\n\nWhen using the vertical NavigationMenu, `defaultOpen` doesn't work...\n\n\"When orientation is vertical, a [Collapsible](https://ui3.nuxt.dev/components/collapsible) component is used to display children. You can control the open state of each item using the `open` and `defaultOpen` properties.\" - [link here](https://ui3.nuxt.dev/components/navigation-menu#orientation).\n\nPS I tried `open` as well: same issue.\n\n### Additional context\n\n```vue\n\u003Cscript setup lang=\"ts\">\n/* Types */\nimport type { NavigationMenuItem } from '#ui/types';\n\nconst items = ref\u003CNavigationMenuItem[][]>([\n [\n {\n label: 'Menu 1',\n defaultOpen: true, // ! This doesn't work\n open: true, // ! This doesn't work\n children: [\n {\n label: 'Submenu 1',\n to: '/submenu-1',\n },\n {\n label: 'Submenu 2',\n to: '/submenu-2',\n },\n ],\n },\n {\n label: 'Menu 2',\n defaultOpen: true, // ! This doesn't work\n open: true, // ! This doesn't work\n children: [\n {\n label: 'Submenu 1',\n to: '/submenu-1',\n },\n {\n label: 'Submenu 2',\n to: '/submenu-2',\n },\n ],\n },\n ],\n]);\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cdiv class=\"h-full\">\n \u003CUNavigationMenu orientation=\"vertical\" :items=\"items\" />\n \u003C/div>\n\u003C/template>\n```\n\n### Logs\n\n```shell-script\n\n```",[2111,2112],{"name":1985,"color":1986},{"name":2008,"color":2009},2755,"Veritcal NavigationMenu - `defaultOpen` doesn't work","2024-11-26T10:29:27Z","https://github.com/nuxt/ui/issues/2755",0.69593793,["Reactive",2119],{},["Set"],["ShallowReactive",2122],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"DBk9F9wxkjYdD6HpyYvqDqcfub_XlcRnBvmtbYK9LTE":-1},"/nuxt/ui/2237"]