`\n\nit doesn't work that way\n\nI really ask for help!",[1984,1987],{"name":1985,"color":1986},"question","d876e3",{"name":1988,"color":1989},"v3","49DCB8",3098,"nuxt","ui","open","Table filtered, sorting fetch","2025-01-14T11:05:37Z","https://github.com/nuxt/ui/issues/3098",0.6624905,{"description":1999,"labels":2000,"number":2003,"owner":1991,"repository":1992,"state":1993,"title":2004,"updated_at":2005,"url":2006,"score":2007},"### Description\n\nCurrently, when I use `UAvatar` and the user's photo returns a 404, it generates an `\u003Cimg>` with the broken image icon:\n\n\nIs there a way to make the image that returns 404 display text from the alt instead?\nIn the documentation it says:\n>When no icon or text is provided, the initials of the `alt` prop are used as fallback\n\nCan `alt` also be used as a fallback when the image is broken?\n\n\n\nExample:\n\n",[2001,2002],{"name":1985,"color":1986},{"name":1988,"color":1989},3809,"[UAvatar] If the image does not exist, return text","2025-04-06T16:07:33Z","https://github.com/nuxt/ui/issues/3809",0.6643742,{"description":2009,"labels":2010,"number":2013,"owner":1991,"repository":1992,"state":1993,"title":2014,"updated_at":2015,"url":2016,"score":2017},"### Description\n\nHi, is there currently a way or planed feature to animate the tr that gets expanded?\nAtm it just pops in and isnt a great ux.\n\nhttps://ui3.nuxt.dev/components/table#with-expandable-rows",[2011,2012],{"name":1985,"color":1986},{"name":1988,"color":1989},3305,"UTable tr expand animation","2025-02-13T05:50:31Z","https://github.com/nuxt/ui/issues/3305",0.67135036,{"description":2019,"labels":2020,"number":2028,"owner":1991,"repository":1992,"state":1993,"title":2029,"updated_at":2030,"url":2031,"score":2032},"### Description\n\nWhen adding `UButton` component with `ghost` or `link` variant inside a `UBanner` with `links` attribute, they remain displayed in black text, even if the banner has a dark background (e.g., primary color). Unlike the Banner close button, which has specific Tailwind classes that adapt it to dark mode (white text), these elements do not automatically adjust their colors.\n\n\n\n```html\n \u003CUBanner to=\"/guide-gouvernance-associative-crise\" icon=\"i-ph-books-duotone\" title=\"Guide Gouvernance Associative\" :actions=\"[{label: 'Lire le guide', to: '/guide-gouvernance-associative-crise', variant: 'ghost', size: 'md', trailingIcon: 'i-ph-arrow-right'}, {label: 'Lire le guide', to: '/guide-gouvernance-associative-crise', variant: 'link', size: 'md'}]\" close />\n```\n\nWould it be relevant to add a global attribute to components like Button, Badge, etc., to force their appearance in dark (or light) mode, regardless of the global setting? This would ensure better visual consistency when these elements are placed on a colored background (e.g., `UPageCTA` with `solid` variant).\n\n### Additional context\n\n_No response_",[2021,2024,2025],{"name":2022,"color":2023},"enhancement","a2eeef",{"name":1988,"color":1989},{"name":2026,"color":2027},"triage","ffffff",3307,"Better handling of `UButton`, `UBadge`, … colors on colored backgrounds","2025-02-13T19:05:27Z","https://github.com/nuxt/ui/issues/3307",0.67496264,{"description":2034,"labels":2035,"number":2040,"owner":1991,"repository":1992,"state":2041,"title":2042,"updated_at":2043,"url":2044,"score":2045},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.4.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.13.2\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.8\n\n### Reproduction\n\n-\n\n### Description\n\nDefault classes of container in [docs](https://ui3.nuxt.dev/components/container#theme) is:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\n**But no one of classes except `mx-auto` is not was created.**\nI change `--ui-container` variable like in [docs](https://ui3.nuxt.dev/getting-started/theme#container):\n```css\n/** app.css */\n\n@import 'tailwindcss';\n@import '@nuxt/ui';\n\n@theme {\n --container-xl: 1280px;\n}\n\n:root {\n --ui-container: var(--container-xl);\n}\n```\nAs result, container classes is `max-w-7xl mx-auto px-4 sm:px-6 lg:px-8` and still not was created, except `mx-auto`.\n\nBut if i create `app.config.ts`:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\nAll is ok, width and other classes are created and applying.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2036,2039],{"name":2037,"color":2038},"bug","d73a4a",{"name":1988,"color":1989},2655,"closed","Classes of container component are not working properly","2024-11-16T13:13:33Z","https://github.com/nuxt/ui/issues/2655",0.65364254,{"description":2047,"labels":2048,"number":2051,"owner":1991,"repository":1992,"state":2041,"title":2052,"updated_at":2053,"url":2054,"score":2055},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.10.0\n- Nuxt Version: 3.15.0\n- CLI Version: 3.17.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.15.1\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.9, @nuxt/eslint@0.7.4\n- Build Modules: -\n------------------------------\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.10\n\n### Reproduction\n\nhttps://github.com/Cyanhall/nuxt-ui-v3-demo/tree/main/demo4\n\n### Description\n\nThe button styles in UModal body should not be affected by UButtonGroup. I'm not sure if this is a bug or a feature.\n\n\n```vue\n\u003Ctemplate>\n \u003CUButtonGroup>\n \u003CUModal\n :close=\"true\"\n v-model:open=\"open\"\n title=\"Test\"\n >\n \u003CUButton\n variant=\"outline\"\n color=\"neutral\"\n @click=\"open = true\"\n >\n Modal Button\n \u003C/UButton>\n \u003Ctemplate #body>\n Body\n \u003C/template>\n \u003Ctemplate #footer>\n \u003Cdiv class=\"flex justify-start w-full gap-4\">\n \u003CUButton\n variant=\"outline\"\n class=\"rounded\"\n label=\"Cancel\"\n @click=\"open = false\"\n />\n \u003CUButton\n variant=\"outline\"\n class=\"rounded\"\n label=\"Middle\"\n @click=\"open = false\"\n />\n \u003CUButton\n type=\"submit\"\n class=\"rounded\"\n label=\"Confirm\"\n color=\"primary\"\n @click=\"open = false\"\n />\n \u003C/div>\n \u003C/template>\n \u003C/UModal>\n \u003CUButton\n variant=\"outline\"\n color=\"neutral\"\n @click=\"\"\n >\n Other Button\n \u003C/UButton>\n \u003C/UButtonGroup>\n\u003C/template>\n```\n\n\u003Cimg width=\"362\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/da66f0d8-fc42-45a5-b1e1-d7214468b24a\" />\n\n\u003Cbr>\n\n\u003Cimg width=\"543\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/a50767ec-bea5-4c88-9b45-963f8e81e5df\" />\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2049,2050],{"name":2037,"color":2038},{"name":1988,"color":1989},2978,"The button styles in UModal body should not be affected by UButtonGroup.","2025-02-07T15:32:58Z","https://github.com/nuxt/ui/issues/2978",0.6667413,{"description":2057,"labels":2058,"number":2065,"owner":1991,"repository":1992,"state":2041,"title":2066,"updated_at":2067,"url":2068,"score":2069},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.13.0\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.7\n- Package Manager: npm@10.9.2\n- Builder: -\n- User Config: modules, compatibilityDate, devtools, css, ui, devServer, future, telemetry, hooks, eslint\n- Runtime Modules: @nuxt/eslint@0.6.2, @nuxt/ui-pro@3.0.1, nuxt-jsonld@2.1.0, @pinia/nuxt@0.10.1\n- Build Modules: -\n\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nNuxt v3.16.1\nui-pro v3.0.1\n\n### Reproduction\n\nWhen I add the following to my nuxt.config.ts:\n\n```ts\n{\n ui: {\n colorMode: false\n }\n}\n```\n\n...then `npx nuxi typecheck` fails with 8 errors.\n\n```\n[...snip]\nnode_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeButton.vue:18:24 - error TS2305: Module '\"#imports\"' has no exported member 'useColorMode'.\n\n18 import { useAppConfig, useColorMode } from '#imports'\n ~~~~~~~~~~~~\n\nnode_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeSelect.vue:10:24 - error TS2305: Module '\"#imports\"' has no exported member 'useColorMode'.\n\n10 import { useAppConfig, useColorMode } from '#imports'\n ~~~~~~~~~~~~\n\nnode_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeSwitch.vue:10:24 - error TS2305: Module '\"#imports\"' has no exported member 'useColorMode'.\n\n10 import { useAppConfig, useColorMode } from '#imports'\n ~~~~~~~~~~~~\n\n\nFound 8 errors in 8 files.\n\nErrors Files\n 1 node_modules/@nuxt/ui-pro/dist/runtime/components/color-mode/ColorModeButton.vue:18\n 1 node_modules/@nuxt/ui-pro/dist/runtime/components/color-mode/ColorModeSelect.vue:10\n 1 node_modules/@nuxt/ui-pro/dist/runtime/components/color-mode/ColorModeSwitch.vue:10\n 1 node_modules/@nuxt/ui-pro/dist/runtime/components/content/ContentSearch.vue:89\n 1 node_modules/@nuxt/ui-pro/dist/runtime/components/DashboardSearch.vue:57\n 1 node_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeButton.vue:18\n 1 node_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeSelect.vue:10\n 1 node_modules/@nuxt/ui-pro/dist/runtime/vue/components/ColorModeSwitch.vue:10\n\n ERROR Process exited with non-zero status (2)\n```\n\n### Description\n\nI think that there probably needs to be a stub export set up in all cases? Or these files should not be gathered by the typechecking script?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2059,2060,2061,2064],{"name":2037,"color":2038},{"name":1988,"color":1989},{"name":2062,"color":2063},"pro","5BD3CB",{"name":2026,"color":2027},3657,"Setting ui.colorMode = false breaks nuxi typecheck","2025-03-27T20:54:57Z","https://github.com/nuxt/ui/issues/3657",0.6668656,{"description":2071,"labels":2072,"number":2075,"owner":1991,"repository":1992,"state":2041,"title":2076,"updated_at":2077,"url":2078,"score":2079},"### Environment\n\n- Operating System: Windows_NT\n- Node Version: v20.16.0\n- Nuxt Version: 3.15.4\n- CLI Version: 3.22.1\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.8.1\n- Builder: -\n- User Config: devtools, compatibilityDate, modules, app, css, colorMode, svgSprite, future, imports, runtimeConfig, ssr\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.13, @nuxt/eslint@1.1.0, @nuxt/icon@1.10.3, @nuxtjs/svg-sprite@1.0.2, @nuxt/image@1.9.0, @vueuse/nuxt@12.7.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.0.0-alpha.13\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/stupefied-roentgen-y6tdsd\n\n### Description\n\n### Help Nuxt ui 3 table not reactive\n\nWhen I click the button, the table doesn't update. However, when I print the array object, the data is added, but the table still does not update\n\nhttps://codesandbox.io/p/devbox/stupefied-roentgen-y6tdsd\n\nThank you for help\n\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2073,2074],{"name":2037,"color":2038},{"name":1988,"color":1989},3377,"UI Table is not reactive","2025-02-27T21:19:42Z","https://github.com/nuxt/ui/issues/3377",0.66872865,{"description":2081,"labels":2082,"number":2085,"owner":1991,"repository":1992,"state":2041,"title":2086,"updated_at":2087,"url":2088,"score":2089},"### Description\n\nStyles with tailwindcss 4.0.13 seem to be broken after updating from NuxtUI pervious alpha.\n\n```\n\"dependencies\": {\n \"@iconify-json/ri\": \"1.2.5\",\n \"@nuxt/ui\": \"3.0.0\",\n \"@vueuse/core\": \"12.7.0\",\n \"@vueuse/nuxt\": \"12.7.0\",\n }\n```\nmain.css\n```\n@import 'tailwindcss' theme(static);\n@import '@nuxt/ui';\n```\nHas anyone else ran into this issue and if so how did you fix it?",[2083,2084],{"name":1985,"color":1986},{"name":1988,"color":1989},3525,"Styles issue have upgrade from 3.0.0-alpha.13 to 3.0.0","2025-03-12T23:28:54Z","https://github.com/nuxt/ui/issues/3525",0.67247975,{"description":2091,"labels":2092,"number":2095,"owner":1991,"repository":1992,"state":2041,"title":2096,"updated_at":2097,"url":2098,"score":2099},"### Environment\n\n- Operating System: Darwin\n- Node Version: v20.11.1\n- Nuxt Version: 3.13.2\n- CLI Version: 3.14.0\n- Nitro Version: 2.9.7\n- Package Manager: bun@1.1.33\n- Builder: -\n- User Config: -\n- Runtime Modules: -\n- Build Modules: -\n\n### Version\n\nv3.0.0-alpha.7\n\n### Reproduction\n\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n neutral: \"zinc\",\n primary: \"rose\",\n },\n button: {\n compoundVariants: [\n {\n color: \"neutral\",\n variant: \"outline\",\n class:\n \"ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] hover:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg)] aria-disabled:bg-[var(--ui-bg)] focus-visible:ring-2 focus-visible:ring-[var(--ui-border-inverted)]\",\n },\n ],\n },\n },\n});\n```\n\n```\nType '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type 'DeepPartial\u003C({ color: \"primary\"; variant: \"solid\"; class: string; size?: undefined; square?: undefined; loading?: undefined; leading?: undefined; trailing?: undefined; } | { color: \"secondary\"; variant: \"solid\"; ... 5 more ...; trailing?: undefined; } | ... 46 more ... | { ...; })[], string>'.\n Type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type '{ [key: string]: string | TightMap\u003Cstring>; }'.\n Index signature for type 'string' is missing in type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]'.ts(2322)\n```\n\n### Description\n\nHi :) I am getting type errors when using `compoundVariant`. \n\nFor example, here is my `app.config.ts`:\n\n```ts\nexport default defineAppConfig({\n ui: {\n colors: {\n neutral: \"zinc\",\n primary: \"rose\",\n },\n button: {\n compoundVariants: [\n {\n color: \"neutral\",\n variant: \"outline\",\n class:\n \"ring ring-inset ring-[var(--ui-border-accented)] text-[var(--ui-text)] bg-[var(--ui-bg)] hover:bg-[var(--ui-bg-elevated)] disabled:bg-[var(--ui-bg)] aria-disabled:bg-[var(--ui-bg)] focus-visible:ring-2 focus-visible:ring-[var(--ui-border-inverted)]\",\n },\n ],\n },\n },\n});\n```\n\nI am getting the following type error for `compoundVariants`:\n```\nType '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type 'DeepPartial\u003C({ color: \"primary\"; variant: \"solid\"; class: string; size?: undefined; square?: undefined; loading?: undefined; leading?: undefined; trailing?: undefined; } | { color: \"secondary\"; variant: \"solid\"; ... 5 more ...; trailing?: undefined; } | ... 46 more ... | { ...; })[], string>'.\n Type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]' is not assignable to type '{ [key: string]: string | TightMap\u003Cstring>; }'.\n Index signature for type 'string' is missing in type '{ color: \"neutral\"; variant: \"outline\"; class: string; }[]'.ts(2322)\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2093,2094],{"name":2037,"color":2038},{"name":1988,"color":1989},2481,"Type error on `compoundVariants`","2024-10-28T21:43:49Z","https://github.com/nuxt/ui/issues/2481",0.6726517,["Reactive",2101],{},["Set"],["ShallowReactive",2104],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"FJwp0qRepuxthqvQYKVKH9eVYPxVSn7s7g8CJXtWFXA":-1},"/nuxt/ui/3303"]