\n```\n\nsame result is expected when using `active`, but `leadingIcon` is ignored\n```\n\u003CUButton\n label=\"Label\"\n active\n active-color=\"primary\"\n active-variant=\"soft\"\n icon=\"mdi-account\"\n @click.prevent=\"active = !active\"\n/>\n```\n\n### Additional context\n\n\u003Cimg width=\"202\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/0756fb1c-772c-44ae-855d-90aba304bd9e\" />",[2887,2890,2891],{"name":2888,"color":2889},"bug","d73a4a",{"name":2871,"color":2872},{"name":2892,"color":2893},"triage","ffffff",3972,"Different result than static for active-color & active-variant","2025-04-24T15:30:39Z","https://github.com/nuxt/ui/issues/3972",0.7598781,{"description":2900,"labels":2901,"number":2906,"owner":2877,"repository":2878,"state":2879,"title":2907,"updated_at":2908,"url":2909,"score":2910},"### For what version of Nuxt UI are you suggesting this?\n\nv2.x\n\n### Description\n\nIt would be great if there was an option for eager validation if there are errors present on the group.\n\nFor example, when initially filling out the field you don't want eager validation as it's distracting when you aren't finished typing.\n\nHowever if you tab away and there's an error, when fixing the error you'd want immediate feedback with eager-validation.\n\nSo I propose a new prop: `eager-validation-on-error=\"true\"` to improve the UX of forms.\n\nThanks!\n\n### Additional context\n\n_No response_",[2902,2905],{"name":2903,"color":2904},"enhancement","a2eeef",{"name":2871,"color":2872},2599,"FormGroup eager-validation when errors exist","2024-11-22T14:20:31Z","https://github.com/nuxt/ui/issues/2599",0.79258305,{"description":2912,"labels":2913,"number":2916,"owner":2877,"repository":2878,"state":2879,"title":2917,"updated_at":2918,"url":2919,"score":2920},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.9.0\n- Nuxt Version: 3.14.1592\n- CLI Version: 3.15.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@2.19.2, nuxt-svgo@4.0.9, @pinia/nuxt@0.9.0, pinia-plugin-persistedstate/nuxt, @nuxtjs/i18n@9.1.0, nuxt-jsonld@2.1.0, @nuxtjs/robots@5.0.0, nuxt-gtag@3.0.2, @sentry/nuxt/module@8.42.0, nuxt-time@1.0.3, @nuxt/eslint@0.7.2\n- Build Modules: -\n\n\n### Version\n\nv2.19.2\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-ncxoznzw\n\n### Description\n\nIf you define your own color for tailwinds, and attempt to use it on a UButton component with the link variant, it will not work and give the following error:\n\n```\n500\nvariant?.replaceAll is not a function\n\nat ComputedRefImpl.fn (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@nuxt+ui@2.19.2_vite@6.0.3_vue@3.5.13/node_modules/@nuxt/ui/dist/runtime/components/elements/Button.js:142:18)\nat refreshComputed (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+reactivity@3.5.13/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js?v=177a248a:353:29)\nat get value (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+reactivity@3.5.13/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js?v=177a248a:1558:5)\nat unref (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+reactivity@3.5.13/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js?v=177a248a:1431:29)\nat Object.get (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+reactivity@3.5.13/node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js?v=177a248a:1437:64)\nat Object.get (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+runtime-core@3.5.13/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=177a248a:3099:26)\nat Proxy._sfc_render (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@nuxt+ui@2.19.2_vite@6.0.3_vue@3.5.13/node_modules/@nuxt/ui/dist/runtime/components/elements/Button.js:199:17)\nat renderComponentRoot (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+runtime-core@3.5.13/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=177a248a:6521:16)\nat hydrateSubTree (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+runtime-core@3.5.13/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=177a248a:5309:32)\nat ReactiveEffect.componentUpdateFn [as fn] (https://nuxtui-0mn3--3000--fc837ba8.local-credentialless.webcontainer.io/_nuxt/node_modules/.pnpm/@vue+runtime-core@3.5.13/node_modules/@vue/runtime-core/dist/runtime-core.esm-bundler.js?v=177a248a:5334:13)\n```\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2914,2915],{"name":2888,"color":2889},{"name":2892,"color":2893},2860,"[UButton] Using a custom color on the link variant causes an error","2025-02-06T03:16:14Z","https://github.com/nuxt/ui/issues/2860",0.8010818,{"description":2922,"labels":2923,"number":2926,"owner":2877,"repository":2878,"state":2927,"title":2928,"updated_at":2929,"url":2930,"score":2931},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.11.1\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.11.0\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8, @nuxtjs/html-validator@1.8.2, @nuxt/image@1.8.1, @nuxt/eslint@0.6.1, @nuxtjs/seo@2.0.0-rc.23\n- Build Modules: -\n------------------------------\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n\"@nuxt/ui\": \"3.0.0-alpha.8\",\n\n### Reproduction\n\n\u003C!-- layouts/default.vue -->\n\u003Ctemplate>\n \u003Cdiv class=\"container mx-auto\">\n \u003Cu-breadcrumb :items=\"items \" />\n \u003Cslot>\u003C/slot>\n \u003C/div>\n\u003C/template>\n\n\n\u003Cscript lang=\"ts\" setup>\nimport { useRoute } from 'vue-router';\n\nconst route = useRoute();\nconst items = useBreadcrumbItems({\n schemaOrg: true,\n});\n\u003C/script>\n\n\n### Description\n\nthis will render the breadcrumbs in a \u003Cdiv> with an aria-label, which is a violation of this rule: https://html-validate.org/rules/aria-label-misuse.html\n\n- Rule ID: aria-label-misuse\n- Category: Accessibility\n- Standards: WCAG 2.2 (A)WCAG 2.1 (A)WCAG 2.0 (A)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n ERROR HTML validation errors found for /song/justice-genesis-1\n\ninline\n 129:21990 error \"aria-label\" cannot be used on this element aria-label-misuse\n\n✖ 1 problem (1 error, 0 warnings)\n\nMore information:\n https://html-validate.org/rules/aria-label-misuse.html\n\n```",[2924,2925],{"name":2888,"color":2889},{"name":2871,"color":2872},2649,"closed","breadcrumb HTML validation errors","2024-11-15T08:53:33Z","https://github.com/nuxt/ui/issues/2649",0.7349694,{"description":2933,"labels":2934,"number":2935,"owner":2877,"repository":2936,"state":2927,"title":2937,"updated_at":2938,"url":2939,"score":2940},"- [x] Colors & Fonts\n- [x] Landing page (Home)\n- [x] Showcase categories/hero\n- [x] Modules categories/hero\n- [x] Blog categories/hero\n- [x] Support hero/content",[],1305,"nuxt.com","Marketing Update","2023-07-04T10:00:31Z","https://github.com/nuxt/nuxt.com/issues/1305",0.7352126,{"description":2942,"labels":2943,"number":2947,"owner":2877,"repository":2878,"state":2927,"title":2948,"updated_at":2949,"url":2950,"score":2951},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.11.0\n- Nuxt Version: 3.16.0\n- CLI Version: 3.22.5\n- Nitro Version: 2.11.6\n- Package Manager: pnpm@10.2.1\n- Builder: -\n- User Config: devtools, modules, css, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.0, @nuxt/eslint@1.2.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.16.0\n\n### Reproduction\n\nhttps://github.com/deetz99/ui3-layer-test\n\n**Nuxt UI 2 working as expected**\nhttps://github.com/deetz99/ui2-layer-test\n\n### Description\n\nTailwind classes aren't resolved when using layers.\n\nAs seen in the repro, when using `pnpm dev` to run the .playground, the header, footer and layout styles are missing. \n\nUButton is still rendered correctly with the custom blue in the layer main.css file.\n\n`npx nuxi dev` (run the layer) renders the header, footer and layout correctly.\n\nAm I missing something here?\n\n## pnpm dev\n\n\u003Cimg width=\"1720\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/245bae83-2c86-42d1-a883-e472da30e6f7\" />\n\n## npx nuxi dev\n\n\u003Cimg width=\"1717\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/c362da21-f5f9-4c7d-a91c-f60bf6de9c0b\" />\n\n### Additional context\n\nThe classes are recognized in the .playground it seems. If I redefine the header, footer and layout in the playground they are displayed correctly. \n\n[header/footer/layout added to .playground](https://github.com/deetz99/ui3-layer-test/tree/test)\n\nIt seems that the styles aren't applied to the components that come from the layer.\n\n### Logs\n\n```shell-script\n\n```",[2944,2945,2946],{"name":2888,"color":2889},{"name":2871,"color":2872},{"name":2892,"color":2893},3544,"Tailwind classes missing when using layers","2025-03-14T19:00:15Z","https://github.com/nuxt/ui/issues/3544",0.7780295,{"description":2953,"labels":2954,"number":2959,"owner":2877,"repository":2878,"state":2927,"title":2960,"updated_at":2961,"url":2962,"score":2963},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.20.3\r\n- Nuxt Version: 3.13.2\r\n- CLI Version: 3.13.2\r\n- Nitro Version: 2.9.7\r\n- Package Manager: pnpm@8.15.6\r\n- Builder: -\r\n- User Config: modules, typescript\r\n- Runtime Modules: @nuxt/ui@2.18.6\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Version\r\n\r\n2.18.6\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/nuxt-ui-itcrga?file=app.config.ts\r\n\r\n> Type '\"white\"' is not assignable to type '\"primary\"'. ts(2322)\r\n\r\n### Description\r\n\r\n`primary` is the only possible value for colours in the default config of a lot of components. Issue appeared with 2.18.x\r\nAlso noticed a similar issue on other configs, like `variant` for buttons\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2955,2956],{"name":2888,"color":2889},{"name":2957,"color":2958},"duplicate","cfd3d7",2241,"Type issue with colors/variant in app.config.ts","2024-10-06T18:03:19Z","https://github.com/nuxt/ui/issues/2241",0.7783929,{"description":2965,"labels":2966,"number":2969,"owner":2877,"repository":2878,"state":2927,"title":2970,"updated_at":2971,"url":2972,"score":2973},"### Environment\n\nOperating System: `Darwin`\nNode Version: `v22.11.0`\nNuxt Version: `3.14.1592`\nCLI Version: `3.16.0`\nNitro Version: `2.10.4`\nPackage Manager: `npm@10.9.0`\nBuilder: -\nUser Config: `default`\nRuntime Modules: `@nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.2, @nuxt/image@1.8.1`\nBuild Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.9\n\n### Reproduction\n\nhttps://github.com/makvv4/nuxtui3-avatar-bug-reproduction\n\n### Description\n\nIn the markup we see the correct link to the image, but in the avatar component only a fallback is displayed.\nIn the Network tab, you can see that there are multiple requests made at the same time: one with the correct link, and another request links to the localhost.\n\nThe provider is located in `/providers/my-img-provider.ts`\nAnd config looks like:\n```javascript\nexport default defineNuxtConfig({\n devtools: { enabled: true },\n modules: ['@nuxt/ui', '@nuxt/eslint', '@nuxt/image'],\n css: ['~/assets/css/main.css'],\n\n future: {\n compatibilityVersion: 4,\n },\n\n compatibilityDate: '2024-11-27',\n\n image: {\n providers: {\n myImgProvider: {\n provider: '~~/providers/my-img-provider.ts',\n },\n },\n provider: 'myImgProvider',\n },\n})\n```\n\n### Additional context\n\n\n\n\n\n\n\n\n\n### Logs\n\n```shell-script\n\n```",[2967,2968],{"name":2888,"color":2889},{"name":2871,"color":2872},2857,"[v3][UAvatar] `UAvatar` breaks when using `@nuxt/image` with custom provider","2025-01-11T15:14:06Z","https://github.com/nuxt/ui/issues/2857",0.77941126,{"description":2975,"labels":2976,"number":2981,"owner":2877,"repository":2878,"state":2927,"title":2982,"updated_at":2983,"url":2984,"score":2985},"### Environment\n\n```\nNuxt project info: 4:16:28 PM\n\n------------------------------\n- Operating System: Linux\n- Node Version: v20.14.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@8.8.0\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@2.19.2, @nuxt/eslint@0.3.13, @nuxt/test-utils/module@3.14.4, @pinia/nuxt@0.5.5, @vueuse/nuxt@10.11.1, nuxt-shiki@0.3.0, nuxt-svgo@4.0.8\n- Build Modules: -\n------------------------------\n```\n\n### Version\n\nv2.19.2\n\n### Reproduction\n\nI don't know how to reproduce it unfortunately.\n\n### Description\n\nI often have a bunch of `[Icon] loading icon `heroicons:magnifying-glass` timed out after 500ms` on firefox\n\n\n\nit impacts the breadcrumb component\n\nbut also other `\u003CUIcon>` instances\n\nDo you have any idea about where those timeouts maybe coming from \n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2977,2978],{"name":2888,"color":2889},{"name":2979,"color":2980},"upstream","78bddb",2573,"Icon timeout despite having installed the @iconify-json/heroicons collection","2024-11-08T16:41:20Z","https://github.com/nuxt/ui/issues/2573",0.78391075,["Reactive",2987],{},["Set"],["ShallowReactive",2990],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$ftcNor1HFeFBj2ptDDwRgFutA_aASyvX7eMUuMYRWAEw":-1},"/nuxt/nuxt.com/1124"]