\n \u003C/UCarousel>\n\u003C/template>\n```\n\n### Description\n\nSimulate the behavior of https://m3.material.io/components/carousel/overview, Carousel will repeatedly calculate is-snapped in an infinite loop\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[3204,3206,3209,3212,3215],{"name":3181,"color":3205},"d73a4a",{"name":3207,"color":3208},"v3","49DCB8",{"name":3210,"color":3211},"triage","ffffff",{"name":3213,"color":3214},"closed-by-bot","ededed",{"name":3216,"color":3214},"stale",3883,"ui","[Carousel] Unable to differentiate item sizes","2025-08-12T02:12:47Z","https://github.com/nuxt/ui/issues/3883",0.7417316,{"description":3224,"labels":3225,"number":3231,"owner":3184,"repository":3218,"state":3186,"title":3232,"updated_at":3233,"url":3234,"score":3235},"### Description\n\nhttps://ui.nuxt.com/components/carousel#with-thumbnails\n\nThere are a couple of issues with the current implementation:\n\n1. Swiping via gestures isn't tracked — when switching slides this way, the active thumb doesn't update.\n2. The thumbs list can have more items, so scrolling needs to be handled properly.\n\nHere's my take on fixing both:\n```vue\n\u003Cscript setup lang=\"ts\">\nconst items = [\n 'https://picsum.photos/640/640?random=1',\n 'https://picsum.photos/640/640?random=2',\n 'https://picsum.photos/640/640?random=3',\n 'https://picsum.photos/640/640?random=4',\n 'https://picsum.photos/640/640?random=5',\n 'https://picsum.photos/640/640?random=6',\n 'https://picsum.photos/640/640?random=7',\n 'https://picsum.photos/640/640?random=8',\n 'https://picsum.photos/640/640?random=9',\n 'https://picsum.photos/640/640?random=10',\n]\n\nconst carousel = useTemplateRef('carousel')\nconst thumbCarousel = useTemplateRef('thumbCarousel')\nconst activeIndex = ref(0)\n\nfunction onClickPrev() {\n activeIndex.value--\n}\nfunction onClickNext() {\n activeIndex.value++\n}\n\nfunction onSelect(index: number) {\n activeIndex.value = index\n\n thumbCarousel.value?.emblaApi?.scrollTo(index)\n}\n\nfunction onThumbClick(index: number) {\n carousel.value?.emblaApi?.scrollTo(index)\n}\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cdiv class=\"flex-1 w-full\">\n \u003CUCarousel\n ref=\"carousel\"\n v-slot=\"{ item }\"\n arrows\n :items=\"items\"\n :prev=\"{ onClick: onClickPrev }\"\n :next=\"{ onClick: onClickNext }\"\n class=\"w-full max-w-xs mx-auto\"\n >\n \u003Cimg :src=\"item\" width=\"320\" height=\"320\" class=\"rounded-lg\">\n \u003C/UCarousel>\n\n \u003Cdiv class=\"pt-4 max-w-xs mx-auto\">\n \u003CUCarousel\n ref=\"thumbCarousel\"\n v-slot=\"{ item, index }\"\n :items=\"items\"\n class=\"w-full\"\n contain-scroll=\"keepSnaps\"\n drag-free\n :ui=\"{ item: 'basis-auto' }\"\n >\n \u003Cimg\n :src=\"item\"\n width=\"44\"\n height=\"44\"\n class=\"size-11 opacity-25 hover:opacity-100 transition-opacity rounded-lg\"\n :class=\"{ 'opacity-100': activeIndex === index }\"\n alt=\"\"\n @click=\"onThumbClick(index)\"\n >\n \u003C/UCarousel>\n \u003C/div>\n \u003C/div>\n\u003C/template>\n```\n\n### Additional context\n\n_No response_",[3226,3229,3230],{"name":3227,"color":3228},"enhancement","a2eeef",{"name":3207,"color":3208},{"name":3210,"color":3211},4032,"[Carousel] improve thumb example","2025-05-02T09:58:58Z","https://github.com/nuxt/ui/issues/4032",0.7492256,{"description":3237,"labels":3238,"number":3245,"owner":3184,"repository":3218,"state":3186,"title":3246,"updated_at":3247,"url":3248,"score":3249},"### 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```",[3239,3240,3243,3244],{"name":3181,"color":3205},{"name":3241,"color":3242},"needs reproduction","CB47CF",{"name":3207,"color":3208},{"name":3213,"color":3214},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.7525831,{"description":3251,"labels":3252,"number":1229,"owner":3184,"repository":3185,"state":3186,"title":3255,"updated_at":3256,"url":3257,"score":3258},"https://www.figma.com/file/OLlmzoVQ7FSBh4FJJORNpl/nuxt.com?node-id=2441%3A11054",[3253],{"name":3227,"color":3254},"1ad6ff","Improve docs navigation bar","2023-02-15T12:30:39Z","https://github.com/nuxt/nuxt.com/issues/115",0.7529727,{"description":3260,"labels":3261,"number":1229,"owner":3184,"repository":3262,"state":3186,"title":3263,"updated_at":3264,"url":3265,"score":3258},"If I have my global scripts set up like so:\r\n\r\n\r\n\r\nThen the scripts are output as expected on the frontend:\r\n\r\n\r\n\r\nHowever, if I pass in a UseScriptInput object, like so:\r\n\r\n\r\n\r\nThen the script is not output:\r\n\r\n\r\n\r\nIf I pass [UseScriptInput, NuxtUseScriptOptions], like so:\r\n\r\n\r\n\r\nI get this error:\r\n\r\n\r\n\r\nENV:\r\nbun 1.1.16\r\nnuxt 3.12.2\r\n@nuxt/scripts 0.5.1\r\n\r\nRunning with compatibility version 4\r\n",[],"scripts","Issues using UseScriptInput in the globals section of nuxt.config.ts","2024-07-03T09:16:13Z","https://github.com/nuxt/scripts/issues/115",{"description":3267,"labels":3268,"number":3272,"owner":3184,"repository":3218,"state":3186,"title":3273,"updated_at":3274,"url":3275,"score":3276},"### 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_",[3269,3270,3271],{"name":3227,"color":3228},{"name":3207,"color":3208},{"name":3210,"color":3211},4494,"Carousel component could be made more accessible (v3).","2025-07-10T12:18:41Z","https://github.com/nuxt/ui/issues/4494",0.7594856,{"description":3278,"labels":3279,"number":3283,"owner":3184,"repository":3218,"state":3186,"title":3284,"updated_at":3285,"url":3286,"score":3287},"### Description\n\n## Description\n\nIn Nuxt UI v3, there is currently no way to apply custom styles or classes to individual table rows or cells. Additionally, it is not possible to dynamically set classes based on specific criteria, for example, the value of data displayed in a given cell.\n\nIn contrast, this feature was available in Nuxt UI v2, as documented in the [official documentation](https://ui2.nuxt.com/components/table). In that version, custom classes could be applied by simply adding a `class` property to a specific row's data:\n\n```js\nconst items = [{\n id: 1,\n name: 'Apple',\n quantity: { value: 100, class: 'bg-green-500/50 dark:bg-green-400/50' }\n}, {\n id: 2,\n name: 'Orange',\n quantity: { value: 0 },\n // Class property\n class: 'bg-red-500/50 dark:bg-red-400/50 animate-pulse'\n}]\n```\n\n\n### Additional context\n\n_No response_",[3280,3281,3282],{"name":3227,"color":3228},{"name":3207,"color":3208},{"name":3210,"color":3211},3865,"Table: conditionally apply classes to tr and td elements","2025-04-22T19:14:59Z","https://github.com/nuxt/ui/issues/3865",0.7610104,{"description":3289,"labels":3290,"number":3295,"owner":3184,"repository":3218,"state":3186,"title":3296,"updated_at":3297,"url":3298,"score":3299},"### Description\n\nhow to run vitest with `nuxt/ui` components?\n\nexample repo: https://github.com/OrbisK/nuxt-ui-vue-starter/tree/test/repoduction\n\n1. `pnpm i`\n2. `pnpm test`\n3. `TypeError: Package import specifier \"#imports\" is not defined in package /var/www/html/node_modules/@nuxt/ui/package.json imported from /var/www/html/node_modules/@nuxt/ui/dist/runtime/plugins/colors.js`\n\n```ts\nimport App from './App.vue'\nimport {mount} from '@vue/test-utils'\nimport ui from '@nuxt/ui/vue-plugin'\n\nit(\"should render button\", ()=>{\n const wrapper = mount(App, {\n global: {\n plugins: [ui]\n }\n })\n})\n```",[3291,3294],{"name":3292,"color":3293},"question","d876e3",{"name":3207,"color":3208},3814,"nuxt/ui with vitest `Package import specifier \"#imports\" is not defined`","2025-04-07T08:00:21Z","https://github.com/nuxt/ui/issues/3814",0.76282555,["Reactive",3301],{},["Set"],["ShallowReactive",3304],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fpzhP8e0fk50C_a9j4z_3UfvVCLGdis5qV-HUpS8N54s":-1},"/nuxt/fonts/593"]