\n```\n\ninstead of\n\n```vue\n// Current workaround\n\u003CUTable\n :meta=\"{ class: {\n tr: row => (row.getCanSelect()\n ? 'cursor-pointer'\n : 'data-[selectable=true]:!bg-accented data-[selectable=true]:hover:!bg-accented'),\n } }\"\n/>\n\n```\n\nI understand the need to have some sensible defaults, but I propose changing this to\n\n```html\n\u003Ctr :data-selectable=\"!!props.rowSelectionOptions?.enableRowSelection \n ? row.getCanSelect() : !!props.onSelect || !!props.onHover || !!props.onContextmenu\">\n```\n\np.s. Many thanks for all this beautiful work you have done so far.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3171,3174,3177],{"name":3172,"color":3173},"bug","d73a4a",{"name":3175,"color":3176},"triage","ffffff",{"name":3178,"color":3179},"v4","49DCB8",4968,"nuxt","ui","open","UTable row data-selectable attribute not aligned with TanStack API","2025-09-14T00:46:37Z","https://github.com/nuxt/ui/issues/4968",0.7354568,{"description":3189,"labels":3190,"number":3195,"owner":3181,"repository":3182,"state":3183,"title":3196,"updated_at":3197,"url":3198,"score":3199},"### Package\n\nv4.x\n\n### Description\n\nForm elements usually need to provide behavior that allows for clearing, making it easy for users to quickly clear the current one,Including these components:\n\n- input\n- inputMenu\n- inputNumber\n- inputTags\n- select\n- selectMenu\n- textarea\n\n### Additional context\n\n\n\n",[3191,3194],{"name":3192,"color":3193},"enhancement","a2eeef",{"name":3175,"color":3176},5088,"Form Element add allow-clear props","2025-09-28T02:04:29Z","https://github.com/nuxt/ui/issues/5088",0.7439581,{"description":3201,"labels":3202,"number":3205,"owner":3181,"repository":3182,"state":3183,"title":3206,"updated_at":3207,"url":3208,"score":3209},"### Package\n\nv4.x\n\n### Description\n\nI've been using successfully a very similar component to handle `ButtonGroup` messing with nested controls:\n\n```vue\n\u003Ctemplate>\n \u003CUFieldGroup>\n \u003CUInput\n v-model=\"text\"\n />\n\n \u003CUDrawer>\n \u003CUChip\n :show=\"anyFilter\"\n >\n \u003CUButton\n icon=\"lucide:filter\"\n />\n \u003C/UChip>\n\n \u003Ctemplate #content>\n \u003CUClearFieldGroup>\n \u003CFilters />\n \u003C/UClearFieldGroup>\n \u003C/template>\n \u003C/UDrawer>\n \u003C/UFieldGroup>\n\u003C/template>\n```\n\nReference: #4242 \n\n### Additional context\n\n_No response_",[3203,3204],{"name":3192,"color":3193},{"name":3175,"color":3176},5045,"\u003CClearFieldGroup>","2025-09-23T13:26:53Z","https://github.com/nuxt/ui/issues/5045",0.74680626,{"description":3211,"labels":3212,"number":3216,"owner":3181,"repository":3181,"state":3183,"title":3217,"updated_at":3218,"url":3219,"score":3220},"### Environment\n\n- Operating System: Linux\n- Node Version: v18.20.3\n- Nuxt Version: 3.16.1\n- CLI Version: 3.23.1\n- Nitro Version: 2.11.7\n- Package Manager: npm@10.2.3\n- Builder: -\n- User Config: compatibilityDate, experimental\n- Runtime Modules: -\n- Build Modules: -\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-lewobysm?file=app.vue\n\n### Describe the bug\n\n- `getFragmentHTML` throws `clone.querySelectorAll is not a function` when server component is slotted inside another server component\n- the error is not thrown if another vnode is in the slot\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3213],{"name":3214,"color":3215},"pending triage","E99695",31509,"nested server components throw `clone.querySelectorAll is not a function`","2025-03-23T17:27:23Z","https://github.com/nuxt/nuxt/issues/31509",0.75695854,{"description":3222,"labels":3223,"number":3231,"owner":3181,"repository":3181,"state":3183,"title":3232,"updated_at":3233,"url":3234,"score":3235},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Windows_NT\r\n- Node Version: v20.11.1\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@10.8.1\r\n- Builder: -\r\n- User Config: devtools, ssr\r\n- Runtime Modules: -\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\nhttps://stackblitz.com/edit/github-yfqdht?file=pages%2Findex.vue\r\n\r\n### Describe the bug\r\n\r\nThere is something strange. It happens when I move from one page to another page that contains a specific component. Within this component, I give a data-Attribute element, and when I return to the first page and then return, I find that the Attribute has not been deleted.\r\n\r\nUnlike usual, when you visit a page and, for example, give certain properties to HTML elements, after exiting the page I think they are deleted.\r\n\r\nex :\r\nYou Have 2 Pages : \r\n- `index.vue`\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\nconst router = useRouter();\r\n\r\nfunction go() {\r\n router.push('/about');\r\n}\r\n\r\nfunction setItem() {\r\n localStorage.setItem('set', 'set');\r\n}\r\n\r\nfunction removeItem() {\r\n localStorage.removeItem('set');\r\n}\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ch1>Index Page\u003C/h1>\r\n \u003Cbutton @click=\"go\">To About\u003C/button>\r\n \u003Cp>For Test :\u003C/p>\r\n \u003Cbutton @click=\"setItem\">Local Storage Set\u003C/button>\r\n \u003Cbutton @click=\"removeItem\">Local Storage remove Set\u003C/button>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n```\r\n- `about.vue`\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\nfunction getAttr() {\r\n if (document.querySelector('.notRemoveAttr').getAttribute('data-setData')) {\r\n alert('Attribute exists');\r\n } else {\r\n alert('Attribute Not exists!!');\r\n }\r\n}\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003Cdiv>\r\n \u003Ch1>About Page\u003C/h1>\r\n \u003CTestComp>\u003C/TestComp>\r\n \u003CNuxtLink to=\"/\">To Index\u003C/NuxtLink>\r\n \u003Cbutton @click=\"getAttr\">getAttribute (data-setData)\u003C/button>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n```\r\nin `about page` have `testComp.vue` :\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\n\r\nonMounted(() => {\r\n if (!localStorage.getItem(\"set\")) {\r\n document.querySelector(\".notRemoveAttr\")?.setAttribute('data-setData', 'hi');\r\n }\r\n});\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n\u003C!-- I am surprised that when the html code is arranged in this way, the problem occurs. I do not know if the problem exists in other forms, but this is what happened. -->\r\n \u003Cdiv>\r\n \u003Cdiv class=\"anyClass\">\r\n \u003Cdiv class=\"anyClass2\">\r\n \u003Cdiv class=\"anyClass3\">\u003C/div>\r\n \u003Cdiv class=\"notRemoveAttr\">\r\n \u003Cdiv class=\"anyClass4\">\u003C/div>\r\n \u003C/div>\r\n \u003C/div>\r\n \u003C/div>\r\n \u003C/div>\r\n\u003C/template>\r\n\r\n```\r\n\r\nNow when I go to the about page directly, everything is excellent, but when I go to the index page, then go to the about page, then return to the index page and put `set` in localStorage, then return to about, I find that the Attribute `setData` has not been deleted!\r\n\r\ntry it yourself, https://stackblitz.com/edit/github-yfqdht?file=pages%2Findex.vue\r\n1 - open index page\r\n2 - Go to the about page (click Button) (the element `.notRemoveAttr` will be given `Attribute`, which is `data-setData`)\r\n3 - Go back to index (click Button)\r\n4 - Click on (Local Storage Set) - so that `.setAttribute('data-setData', 'hi')` does not work when we return to the about page\r\n5 - Go back to the about page (click on `getAttribute (data-setData)`) and you will find that it brings it to you!! \r\n\r\nMake sure when you want to try again, click on `Local Storage remove Set`\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\n_No response_",[3224,3227,3228],{"name":3225,"color":3226},"workaround available","11376d",{"name":3214,"color":3215},{"name":3229,"color":3230},"upstream","E8A36D",27471,"data-Attribute is not deleted when you go to another page","2024-06-30T11:03:49Z","https://github.com/nuxt/nuxt/issues/27471",0.7578602,{"description":3237,"labels":3238,"number":3241,"owner":3181,"repository":3182,"state":3183,"title":3242,"updated_at":3243,"url":3244,"score":3245},"### Package\n\nv4.x\n\n### Description\n\nWe’d like to implement a \"Select visible\" / \"Unselect visible\" feature for large datasets rendered in USelectMenu and UInputMenu. Currently, there’s no way to access the list of items that match the active filter, which makes it difficult to apply bulk actions to only the visible subset.\n\nIt would be helpful if the component exposed the currently filtered items—either via a computed property, event, or method—so developers can interact with the visible list directly without duplicating the filtering logic externally. This would improve performance and reduce complexity for use cases involving large lists and dynamic filtering.\n\n### Additional context\n\n_No response_",[3239,3240],{"name":3192,"color":3193},{"name":3175,"color":3176},5160,"[USelectMenu/UInputMenu] Expose list of filtered items","2025-10-06T11:13:05Z","https://github.com/nuxt/ui/issues/5160",0.7586515,{"description":3247,"labels":3248,"number":3251,"owner":3181,"repository":3182,"state":3183,"title":3252,"updated_at":3253,"url":3254,"score":3255},"### Package\n\nv4.x\n\n### Description\n\nCurrently, when a developer needs to restyle a specific part of a component using the :ui prop, the process involves several steps:\n- Inspecting the component in browser developer tools to identify the specific HTML element.\n- Consulting the component's documentation to find the corresponding UI theme keys.\n- Matching the identified HTML element's classes or structure to the documentation to determine the correct key value for customization within the UI theme.\n\nThis workflow is inefficient as it frequently requires switching between browser devtools and documentation, which can be time-consuming and interrupt the development flow, especially for complex components or new users.\n\n**Proposed Solution:** Introduce a new attribute like for example `themekey`, to the key building blocks of components' HTML structure. This attribute would directly indicate the corresponding key in the component's UI theme configuration.\n\n**Example:** Consider the following button component. With the `themekey` attribute, identifying the parts for customization becomes straightforward:\n\n```html\n\u003Cbutton themekey=\"base\" type=\"button\" class=\"rounded-md font-medium inline-flex items-center \">\n \u003Csvg themekey=\"icon\" xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" role=\"img\">\u003C/svg>\n \u003Cspan themekey=\"label\" class=\"truncate\">Button\u003C/span>\n\u003C/button>\n\n```\n\nIn this example:\n- themekey=\"base\" identifies the main button element.\n- themekey=\"icon\" identifies the SVG icon.\n- themekey=\"label\" identifies the text span.\n\n## Benefits\n\n* **Improved Developer Experience:** Developers can quickly identify the correct UI theme keys by simply inspecting the element in devtools, without needing to cross-reference documentation.\n* **Faster Customization:** Reduces the time and effort required to apply custom styling via the `:ui` prop.\n* **Reduced Documentation Reliance:** While documentation remains important, this attribute provides an immediate, in-context hint for common customization points.\n* **Clarity:** Makes the component's structure and customizable parts more explicit.\n\n\n### Additional context\n\n_No response_",[3249,3250],{"name":3192,"color":3193},{"name":3175,"color":3176},5165,"Ease identification of components building blocks","2025-10-06T18:26:36Z","https://github.com/nuxt/ui/issues/5165",0.75937736,{"description":3257,"labels":3258,"number":3263,"owner":3181,"repository":3182,"state":3183,"title":3264,"updated_at":3265,"url":3266,"score":3267},"### Description\n\n`name` and `type` in the `ProseField` component can only be consigned as strings:\n\n```\n::field{name=\"fieldname\" type=\"boolean\"}\ndescription\n::\n```\n\nBut actually I need them as slots like:\n\n```\n::field\n#name\n\u003Cbutton>fieldname\u003C/button>\n#type\n\u003Cspan>fieldtype\u003C/span>\n#default\ndescription\n::\n```\n\nIt's not much of an adjustment, just a little tweaking in the respective Vue component:\n\n```\n \u003Cspan\n v-if=\"!!slots.name || name\"\n :class=\"ui.name({ class: props.ui?.name })\"\n >\n \u003Cslot name=\"name\" mdc-unwrap=\"p\">\n {{ name }}\n \u003C/slot>\n \u003C/span>\n```\n\nI tried to overwrite it with my own component in `component/contents/ProseField.vue`, but it didn't work in production, probably because of tree shaking. (That's another issue.)\n\n### Additional context\n\n_No response_",[3259,3260,3262],{"name":3192,"color":3193},{"name":3261,"color":3179},"v3",{"name":3175,"color":3176},4575,"Allow name and type slots in ProseField (#uiPro)","2025-07-22T20:26:57Z","https://github.com/nuxt/ui/issues/4575",0.7599044,{"description":3269,"labels":3270,"number":3273,"owner":3181,"repository":3182,"state":3274,"title":3275,"updated_at":3276,"url":3277,"score":3278},"### Description\n\nWe'd like to use `data-testid` on our elements so we can target them in tests. But doing this for example:\n`\u003CUButton data-testid=\"test\" />`\nDoesn't result in the test id being applied.\n\nThis can probably be fixed by enabling (some more) fallthrough attributes.\nhttps://vuejs.org/guide/components/attrs\n\nThanks for the work on this project!\n\n### Additional context\n\n_No response_",[3271,3272],{"name":3192,"color":3193},{"name":3175,"color":3176},4679,"closed","Allow Fallthrough Attributes","2025-08-17T13:45:19Z","https://github.com/nuxt/ui/issues/4679",0.6810641,{"description":3280,"labels":3281,"number":3290,"owner":3181,"repository":3182,"state":3274,"title":3291,"updated_at":3292,"url":3293,"score":3294},"### Description\n\nThis feature request proposes that the InputNumber component be enhanced with leading and trailing slot support. \n\nCurrently, components such as **Input**, **InputMenu**, **Select**, and **SelectMenu** already offer these slots for inserting custom content. For consistency across the UI library and to provide developers with a uniform customization experience, it is imperative that InputNumber is updated to include both leading and trailing slots. \n\n### Additional context\n\n_No response_",[3282,3283,3284,3285,3288],{"name":3192,"color":3193},{"name":3261,"color":3179},{"name":3175,"color":3176},{"name":3286,"color":3287},"closed-by-bot","ededed",{"name":3289,"color":3287},"stale",4201,"[InputNumber] Add support for leading & trailing slots","2025-09-28T02:10:15Z","https://github.com/nuxt/ui/issues/4201",0.7236261,["Reactive",3296],{},["Set"],["ShallowReactive",3299],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fDxJ4vHwua1jOLDm4yfawBsi7_Lru1MPKKHLK6tM70sk":-1},"/nuxt/ui/5137"]