\n \u003C/template>\n\u003C/UModal>\n```\n\n\n### Description\n\nselect menu's search input always autofocus inside modal, even when the autofocus is set to false.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2876,2879,2882],{"name":2877,"color":2878},"bug","d73a4a",{"name":2880,"color":2881},"v3","49DCB8",{"name":2883,"color":2884},"triage","ffffff",3933,"ui","SelectMenu's autofocus doesn't work inside Modal","2025-04-19T06:22:26Z","https://github.com/nuxt/ui/issues/3933",0.67235875,{"description":2892,"labels":2893,"number":2898,"owner":2866,"repository":2886,"state":2868,"title":2899,"updated_at":2900,"url":2901,"score":2902},"### Description\n\nHi, I'm having a hard time applying transition to dark / light background.\n\nMy `main.css` file is as follows.\n\nChanging the background color from `slate` to `stone`, for example, works fine.\n\nThe problem is just for the light / dark theme transition.\n\n```\n:root {\n --ui-bg: var(--ui-color-neutral-100);\n}\n\n.dark {\n --ui-bg: var(--ui-color-neutral-900);\n}\n\n@layer base {\n body {\n @apply transition-colors duration-1000;\n }\n}\n```\n\nHere is the function that changes the theme:\n\n```\nconst isDark = computed({\n get() {\n return colorMode.value === 'dark';\n },\n set() {\n colorMode.preference = colorMode.value === 'dark' ? 'light' : 'dark';\n },\n});\n```\n\nAny help would be appreciated, thanks!\n",[2894,2897],{"name":2895,"color":2896},"question","d876e3",{"name":2880,"color":2881},3645,"Applying transition-colors to light / dark theme","2025-03-21T16:20:57Z","https://github.com/nuxt/ui/issues/3645",0.6771996,{"description":2904,"labels":2905,"number":2908,"owner":2866,"repository":2886,"state":2868,"title":2909,"updated_at":2910,"url":2911,"score":2912},"### Environment\n\n- Operating System: Linux\n- Node Version: v18.20.3\n- Nuxt Version: 3.15.2\n- CLI Version: 3.20.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@8.15.6\n- Builder: -\n- User Config: modules\n- Runtime Modules: @nuxt/ui@2.21.0\n- Build Modules: -\n\n### Version\n\nv2.21.0\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-kt7kxa75?file=app.vue\n\n### Description\n\nThe position of the arrow of a tooltip which is used inside a popover appears in the wrong position if the `top` placement is used\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2906,2907],{"name":2877,"color":2878},{"name":2883,"color":2884},3164,"Bug on tooltip arrow position if inside a popover","2025-01-23T09:36:39Z","https://github.com/nuxt/ui/issues/3164",0.6815249,{"description":2914,"labels":2915,"number":2918,"owner":2866,"repository":2886,"state":2919,"title":2920,"updated_at":2921,"url":2922,"score":2923},"### Description\n\nBefore using `nuxt ui`, I briefly skimmed through the repository and found an already closed issue: [3018](https://github.com/nuxt/ui/issues/3018)\n\nThe error and solution mentioned in this issue (the [v2 documentation](https://ui.nuxt.com/getting-started/installation) indeed did not mention the solution) can actually be resolved by adding `tailwindcss@next` to the `peerDependencies` section in the `package.json` file.\n\nThis is because when [nuxi module add](https://github.com/nuxt/cli/blob/1afc06e8d08ea781fc5fede343de8d68865c2b4e/packages/nuxi/src/commands/module/add.ts#L134) installs a module, it not only installs the module itself but also scans the module package's `peerDependencies`.\n\nFor example, when using `nuxi module add pinia`, since `@pinia/nuxt` has `pinia` listed in its `peerDependencies` in the [package.json](https://github.com/vuejs/pinia/blob/3b21e08b6a068d18112b915b83f702fb5504ab73/packages/nuxt/package.json#L51C4-L51C20), both `@pinia/nuxt` and `pinia` will be automatically installed during the module installation.\n\nIf there are dependencies in `peerDependencies` that you do not want `nuxi module` to install automatically, you can use `peerDependenciesMeta` to ignore them, for [example](https://github.com/atinux/nuxt-auth-utils/blob/6b61b8888e3b3c6f60fd5ff767b7f0aa6cf09fc9/package.json#L57):\n\n```\n\"peerDependenciesMeta\": {\n \"pinia\": {\n \"optional\": true\n }\n },\n```\n\nTherefore, Nuxt UI can specify `tailwindcss@next` in the `peerDependencies` of `package.json`, ensuring Tailwind CSS is automatically installed when the Nuxt UI module is installed.\n\nThis solution applies to both v3 and v2.\n\n> PS: I noticed `typescript` in the `peerDependencies` of the v3 package.json. Is this a necessary dependency similar to `tailwindcss`? If not, after adding tailwindcss, perhaps `peerDependenciesMeta` could be used to ignore it.",[2916,2917],{"name":2895,"color":2896},{"name":2880,"color":2881},3349,"closed","Add \"tailwindcss@next\" to the \"peerDependencies\" section in the package.json file.","2025-02-21T17:05:10Z","https://github.com/nuxt/ui/issues/3349",0.66009045,{"description":2925,"labels":2926,"number":2929,"owner":2866,"repository":2886,"state":2919,"title":2930,"updated_at":2931,"url":2932,"score":2933},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v20.10.0`\n- Nuxt Version: `3.14.159`\n- CLI Version: `3.15.0`\n- Nitro Version: `2.10.4`\n- Package Manager: `npm@10.9.0`\n- Builder: `-`\n- User Config: `default`\n- Runtime Modules: `@nuxt/ui@3.0.0-alpha.8`, `nuxt-svgo@4.0.9`\n- Build Modules: `-`\n\n### Version\n\nv3.0.0-alpha.8\n\n### Reproduction\n\nhttps://stackblitz.com/edit/nuxt-ui-h9x1yj\n\n### Description\n\nWhen using the vertical NavigationMenu, `defaultOpen` doesn't work...\n\n\"When orientation is vertical, a [Collapsible](https://ui3.nuxt.dev/components/collapsible) component is used to display children. You can control the open state of each item using the `open` and `defaultOpen` properties.\" - [link here](https://ui3.nuxt.dev/components/navigation-menu#orientation).\n\nPS I tried `open` as well: same issue.\n\n### Additional context\n\n```vue\n\u003Cscript setup lang=\"ts\">\n/* Types */\nimport type { NavigationMenuItem } from '#ui/types';\n\nconst items = ref\u003CNavigationMenuItem[][]>([\n [\n {\n label: 'Menu 1',\n defaultOpen: true, // ! This doesn't work\n open: true, // ! This doesn't work\n children: [\n {\n label: 'Submenu 1',\n to: '/submenu-1',\n },\n {\n label: 'Submenu 2',\n to: '/submenu-2',\n },\n ],\n },\n {\n label: 'Menu 2',\n defaultOpen: true, // ! This doesn't work\n open: true, // ! This doesn't work\n children: [\n {\n label: 'Submenu 1',\n to: '/submenu-1',\n },\n {\n label: 'Submenu 2',\n to: '/submenu-2',\n },\n ],\n },\n ],\n]);\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cdiv class=\"h-full\">\n \u003CUNavigationMenu orientation=\"vertical\" :items=\"items\" />\n \u003C/div>\n\u003C/template>\n```\n\n### Logs\n\n```shell-script\n\n```",[2927,2928],{"name":2877,"color":2878},{"name":2880,"color":2881},2755,"Veritcal NavigationMenu - `defaultOpen` doesn't work","2024-11-26T10:29:27Z","https://github.com/nuxt/ui/issues/2755",0.6627287,{"description":2935,"labels":2936,"number":2941,"owner":2866,"repository":2886,"state":2919,"title":2942,"updated_at":2943,"url":2944,"score":2945},"### For what version of Nuxt UI are you suggesting this?\n\nv3-alpha\n\n### Description\n\nIn v2 (https://ui.nuxt.com/components/modal#prevent-close):\n> Use the prevent-close prop to disable the outside click alongside the esc keyboard shortcut. A close-prevented event will be emitted when the user tries to close the modal.\n\nIn v3 (https://ui3.nuxt.dev/components/modal#prevent-close):\n> Use the prevent-close prop to prevent the Modal from being closed when clicking outside of it.\n\nI'd like to have similar behavior in v3 as in v2, i.e. being able to prevent closing the modal (by any means) but being able to capture and handle this event on my own.\n\n### Additional context\n\n_No response_",[2937,2940],{"name":2938,"color":2939},"enhancement","a2eeef",{"name":2880,"color":2881},2501,"[Modal] prevent-close differs between v2 and v3","2024-11-10T09:20:14Z","https://github.com/nuxt/ui/issues/2501",0.6635567,{"description":2947,"labels":2948,"number":2950,"owner":2866,"repository":2886,"state":2919,"title":2951,"updated_at":2952,"url":2953,"score":2954},"### For what version of Nuxt UI are you suggesting this?\n\nv2.x\n\n### Description\n\nThe config of the divider component allows to define types:\n\n```\ntype: {\n solid: 'border-solid',\n dotted: 'border-dotted',\n dashed: 'border-dashed',\n},\n```\n\nHowever, the solid type is set by default and can only be changed per Divider component, not globally via config. It would be great to be able to set a custom default type like so:\n\n```\ndefault: {\n border: {\n type: 'dotted',\n },\n},\n```\n\n### Additional context\n\n_No response_",[2949],{"name":2938,"color":2939},2398,"Define default type for Divider","2024-10-19T12:19:23Z","https://github.com/nuxt/ui/issues/2398",0.664534,{"description":2956,"labels":2957,"number":2960,"owner":2866,"repository":2886,"state":2919,"title":2961,"updated_at":2962,"url":2963,"score":2964},"### Description\n\nHello, I just wanted to overwrite shadow-sm with another shadow in the card root slot.\nBut I failed to do so. I tried the :ui way and the app.config.ts way but in both cases the new class \"shadow-card\" ended up BEHIND \"shadow-sm\".\n\n```\n card: {\n slots: {\n root: \"shadow-card\",\n },\n },\n```\n\nSo shadow-card always gets overwritten by shadow-sm cause the code always ends up like this:\n```\n\u003Cdiv class=\"bg-[var(--ui-bg)] ring ring-[var(--ui-border)] divide-y divide-[var(--ui-border)] rounded-[calc(var(--ui-radius)*2)] shadow-sm shadow-card\">\n```\n\nso how can I overwrite shadow-sm here?",[2958,2959],{"name":2895,"color":2896},{"name":2880,"color":2881},2936,"Overwrite css classes of slots","2025-01-08T16:26:22Z","https://github.com/nuxt/ui/issues/2936",0.66887957,{"description":2966,"labels":2967,"number":2968,"owner":2866,"repository":2867,"state":2919,"title":2969,"updated_at":2970,"url":2971,"score":2972},"On the 'Enterprise Jobs' page, location badges were closely together on mobile screens. I removed the `mr-3` class from the badge element and placed the badges inside a parent `\u003Cdiv>` with the classes` flex`, `flex-wrap`, and `gap-3` Now it won't stick together and will look good on mobile devices.\r\n\r\n| **BEFORE** | **AFTER** | \r\n|-------- | ------ | \r\n|  |  |\r\n\r\n\r\n\r\n\n```[tasklist]\n### Tasks\n```\n",[],1403,"Spacing issue with Location badges on 'Enterprise Jobs' page for mobile screens","2024-09-19T19:38:43Z","https://github.com/nuxt/nuxt.com/issues/1403",0.6736921,["Reactive",2974],{},["Set"],["ShallowReactive",2977],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fjSK9WVoR8PWkSjNNLiW4ELv_-S7TpB0vMbazxj9k050":-1},"/nuxt/ui/2301"]