\n\n### Additional context\n\n I pulled nuxtui and ran and checked playground carousel - dot buttons have `data-state` attribute tho.\n\n### Logs\n\n```shell-script\n\n```",[2915,2918,2921],{"name":2916,"color":2917},"bug","d73a4a",{"name":2919,"color":2920},"v3","49DCB8",{"name":2922,"color":2923},"triage","ffffff",4312,"ui","closed","Can't customize active state of UCarousel dot","2025-06-08T19:55:49Z","https://github.com/nuxt/ui/issues/4312",0.6994133,{"description":2932,"labels":2933,"number":2934,"owner":2905,"repository":2906,"state":2926,"title":2935,"updated_at":2936,"url":2937,"score":2938},"`\u003CIcon name=\"uil:github\" color=\"red\" />`\r\nreturns\r\n\r\n**App.config.ts**\r\n```\r\n// https://github.com/nuxt-modules/icon#configuration-%EF%B8%8F\r\nexport default defineAppConfig({\r\n icon: {\r\n size: \"300%\", // default \u003CIcon> size applied\r\n class: \"icon\", // default \u003CIcon> class applied\r\n mode: \"css\", // svg || css\r\n aliases: {\r\n nuxt: \"logos:nuxt-icon\",\r\n },\r\n },\r\n})\r\n```\r\n",[],176,"Add universal support for color attribute (similar to CSS icons)","2024-07-15T16:06:31Z","https://github.com/nuxt/icon/issues/176",0.71964586,{"description":2940,"labels":2941,"number":2945,"owner":2905,"repository":2925,"state":2926,"title":2946,"updated_at":2947,"url":2948,"score":2949},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.11.0\n- Nuxt Version: 3.16.2\n- CLI Version: 3.25.0\n- Nitro Version: 2.11.9\n- Package Manager: npm@10.9.0\n- Builder: -\n- User Config: devtools, modules, runtimeConfig, app, css, ui, icon, i18n, future, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.1.0, @nuxt/eslint@1.3.0, @nuxtjs/device@3.2.4, @nuxtjs/i18n@9.5.3, @pinia/nuxt@0.11.0, @vueuse/nuxt@13.1.0, nuxt-lodash@2.5.3\n- Build Modules: -\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.1.0\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/vigorous-cerf-pnrc3g\n\n// app.config.ts\nexport default defineAppConfig({\n ui: {\n colors: {\n primary: 'emerald',\n neutral: 'zinc',\n red: 'red',\n orange: 'orange',\n yellow: 'yellow',\n green: 'green',\n blue: 'blue',\n purple: 'purple',\n gray: 'gray',\n },\n }\n}\n\n// nuxt.config.ts\n\nui: {\n theme: {\n colors: [ 'primary', 'secondary', 'success', 'info', 'warning', 'error', 'red', 'orange', 'yellow', 'green', 'blue', 'purple', 'gray' ],\n },\n },\n\n### Description\n\nYesterday everything was working fine, no code was changed, after the upgrade it broke.\nFor example:\n```html\n\u003Cdiv class=\"bg-(--ui-orange)\">\n```\nOr\n```html\n\u003Cdiv class=\"bg-orange\">\n```\nBoth not work\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2942,2943,2944],{"name":2916,"color":2917},{"name":2919,"color":2920},{"name":2922,"color":2923},3977,"Extend colors not work after update to v3.1","2025-04-28T10:40:09Z","https://github.com/nuxt/ui/issues/3977",0.7205476,{"description":2951,"labels":2952,"number":2959,"owner":2905,"repository":2925,"state":2926,"title":2960,"updated_at":2961,"url":2962,"score":2963},"### Environment\r\n\r\n- Operating System: Windows_NT\r\n- Node Version: v18.18.2\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: npm@9.8.1\r\n- Builder: -\r\n- User Config: extends, devtools, colorMode, modules, piniaPersistedstate, eslint\r\n- Runtime Modules: @nuxt/ui@2.16.0, @nuxt/eslint@0.3.12, @nuxtjs/device@3.1.1, @pinia/nuxt@0.5.1, @pinia-plugin-persistedstate/nuxt@1.2.0\r\n- Build Modules: -\r\n\r\n### Version\r\n\r\nv2.16.0\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-gaqntm?file=app.vue\r\n\r\n### Description\r\n\r\nI use a `pinia` store to save settings and `persist` those settings using `pinia-plugin-persistedstate` and `localStorage` as storage. Everything works great, `URadioGroup` and `URadio` are correctly updated when I refresh the page. But `UToggle` isn't, although the value of `modelValue` is correct when I print it on screen. \r\n\r\n- UToggle is not updated when v-model is set from pinia store\r\n- UToggle is correctly set when v-model is from local variable\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2953,2954,2957],{"name":2916,"color":2917},{"name":2955,"color":2956},"closed-by-bot","ededed",{"name":2958,"color":2956},"stale",1792,"UToggle is not getting rerendered when v-model is getting from pinia store","2025-06-19T02:12:32Z","https://github.com/nuxt/ui/issues/1792",0.722754,{"description":2965,"labels":2966,"number":2971,"owner":2905,"repository":2925,"state":2926,"title":2972,"updated_at":2973,"url":2974,"score":2975},"### 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```",[2967,2968,2969,2970],{"name":2916,"color":2917},{"name":2922,"color":2923},{"name":2955,"color":2956},{"name":2958,"color":2956},2860,"[UButton] Using a custom color on the link variant causes an error","2025-06-18T09:05:19Z","https://github.com/nuxt/ui/issues/2860",0.7318509,{"description":2977,"labels":2978,"number":2979,"owner":2905,"repository":2906,"state":2926,"title":2980,"updated_at":2981,"url":2982,"score":2983},"When installing nuxt/ui with compatibility version 4 adding the ui module keep running into this issue which looks like an issue with nuxt icon instead of nuxt ui. Verified by just installing icon and using it.\n\n`pnpm add -D @nuxt/ui` or `pnpm add -D @nuxt/icon`\n\n```\n// nuxt.config\nfuture: {\n compatibilityVersion: 4,\n},\nmodules: ['@nuxt/ui'], // or ['@nuxt/icon']\n```\n\n```\n[nitro 9:03:17 PM] ERROR RollupError: ../../node_modules/.pnpm/@nuxt+icon@1.10.3_magicast@0.3.5_rollup@4.32.0_vite@6.0.11_@types+node@22.10.10_jiti@2.4.2_te_l2cj2dwsj5nl24pd2nyhg23hta/node_modules/@nuxt/icon/dist/runtime/server/api.js (6:9): \"useAppConfig\" is not exported by \"virtual:#imports\", imported by \"../../node_modules/.pnpm/@nuxt+icon@1.10.3_magicast@0.3.5_rollup@4.32.0_vite@6.0.11_@types+node@22.10.10_jiti@2.4.2_te_l2cj2dwsj5nl24pd2nyhg23hta/node_modules/@nuxt/icon/dist/runtime/server/api.js\".\n\n\n4: import { createError, getQuery } from \"h3\";\n5: import { consola } from \"consola\";\n6: import { useAppConfig, getRequestURL, defineCachedEventHandler } from \"#imports\";\n ^\n7: import { collections } from \"#nuxt-icon-server-bundle\";\n8: const warnOnceSet = /* @__PURE__ */ new Set();\n```",[],345,"Nuxt compatibilityVersion 4 error","2025-01-26T20:39:32Z","https://github.com/nuxt/icon/issues/345",0.732448,{"description":2985,"labels":2986,"number":2987,"owner":2905,"repository":2906,"state":2926,"title":2988,"updated_at":2989,"url":2990,"score":2991},"The following code snippet from nuxt-icon.svg is breaking SVG by rendering them all black.\r\n\r\n`&.nuxt-icon--fill, \r\n&.nuxt-icon--fill * { \r\n fill: currentColor; \r\n}`\r\n\r\nThe following bug is happening when using svg with nuxt-svgo module. For some reason, some of the svg get the class nuxt-icon--fill attach to them even though they are not rendered using nuxt-icon.",[],106,"fill propery is breaking SVGs","2024-08-28T10:17:14Z","https://github.com/nuxt/icon/issues/106",0.73257744,{"description":2993,"labels":2994,"number":3004,"owner":2905,"repository":2905,"state":2926,"title":3005,"updated_at":3006,"url":3007,"score":3008},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v16.14.2\r\n- Nuxt Version: 3.6.5\r\n- Nitro Version: 2.5.2\r\n- Package Manager: yarn@3.2.0\r\n- Builder: vite\r\n- User Config: alias, app, components, css, devtools, experimental, extends, i18n, modules, nitro, pinia, router, runtimeConfig, tailwindcss, telemetry, veeValidate, vite, vue\r\n- Runtime Modules: @pinia/nuxt@^0.4.11, @nuxtjs/stylelint-module@^5.1.0, @nuxtjs/i18n@8.0.0-beta.13, @vueuse/nuxt@10.2.1, @vee-validate/nuxt@^4.9.6, @nuxtjs/tailwindcss@^6.8.0\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\nI provide a minimal reproduction\r\n\r\nhttps://stackblitz.com/edit/github-brcyvh?file=pages%2Findex.vue\r\n\r\n### Describe the bug\r\n\r\nI'm using a plugin `$bp` that use `useBreakpoints` from `vueuse` under the hood https://vueuse.org/core/useBreakpoints\r\n\r\nMy goal is to change the `size` of the component `NButton` based on a boolean : `$bp.isLapM`.\r\n\r\nWhen we refresh the page, we see that the `btnSize` inside the button is updated but the class still `-sm`.\r\nIf I resize my window, both are updated\r\n\r\nWe are migrating our app to Nuxt 3, and on Nuxt 2 we didn't have this issue... :cry: \r\n\r\nI'm a doing something wrong about this ? \r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[2995,2998,3001],{"name":2996,"color":2997},"3.x","29bc7f",{"name":2999,"color":3000},"pending triage","E99695",{"name":3002,"color":3003},"upstream","E8A36D",22722,"class / style attribute does not update on node mismatch","2023-08-23T10:38:59Z","https://github.com/nuxt/nuxt/issues/22722",0.73261917,{"description":3010,"labels":3011,"number":3017,"owner":2905,"repository":2925,"state":2926,"title":3018,"updated_at":3019,"url":3020,"score":3021},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.14.0\n- Nuxt Version: 3.16.0\n- CLI Version: 3.22.5\n- Nitro Version: 2.11.6\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: devtools, modules, components, css, compatibilityDate\n- Runtime Modules: @nuxt/ui@3.0.0, @pinia/nuxt@0.10.1, compodium@0.1.0-beta.5\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\n```vue\n\u003CUCard variant=\"subtle\">\n \u003CUTable \n :data=\"data\"\n :columns=\"columns\"\n />\n\u003C/UCard>\n```\n\n### Description\n\nIf using a UTable component on a background that isn't the default neutral color the bg-color of the thead is visible.\n\n\n\n\n\n_A little bit easier to see with white Background_\n\n\n\n\nMaybe this is a wanted behavior. So if so please ignore and close the issue.\nI know sometimes you want a background color in the headlines. But sometimes you don't want them.\nAnyways if this is a wanted behavior, then maybe this issue will help those who don't want a background color and are looking for a solution.\n\n### Additional context\n\nCould be fixed by adding:\n```vue\n:ui=\"{\n thead: 'bg-unset'\n}\"\n```\nto the `\u003CUTable>` tag\n\n\n\n### Logs\n\n```shell-script\n-\n```",[3012,3013,3014,3015,3016],{"name":2916,"color":2917},{"name":2919,"color":2920},{"name":2922,"color":2923},{"name":2955,"color":2956},{"name":2958,"color":2956},3607,"Background-Color for UTable","2025-06-18T09:01:26Z","https://github.com/nuxt/ui/issues/3607",0.7328292,["Reactive",3023],{},["Set"],["ShallowReactive",3026],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fEvZTeg3fLE_eu7cA7gQACjOso9i8tDI9_l9FtCOvhXs":-1},"/nuxt/ui/2013"]