\n \u003C/UFormField>\n \u003CUFormField\n label=\"Last Name\"\n name=\"lastName\"\n class=\"flex-5\">\n \u003CUInput\n v-model=\"formState.lastName\"\n type=\"text\"\n placeholder=\"Last Name\"\n icon=\"i-heroicons-user-solid\"\n class=\"text-gray-900 dark:text-white\" /> \u003C!-- has no effect -->\n \u003C/UFormField>\n \u003C/div>\n ...\n```\n\n",[2924,2927],{"name":2925,"color":2926},"question","d876e3",{"name":2887,"color":2888},3136,"Q: how to style the text and background color of the UInput component?","2025-01-18T00:58:37Z","https://github.com/nuxt/ui/issues/3136",0.694608,{"description":2934,"labels":2935,"number":2938,"owner":2874,"repository":2893,"state":2916,"title":2939,"updated_at":2940,"url":2941,"score":2942},"### For what version of Nuxt UI are you suggesting this?\n\nv3.0.0-alpha.x\n\n### Description\n\nI noticed that using form validation in Nuxt UI is very simple: Add a schema to a `\u003CUForm>` component and then place `\u003CUFormGroup>`'s with the corresponding names.\n\nUnfortunately in Vue I never found a solution this simple. In fact e.g. the use of VeeValidate is very cumberstone and requires a lot of code.\n\nMight it be possible to refactor the form validation of Nuxt UI as a standalone Vue component that uses slots and provides pure functionality without styling?\n\nE.g. by providing the a \"Form\" component, that auto validated the state and providing the error messages in a reactive object, but most things are handled by the developer:\n\n```vue\n\u003CForm :schema=\"schema\" :state=\"state\" @submit=\"onSubmit\" ref=\"form\">\n \u003Clabel for=\"email\">E-Mail\u003C/label>\n \u003Cinput name=\"email\" type=\"text\" v-model=\"state.email\" />\n \u003Cdiv v-if=\"form.errors.email\">{{ form.errors.email }}\u003C/div>\n\n \u003Cbutton type=\"submit\">Submit\u003C/button>\n\u003C/Form>\n```\n\nInstead of configuring how the form validates (e.g. on each change, only after pressing submit, etc) we could use states for each value like Angular does. There the form validates on each change but each value has multiple states like is-pristine, isDirty, isUntouched and by use of those values triggering the visibility of the error messages can be precisely handled. Example:\n\n```vue\n\u003CForm :schema=\"schema\" :state=\"state\" @submit=\"onSubmit\" ref=\"form\">\n \u003Clabel for=\"email\">E-Mail\u003C/label>\n \u003Cinput name=\"email\" type=\"text\" v-model=\"state.email\" />\n \u003Cdiv v-if=\"form.errors.email && form.values.email.dirty\">{{ form.errors.email }}\u003C/div>\n\n \u003Cbutton type=\"submit\" :disabled=\"!form.isValid\">Submit\u003C/button>\n\u003C/Form>\n```",[2936,2937],{"name":2884,"color":2885},{"name":2887,"color":2888},2768,"Release form validation as standalone library","2024-12-16T09:47:15Z","https://github.com/nuxt/ui/issues/2768",0.70999295,{"description":2944,"labels":2945,"number":2949,"owner":2874,"repository":2893,"state":2916,"title":2950,"updated_at":2951,"url":2952,"score":2953},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.12.0\n- Nuxt Version: 3.16.0\n- CLI Version: 3.22.5\n- Nitro Version: 2.11.6\n- Package Manager: pnpm@10.6.2\n- Builder: -\n- User Config: modules, css, runtimeConfig, uiPro, compatibilityDate, devtools, future, experimental\n- Runtime Modules: @nuxt/eslint@1.2.0, @nuxt/ui-pro@3.0.0, @nuxt/content@3.3.0\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0\n\n### Reproduction\n\n```html\n\u003CProsePre lang=\"yaml\">{{ yaml }}\u003C/ProsePre>\n```\n\n\n### Description\n\nMade sure I have content installed and loaded - renders just fine, copy button shows the ✅ - but nothing is copied\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2946,2947,2948],{"name":2911,"color":2912},{"name":2887,"color":2888},{"name":2890,"color":2891},3545,"Clipboard button doesnt copy content when using ProsePre directly","2025-03-13T00:31:04Z","https://github.com/nuxt/ui/issues/3545",0.7104246,{"description":2955,"labels":2956,"number":2961,"owner":2874,"repository":2874,"state":2916,"title":2962,"updated_at":2963,"url":2964,"score":2965},"### Environment\n\n- Operating System: Darwin\r\n- Node Version: v20.11.1\r\n- Nuxt Version: 3.11.2\r\n- CLI Version: 3.11.1\r\n- Nitro Version: 2.9.6\r\n- Package Manager: pnpm@8.5.1\r\n- Builder: -\r\n- User Config: devtools, extends, modules, runtimeConfig\r\n- Runtime Modules: @nuxt/image@1.5.0\r\n- Build Modules: -\n\n### Reproduction\n\nReproduction url: https://stackblitz.com/edit/github-um9rcm?file=composables%2FuseAppFetch.ts\n\n### Describe the bug\n\nI tried to create my custom composable using the link https://nuxt.com/docs/examples/advanced/use-custom-fetch-composable, but I encountered errors related to typing. \r\nIn useAppFetch on line 15. \r\n\r\n`No overload matches this call.\r\n Overload 1 of 2, '(request: NitroFetchRequest | Ref\u003CNitroFetchRequest> | (() => NitroFetchRequest), opts?: UseFetchOptions\u003CResT extends void ? unknown : ResT, ... 4 more ..., ResT extends void ? \"get\" : AvailableRouterMethod\u003C...>> | undefined): AsyncData\u003C...>', gave the following error.\r\n Argument of type 'UseFetchOptions\u003CResT, ResT, KeysOf\u003CResT>, null, string & {}, AvailableRouterMethod\u003Cstring & {}>>' is not assignable to parameter of type 'UseFetchOptions\u003CResT extends void ? unknown : ResT, ResT extends void ? unknown : ResT, KeysOf\u003CResT extends void ? unknown : ResT>, null, NitroFetchRequest, ResT extends void ? \"get\" : AvailableRouterMethod\u003C...>>'.\r\n Type 'ResT extends void ? unknown : ResT' is not assignable to type 'ResT'.\r\n 'ResT' could be instantiated with an arbitrary type which could be unrelated to 'ResT extends void ? unknown : ResT'.\r\n Overload 2 of 2, '(request: NitroFetchRequest | Ref\u003CNitroFetchRequest> | (() => NitroFetchRequest), opts?: UseFetchOptions\u003CResT extends void ? unknown : ResT, ... 4 more ..., ResT extends void ? \"get\" : AvailableRouterMethod\u003C...>> | undefined): AsyncData\u003C...>', gave the following error.\r\n Argument of type 'UseFetchOptions\u003CResT, ResT, KeysOf\u003CResT>, null, string & {}, AvailableRouterMethod\u003Cstring & {}>>' is not assignable to parameter of type 'UseFetchOptions\u003CResT extends void ? unknown : ResT, ResT extends void ? unknown : ResT, KeysOf\u003CResT extends void ? unknown : ResT>, ResT extends void ? unknown : ResT, NitroFetchRequest, ResT extends void ? \"get\" : AvailableRouterMethod\u003C...>>'.\r\n Type 'ResT extends void ? unknown : ResT' is not assignable to type 'ResT'.\r\n 'ResT' could be instantiated with an arbitrary type which could be unrelated to 'ResT extends void ? unknown : ResT'.(2769)`\r\n\r\n\u003Cimg width=\"685\" alt=\"Screenshot 2024-05-10 at 11 36 59\" src=\"https://github.com/nuxt/nuxt/assets/159756578/f13be891-2199-47f5-bb81-4d79ba6b3e8b\">\r\n\r\n\r\nAlso in app.vue line 5 type error related to 'transform'. But for some reason in stackblitz.com error in app.vue is not displayed. If you copy whole code to VScode it show error.\r\n\r\n`Type '(res: Todo[]) => string[]' is not assignable to type '_Transform\u003CTodo[], Todo[]>'.\r\n Type 'string[]' is not assignable to type 'Todo[] | Promise\u003CTodo[]>'.ts(2322)`\r\n\r\n\u003Cimg width=\"734\" alt=\"Screenshot 2024-05-10 at 11 35 18\" src=\"https://github.com/nuxt/nuxt/assets/159756578/2d9e59cf-93d2-4dfa-bcf5-a8fe1501127c\">\r\n\r\nIt returns transformed value as expected.\r\n\r\nThanks in advance for helping.\r\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n_No response_",[2957,2960],{"name":2958,"color":2959},"3.x","29bc7f",{"name":2871,"color":2872},27142,"Custom useFetch type error","2024-05-12T07:37:52Z","https://github.com/nuxt/nuxt/issues/27142",0.7139485,{"description":2967,"labels":2968,"number":2971,"owner":2874,"repository":2874,"state":2916,"title":2972,"updated_at":2973,"url":2974,"score":2975},"### Environment\r\n\r\n------------------------------\r\n- Operating System: Linux\r\n- Node Version: v18.18.0\r\n- Nuxt Version: 3.8.2\r\n- CLI Version: 3.10.0\r\n- Nitro Version: 2.8.1\r\n- Package Manager: pnpm@8.7.1\r\n- Builder: -\r\n- User Config: modules, runtimeConfig, css, site, linkChecker, devtools\r\n- Runtime Modules: @nuxt/ui@2.11.1, @nuxtseo/module@2.0.0-beta.50\r\n- Build Modules: -\r\n------------------------------\r\n\r\n### Reproduction\r\n\r\n```ts\r\nconst config = useRuntimeConfig()\r\nconst { data: followers } = await useFetch('/repos', {\r\n baseUrl: config.public.apiBase,\r\n})\r\n```\r\n\r\ninside a script tag. In your nuxt.config.ts file, you must define a apiBase.\r\n\r\n```\r\n runtimeConfig: {\r\n public: {\r\n apiBase: 'http://localhost:3333',\r\n },\r\n },\r\n```\r\n\r\n### Describe the bug\r\n\r\nThis will give you the following type error\r\n\r\n```\r\nNo overload matches this call.\r\n Overload 1 of 2, '(request: \"/repos\" | Ref\u003C\"/repos\"> | (() => \"/repos\"), opts?: UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, null, \"/repos\", \"get\"> | undefined): AsyncData\u003Cunknown, FetchError\u003Cany> | null>', gave the following error.\r\n Overload 2 of 2, '(request: \"/repos\" | Ref\u003C\"/repos\"> | (() => \"/repos\"), opts?: UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, unknown, \"/repos\", \"get\"> | undefined): AsyncData\u003Cunknown, FetchError\u003Cany> | null>', gave the following error.\r\n```\r\n\r\n\r\n\r\n\r\n### Additional context\r\n\r\n_No response_\r\n\r\n### Logs\r\n\r\nusing `npx nuxi typecheck`\r\n\r\n```\r\npages/index.vue:4:3 - error TS2769: No overload matches this call.\r\n Overload 1 of 2, '(request: \"/repos\" | Ref\u003C\"/repos\"> | (() => \"/repos\"), opts?: UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, null, \"/repos\", \"get\"> | undefined): AsyncData\u003Cunknown, FetchError\u003Cany> | null>', gave the following error.\r\n Object literal may only specify known properties, but 'baseUrl' does not exist in type 'UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, null, \"/repos\", \"get\">'. Did you mean to write 'baseURL'?\r\n Overload 2 of 2, '(request: \"/repos\" | Ref\u003C\"/repos\"> | (() => \"/repos\"), opts?: UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, unknown, \"/repos\", \"get\"> | undefined): AsyncData\u003Cunknown, FetchError\u003Cany> | null>', gave the following error.\r\n Object literal may only specify known properties, but 'baseUrl' does not exist in type 'UseFetchOptions\u003Cunknown, unknown, KeysOf\u003Cunknown>, unknown, \"/repos\", \"get\">'. Did you mean to write 'baseURL'?\r\n\r\n4 baseUrl: config.public.apiBase,\r\n ~~~~~~~\r\n\r\n\r\n\r\nFound 1 error in pages/index.vue:4\r\n\r\n\r\n ERROR Command failed with exit code 2: npx -p vue-tsc -p typescript vue-tsc --noEmit 10:42:22 AM\r\n\r\n at makeError (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/chunks/index3.mjs:625:11)\r\n at handlePromise (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/chunks/index3.mjs:1821:26)\r\n at process.processTicksAndRejections (node:internal/process/task_queues:95:5)\r\n at async Object.run (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/chunks/typecheck.mjs:82:7)\r\n at async runCommand$1 (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/shared/nuxi.4fde776c.mjs:1648:16)\r\n at async runCommand$1 (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/shared/nuxi.4fde776c.mjs:1639:11)\r\n at async runMain$1 (node_modules/.pnpm/nuxi@3.10.0/node_modules/nuxi/dist/shared/nuxi.4fde776c.mjs:1773:7) \r\n\r\n\r\n\r\n ERROR Command failed with exit code 2: npx -p vue-tsc -p typescript vue-tsc --noEmit \r\n```\r\n",[2969,2970],{"name":2958,"color":2959},{"name":2871,"color":2872},24791,"Type issue when using `useFetch` with baseURL","2023-12-16T09:44:02Z","https://github.com/nuxt/nuxt/issues/24791",0.7140392,{"description":2977,"labels":2978,"number":2981,"owner":2874,"repository":2874,"state":2916,"title":2982,"updated_at":2983,"url":2984,"score":2985},"### Describe the feature\n\nIn server API When we use `getQuery()` function to parse params from query, it provides type as `QueryValue | QueryValue[]`.\r\nIt would be great if we could provide types to this params.\r\n\r\ncheck below code snippet.\r\n```\r\nexport default defineEventHandler((event) => {\r\n const queries = getQuery(event)\r\n\tconst searchQuery = queries.q\r\n}\r\n``` \r\n\r\nhere the type of searchQuery is `QueryValue | QueryValue[]`, but I want type to be `string | undefined`.It would be great If I could narrow down type to `string | undefined`.currently I am providing types using typeof for every param.\n\n### Additional information\n\n- [X] Would you be willing to help implement this feature?\n- [X] Could this feature be implemented as a module?\n\n### Final checks\n\n- [X] Read the [contribution guide](https://nuxt.com/docs/community/contribution).\n- [X] Check existing [discussions](https://github.com/nuxt/nuxt/discussions) and [issues](https://github.com/nuxt/nuxt/issues).",[2979,2980],{"name":2958,"color":2959},{"name":2871,"color":2872},22262,"Allow defining type for getQuery() function via generic","2023-07-21T09:33:42Z","https://github.com/nuxt/nuxt/issues/22262",0.72230446,["Reactive",2987],{},["Set"],["ShallowReactive",2990],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$ftrQKa0r8aMpbgJt4ZAhFTfnlzywrTtB5Thp_3Tl0RLw":-1},"/nuxt/ui/2996"]