From 1044c0169936d921ddcd0c030be635b4e9ca9a6d Mon Sep 17 00:00:00 2001 From: Fabian Hiller Date: Sat, 8 Jun 2024 20:07:43 +0200 Subject: [PATCH 1/6] feat(valibot): update and migrate valibot to v0.31.0 --- .../content/examples/FormExampleValibot.vue | 10 ++++---- docs/package.json | 2 +- package.json | 2 +- pnpm-lock.yaml | 16 ++++++------- src/runtime/components/forms/Form.vue | 24 +++++++++---------- 5 files changed, 26 insertions(+), 28 deletions(-) diff --git a/docs/components/content/examples/FormExampleValibot.vue b/docs/components/content/examples/FormExampleValibot.vue index 2c8b189e66..5ace973c58 100644 --- a/docs/components/content/examples/FormExampleValibot.vue +++ b/docs/components/content/examples/FormExampleValibot.vue @@ -1,13 +1,13 @@ From 60759072509e8db131bc7d9c9588bb3fe8c075a7 Mon Sep 17 00:00:00 2001 From: Fabian Hiller Date: Mon, 10 Jun 2024 14:27:09 +0200 Subject: [PATCH 2/6] feat(valibot): remove dependency and improve compatibility --- package.json | 3 ++- pnpm-lock.yaml | 14 +++++++++++--- src/runtime/components/forms/Form.vue | 15 ++++++++------- 3 files changed, 21 insertions(+), 11 deletions(-) diff --git a/package.json b/package.json index 70f3344751..5cd8217d57 100644 --- a/package.json +++ b/package.json @@ -54,7 +54,6 @@ "nuxt-icon": "^0.6.10", "ohash": "^1.1.3", "pathe": "^1.1.2", - "valibot": "^0.31.0", "scule": "^1.3.0", "tailwind-merge": "^2.3.0", "tailwindcss": "^3.4.3" @@ -72,6 +71,8 @@ "release-it": "^17.3.0", "typescript": "^5.4.5", "unbuild": "^2.0.0", + "valibot30": "npm:valibot@0.30.0", + "valibot31": "npm:valibot@^0.31.1", "vitest": "^1.6.0", "vitest-environment-nuxt": "^1.0.0", "vue-tsc": "^2.0.16", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 6822bb2b75..a00fba2b19 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -82,9 +82,6 @@ importers: tailwindcss: specifier: ^3.4.3 version: 3.4.3 - valibot: - specifier: ^0.31.0 - version: 0.31.1 devDependencies: '@nuxt/eslint-config': specifier: ^0.3.13 @@ -122,6 +119,12 @@ importers: unbuild: specifier: ^2.0.0 version: 2.0.0(typescript@5.4.5) + valibot30: + specifier: npm:valibot@0.30.0 + version: valibot@0.30.0 + valibot31: + specifier: npm:valibot@^0.31.1 + version: valibot@0.31.1 vitest: specifier: ^1.6.0 version: 1.6.0(@types/node@20.11.19)(happy-dom@14.10.1)(terser@5.27.2) @@ -7148,6 +7151,9 @@ packages: peerDependencies: '@vue/compiler-core': ^3.3 + valibot@0.30.0: + resolution: {integrity: sha512-5POBdbSkM+3nvJ6ZlyQHsggisfRtyT4tVTo1EIIShs6qCdXJnyWU5TJ68vr8iTg5zpOLjXLRiBqNx+9zwZz/rA==} + valibot@0.31.1: resolution: {integrity: sha512-2YYIhPrnVSz/gfT2/iXVTrSj92HwchCt9Cga/6hX4B26iCz9zkIsGTS0HjDYTZfTi1Un0X6aRvhBi1cfqs/i0Q==} @@ -17295,6 +17301,8 @@ snapshots: dependencies: '@vue/compiler-core': 3.4.25 + valibot@0.30.0: {} + valibot@0.31.1: {} validate-npm-package-license@3.0.4: diff --git a/src/runtime/components/forms/Form.vue b/src/runtime/components/forms/Form.vue index 6bd57a4e43..de0dccf863 100644 --- a/src/runtime/components/forms/Form.vue +++ b/src/runtime/components/forms/Form.vue @@ -10,8 +10,8 @@ import { useEventBus } from '@vueuse/core' import type { ZodSchema } from 'zod' import type { ValidationError as JoiError, Schema as JoiSchema } from 'joi' import type { ObjectSchema as YupObjectSchema, ValidationError as YupError } from 'yup' -import type { GenericSchema as ValibotSchema, GenericSchemaAsync as ValibotSchemaAsync } from 'valibot' -import { getDotPath as valibotPath, safeParseAsync as valibotParse } from 'valibot' +import type { BaseSchema as ValibotSchema30, BaseSchemaAsync as ValibotSchemaAsync30 } from 'valibot30' +import type { GenericSchema as ValibotSchema, GenericSchemaAsync as ValibotSchemaAsync, SafeParser as ValibotSafeParser, SafeParserAsync as ValibotSafeParserAsync } from 'valibot31' import type { FormError, FormEvent, FormEventType, FormSubmitEvent, FormErrorEvent, Form } from '../../types/form' import { useId } from '#imports' @@ -256,17 +256,18 @@ async function getJoiErrors ( } } -function isValibotSchema (schema: any): schema is ValibotSchema | ValibotSchemaAsync { - return schema._run !== undefined +function isValibotSchema (schema: any): schema is ValibotSchema30 | ValibotSchemaAsync30 | ValibotSchema | ValibotSchemaAsync | ValibotSafeParser | ValibotSafeParserAsync { + return '_parse' in schema || '_run' in schema || (typeof schema === 'function' && 'schema' in schema) } async function getValibotError ( state: any, - schema: ValibotSchema | ValibotSchemaAsync + schema: ValibotSchema30 | ValibotSchemaAsync30 | ValibotSchema | ValibotSchemaAsync | ValibotSafeParser | ValibotSafeParserAsync ): Promise { - const result = await valibotParse(schema, state) + const result = await ('_parse' in schema ? schema._parse(state) : '_run' in schema ? schema._run({ typed: false, value: state }, {}) : schema(state)) return result.issues?.map((issue) => ({ - path: valibotPath(issue) || '', + // We know that the key for a form schema is always a string or a number + path: issue.path?.map((item) => item.key).join('.') || '', message: issue.message })) || [] } From f4bdddedb9178dc95517ff10abff33b48c1f34cf Mon Sep 17 00:00:00 2001 From: Fabian Hiller Date: Mon, 10 Jun 2024 16:18:04 +0200 Subject: [PATCH 3/6] Fix type of schema prop of Form component --- src/runtime/components/forms/Form.vue | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/runtime/components/forms/Form.vue b/src/runtime/components/forms/Form.vue index de0dccf863..21c63ed2e8 100644 --- a/src/runtime/components/forms/Form.vue +++ b/src/runtime/components/forms/Form.vue @@ -30,7 +30,9 @@ export default defineComponent({ | PropType | PropType> | PropType - | PropType, + | PropType + | PropType + | PropType | ValibotSafeParserAsync>, default: undefined }, state: { From 590096f1e774d11eaed11c290a402c0becffece4 Mon Sep 17 00:00:00 2001 From: Fabian Hiller Date: Mon, 10 Jun 2024 16:19:41 +0200 Subject: [PATCH 4/6] Add safeParser to Valibot form example --- docs/components/content/examples/FormExampleValibot.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/components/content/examples/FormExampleValibot.vue b/docs/components/content/examples/FormExampleValibot.vue index 5ace973c58..6da9ec85ca 100644 --- a/docs/components/content/examples/FormExampleValibot.vue +++ b/docs/components/content/examples/FormExampleValibot.vue @@ -21,7 +21,7 @@ async function onSubmit (event: FormSubmitEvent) {