\u003Cbr />\n \u003CUButton @click=\"fnOpenModal\">Open FooModal from code\u003C/UButton>\n \u003C/UContainer>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\n import { FooModal } from '#components';\n\n const overlay = useOverlay();\n\n const foo = overlay.create(FooModal);\n\n const fnOpenModal = async () => {\n foo.open();\n };\n\n const fnHandleAction = (action) => {\n console.log(\"Handle FooModal action: \", action);\n };\n\u003C/script>\n```\n\n**FooModal**\n```\n\u003Ctemplate>\n \u003CUModal v-model:open=\"open\" title=\"Foobar\">\n \u003CUButton label=\"Open FooModal from modal\" color=\"neutral\" variant=\"subtle\" />\n\n \u003Ctemplate #body>\n \u003CUButton @click=\"click()\" >Submit\u003C/UButton>\n \u003C/template>\n \u003C/UModal>\n\u003C/template>\n\n\u003Cscript lang=\"ts\" setup>\n const open = ref(false);\n\n const emits = defineEmits(['some-action']);\n\n const click = () => {\n console.log(\"clicked from inside the modal\");\n emits('some-action', 'closing'); //emits does not work if Modal opened using useOverlay.\n open.value = false; //closing modal does not work if Modal opened using useOverlay.\n };\n\u003C/script>\n```\n\n### Description\n\nHello Nuxt UI team,\n\nThank you for providing a high-quality UI library. I truly appreciate the effort you put into creating and maintaining it.\n\nI have encountered an issue while using `UModal` in my application. The modal is used to create and/or update database entries, and it needs to be opened in two different ways:\n\n1. Via a `UButton` that is always present on the screen (provided by the modal itself).\n2. Programmatically, through a link in a dropdown menu, using `useOverlay`.\n\nWhen the modal is opened using the first method, everything works as expected. However, when it is opened programmatically using the second method, the modal does not behave the same way. Specifically:\n\n- I am unable to trigger an `emit` to notify the parent component that the update was successful.\n- The modal does not close properly using the `open.value = false` technique.\n\nI am unsure if this behavior is intentional or a bug. I was under the impression that `UModal` and `useOverlay` should work seamlessly together and exhibit consistent behavior. Could you please confirm whether this is a valid concern?\n\nThank you for your time and attention to this matter. I look forward to your guidance.\n\n**Note**: You'll also notice that the button within the modal appears on the screen when opened using `useOverlay`. It would be helpful if it could be hidden automatically, but I believe this is something I can control easily. As such, I do not consider this to be a bug.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2953,2954,2955],{"name":2927,"color":2928},{"name":2907,"color":2908},{"name":2910,"color":2911},3432,"UModal and useOverlay compatibility Issue","2025-03-11T13:57:03Z","https://github.com/nuxt/ui/issues/3432",0.71660084,{"description":2962,"labels":2963,"number":2965,"owner":2913,"repository":2914,"state":2945,"title":2966,"updated_at":2967,"url":2968,"score":2969},"### 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_",[2964],{"name":2904,"color":2905},2398,"Define default type for Divider","2024-10-19T12:19:23Z","https://github.com/nuxt/ui/issues/2398",0.71787477,{"description":2971,"labels":2972,"number":2975,"owner":2913,"repository":2914,"state":2945,"title":2976,"updated_at":2977,"url":2978,"score":2979},"https://www.radix-vue.com/components/select.html#scrollupbutton",[2973,2974],{"name":2904,"color":2905},{"name":2907,"color":2908},2145,"[Select] Handle scroll buttons","2025-04-21T20:05:00Z","https://github.com/nuxt/ui/issues/2145",0.72177166,{"description":2981,"labels":2982,"number":2987,"owner":2913,"repository":2914,"state":2945,"title":2988,"updated_at":2989,"url":2990,"score":2991},"### For what version of Nuxt UI are you suggesting this?\n\nv2.x\n\n### Description\n\nWhen validating an object, a FormGroup does not display validations of specific properties (at least not with details).\n\nWould it make sense for the name `myobj` to display errors from anything that looks like `myobj\\..*` ? it could show all of them, each on a newline.\n\n### Additional context\n\nhttps://github.com/nuxt/ui/issues/1898",[2983,2984,2986],{"name":2904,"color":2905},{"name":2985,"color":2911},"wontfix-v2",{"name":2907,"color":2908},2569,"Display zod validation errors based on prefix","2024-11-11T18:28:09Z","https://github.com/nuxt/ui/issues/2569",0.722673,{"description":2993,"labels":2994,"number":2997,"owner":2913,"repository":2914,"state":2945,"title":2998,"updated_at":2999,"url":3000,"score":3001},"### Environment\n\n- Operating System: Linux\n- Node Version: v22.4.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.13.2\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.8\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-alpha.8\n\n### Reproduction\n\n-\n\n### Description\n\nDefault classes of container in [docs](https://ui3.nuxt.dev/components/container#theme) is:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\n**But no one of classes except `mx-auto` is not was created.**\nI change `--ui-container` variable like in [docs](https://ui3.nuxt.dev/getting-started/theme#container):\n```css\n/** app.css */\n\n@import 'tailwindcss';\n@import '@nuxt/ui';\n\n@theme {\n --container-xl: 1280px;\n}\n\n:root {\n --ui-container: var(--container-xl);\n}\n```\nAs result, container classes is `max-w-7xl mx-auto px-4 sm:px-6 lg:px-8` and still not was created, except `mx-auto`.\n\nBut if i create `app.config.ts`:\n```ts\nexport default defineAppConfig({\n ui: {\n container: {\n base: 'max-w-[var(--ui-container)] mx-auto px-4 sm:px-6 lg:px-8'\n }\n }\n})\n```\nAll is ok, width and other classes are created and applying.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2995,2996],{"name":2927,"color":2928},{"name":2907,"color":2908},2655,"Classes of container component are not working properly","2024-11-16T13:13:33Z","https://github.com/nuxt/ui/issues/2655",0.7249382,{"description":3003,"labels":3004,"number":3008,"owner":2913,"repository":2913,"state":2945,"title":3009,"updated_at":3010,"url":3011,"score":3012},"### Environment\n\n System:\n OS: Linux 5.15 Ubuntu 22.04.5 LTS 22.04.5 LTS (Jammy Jellyfish)\n CPU: (18) x64 Intel(R) Core(TM) Ultra 5 125H\n Memory: 10.04 GB / 15.43 GB\n Container: Yes\n Shell: 5.8.1 - /usr/bin/zsh\n Binaries:\n Node: 22.8.0 - ~/.nvm/versions/node/v22.8.0/bin/node\n pnpm: 9.12.0 - /mnt/c/Program Files/nodejs/pnpm\n npmPackages:\n nuxt: ^3.13.2 => 3.13.2 \n vue: latest => 3.5.11 \n\n### Reproduction\n\nhttps://stackblitz.com/edit/github-gdblwc?file=app.vue\n\napp.vue:\n```vue\n\u003Cscript setup lang=\"ts\">\n// This causes `nuxt build` to report an error\n// import {parse} from \"vue/compiler-sfc\"\n\n// This causes `nuxt generate` to report an error\nimport {parse} from \"@vue/compiler-sfc\"\n\nconst source= `\u003Ctemplate>\u003Cdiv>111\u003C/div>\u003C/template>`\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cdiv>\n {{ parse(source) }}\n \u003C/div>\n\u003C/template>\n\n```\n\n### Describe the bug\n\n### Use \"vue/compiler-sfc\" and run `nuxt build`\n\n```bash\n[nitro 11:58:43 AM] ERROR TypeError [ERR_INVALID_ARG_TYPE]: The \"path\" argument must be of type string. Received type function ([Function (anonymous)])\n\n\nundefined\n\n\n[11:58:43 AM] ERROR The \"path\" argument must be of type string. Received type function ([Function (anonymous)])\n\n at __node_internal_captureLargerStackTrace2 (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:5335)\n at new NodeError (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:4149)\n at validateString (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:265:1272)\n at Function.join (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:287:7889)\n at Object.mockPath [as then] (node_modules/@vercel/nft/out/analyze.js#cjs:174:27) \n\n\n\n[11:58:43 AM] ERROR The \"path\" argument must be of type string. Received type function ([Function (anonymous)])\n\n\n~/projects/gqairmgblw.github 36s\n```\n\n### Use \"@vue/compiler-sfc\" and run `nuxt generate`\n\n```bash\n[nitro 11:55:11 AM] ℹ Prerendering 3 initial routes with crawler\n\n[11:55:13 AM] ERROR [nuxt] [request error] [unhandled] [500] Cannot find package 'velocityjs' imported from /home/projects/gqairmgblw.github/.nuxt/prerender/chunks/build/server.mjs\n at __node_internal_captureLargerStackTrace2 (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:5335) \n at new NodeError (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:4149) \n at packageResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:9724) \n at moduleResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:10188) \n at defaultResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:12372) \n at ModuleLoader.defaultResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:3284) \n at ModuleLoader.resolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:2989) \n at ModuleLoader.getModuleJob (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:1938) \n at https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:155:1047 \n at _0x24d9dc.link (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/blitz.134daa3c.js:40:786141) \n at https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:155:1002\n\n\n[11:55:13 AM] ERROR [nuxt] [request error] [unhandled] [500] Cannot find package 'velocityjs' imported from /home/projects/gqairmgblw.github/.nuxt/prerender/chunks/build/server.mjs\n at __node_internal_captureLargerStackTrace2 (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:5335) \n at new NodeError (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:101:4149) \n at packageResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:9724) \n at moduleResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:10188) \n at defaultResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:158:12372) \n at ModuleLoader.defaultResolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:3284) \n at ModuleLoader.resolve (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:2989) \n at ModuleLoader.getModuleJob (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:154:1938) \n at https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:155:1047 \n at _0x24d9dc.link (https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/blitz.134daa3c.js:40:786141) \n at https://gqairmgblwgithub-c5kt.w-credentialless-staticblitz.com/builtins.ddb8d84d.js:155:1002\n\n[nitro 11:55:13 AM] ├─ / (1188ms)\n │ └── Error: [500] \n[nitro 11:55:13 AM] ├─ /200.html (1173ms)\n[nitro 11:55:13 AM] ├─ /404.html (1174ms)\n[nitro 11:55:13 AM] \nErrors prerendering:\n[nitro 11:55:13 AM] ├─ / (1188ms)\n │ └── Error: [500] \n[nitro 11:55:13 AM] \n\n[11:55:13 AM] ERROR Exiting due to prerender errors.\n\n at Module.prerender (node_modules/nitropack/dist/chunks/prerender.mjs:235:11)\n at async eval (node_modules/nuxt/dist/index.mjs:3645:5) \n\n\n\n[11:55:13 AM] ERROR Exiting due to prerender errors.\n\n```\n\n### Additional context\n\nThis is the same as part #28208, but I didn't think the copy there was small enough, so opened this one.\n\nI don't see `velocityjs` in pnpm-lock.yaml, it's like a module that appeared out of thin air.\n\nAnd `velocityjs` is not a special case, if you install `velocityjs`, there will be other non-existent dependencies that will give the same error.\n\n\n### Logs\n\n_No response_",[3005],{"name":3006,"color":3007},"pending triage","E99695",29312,"Unable to use `vue/compiler-sfc` or `@vue/compiler-sfc` with nuxt","2025-01-26T18:13:25Z","https://github.com/nuxt/nuxt/issues/29312",0.72721934,{"description":3014,"labels":3015,"number":3016,"owner":2913,"repository":3017,"state":2945,"title":3018,"updated_at":3019,"url":3020,"score":3021},"After using `pnpm update` to upgrade vue to 3.4.3, the console throws a lot of `Hydration mismatch`. If I am using vue 3.3.13, no `Hydration mismatch` warnings will be thrown.\r\n\r\n\u003Cimg width=\"1402\" alt=\"SCR-20240103-qagg\" src=\"https://github.com/nuxt/nuxt.com/assets/133459587/188ac1c4-e19a-4570-a5d0-4863c92a7bda\">\r\n",[],1467,"nuxt.com","About vue@3.4.3 causing hydration mismatch","2024-05-03T00:34:36Z","https://github.com/nuxt/nuxt.com/issues/1467",0.7273282,["Reactive",3023],{},["Set"],["ShallowReactive",3026],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fCdZpzkdK9d4cTuqDyh_8iIIqzVqIDQ_9sTZevjFpYSM":-1},"/nuxt/ui/2691"]