\n\u003C/svg>`",[],382,"nuxt","icon","open","Some local SVGs cannot be loaded","2025-03-30T07:43:06Z","https://github.com/nuxt/icon/issues/382",0.73625946,{"description":3028,"labels":3029,"number":3036,"owner":3020,"repository":3037,"state":3038,"title":3039,"updated_at":3040,"url":3041,"score":3042},"### Description\n\nThe [documentation](https://ui.nuxt.com/components/date-picker) uses v-calendar as an example to create a date picker component. However, v-calendar is likely abandoned and will no longer be maintained (see https://github.com/nathanreyes/v-calendar/issues/1503 ) . Latest release was over a year ago.\n\nAlso, it has a dependency on a vulnerable lodash version ( see https://github.com/nathanreyes/v-calendar/issues/1420 ).\n\nWhat other alternatives are you planning on using in your documentation, or are there any other examples using a different library?\n\nThanks.",[3030,3033],{"name":3031,"color":3032},"question","d876e3",{"name":3034,"color":3035},"wontfix-v2","ffffff",3239,"ui","closed","DatePicker documentation uses library that's no longer maintained","2025-02-04T20:40:38Z","https://github.com/nuxt/ui/issues/3239",0.69718355,{"description":3044,"labels":3045,"number":3046,"owner":3020,"repository":3021,"state":3038,"title":3047,"updated_at":3048,"url":3049,"score":3050},"I have this kind of template:\n```\n \u003Cspan>\n \u003CIcon\n v-show=\"!searching\"\n name=\"i-heroicons-magnifying-glass-20-solid\" />\n \u003CIcon\n v-show=\"searching\"\n name=\"i-heroicons-arrow-path-20-solid\"\n class=\"animate-spin\"\n />\u003C/span>\n```\n\nSo, it should show `magnifying-glass` when not searching and `arrow-path` when searching. This does not work. Depending on if the view was loaded during navigation or page load it does not change or there a both. With `v-if` it works fine.\n\nHere is a reproduction with `nuxt-ui`:\nhttps://stackblitz.com/edit/nuxt-ui-7zcwsg?file=app.vue,package.json\n\nAnd here is a reproduction from `nuxt-icon-playground`:\nhttps://stackblitz.com/edit/nuxt-icon-playground-odkjmz?file=app.vue,package.json\n\nIt works with 1.7.6 but not 1.8.0 onwards. Could this be related to #300 ?\n\n---\n```\n❯ npx nuxt info\nWorking directory: /home/projects/nuxt-ui \nNuxt project info: \n\n------------------------------\n- Operating System: Linux\n- Node Version: v18.20.3\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@2.19.2\n- Build Modules: -\n------------------------------\n```\n",[],301,"Issue with v-show on icons in 1.8.1 or 1.8.0","2024-11-20T15:03:29Z","https://github.com/nuxt/icon/issues/301",0.70144516,{"description":3052,"labels":3053,"number":3058,"owner":3020,"repository":3037,"state":3038,"title":3059,"updated_at":3060,"url":3061,"score":3062},"### Description\n\nHi, \nI was removed due to a lack of 2fa, but I've remedied that. Can you please re-invite me to the UI-PRO repo?\n\nThank you!\nJim\n",[3054,3055],{"name":3031,"color":3032},{"name":3056,"color":3057},"v3","49DCB8",3887,"Can I get re-invited please? (ui-pro)","2025-04-14T14:02:03Z","https://github.com/nuxt/ui/issues/3887",0.7037437,{"description":3064,"labels":3065,"number":3072,"owner":3020,"repository":3073,"state":3038,"title":3074,"updated_at":3075,"url":3076,"score":3077},"Hello,\r\n\r\nI have problems using nuxt fonts with Adobe as Provider (and tailwind for css)\r\n\r\n----\r\n\r\nThis ist the font I want to use and what postman shows me for the correct names:\r\n\r\n```\r\n\"families\": [\r\n {\r\n \"id\": \"some id\",\r\n \"name\": \"DIN 2014\",\r\n \"slug\": \"din-2014\",\r\n \"css_names\": [\r\n \"din-2014\"\r\n ],\r\n \"css_stack\": \"\\\"din-2014\\\",sans-serif\",\r\n \"variations\": [\r\n \"n4\",\r\n \"n6\",\r\n \"n7\"\r\n ]\r\n }\r\n ]\r\n }\r\n```\r\n\r\n----\r\n\r\nThis is how my tailwind.config.ts looks:\r\n\r\n```\r\nfontFamily: {\r\n custom: ['din-2014', 'sans-serif'],\r\n},\r\n```\r\n\r\n\r\n\r\nThis is how my nuxt.config.ts looks:\r\n\r\n```\r\nfonts: {\r\n families: [{ name: 'din-2014', provider: 'adobe' }],\r\n adobe: {\r\n id: ['some id'],\r\n },\r\n defaults: {\r\n weights: [400],\r\n styles: ['normal', 'italic'],\r\n subsets: [\r\n 'cyrillic-ext',\r\n 'cyrillic',\r\n 'greek-ext',\r\n 'greek',\r\n 'vietnamese',\r\n 'latin-ext',\r\n 'latin',\r\n ],\r\n fallbacks: {\r\n monospace: ['Tahoma'],\r\n },\r\n },\r\n },\r\n```\r\n\r\n----\r\n\r\nI get this warning with the above code:\r\n\r\n\r\n\r\n----\r\n\r\nI also tried other names like: \"DIN 2014\" or \"Din 2014\", but it seems like the font does not get through to the frontend of my nuxt application. \r\n\r\nPS: If I use the adobe cdn link everything works fine\r\n\r\nThank you for the help!\r\n\r\nnewbie\r\n",[3066,3069],{"name":3067,"color":3068},"provider","1161A4",{"name":3070,"color":3071},"needs reproduction","C94E53",221,"fonts","Problems with Adobe as provider","2024-08-21T07:50:11Z","https://github.com/nuxt/fonts/issues/221",0.7048287,{"labels":3079,"number":3086,"owner":3020,"repository":3020,"state":3038,"title":3087,"updated_at":3088,"url":3089,"score":3090},[3080,3083],{"name":3081,"color":3082},"3.x","29bc7f",{"name":3084,"color":3085},"upstream","E8A36D",14327,"Font 404 error when loading css using vite","2023-01-19T17:33:48Z","https://github.com/nuxt/nuxt/issues/14327",0.7142709,{"description":3092,"labels":3093,"number":3097,"owner":3020,"repository":3020,"state":3038,"title":3098,"updated_at":3099,"url":3100,"score":3101},"So I built my project, and hit npm run build. The files appear in my dist folder, all bundled up. However, it doesn't work. When I try and upload the files to a server I get a bunch of 404 errors that none of the bundled files can be found.\r\n\r\nI don't understand if this has something to do with dynamic routes. For my project, all I did was make a new .vue file for each page. I don't think these are dynamic routes. I don't understand the documentation. You have to make a .vue file to define dynamic routes? or you put them in nuxt.config.js? \n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This question is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c761\">#c761\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3094],{"name":3095,"color":3096},"2.x","d4c5f9",890,"Static build does not work, assets not found 404","2023-01-18T15:39:55Z","https://github.com/nuxt/nuxt/issues/890",0.71862376,{"description":3103,"labels":3104,"number":3109,"owner":3020,"repository":3037,"state":3038,"title":3110,"updated_at":3111,"url":3112,"score":3113},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.15.1\n- Nuxt Version: 3.15.4\n- CLI Version: 3.21.1\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.7.0\n- Builder: -\n- User Config: compatibilityDate, devtools, colorMode, css, modules, supabase, app\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.12, @nuxtjs/supabase@1.4.6, @nuxt/image@1.9.0, @pinia/nuxt@0.10.1, pinia-plugin-persistedstate/nuxt@4.2.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.13\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/s7wlqy\n\n### Description\n\nThe UAlert component prop \"orientation\" does not work when set to horizontal. It stays in the default vertical mode in both my local env and the sandbox.\n\n### Additional context\n\n\n\nhttps://ui3.nuxt.dev/components/alert#orientation\n\n### Logs\n\n```shell-script\n\n```",[3105,3108],{"name":3106,"color":3107},"bug","d73a4a",{"name":3056,"color":3057},3370,"UAlert component orientation prop not working","2025-03-08T12:22:25Z","https://github.com/nuxt/ui/issues/3370",0.72017413,{"description":3115,"labels":3116,"number":3120,"owner":3020,"repository":3121,"state":3038,"title":3122,"updated_at":3123,"url":3124,"score":3125},"Try to remove the library by creating our own ui components.\n\n- UButton\n- USlideover\n- UContainer\n- UCard\n- UAvatar\n- UInput\n- UBadge\n- USelectCustom\n- UNotifications",[3117],{"name":3118,"color":3119},"pending","508997",1196,"nuxt.com","Remove nuxthq/ui","2023-02-15T12:31:16Z","https://github.com/nuxt/nuxt.com/issues/1196",0.72212833,{"description":3127,"labels":3128,"number":3131,"owner":3020,"repository":3037,"state":3038,"title":3132,"updated_at":3133,"url":3134,"score":3135},"### For what version of Nuxt UI are you asking this question?\n\nv3.0.0-alpha.x\n\n### Description\n\n### Environment\n\n* Operating System: Linux\n* Node Version: v20.15.1\n* Nuxt Version: 3.14.1592\n* Package Manager: npm@10.7.0\n* Nuxt UI: v3.0.0-alpha.x\n\n### Description\nHello, I have the following configurations; \n\n#### assets/css/main.css\n```css\n@import \"tailwindcss\";\n@import \"@nuxt/ui\";\n\n@theme {\n /* Font Family Extend */\n --font-display: 'Work Sans', sans-serif;\n --font-content: 'Roboto', sans-serif;\n --font-condensed: 'Roboto Condensed', sans-serif;\n\n\n /* Color Extend */\n --color-brand-50: #fef4ee;\n --color-brand-100: #fcdbc5;\n --color-brand-200: #facaae;\n --color-brand-300: #f6a57b;\n --color-brand-400: #f27545;\n --color-brand-500: #ee5221;\n --color-brand-600: #df3917;\n --color-brand-700: #b92915;\n --color-brand-800: #932219;\n --color-brand-900: #772017;\n --color-brand-950: #400d0a;\n}\n\n:root {\n --ui-primary: var(--color-brand-500);\n}\n```\n\nand my nuxt.config.ts file; \n```ts\nexport default defineNuxtConfig({\n // ....\n modules: ['@nuxt/ui', '@pinia/nuxt'],\n css: ['~/assets/css/main.css', '~/assets/scss/common.scss'],\n vite: {\n css: {\n preprocessorOptions: {\n scss: { api: 'modern-compiler' }\n }\n }\n },\n // ....\n});\n```\nWith the configurations defined as above when i set ssr:false in my nuxt.config.ts, my custom color called 'brand' is not applied to components and the default green is used from the tailwind. With ssr: true everything is ok with `npm run dev`. I also tried to set the color 'brand' in app.config.ts \n\n```ts\nexport default defineAppConfig({\n ui:{\n colors: {\n primary: 'brand'\n }\n }\n});\n``` \nwith this setting again everything works but this time ts complains about `Type '\"brand\"' is not assignable to type 'Color | undefined'.ts(2322)`. \n\nI did not find a true way to set colors from extended tailwindcss color palette. Thanks in advance for any help.\n\n\nThe following screenshot; ssr: false and primary color defined on ```:root {}``` \n\n\n\nThe following screenshot; ssr: true and primary color defined on ```:root {}``` \n\n\n\n\n \nThe following screenshot; ssr: false and primary color defined on 'appconfig' but this time I have the following error from ts\n\n\n\n\n\n\nEdit 1: \n> [!IMPORTANT]\n> I also tried to extend on a types/colors.d.ts file the `tailwindcss/colors` namespace to add my custom color but no chance\n\n```ts\nimport colors from 'tailwindcss/colors'\n\n\ndeclare module 'tailwindcss/colors' {\n const colors = colors | 'brand'\n export default colors;\n}\n```\n\n",[3129,3130],{"name":3031,"color":3032},{"name":3056,"color":3057},2869,"Use a custom color instead of the predefined Tailwind colors with ssr false","2024-12-16T09:47:16Z","https://github.com/nuxt/ui/issues/2869",0.7221298,["Reactive",3137],{},["Set"],["ShallowReactive",3140],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fZBIbtwjNgWiOy5Q4h5kFleLxnd4Sk2BnnVMUMNtqIEo":-1},"/nuxt/scripts/440"]