\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",[2018,2021],{"name":2019,"color":2020},"question","d876e3",{"name":2022,"color":2023},"v3","49DCB8",3136,"ui","closed","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.6838536,{"description":2032,"labels":2033,"number":2041,"owner":1991,"repository":2025,"state":2026,"title":2042,"updated_at":2043,"url":2044,"score":2045},"### Environment\n\n- Operating System: Darwin\n- Node Version: v22.12.0\n- Nuxt Version: 3.15.0\n- CLI Version: 3.17.2\n- Nitro Version: 2.10.4\n- Package Manager: pnpm@9.14.4\n- Builder: -\n- User Config: default\n- Runtime Modules: @nuxt/ui@3.0.0-alpha.10\n- Build Modules: -\n\n### Is this bug related to Nuxt or Vue?\n\nNuxt\n\n### Version\n\nv3.0.0-apha.10\n\n### Reproduction\n\nhttps://codesandbox.io/p/devbox/nuxt-ui3-forked-jncllj\n\n### Description\n\nRelated : https://github.com/histoire-dev/histoire/issues/702\n\nWhen a component is ULink or uses ULink (ex: UButton), Histoire doesn't work anymore.\n\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\nLink.vue:108 Uncaught (in promise) TypeError: Cannot destructure property 'href' of 'undefined' as it is undefined.\n at Link.vue:108:28\n at Proxy.renderFnWithContext (runtime-core.esm-bundler.js?v=896f4f1e:699:13)\n at Proxy.\u003Canonymous> (components.mjs:12:28)\n at renderComponentRoot (runtime-core.esm-bundler.js?v=896f4f1e:6521:16)\n at ReactiveEffect.componentUpdateFn [as fn] (runtime-core.esm-bundler.js?v=896f4f1e:5343:46)\n at ReactiveEffect.run (reactivity.esm-bundler.js?v=896f4f1e:198:19)\n at setupRenderEffect (runtime-core.esm-bundler.js?v=896f4f1e:5478:5)\n at mountComponent (runtime-core.esm-bundler.js?v=896f4f1e:5253:7)\n at processComponent (runtime-core.esm-bundler.js?v=896f4f1e:5206:9)\n at patch (runtime-core.esm-bundler.js?v=896f4f1e:4722:11)\n```",[2034,2037,2038],{"name":2035,"color":2036},"bug","d73a4a",{"name":2022,"color":2023},{"name":2039,"color":2040},"triage","ffffff",3004,"ULink make Histoire crash","2025-03-28T17:36:15Z","https://github.com/nuxt/ui/issues/3004",0.7000475,{"description":2047,"labels":2048,"number":2052,"owner":1991,"repository":2025,"state":2026,"title":2053,"updated_at":2054,"url":2055,"score":2056},"### 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```",[2049,2050,2051],{"name":2035,"color":2036},{"name":2022,"color":2023},{"name":2039,"color":2040},3545,"Clipboard button doesnt copy content when using ProsePre directly","2025-03-13T00:31:04Z","https://github.com/nuxt/ui/issues/3545",0.7013093,{"description":2058,"labels":2059,"number":2064,"owner":1991,"repository":1991,"state":2026,"title":2065,"updated_at":2066,"url":2067,"score":2068},"### 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).",[2060,2063],{"name":2061,"color":2062},"3.x","29bc7f",{"name":1988,"color":1989},22262,"Allow defining type for getQuery() function via generic","2023-07-21T09:33:42Z","https://github.com/nuxt/nuxt/issues/22262",0.7105348,{"description":2070,"labels":2071,"number":2076,"owner":1991,"repository":2025,"state":2026,"title":2077,"updated_at":2078,"url":2079,"score":2080},"### 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```",[2072,2075],{"name":2073,"color":2074},"enhancement","a2eeef",{"name":2022,"color":2023},2768,"Release form validation as standalone library","2024-12-16T09:47:15Z","https://github.com/nuxt/ui/issues/2768",0.7105829,{"description":2082,"labels":2083,"number":2085,"owner":1991,"repository":1991,"state":2026,"title":2086,"updated_at":2087,"url":2088,"score":2089},"### Environment\n\n------------------------------\n- Operating System: Darwin\n- Node Version: v20.15.1\n- Nuxt Version: 3.14.1592\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: -\n- Build Modules: -\n------------------------------\n\n### Reproduction\n\nhttps://github.com/mklnz/nuxt-custom-usefetch\n\n### Describe the bug\n\nBlank reproducible example at: https://github.com/mklnz/nuxt-custom-usefetch\n\nI'm following the example at:\nhttps://nuxt.com/docs/guide/recipes/custom-usefetch\n\nI'm getting a Typescript error when generics are added, error below:\n\nThe error goes away when generics are removed, e.g.:\n```typescript\nexport function useAPI\u003CT>(\n url: string | (() => string),\n options?: UseFetchOptions\u003CT>,\n) {\n return useFetch(url, {\n ...options,\n $fetch: useNuxtApp().$api as typeof $fetch\n })\n}\n```\n\n\n```\n[{\n\t\"resource\": \"/Users/Bob/Development/my-site/composables/useAPI.ts\",\n\t\"owner\": \"typescript\",\n\t\"code\": \"2769\",\n\t\"severity\": 8,\n\t\"message\": \"No overload matches this call.\\n Overload 1 of 2, '(request: NitroFetchRequest | Ref\u003CNitroFetchRequest, NitroFetchRequest> | (() => NitroFetchRequest), opts?: UseFetchOptions\u003C...> | undefined): AsyncData\u003C...>', gave the following error.\\n Argument of type '{ $fetch: typeof $fetch; key?: string; watch?: MultiWatchSources | false; default?: (() => globalThis.Ref\u003Cnull, null> | null) | undefined; ... 38 more ...; onResponseError?: FetchHook\u003C...> | ... 3 more ... | undefined; }' is not assignable to parameter of type 'UseFetchOptions\u003CT extends void ? unknown : T, T extends void ? unknown : T, KeysOf\u003CT extends void ? unknown : T>, null, NitroFetchRequest, T extends void ? \\\"get\\\" : AvailableRouterMethod\u003C...>>'.\\n Types of property 'getCachedData' are incompatible.\\n Type '((key: string, nuxtApp: NuxtApp) => NoInfer\u003CT> | undefined) | undefined' is not assignable to type '((key: string, nuxtApp: NuxtApp) => NoInfer\u003CT extends void ? unknown : T> | undefined) | undefined'.\\n Type '(key: string, nuxtApp: NuxtApp) => NoInfer\u003CT> | undefined' is not assignable to type '(key: string, nuxtApp: NuxtApp) => NoInfer\u003CT extends void ? unknown : T> | undefined'.\\n Type 'NoInfer\u003CT> | undefined' is not assignable to type 'NoInfer\u003CT extends void ? unknown : T> | undefined'.\\n Type 'NoInfer\u003CT>' is not assignable to type 'NoInfer\u003CT extends void ? unknown : T> | undefined'.\\n Type 'T' is not assignable to type 'NoInfer\u003CT extends void ? unknown : T> | undefined'.\\n Overload 2 of 2, '(request: NitroFetchRequest | Ref\u003CNitroFetchRequest, NitroFetchRequest> | (() => NitroFetchRequest), opts?: UseFetchOptions\u003C...> | undefined): AsyncData\u003C...>', gave the following error.\\n Argument of type '{ $fetch: typeof $fetch; key?: string; watch?: MultiWatchSources | false; default?: (() => globalThis.Ref\u003Cnull, null> | null) | undefined; ... 38 more ...; onResponseError?: FetchHook\u003C...> | ... 3 more ... | undefined; }' is not assignable to parameter of type 'UseFetchOptions\u003CT extends void ? unknown : T, T extends void ? unknown : T, KeysOf\u003CT extends void ? unknown : T>, T extends void ? unknown : T, NitroFetchRequest, T extends void ? \\\"get\\\" : AvailableRouterMethod\u003C...>>'.\\n Types of property 'default' are incompatible.\\n Type '(() => Ref\u003Cnull, null> | null) | undefined' is not assignable to type '(() => (T extends void ? unknown : T) | Ref\u003CT extends void ? unknown : T, T extends void ? unknown : T>) | undefined'.\\n Type '() => Ref\u003Cnull, null> | null' is not assignable to type '() => (T extends void ? unknown : T) | Ref\u003CT extends void ? unknown : T, T extends void ? unknown : T>'.\\n Type 'Ref\u003Cnull, null> | null' is not assignable to type '(T extends void ? unknown : T) | Ref\u003CT extends void ? unknown : T, T extends void ? unknown : T>'.\\n Type 'null' is not assignable to type '(T extends void ? unknown : T) | Ref\u003CT extends void ? unknown : T, T extends void ? unknown : T>'.\",\n\t\"source\": \"ts\",\n\t\"startLineNumber\": 13,\n\t\"startColumn\": 52,\n\t\"endLineNumber\": 16,\n\t\"endColumn\": 4\n}]\n```\n\n### Additional context\n\n_No response_\n\n### Logs\n\n```shell-script\n\n```",[2084],{"name":1988,"color":1989},30013,"Typescript error when following custom useFetch example","2024-12-16T23:15:48Z","https://github.com/nuxt/nuxt/issues/30013",0.7224168,{"description":2091,"labels":2092,"number":2095,"owner":1991,"repository":1991,"state":2026,"title":2096,"updated_at":2097,"url":2098,"score":2099},"### 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",[2093,2094],{"name":2061,"color":2062},{"name":1988,"color":1989},24791,"Type issue when using `useFetch` with baseURL","2023-12-16T09:44:02Z","https://github.com/nuxt/nuxt/issues/24791",0.7229426,["Reactive",2101],{},["Set"],["ShallowReactive",2104],{"TRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"trQKa0r8aMpbgJt4ZAhFTfnlzywrTtB5Thp_3Tl0RLw":-1},"/nuxt/ui/2996"]