\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```",[2938,2939,2940],{"name":2871,"color":2872},{"name":2902,"color":2903},{"name":2905,"color":2906},3432,"UModal and useOverlay compatibility Issue","2025-03-11T13:57:03Z","https://github.com/nuxt/ui/issues/3432",0.68308294,{"description":2947,"labels":2948,"number":2951,"owner":2880,"repository":2890,"state":2930,"title":2952,"updated_at":2953,"url":2954,"score":2955},"https://content-v2.nuxtjs.org/guide/writing/mdc#props\n\n",[2949],{"name":2871,"color":2950},"ff281a",496,"[Milkdown] On serialize, component props should keep their current format `inline` or `yaml`","2023-06-06T12:14:53Z","https://github.com/nuxt/nuxt.com/issues/496",0.69489735,{"description":2957,"labels":2958,"number":2951,"owner":2880,"repository":2962,"state":2930,"title":2963,"updated_at":2964,"url":2965,"score":2955},"",[2959],{"name":2960,"color":2961},"vitest-environment","b60205","test-utils","documentation/examples","2023-12-02T22:52:29Z","https://github.com/nuxt/test-utils/issues/496",{"description":2967,"labels":2968,"number":2970,"owner":2880,"repository":2908,"state":2930,"title":2971,"updated_at":2972,"url":2973,"score":2974},"### Environment\n\n```\n- Operating System: Linux\n- Node Version: v20.18.0\n- Nuxt Version: 3.14.159\n- CLI Version: 3.15.0\n- Nitro Version: 2.10.4\n- Package Manager: npm@10.8.2\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@2.19.2, @nuxt/eslint@0.7.1, @pinia/nuxt@0.7.0\n- Build Modules: -\n```\n\n### Version\n\nv2.19.2\n\n### Reproduction\n\nThis is the same page with @nuxt/ui v2.19.2 : https://stackblitz.com/edit/nuxt-ui-jxfvsf?file=pages%2Findex.vue (validation doesn't work)\n\nThis is the same page with @nuxt/ui v2.18.7 : https://stackblitz.com/edit/nuxt-ui-np2mhw?file=pages%2Findex.vue (validation works)\n\n\n### Description\n\nAsync form validation with yup of the \"username\" field works perfectly in v2.18.7 - by entering a 4-letter word for example, after one second you get a \"username already exists\" error underneath the field, as expected.\n\nHowever when we use v2.19.2, no validation of the \"username\" field works - neither the async nor the min length one.\n\nOn my local dev, I get this error in the console in v2.19.2 when I leave the field:\n\n```\nUncaught (in promise) Error: Validation test of type: \"duplicate-username\" returned a Promise during a synchronous validate. This test will finish after the validate call has returned\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2969],{"name":2871,"color":2872},2691,"v2.19.2 @nuxt/ui breaks async form validation with yup","2024-12-05T13:48:53Z","https://github.com/nuxt/ui/issues/2691",0.69941175,{"description":2976,"labels":2977,"number":2982,"owner":2880,"repository":2908,"state":2930,"title":2983,"updated_at":2984,"url":2985,"score":2986},"### Environment\n\nNuxt 3.15.4\nNuxt UI https://pkg.pr.new/@nuxt/ui@e7e7585\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\n3.15.4\n\n### Reproduction\n\n-\n\n### Description\n\nJust noticed the following components work as expected in a fieldForm\n\n```\n \u003CUFormField\n v-if=\"isVisible\"\n :name=\"fieldName\"\n :label=\"field['#title']\"\n :required=\"!!field['#required']\"\n >\n \u003Ctemplate\n v-if=\"descriptionContent && field['#type'] !== 'checkbox'\"\n #description\n >\n \u003Cspan v-html=\"cleanHTML(descriptionContent)\" />\n \u003C/template>\n\n \u003Ccomponent\n v-if=\"resolvedComponent\"\n :is=\"resolvedComponent\"\n :field=\"field\"\n :fieldName=\"fieldName\"\n :state=\"state\"\n />\n\n \u003Ctemplate v-if=\"helpContent\" #help>\n \u003Cspan v-html=\"cleanHTML(helpContent)\" />\n \u003C/template>\n \u003C/UFormField>\n```\n\n ```\n \u003CURadioGroup\n v-model=\"state[fieldName]\"\n :items=\"transformOptions(field['#options'] || {})\"\n orientation=\"horizontal\"\n class=\"w-full\"\n />\n```\n\n```\n \u003CUSelect\n v-model=\"state[fieldName]\"\n placeholder=\"Select\"\n :items=\"transformOptions(field['#options'] || {})\"\n class=\"w-full\"\n />\n\n```\nHowever when using a UCheckbox label and description have to be set here\n\n```\n \u003CUCheckbox\n v-model=\"checkboxValue\"\n :label=\"field['#title']\"\n :description=\"field['#description']\"\n class=\"w-full\"\n @update:model-value=\"props.state[fieldName] = $event\"\n />\n```\n\nSeems like this is a bug or maybe this is by design?\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2978,2981],{"name":2979,"color":2980},"question","d876e3",{"name":2902,"color":2903},3294,"UCheckbox fieldform support","2025-02-12T19:23:36Z","https://github.com/nuxt/ui/issues/3294",0.700057,["Reactive",2988],{},["Set"],["ShallowReactive",2991],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$fY2xymvitSy3wawUMmO2VJDojKMx9yKmpFJfsxAOsXy4":-1},"/nuxt/ui/3565"]