\n```",[3145],{"name":3146,"color":3147},"question","d876e3",4849,"nuxt","ui","open","Can `UNavigationMenu` support active styles via the ui prop?","2025-08-30T10:29:01Z","https://github.com/nuxt/ui/issues/4849",0.7351669,{"description":3157,"labels":3158,"number":3160,"owner":3149,"repository":3150,"state":3151,"title":3161,"updated_at":3162,"url":3163,"score":3164},"### Description\n\nHey everyone, I was trying to add a `UTooltip` to a `UColorModeButton`.\n\n```vue\n\u003CUTooltip :delay-duration=\"0\" text=\"Toggle mode\">\n \u003CUColorModeButton :ui=\"{ base: 'text-dimmed hover:text-highlighted' }\" />\n\u003C/UTooltip>\n```\n\nUnfortunately, the tooltip gets pushed to the top-left corner of the viewport. Am I missing something or doing anything incorrectly here?",[3159],{"name":3146,"color":3147},4286,"Can UColorModeButton be wrapped in a UTooltip?","2025-06-04T11:52:41Z","https://github.com/nuxt/ui/issues/4286",0.7769688,{"description":3166,"labels":3167,"number":3174,"owner":3149,"repository":3150,"state":3151,"title":3175,"updated_at":3176,"url":3177,"score":3178},"### Description\n\n### Feature Request: Add `variant` and `status-position` props to `UProgress` component\n\n#### Description\nI’m a junior developer, and I’ve been working on enhancing the flexibility of the `Progress` component by adding two new props: `variant` and `status-position`. These props allow for better customization, especially when using the `Progress` component in different design contexts.\n\n- **`variant`**: This prop allows you to choose between two styles for the progress bar: `linear` and `circular`. The `circular` variant provides a circular progress bar instead of the default linear style.\n \n- **`status-position`**: This prop controls the position of the progress status (the percentage or label) relative to the progress bar. The possible values are:\n - `inside`: The status is displayed inside the circle (for the `circular` variant).\n - `outside`: The status is displayed outside the circle.\n\n#### Motivation\nThis update would help in using the `Progress` component more flexibly across different layouts, providing options for both linear and circular progress indicators with customizable label placements.\n\n#### What I've Done\nI’m still a junior developer, so the implementation is not perfect, but a good portion of the work is done. I’ve added the `variant` and `status-position` props to the `Progress` component. I’d love to know if this is something you’d like to integrate into the main repository and whether I can open a pull request for it.\n\n#### Additional Notes\n- The `variant` prop accepts values `linear` or `circular`.\n- The `status-position` prop accepts values `inside` or `outside`.\n \nWould love to hear your thoughts on this approach!\n\n\n### Additional context\n\n[Reka UI : Progress Circular](https://reka-ui.com/examples/progress-circular)",[3168,3171],{"name":3169,"color":3170},"enhancement","a2eeef",{"name":3172,"color":3173},"v3","49DCB8",3728,"[UProgress]: Add `variant` and `status-position` props","2025-08-06T13:48:03Z","https://github.com/nuxt/ui/issues/3728",0.7771891,{"description":3180,"labels":3181,"number":3187,"owner":3149,"repository":3150,"state":3188,"title":3189,"updated_at":3190,"url":3191,"score":3192},"### Description\n\nI am using the carousel component. Trying to color the dots differently but can't find any documentation on how to achieve this. Is there any doc on the ui property? ",[3182,3183,3184],{"name":3146,"color":3147},{"name":3172,"color":3173},{"name":3185,"color":3186},"upstream","78bddb",4372,"closed","Carousel Config Options","2025-06-18T13:56:20Z","https://github.com/nuxt/ui/issues/4372",0.63229424,{"description":3194,"labels":3195,"number":3201,"owner":3149,"repository":3150,"state":3188,"title":3202,"updated_at":3203,"url":3204,"score":3205},"### Description\n\nWhen a dot is selected in the UCarousel component, we get no attribute in the element : \n\n- no data-selected\n- no aria-current for accessibility\n\nSince there is no dots/dot slot, we have no possibility to style these dots when selected or not. The only difference is the bg style being either bg-accented or bg-inverted, which is overwritten if we actually style the background.\n\nIs there any way to add these attributes ? At least for accessibility.\n\n### Additional context\n\n_No response_",[3196,3197,3198],{"name":3169,"color":3170},{"name":3172,"color":3173},{"name":3199,"color":3200},"triage","ffffff",4403,"UCarousel selected dot has no attribute","2025-07-07T10:09:58Z","https://github.com/nuxt/ui/issues/4403",0.7199987,{"description":3207,"labels":3208,"number":3212,"owner":3149,"repository":3150,"state":3188,"title":3213,"updated_at":3214,"url":3215,"score":3216},"### Description\n\nThis is a re-opening of #1484 but for v3. It seems in the transition from v2 to v3, giving the indicators (now \"dots\") ARIA \"tab\" roles was lost. While I did mention it in my original issue, I don't believe my original PR accounted for when multiple items would be displayed at the same time. Perhaps the changes for v3 can take that into account.\n\n### Additional context\n\n_No response_",[3209,3210,3211],{"name":3169,"color":3170},{"name":3172,"color":3173},{"name":3199,"color":3200},4494,"Carousel component could be made more accessible (v3).","2025-07-10T12:18:41Z","https://github.com/nuxt/ui/issues/4494",0.72566193,{"description":3218,"labels":3219,"number":3226,"owner":3149,"repository":3150,"state":3188,"title":3227,"updated_at":3228,"url":3229,"score":3230},"### Description\n\nI want to place it on the side or on the top like tabs component",[3220,3221,3224],{"name":3146,"color":3147},{"name":3222,"color":3223},"closed-by-bot","ededed",{"name":3225,"color":3223},"stale",1410,"Can carousel indicator be located elsewhere beside on bottom of parent?","2025-06-19T02:12:52Z","https://github.com/nuxt/ui/issues/1410",0.7495516,{"description":3232,"labels":3233,"number":3238,"owner":3149,"repository":3150,"state":3188,"title":3239,"updated_at":3240,"url":3241,"score":3242},"### Description\n\n## No Clear Documentation for Targeting Active Styles in `NavigationMenu` Component\n\n### Description\n\nI'm trying to apply custom styles to the active state of a menu item in the `NavigationMenu` component, but there doesn't seem to be any clear documentation on how to do this.\n\nThe [theming docs](https://ui.nuxt.com/getting-started/theme#props) mention using the `:ui` attribute to target internal parts of a component, and the [theme structure for `NavigationMenu`](https://ui.nuxt.com/components/navigation-menu#theme) shows a large theme object. However, attempting to follow that structure often results in unexpected behavior—like rendering `[object Object]`, which suggests that it doesn't expect an object or the nested configuration isn’t being parsed correctly.\n\nEven large language models get tripped up when referencing the documentation. Some approaches I've tried (unsuccessfully) include:\n\n```js\nlink: {\n base: 'px-3 py-2 rounded-md',\n active: 'bg-primary text-white font-medium'\n},\nvariants: {\n active: {\n true: {\n item: 'bg-primary text-white font-medium'\n }\n }\n}\n```\n\nThe only working solution so far is using data-* attributes like this:\n```js\nlink: 'text-md data-active:bg-primary data-active:text-white'\n```\nWhile this works, it’s undocumented and feels fragile—it could easily break with a future update if it’s not the intended method.\n\n### Question\nWhat is the official and supported way to apply styles based on active state for subcomponents like link in NavigationMenu?",[3234,3235,3236,3237],{"name":3146,"color":3147},{"name":3172,"color":3173},{"name":3222,"color":3223},{"name":3225,"color":3223},4279,"Targeting active menu styles","2025-08-20T02:08:31Z","https://github.com/nuxt/ui/issues/4279",0.7503714,{"description":3244,"labels":3245,"number":3248,"owner":3149,"repository":3150,"state":3188,"title":3249,"updated_at":3250,"url":3251,"score":3252},"### For what version of Nuxt UI are you suggesting this?\n\nv3-alpha\n\n### Description\n\nI was browsing through the v3 carousel docs at https://ui.nuxt.com/components/carousel#props, to see whether the v3 version will have callback events for onPrev and onNext, but didn't find it.\n\nIs this something that would be considered to implement?\n\nAlternatively, the ability to bind to the active item in the carousel, could also work.\n\nWe would use it to display an info text next to the image, and change it depending on which image is active in the carousel.\n\nIf this is something that is already possible, then please let me know how :)",[3246,3247],{"name":3169,"color":3170},{"name":3172,"color":3173},2475,"[v3] `Carousel` feature request: callback methods onPrev & onNext","2024-11-07T14:11:43Z","https://github.com/nuxt/ui/issues/2475",0.75535417,{"description":3254,"labels":3255,"number":3264,"owner":3149,"repository":3150,"state":3188,"title":3265,"updated_at":3266,"url":3267,"score":3268},"### Environment\n\n- Nuxt Vesrion: '3.15.1'\n- Nuxt/ui Version: '3.0.1'\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.15.1\n\n### Reproduction\n\nhttps://github.com/nuxt/ui/pull/2251\n\n### Description\n\nThis issue was previously addressed and fixed in [PR #2251](https://github.com/nuxt/ui/pull/2251). However, after upgrading to Nuxt UI v3.0.1, the dir prop no longer exists, making it impossible to switch the direction of the Carousel.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3256,3259,3262,3263],{"name":3257,"color":3258},"bug","d73a4a",{"name":3260,"color":3261},"needs reproduction","CB47CF",{"name":3172,"color":3173},{"name":3222,"color":3223},3705,"Missing \"dir\" Prop in Carousel Component After Nuxt UI v3.0.1 Update","2025-05-31T02:09:01Z","https://github.com/nuxt/ui/issues/3705",0.7559012,["Reactive",3270],{},["Set"],["ShallowReactive",3273],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fy0K0utxG3d6S9tHGGdYbQPUy1xM3SPYYLYQfsmR4Nvk":-1},"/nuxt/ui/4228"]