\n\n\n## Summary\nI would like to request the addition of a `header` slot to the Accordion component in Nuxt UI. This would provide more flexibility for customizing the accordion header content beyond the current available slots.\n\n## Current Behavior\nThe Accordion component currently supports the following slots:\n- `body`\n- `content` \n- `default`\n- `leading`\n- `trailing`\n\n## Proposed Enhancement\nAdd a new `header` slot that allows developers to completely customize the header content of each accordion item.\n\n## Use Case\nI need to display additional information in the accordion title when it's in a collapsed state. The current slots (`leading`, `trailing`) provide some customization, but a dedicated `header` slot would allow for more complex layouts and better control over the entire header area.\n\nFor example, I want to show:\n- Custom formatted titles\n- Additional metadata or status indicators\n- Complex layouts that go beyond simple leading/trailing elements\n\n## Implementation Suggestion\nMy idea is to position the `header` slot **below the existing header area** as a supplementary display zone. This would:\n- Preserve the current header functionality (title, leading/trailing slots, toggle button)\n- Add an additional customizable area underneath for extra information\n- Maintain visual hierarchy while providing more space for content\n\n## Expected API\n```vue\n\u003CUAccordion :items=\"items\">\n\u003Ctemplate #header=\"{ item, index, open }\">\n \u003Cdiv class=\"supplementary-header-info\">\n \u003Cspan class=\"status-badge\">{{ item.status }}\u003C/span>\n \u003Cp class=\"description\">{{ item.summary }}\u003C/p>\n \u003C/div>\n\u003C/template>\n\u003C/UAccordion>\n```\n\n**Visual Layout:**\n```\n┌─────────────────────────────────────┐\n│ [Leading] Title Text [Trailing] ▼│ ← Existing header\n├─────────────────────────────────────┤\n│ Custom Header Slot Content │ ← New header slot\n└─────────────────────────────────────┘\n```\n\n## Benefits\n1. **Enhanced Flexibility**: Developers can create more sophisticated header layouts\n2. **Better UX**: Ability to show contextual information when accordion items are collapsed\n3. **Consistency**: Aligns with the existing slot-based architecture of other Nuxt UI components\n4. **Backward Compatibility**: Would not break existing implementations\n5. **Non-intrusive**: Positioned below existing header, maintaining current functionality\n\n## Additional Context\nThis feature would be particularly useful for:\n- Dashboard interfaces where accordion headers need to show status information\n- Form sections that display validation states in headers\n- Data tables collapsed into accordion format with summary information\n- Preview content or metadata display without expanding the full accordion\n\nThank you for considering this enhancement!\n\n### Additional context\n\n_No response_",[3137,3140,3143],{"name":3138,"color":3139},"enhancement","a2eeef",{"name":3141,"color":3142},"v3","49DCB8",{"name":3144,"color":3145},"triage","ffffff",4782,"nuxt","ui","open","Feature Request: Add Header Slot to Accordion Component","2025-08-21T18:07:41Z","https://github.com/nuxt/ui/issues/4782",0.74734885,{"description":3155,"labels":3156,"number":3164,"owner":3147,"repository":3148,"state":3165,"title":3166,"updated_at":3167,"url":3168,"score":3169},"### Description\r\n\r\nHi 👋🏻 \r\n\r\nI started using NuxtUI and realized one more thing that can be improved. Right now, For `v-model` of tabs component index (number) is used.\r\n\r\nIf we want to get the key of active tab for making API req then we have to do something like below:\r\n```ts\r\nconst activeTabKey = items[itemsModel.value]!.key\r\n\r\n// With this feature implemented we can directly use `itemsModel.value`\r\n```\r\n\r\nInstead, if we can allow using `key` then:\r\n- I'll be more readable\r\n- If we change the order of the tabs (in items array) it doesn't affect the active tab\r\n\r\n### Additional context\r\n\r\nWe can also introduce this change in v3.",[3157,3158,3159,3162],{"name":3138,"color":3139},{"name":3144,"color":3145},{"name":3160,"color":3161},"closed-by-bot","ededed",{"name":3163,"color":3161},"stale",2061,"closed","Allow using tab item key as value for v-model","2025-06-18T09:06:22Z","https://github.com/nuxt/ui/issues/2061",0.7071665,{"description":3171,"labels":3172,"number":3177,"owner":3147,"repository":3148,"state":3165,"title":3178,"updated_at":3179,"url":3180,"score":3181},"### For what version of Nuxt UI are you suggesting this?\n\nv2.x\n\n### Description\n\nHi I would like to have within the component UselectMenu emit the event \"scroll\" \nwith the following properties: \n```\n{\n target: HTMLElement, \n currentTarget: HTMLElement, \n scrollTop: number,\n scrollHeight: number, \n clientHeight: number, \n}\n```\n\n to dynamically remote search items through an api and append it dynamically to my USelectMenu to create an infinite scroll. \n\nThis feature would be great in both version :)\n\n### Additional context\n\n_No response_",[3173,3174,3175,3176],{"name":3138,"color":3139},{"name":3144,"color":3145},{"name":3160,"color":3161},{"name":3163,"color":3161},2793,"add an emit \"scroll\" event for USelectMenu","2025-06-18T09:05:29Z","https://github.com/nuxt/ui/issues/2793",0.7308227,{"labels":3183,"number":3191,"owner":3147,"repository":3147,"state":3165,"title":3192,"updated_at":3193,"url":3194,"score":3195},[3184,3185,3188],{"name":3163,"color":3145},{"name":3186,"color":3187},"pending triage","E99695",{"name":3189,"color":3190},"2.x","d4c5f9",7758,"nuxt-link does not pass tabindex attribute to wrapped anchor element","2023-01-22T15:36:04Z","https://github.com/nuxt/nuxt/issues/7758",0.73217577,{"description":3197,"labels":3198,"number":3205,"owner":3147,"repository":3148,"state":3165,"title":3206,"updated_at":3207,"url":3208,"score":3209},"### Environment\n\n\"nuxt\": \"^3.11.2\",\r\n \"@nuxt/ui\": \"^2.17.0\"\n\n### Version\n\n3.11.2\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-starter-cqb61v\n\n### Description\n\nWhen the content in the tabs component is a component, the content component will be rendered n times (n equals the number of items)\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3199,3202,3203,3204],{"name":3200,"color":3201},"bug","d73a4a",{"name":3144,"color":3145},{"name":3160,"color":3161},{"name":3163,"color":3161},2044,"When the content in the tabs component is a component, the content component will be rendered n times (n equals the number of items)","2025-06-18T09:06:31Z","https://github.com/nuxt/ui/issues/2044",0.73582345,{"description":3211,"labels":3212,"number":3218,"owner":3147,"repository":3148,"state":3165,"title":3219,"updated_at":3220,"url":3221,"score":3222},"### Description\n\n**Feature Request: Add \"Copy Page as Markdown\" Button to Nuxt UI v3 Documentation**\n\n**Description:**\nAdd a button to each component documentation page that allows users to copy the current page content in markdown format.\n\n**Problem:**\n- The full documentation text at ui.nuxt.com/llms-full.txt contains too much information when I only need documentation for specific components\n- GitHub raw files don't show the dynamic content visible on the actual documentation site\n- Need an easy way to copy specific component documentation for use in prompts to AI assistants\n\n**Proposed Solution:**\nAdd a \"Copy Page as Markdown\" button to each documentation page, similar to the implementation on https://modelcontextprotocol.io/introduction\n\n**User Benefit:**\nThis feature would let users easily copy specific component documentation to paste as additional context in AI prompts, improving the relevance and focus of AI assistance for Nuxt UI development.\n\n\n\n### Additional context\n\n_No response_",[3213,3216,3217],{"name":3214,"color":3215},"documentation","0075ca",{"name":3138,"color":3139},{"name":3141,"color":3142},3923,"Docs: Add \"Copy Page as Markdown\" Button to Nuxt UI v3 Documentation","2025-06-24T10:11:25Z","https://github.com/nuxt/ui/issues/3923",0.73671234,{"description":3224,"labels":3225,"number":3229,"owner":3147,"repository":3147,"state":3165,"title":3230,"updated_at":3231,"url":3232,"score":3233},"I've been reading the source code and found out that `window.__nuxt__` and the id for the App component `#__nuxt` are hardcoded. For security reasons I would like to hide what technology is powering my site, do you have plans on having those as options or should I work on my own fork? \n\n\u003C!--cmty-->\u003C!--cmty_prevent_hook-->\n\u003Cdiv align=\"right\">\u003Csub>\u003Cem>This feature request is available on \u003Ca href=\"https://nuxtjs.cmty.io\">Nuxt.js\u003C/a> community (\u003Ca href=\"https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1605\">#c1605\u003C/a>)\u003C/em>\u003C/sub>\u003C/div>",[3226,3228],{"name":3138,"color":3227},"8DEF37",{"name":3189,"color":3190},1792,"Hiding references to __nuxt in the scripts and the template ID","2023-01-18T15:42:21Z","https://github.com/nuxt/nuxt/issues/1792",0.73764175,{"description":3235,"labels":3236,"number":3241,"owner":3147,"repository":3148,"state":3165,"title":3242,"updated_at":3243,"url":3244,"score":3245},"### Environment\n\n- Operating System: `Linux`\n- Node Version: `v20.18.0`\n- Nuxt Version: `3.17.6`\n- CLI Version: `3.25.1`\n- Nitro Version: `2.11.13`\n- Package Manager: `yarn@1.22.22`\n- Builder: `-`\n- User Config: `app`, `css`, `ssr`, `modules`, `mg_ui`, `icon`, `extends`, `components`, `vite`, `runtimeConfig`, `devtools`, `pinia`, `imports`, `hooks`, `compatibilityDate`\n- Runtime Modules: `@nuxt/ui-pro@3.2.0`, `@pinia/nuxt@0.4.11`, `@formkit/auto-animate/nuxt@0.8.2`, `@nuxt/image@1.10.0`\n- Build Modules: `-`\n\n\n### Version\n\nv3.3.0\n\n### Reproduction\n\nhttps://ui.nuxt.com/components/page-card#link\n\n### Description\n\nHi, first thank you for the amazing lib !\nI was starting to use the `\u003CUPageCard` in my application with the `to=\"\"` prop to make it a link and I noticed I could'nt reach the link with my keyboard.\n\nWhen I checked the rendered code, I noticed the link has a `tabindex=\"-1\"` which makes it not focusable and is therefore an A11Y issue.\n\nAm I missing something or is it not normal ?\n\nI also asked on Discord and the AI confirmed it wasn't [mentioned in the docs](https://discord.com/channels/473401852243869706/1400493333670789291)\n\n### Additional context\n\nOfficial documentation : \n\u003Cimg width=\"752\" height=\"610\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/f297a64e-a0b8-4b78-adb9-5e630d51f023\" />\nAnd the rendered link element : \n\u003Cimg width=\"517\" height=\"208\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/fbf26569-fc21-461e-9184-8653d73e53a4\" />\n\n### Logs\n\n```shell-script\n\n```",[3237,3238],{"name":3200,"color":3201},{"name":3239,"color":3240},"nuxt/ui-pro","00dc82",4639,"NuxtUI Pro : PageCard's rendered link \u003Ca> is not accessible with keyboard (tabindex=\"-1\")","2025-08-13T12:23:18Z","https://github.com/nuxt/ui/issues/4639",0.7383043,{"description":3247,"labels":3248,"number":3254,"owner":3147,"repository":3148,"state":3165,"title":3255,"updated_at":3256,"url":3257,"score":3258},"### Environment\n\n- Operating System: `Windows 11`\n- Browser: `Chrome 131`\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt UI\n\n### Version\n\nv2.20.0, 3.0.0-alpha-x\n\n### Reproduction\n\n[Tabs ](https://ui.nuxt.com/components/tabs) and [Input#disabled](https://ui.nuxt.com/components/input#disabled) sections of ui.nuxt.com, as well as pretty much every other component that has a \"Disabled\" state, demonstrate the issue\n\n### Description\n\nThe current styling for `disabled` state of different components in Nuxt UI has a very subtle visual distinction from the enabled state. On a monitor with good sRGB calibration (Gigabyte M32U - IPS, 4K, sRGB mode), the grayed-out appearance of the `disabled` state in almost every Nuxt UI component (as shown on the [ui.nuxt.com/components](https://ui.nuxt.com/components)) is almost indistinguishable from the non-disabled state.\n\n**Issue:**\n- Disabled elements do not provide a clear visual cue, making it hard for users to differentiate their state at a glance.\n- This affects usability and accessibility, especially for users with mild visual impairments or varying screen settings.\n\n**Suggestion:**\n\nConsider increasing contrast differences or adding clearer indicators (e.g., opacity) to improve visual accessibility for disabled elements.\n\n**Example:**\n[Tabs](https://ui.nuxt.com/components/tabs) and [Input#disabled](https://ui.nuxt.com/components/input#disabled) sections of ui.nuxt.com, as well as pretty much every other component that has a \"Disabled\" state, demonstrate the issue.\n\n**Video** (may look different on your monitor):\nNuxt UI `2.20.0`:\n\n\nhttps://github.com/user-attachments/assets/81eea3ee-1c74-4036-9fe9-55b18cb16851\n\n\nNuxt UI `3.0.0-alpha-x`:\n\n\nhttps://github.com/user-attachments/assets/9018589e-98fb-46d1-97e5-623fae98727e\n\n\n**Photos** of how it looks like on the mentioned monitor:\n\n\u003Cimg src=\"https://github.com/user-attachments/assets/97736e43-fe88-428a-b3b2-67fcbe9b37dc\" width=\"400\"/>\n\n\u003Cimg src=\"https://github.com/user-attachments/assets/6caf4ee6-0cb9-4c7e-9bc7-07e320248b8e\" width=\"400\"/>\n\n\u003Cimg src=\"https://github.com/user-attachments/assets/b64d9960-4877-4fc4-b016-92ce8c4cf393\" width=\"400\"/>\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3249,3250,3251,3252,3253],{"name":3200,"color":3201},{"name":3141,"color":3142},{"name":3144,"color":3145},{"name":3160,"color":3161},{"name":3163,"color":3161},2995,"Improve disabled state visibility for Tabs and other components","2025-06-18T09:02:44Z","https://github.com/nuxt/ui/issues/2995",0.741643,{"labels":3260,"number":3263,"owner":3147,"repository":3147,"state":3165,"title":3264,"updated_at":3265,"url":3266,"score":3267},[3261,3262],{"name":3138,"color":3227},{"name":3189,"color":3190},6850,"change the __nuxt id","2023-01-22T15:51:03Z","https://github.com/nuxt/nuxt/issues/6850",0.7440423,["Reactive",3269],{},["Set"],["ShallowReactive",3272],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fjqVsyklLNTipMP1jCdqzBgBtG0JJ-hgFklbKAW50AYg":-1},"/nuxt/ui/3868"]