\n \u003C/UFormGroup>\n\n \u003CUButton type=\"submit\">\n Submit\n \u003C/UButton>\n\n\u003C/UForm>\n```\n\n```ts\n\u003Cscript setup lang=\"ts\">\n import { z } from 'zod';\n\n const state = reactive({\n picture: undefined,\n })\n\n const schema = z.object({\n picture: z.custom\u003CFileList>()\n .transform((val) => {\n if (val instanceof File) return val;\n if (val instanceof FileList) return val[0];\n return null;\n })\n .superRefine((file, ctx) => {\n if (!(file instanceof File)) {\n ctx.addIssue({\n code: z.ZodIssueCode.custom,\n fatal: true,\n message: 'Not a file',\n });\n return z.NEVER;\n }\n if (file.size > 5 * 1024 * 1024) {\n ctx.addIssue({\n code: z.ZodIssueCode.custom,\n message: 'Max file size allowed is 5MB',\n });\n }\n if (\n !['image/jpeg', 'image/png', 'image/webp', 'image/jpg'].includes(\n file.type\n )\n ) {\n ctx.addIssue({\n code: z.ZodIssueCode.custom,\n message: 'File must be an image (jpeg, jpg, png, webp)',\n });\n }\n })\n });\n\n type Schema = z.infer\u003Ctypeof schema>;\n\n async function onSubmit (event: FormSubmitEvent\u003CSchema>) {\n console.log(event.data);\n }\n\u003C/script>\n```\n\nAs aspected the following onChange function logs a FileList\n\n```ts\nfunction onChangeFile(event: Event) {\n console.log(event)\n}\n```\n\nBut when I log val in the transform function of Zod\n\n```ts\n.transform((val) => {\n console.log(val);\n if (val instanceof File) return val;\n if (val instanceof FileList) return val[0];\n return null;\n})\n```\n\nI get a string like this:\n\n```\nC:\\fakepath\\Screenshot 2024-10-25 at 10.26.36.png\n```\n\nCan someone please help me out, i'm looking for a few days now for a solution.",[1984],{"name":1985,"color":1986},"question","d876e3",2462,"nuxt","ui","open","UInput with type='file', how to validate with Zod?","2025-03-10T01:51:18Z","https://github.com/nuxt/ui/issues/2462",0.7288317,{"description":1996,"labels":1997,"number":1999,"owner":1988,"repository":1989,"state":2000,"title":2001,"updated_at":2002,"url":2003,"score":2004},"### Description\r\n\r\nWe use Directus for content. I want to execute a fetch when using the Pagination component but can't figure out how to.\r\n\r\nClicking on a button update the url but it's not reloading the page so `pageNum` is not updated. Is there emits from the component I can use?\r\n\r\nThanks.\r\n\r\n```vue\r\n\u003Cscript setup lang=\"ts\">\r\nimport type { Article } from '~/types'\r\n\r\nconst route = useRoute()\r\n\r\nconst pageNum = ref(Number(route.query.page ?? 1))\r\nconst maxPages = ref(0)\r\nconst ARTICLES_PER_PAGE = 2\r\n\r\nconst url = ref(/* url to Directus */)\r\n\r\nconst { data: rawArticles, error, execute } = await useFetch(() => url.value)\r\nif (error.value)\r\n console.error(error.value)\r\n\r\nmaxPages.value = Math.ceil(Number(rawArticles.value?.meta?.filter_count ?? 1) / ARTICLES_PER_PAGE)\r\nconst articles: Article[] = ref(rawArticles.value.data)\r\n\r\nwatch(route, () => {\r\n console.log(route.path)\r\n console.log(pageNum.value)\r\n execute()\r\n})\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003CUContainer>\r\n \u003CUPageBody>\r\n \u003CUBlogList>\r\n \u003CUBlogPost [...] />\r\n \u003C/UBlogList>\r\n\r\n \u003CUPagination\r\n size=\"sm\"\r\n :model-value=\"pageNum\"\r\n :total=\"maxPages\"\r\n :page-count=\"1\"\r\n show-last\r\n show-first\r\n :to=\"(page: number) => ({\r\n query: { page },\r\n // Hash is specified here to prevent the page from scrolling to the top\r\n hash: '#links',\r\n })\"\r\n @on-click-page=\"(e) => { console.log('current page', e); execute() }\"\r\n />\r\n \u003C/UPageBody>\r\n \u003C/UContainer>\r\n\u003C/template>\r\n```",[1998],{"name":1985,"color":1986},2190,"closed","[Pagination] emits on buttons?","2024-09-12T12:33:01Z","https://github.com/nuxt/ui/issues/2190",0.73756915,{"description":2006,"labels":2007,"number":2012,"owner":1988,"repository":1989,"state":2000,"title":2013,"updated_at":2014,"url":2015,"score":2016},"### Description\n\nIf i try to define the position of the notification using the `ui` prop `\u003CUNotifications :ui=\"{position: 'top-0 right-0'}\" />`\r\nthe \"default\" configuration is applied as well (`bottom-0 end-0 `) this happens also if defining the position using the app.config.ts.. I'm assuming i'm doing it wrong.. please advice.. \r\n",[2008,2011],{"name":2009,"color":2010},"duplicate","cfd3d7",{"name":1985,"color":1986},2180,"Notification position","2024-09-11T14:08:24Z","https://github.com/nuxt/ui/issues/2180",0.7434231,{"description":2018,"labels":2019,"number":2029,"owner":1988,"repository":1989,"state":2000,"title":2030,"updated_at":2031,"url":2032,"score":2033},"### Environment\n\n- Operating System: `Darwin`\n- Node Version: `v22.14.0`\n- Nuxt Version: `3.16.1`\n- CLI Version: `3.23.1`\n- Nitro Version: `2.11.7`\n- Package Manager: `pnpm@10.6.5`\n- Builder: `-`\n- User Config: `modules`, `devtools`, `css`, `routeRules`, `future`, `compatibilityDate`, `eslint`\n- Runtime Modules: `@nuxt/eslint@1.2.0`, `@nuxt/ui-pro@3.0.1`, `@vueuse/nuxt@13.0.0`\n- Build Modules: `-`\n\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/silent-currying-qhjsy6\n\n### Description\n\n* 当 Avatar 有图片内容时可以作为 UPopover 的 Trigger 被触发\n* 当 Avatar 展示子插槽内容,不能成功触发 UPopover\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2020,2023,2026],{"name":2021,"color":2022},"bug","d73a4a",{"name":2024,"color":2025},"v3","49DCB8",{"name":2027,"color":2028},"triage","ffffff",3710,"cant use u-avatar as triggers for u-popover","2025-03-28T09:27:27Z","https://github.com/nuxt/ui/issues/3710",0.74344015,{"description":2035,"labels":2036,"number":2037,"owner":1988,"repository":2038,"state":2000,"title":2039,"updated_at":2040,"url":2041,"score":2042},"Open https://nuxt.com/docs/guide/directory-structure/composables, **Introduction** page is shown instead of **Composables**\n\n\n\nI think the regression is due to 43b0f43",[],1752,"nuxt.com","All docs/[...slug] routes show Introduction page","2025-01-14T11:25:53Z","https://github.com/nuxt/nuxt.com/issues/1752",0.74411774,{"description":2044,"labels":2045,"number":2050,"owner":1988,"repository":2051,"state":2000,"title":2052,"updated_at":2053,"url":2054,"score":2055},"### Environment\r\n\r\nN/A\r\n\r\n### Reproduction\r\n\r\nN/A\r\n\r\n### Describe the bug\r\n\r\nsetup fails\r\n\r\n### Additional context\r\n\r\ncc: @tobiasdiez \r\n\r\nHere are the lines\r\n\r\nhttps://github.com/nuxt/test-utils/blob/86d09da23a2d7ba6b0f3dcf2e9ca8c21655a5218/src/core/server.ts#L17-L71\r\n\r\noffending line for me was 57, but could easily be any other lines\r\n\r\nhttps://github.com/nuxt/test-utils/commit/c4df41db447afe6101df10fbe763b198b12da86d\r\n\r\nis the offending commit \r\n\r\nspecifically this change\r\n\r\nhttps://github.com/nuxt/test-utils/commit/c4df41db447afe6101df10fbe763b198b12da86d#diff-84e9c1e393b43cee97ce99909a2db3a09bf9a2435daa2066b01a838e206edec3\r\n\r\n### Logs\r\n\r\n```shell-script\r\nN/A\r\n```\r\n",[2046,2047],{"name":2021,"color":2022},{"name":2048,"color":2049},"pending triage","5D08F5",918,"test-utils","`ctx.nuxt` does not exist when `build: false` in setup","2024-12-05T14:26:41Z","https://github.com/nuxt/test-utils/issues/918",0.75000036,{"labels":2057,"number":2064,"owner":1988,"repository":1988,"state":2000,"title":2065,"updated_at":2066,"url":2067,"score":2068},[2058,2061],{"name":2059,"color":2060},"enhancement","8DEF37",{"name":2062,"color":2063},"2.x","d4c5f9",10175," Need a solution that can show full url in data static or assets","2023-02-15T00:48:21Z","https://github.com/nuxt/nuxt/issues/10175",0.7502692,{"description":2070,"labels":2071,"number":2075,"owner":1988,"repository":1989,"state":2000,"title":2076,"updated_at":2077,"url":2078,"score":2079},"### Description\n\nThe [documentation](https://ui.nuxt.com/components/date-picker) uses v-calendar as an example to create a date picker component. However, v-calendar is likely abandoned and will no longer be maintained (see https://github.com/nathanreyes/v-calendar/issues/1503 ) . Latest release was over a year ago.\n\nAlso, it has a dependency on a vulnerable lodash version ( see https://github.com/nathanreyes/v-calendar/issues/1420 ).\n\nWhat other alternatives are you planning on using in your documentation, or are there any other examples using a different library?\n\nThanks.",[2072,2073],{"name":1985,"color":1986},{"name":2074,"color":2028},"wontfix-v2",3239,"DatePicker documentation uses library that's no longer maintained","2025-02-04T20:40:38Z","https://github.com/nuxt/ui/issues/3239",0.75099206,{"labels":2081,"number":2085,"owner":1988,"repository":1988,"state":2000,"title":2086,"updated_at":2087,"url":2088,"score":2089},[2082,2084],{"name":2048,"color":2083},"E99695",{"name":2062,"color":2063},8380,"Markdown table not applying","2023-01-22T15:38:23Z","https://github.com/nuxt/nuxt/issues/8380",0.75111574,{"description":2091,"labels":2092,"number":2094,"owner":1988,"repository":2051,"state":2000,"title":2095,"updated_at":2096,"url":2097,"score":2098},"### Environment\n\n- Operating System: Windows_NT\r\n- Node Version: v18.19.0\r\n- Nuxt Version: 3.11.1\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.4\r\n- Package Manager: npm@10.2.3\r\n- Builder: -\r\n- User Config: devtools, modules\r\n- Runtime Modules: @nuxt/test-utils/module\n\n### Reproduction\n\nhttps://github.com/chronicadventure/nuxt-bug\r\n\r\njust run `npm test` and the console will error out. *Note* you don't even need an actual test, just the import causes the entire file to fail.\n\n### Describe the bug\n\nImporting `import { mockNuxtImport } from '@nuxt/test-utils/runtime'` as stated in the docs causes the entire test file to fail.\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\nDEV v1.4.0 C:/Users/AdrianCampos/BugRepo/repro\r\n\r\n ❯ tests/random.nuxt.test.js (0)\r\n\r\n⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯ Failed Suites 1 ⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯\r\n\r\n FAIL tests/random.nuxt.test.js [ tests/random.nuxt.test.js ]\r\nError: Failed to load url #imports (resolved id: #imports) in C:/Users/AdrianCampos/BugRepo/node_modules/@nuxt/test-utils/dist/runtime-utils/index.mjs. Does the file exist?\r\n ❯ loadAndTransform ../node_modules/vite/dist/node/chunks/dep-B-u6xNiR.js:53832:21\r\n\r\n⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯⎯[1/1]⎯\r\n\r\n Test Files 1 failed (1)\r\n Tests no tests\r\n Start at 21:58:52\r\n Duration 2.22s (transform 69ms, setup 0ms, collect 0ms, tests 0ms, environment 0ms, prepare 846ms)\r\n\r\n\r\n FAIL Tests failed. Watching for file changes...\r\n press h to show help, press q to quit\n```\n",[2093],{"name":2048,"color":2049},800,"Failed to load url #imports after importing mockNuxtImport","2024-05-26T19:14:39Z","https://github.com/nuxt/test-utils/issues/800",0.7511706,["Reactive",2100],{},["Set"],["ShallowReactive",2103],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"HnDK0KbvDD8gsJRBeyL_1Q6y6C54HGqgS-Aj5WHj5IE":-1},"/nuxt/ui/3072"]