\n```\n\nAfter:\n```html\n\u003C!-- `ui` prop is the same as `app.config.ts` theming config\n\u003CUTheme :ui=\"{\n formField: {\n\t slots: {\n\t root: \"flex max-sm:flex-col justify-between items-center gap-4\",\n\t},\n },\n}\">\n \u003CUForm ...>\n \u003CUFormField ...>\n ...\n \u003CUFormField>\n \u003CUFormField ...>\n ...\n \u003CUFormField>\n \u003CUForm/>\n\u003C/UTheme>\n```\n\n## Benefits\n- Easily componentized. I could create a `AppForm` component which contains the `UTheme` usage with a slot, so now its 1 line to get the exact theming that I want. This makes consistency across the app really easy.\n- Nestable - If implemented with provide/inject, you could have an infinite number of UTheme's nested and it would take the latest one\n\n## Implementation\nI'd tentatively be willing to implement this. My approach would be:\n- Create `UTheme`, it should have a `ui` and `uiPro` prop, each of which take the same type as the `app.config.ts`\n- `provide()` those props\n- `inject()` those props into each component and merge with passed in `ui` field.\n- Theme priority order should be:\n 1. `ui` prop passed to component\n 2. `ui` prop coming from UTheme component\n 3. `ui` config coming from `app.config.ts`\n\n### Additional context\n\n_No response_",[3139,3142,3145],{"name":3140,"color":3141},"enhancement","a2eeef",{"name":3143,"color":3144},"v3","49DCB8",{"name":3146,"color":3147},"triage","ffffff",4250,"nuxt","ui","open","UTheme component","2025-05-28T22:24:36Z","https://github.com/nuxt/ui/issues/4250",0.73672706,{"description":3157,"labels":3158,"number":3162,"owner":3149,"repository":3150,"state":3151,"title":3163,"updated_at":3164,"url":3165,"score":3166},"### Description\n\n\u003Cimg width=\"1132\" height=\"641\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/b31830a1-49d8-41e8-bd98-77fa43191d84\" />\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_",[3159,3160,3161],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4782,"Feature Request: Add Header Slot to Accordion Component","2025-08-21T18:07:41Z","https://github.com/nuxt/ui/issues/4782",0.7371315,{"description":3168,"labels":3169,"number":3173,"owner":3149,"repository":3150,"state":3151,"title":3174,"updated_at":3175,"url":3176,"score":3177},"### Description\n\nOptions in `SelectMenu` might need a description below the title e.g. like the watch dropdown on github:\n\n\u003Cimg width=\"362\" height=\"378\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/78093701-742b-49ad-8b60-e26435a3bca5\" />\n\nIt can be worked around using `item-label` slot, but it would be nice if developer can use `items` props only to implement it for simpler way.\n\nBelow, I have tried to create it using Reka UI `combobox` component, the component used by SelectMenu.\n\n\u003Cimg width=\"329\" height=\"460\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/e5cda771-3f8e-4369-bb3b-d5159f84d425\" />\n\n### Additional context\n\n_No response_",[3170,3171,3172],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4661,"SelectMenu: add description props to show text below title","2025-08-06T02:19:32Z","https://github.com/nuxt/ui/issues/4661",0.74484533,{"description":3179,"labels":3180,"number":3184,"owner":3149,"repository":3150,"state":3151,"title":3185,"updated_at":3186,"url":3187,"score":3188},"### Description\n\nUsing `\u003CUNavigationMenu>` it adds an external icon when prop `to` is an external link: \n\n\u003Cimg width=\"196\" height=\"69\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/e7417d54-ca16-48c2-9992-a54a9bed764d\" />\n\nUnfortunately, `UButton` doesnt have this feature. Even with the prop `trailingIcon` the same behavior cant be archived manually in an easy manner because the icon wont be small, at the top and grayed out. Currently it would require to make it fully manually:\n\n```\n\u003CUButton :to=\"externalUrl\" target=\"_blank\">\n \u003Cspan\n >To external provider\u003CIcon\n name=\"i-material-symbols:arrow-outward-rounded\"\n class=\"size-3 align-top opacity-70\"\n />\u003C/span>\n \u003C/UButton>\n```\n\n\u003Cimg width=\"191\" height=\"48\" alt=\"Image\" src=\"https://github.com/user-attachments/assets/f89198d7-a64f-4a04-815b-41ddba68c3cc\" />\n\nIt would be great if a button would either automatically add the icon, like `\u003CUNavigationMenu>` does, or would have a prop `externalIcon` that can be set to true.\n\n### Additional context\n\n\n\n_No response_",[3181,3182,3183],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4501,"Add external icon option to UButton and ULink","2025-07-11T09:39:53Z","https://github.com/nuxt/ui/issues/4501",0.74504197,{"description":3190,"labels":3191,"number":3195,"owner":3149,"repository":3150,"state":3151,"title":3196,"updated_at":3197,"url":3198,"score":3199},"### 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_",[3192,3193,3194],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4575,"Allow name and type slots in ProseField (#uiPro)","2025-07-22T20:26:57Z","https://github.com/nuxt/ui/issues/4575",0.7552418,{"description":3201,"labels":3202,"number":3206,"owner":3149,"repository":3150,"state":3151,"title":3207,"updated_at":3208,"url":3209,"score":3210},"### Description\n\n\n## Problem\n\nCurrently, there's no straightforward way to disable anchor links for specific MDC component instances. The existing approaches have significant limitations:\n\n1. **Global `mdc` config in `nuxt.config.ts` is ignored** when using `@nuxt/ui-pro` with `mdc: true`\n2. **app.config.ts prose configuration affects all MDC components globally**, requiring extensive slot overrides\n3. **No component-level control** over anchor link behavior\n\n## Current Workaround\n\nTo disable anchor links, I currently need to configure every heading level in `app.config.ts`:\n\n```typescript\nexport default defineAppConfig({\n uiPro: {\n prose: {\n h1: {\n slots: {\n base: 'mt-0',\n link: 'cursor-default',\n leading: 'hidden p-0',\n leadingIcon: 'hidden'\n }\n },\n h2: {\n slots: {\n base: 'mt-0',\n link: 'cursor-default', \n leading: 'hidden p-0',\n leadingIcon: 'hidden'\n }\n },\n // ... repeat for h3-h6\n }\n }\n})\n```\n\nThis affects **all** MDC components across the entire application.\n\n\n## Proposed Solution\n\nAllow component-level UI configuration via a `:ui` prop on the `\u003CMDC>` component:\n\n```html\n\u003C!-- Disable anchor links for this specific instance -->\n\u003CMDC \n :value=\"content\" \n :ui=\"{ \n prose: { \n anchors: false \n } \n }\" \n/>\n\n\u003C!-- Or more granular control -->\n\u003CMDC \n :value=\"content\"\n :ui=\"{\n prose: {\n h1: { leading: 'hidden', leadingIcon: 'hidden' },\n h2: { leading: 'hidden', leadingIcon: 'hidden' }\n }\n }\"\n/>\n```\n\n## Use Case\n\n**Displaying AI/LLM generated content** where anchor links are undesirable:\n- Game interfaces showing AI-generated text\n- Chat applications with LLM responses \n- Content previews or excerpts\n- Educational tools displaying sample outputs\n\nIn these scenarios, anchor links serve no purpose and can be distracting or break the user experience.\n\n## Expected Behavior\n\n- Component-level `:ui` prop should merge with global prose configuration\n- Should work consistently with both `@nuxt/content` and standalone MDC usage\n- Should not require global configuration changes for per-component customization\n\n## Current Versions\n\n- `@nuxt/ui-pro` (v3)\n- 'uiPro.mdc' set to true or false in `nuxt.config` does not make a difference\n\n## Additional Context\n\nThis would align with Nuxt UI's existing pattern of allowing component-level customization via `:ui` props, providing developers with fine-grained control while maintaining sensible defaults.\n\n### Additional context\n\n_No response_",[3203,3204,3205],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4216,"Allow disabling anchor links per MDC component instance via :ui prop","2025-05-24T15:32:22Z","https://github.com/nuxt/ui/issues/4216",0.7558179,{"description":3212,"labels":3213,"number":3217,"owner":3149,"repository":3150,"state":3151,"title":3218,"updated_at":3219,"url":3220,"score":3221},"### Description\n\nFor [SelectMenu](https://ui.nuxt.com/components/select-menu) seems to be no option to customize the label of the selected item, e.g. use multiple values to compose the label. Currently only one item value can be selected by prop `labelKey`, but it is not possible to use multiple values OR to even add custom html-code.\n\n**Example:**\n\n```ts\nconst items = [\n {\n id: 1,\n firstName: 'Max',\n lastName: 'Mustermann',\n },\n ...\n]\n```\n\nThe items to select can be fully customized, even with custom html code:\n\n```vue\n\u003Ctemplate #item-label=\"{ item }\">\n {{ item.firstName }} \u003Cspan class=\"text-highlighted\">{{ item.lastName}}\u003C/span>\n \u003Cdiv class=\"text-xs text-muted\">#{{ item.customerId }}\u003C/div>\n\u003C/template>\n```\n\nBut when an item is selected, the selected item can only be one value:\n\n```vue\n\u003CUSelectMenu label-key=\"lastName\" />\n```\n\n**Possible solutions:**\n\n1. Make a new label prop that accepts a function, so values can be compound:\n\n```ts\n\u003CUSelectMenu :label=\"(item) => item.firstName + ' ' + item.lastName\"\n```\n\n2. Optionally make a slot to customize the labels: \n```vue\n\u003CUSelectMenu>\n \u003Ctemplate #label=\"{ item }\">\n {{ item.firstName }} \u003Cspan class=\"text-highlighted\">{{ item.lastName}}\u003C/span>\n \u003Cspan class=\"text-xs text-muted\">#{{ item.customerId }}\u003C/span>\n \u003C/template>\n\u003C/USelectMenu>\n```\n\nP.S. the prop `labelKey` is not documented https://ui.nuxt.com/components/select-menu#props\n",[3214,3215,3216],{"name":3140,"color":3141},{"name":3143,"color":3144},{"name":3146,"color":3147},4581,"SelectMenu: Compound label","2025-07-23T16:38:06Z","https://github.com/nuxt/ui/issues/4581",0.7565312,{"description":3223,"labels":3224,"number":3234,"owner":3149,"repository":3150,"state":3235,"title":3236,"updated_at":3237,"url":3238,"score":3239},"### Description\n\nIs there currently a way, or future support for overriding the trigger for the Accordion similar to how it worked in v2:\n\n> Example for v2\n\n```vue\n\u003Cu-accordion :items=\"items\" :ui=\"{ wrapper: 'flex flex-col w-full' }\">\n \u003Ctemplate #default=\"{ item, open }\">\n \u003Cu-button variant=\"ghost\" class=\"flex justify-between items-center font-semibold\">\n \u003Cspan>{{ item.label }}\u003C/span>\n \u003Cdiv class=\"flex items-center space-x-2\">\n \u003Cu-icon\n name=\"i-heroicons-chevron-right-20-solid\"\n class=\"w-5 h-5 ms-auto transform transition-transform duration-200\"\n :class=\"[open && 'rotate-90']\"\n />\n \u003C/div>\n \u003C/u-button>\n \u003C/template>\n\n \u003Ctemplate #item=\"{ item }\">\n // Content\n \u003C/template>\n\u003C/u-accordion>\n```\n\nCurrently i don't see a way with the default slot to override the AccordionRoot trigger\n",[3225,3228,3229,3232],{"name":3226,"color":3227},"question","d876e3",{"name":3143,"color":3144},{"name":3230,"color":3231},"closed-by-bot","ededed",{"name":3233,"color":3231},"stale",3455,"closed","Override Slot for Accordion Trigger","2025-06-18T09:01:47Z","https://github.com/nuxt/ui/issues/3455",0.71520686,{"description":3241,"labels":3242,"number":3252,"owner":3149,"repository":3150,"state":3235,"title":3253,"updated_at":3254,"url":3255,"score":3256},"### Environment\n\n- Operating System: Linux\r\n- Node Version: v18.20.3\r\n- Nuxt Version: 3.12.4\r\n- CLI Version: 3.12.0\r\n- Nitro Version: 2.9.7\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: compatibilityDate, devtools, extends, modules\r\n- Runtime Modules: @nuxt/ui@2.18.4\r\n- Build Modules: -\n\n### Version\n\n2.18.4\n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-qsqtmc?file=app.vue\n\n### Description\n\nLandingFAQ being built on top Accordion, when an item has a specified \"slot\" property, it should allow to display custom content in a corresponding slot. In my reproduction, you can see i have an faq item with a slot property equal to \"risks\". When using \u003Ctemplate #risks> risks \u003C/template> to show a specific content for that item, it works well in the accordion but is ignored in the LandingFAQ where the content property is shown instead.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[3243,3246,3249,3250,3251],{"name":3244,"color":3245},"bug","d73a4a",{"name":3247,"color":3248},"nuxt/ui-pro","00dc82",{"name":3146,"color":3147},{"name":3230,"color":3231},{"name":3233,"color":3231},2057,"LandingFAQ component in Pro ignores the \"slot\" property of an item","2025-06-18T09:06:25Z","https://github.com/nuxt/ui/issues/2057",0.7383835,{"description":3258,"labels":3259,"number":3262,"owner":3149,"repository":3150,"state":3235,"title":3263,"updated_at":3264,"url":3265,"score":3266},"### Description\n\nI saw that some components (like `Modal` or `Slideover`) have the \"trigger\" fully replaceable, meanwhile others like `Select` and `SelectMenu` cannot be fully replaced. Because of that, introducing another slot to replace the entire trigger would be nice imho. But I would define it as the default slot, not a named one (like `trigger` or something else) to remain consistent with the modal/slideover one.\nThe problem is that it would introduce a breaking change, so I don't know what is the way you want to proceed.\nWhat do you think about this?\nMentioning @sandros94 as I talked about this with him on Discord.\n\n### Additional context\n\nTo have a look on this, I did some changes in a branch in my fork: \u003Chttps://github.com/nuxt/ui/compare/v3...zAlweNy26:nuxt-ui:feat/select-trigger>",[3260,3261],{"name":3140,"color":3141},{"name":3143,"color":3144},4009,"Standardize trigger slot in components","2025-05-10T17:57:56Z","https://github.com/nuxt/ui/issues/4009",0.74057305,["Reactive",3268],{},["Set"],["ShallowReactive",3271],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fOL7tHlEgeWV76VljhkzASG_IZQY949GYrfThcg7TGz4":-1},"/nuxt/ui/4013"]