@volverjs/form-vue 0.0.14-beta.3 → 0.0.14

package/dist/test-playwright/VvForm.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test-playwright/VvFormField.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test-playwright/VvFormWrapper.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test-vitest/defaultObjectBySchema.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/test-vitest/useForm.test.d.ts

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -19,11 +19,11 @@
   "bugs": {
     "url": "https://github.com/volverjs/form-vue/issues"
   },
-  "version": "0.0.14-beta.3",
+  "version": "0.0.14",
   "engines": {
     "node": ">= 16.x"
   },
-  "packageManager": "pnpm@8.6.12",
+  "packageManager": "pnpm@8.7.5",
   "type": "module",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
@@ -35,34 +35,35 @@
     "*.d.ts"
   ],
   "dependencies": {
-    "@volverjs/ui-vue": "^0.0.9",
+    "@volverjs/ui-vue": "0.0.10-beta.3",
     "@vueuse/core": "^10.4.1",
     "ts-dot-prop": "^2.1.3",
     "vue": "^3.3.4",
     "zod": "^3.22.2"
   },
   "devDependencies": {
-    "@playwright/experimental-ct-vue": "1.37.1",
+    "@playwright/experimental-ct-vue": "1.38.0",
     "@testing-library/vue": "^7.0.0",
-    "@typescript-eslint/eslint-plugin": "^6.5.0",
-    "@typescript-eslint/parser": "^6.5.0",
+    "@typescript-eslint/eslint-plugin": "^6.7.0",
     "@vitejs/plugin-vue": "^4.3.4",
     "@volverjs/style": "^0.1.11",
     "@vue/compiler-sfc": "^3.3.4",
+    "@vue/eslint-config-typescript": "^12.0.0",
     "@vue/runtime-core": "^3.3.4",
     "@vue/test-utils": "^2.4.1",
     "copy": "^0.3.2",
-    "eslint": "^8.48.0",
+    "eslint": "^8.49.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-prettier": "^5.0.0",
-    "happy-dom": "^10.11.2",
+    "eslint-plugin-vue": "^9.17.0",
+    "happy-dom": "^11.0.6",
     "prettier": "^3.0.3",
     "typescript": "^5.2.2",
     "vite": "^4.4.9",
     "vite-plugin-dts": "^3.5.3",
     "vite-plugin-eslint": "^1.8.1",
     "vite-plugin-externalize-deps": "^0.7.0",
-    "vitest": "^0.34.3"
+    "vitest": "^0.34.4"
   },
   "typesVersions": {
     "*": {
@@ -83,9 +84,9 @@
   "scripts": {
     "lint": "eslint . --ext .js,.jsx,.ts,.tsx",
     "type-check": "tsc --noEmit",
-    "build": "vite build",
     "dev": "vite build --watch",
-    "test": "pnpm run test-vitest && pnpm run test-playwright",
+    "build": "vite build",
+    "test": "pnpm run build && pnpm run test-vitest && pnpm run test-playwright",
     "test-vitest": "vitest run",
     "test-vitest-watch": "vitest",
     "test-playwright": "playwright test -c playwright-ct.config.ts",

package/src/VvForm.ts

@@ -52,6 +52,7 @@ export const defineForm = <Schema extends FormSchema>(
 			},
 			template: {
 				type: [Array, Function] as PropType<FormTemplate<Schema>>,
+				default: undefined,
 			},
 		},
 		emits: ['invalid', 'valid', 'submit', 'update:modelValue'],
@@ -160,6 +161,15 @@ export const defineForm = <Schema extends FormSchema>(
 			}
 		},
 		render() {
+			const defaultSlot = () =>
+				this.$slots?.default?.({
+					formData: this.formData,
+					submit: this.submit,
+					validate: this.validate,
+					errors: this.errors,
+					status: this.status,
+					invalid: this.invalid,
+				}) ?? this.$slots.default
 			return h(
 				'form',
 				{
@@ -167,20 +177,18 @@ export const defineForm = <Schema extends FormSchema>(
 				},
 				(this.template ?? options?.template) && VvFormTemplate
 					? [
-							h(VvFormTemplate, {
-								schema: this.template ?? options?.template,
-							}),
+							h(
+								VvFormTemplate,
+								{
+									schema: this.template ?? options?.template,
+								},
+								{
+									default: defaultSlot,
+								},
+							),
 					  ]
 					: {
-							default: () =>
-								this.$slots?.default?.({
-									formData: this.formData,
-									submit: this.submit,
-									validate: this.validate,
-									errors: this.errors,
-									status: this.status,
-									invalid: this.invalid,
-								}) ?? this.$slots.default,
+							default: defaultSlot,
 					  },
 			)
 		},

package/src/VvFormTemplate.ts

@@ -35,119 +35,117 @@ export const defineFormTemplate = <Schema extends FormSchema>(
 						? templateProps.schema(injectedFormData)
 						: templateProps.schema
 				let lastIf: boolean | undefined = undefined
-				return normalizedSchema.reduce<(VNode | VNode[] | undefined)[]>(
-					(acc, field) => {
-						const normalizedField =
-							typeof field === 'function'
-								? field(injectedFormData)
-								: field
-						const {
-							vvIs,
-							vvName,
-							vvSlots,
-							vvChildren,
-							vvIf,
-							vvElseIf,
-							vvType,
-							vvDefaultValue,
-							vvShowValid,
-							vvContent,
-							...props
-						} = normalizedField
+				const toReturn = normalizedSchema.reduce<
+					(VNode | VNode[] | undefined)[]
+				>((acc, field) => {
+					const normalizedField =
+						typeof field === 'function'
+							? field(injectedFormData)
+							: field
+					const {
+						vvIs,
+						vvName,
+						vvSlots,
+						vvChildren,
+						vvIf,
+						vvElseIf,
+						vvType,
+						vvDefaultValue,
+						vvShowValid,
+						vvContent,
+						...props
+					} = normalizedField
 
-						// conditions
-						if (vvIf !== undefined) {
-							if (typeof vvIf === 'string') {
-								lastIf = Boolean(
-									get(
-										Object(injectedFormData.formData.value),
-										vvIf,
-									),
-								)
-							} else if (typeof vvIf === 'function') {
-								lastIf = unref(vvIf(injectedFormData))
-							} else {
-								lastIf = unref(vvIf)
-							}
-							if (!lastIf) {
-								return acc
-							}
-						} else if (
-							vvElseIf !== undefined &&
-							lastIf !== undefined
-						) {
-							if (lastIf) {
-								return acc
-							}
-							if (typeof vvElseIf === 'string') {
-								lastIf = Boolean(
-									get(
-										Object(injectedFormData.formData.value),
-										vvElseIf,
-									),
-								)
-							} else if (typeof vvElseIf === 'function') {
-								lastIf = unref(vvElseIf(injectedFormData))
-							} else {
-								lastIf = unref(vvElseIf)
-							}
-							if (!lastIf) {
-								return acc
-							}
-						} else {
-							lastIf = undefined
-						}
-						// children
-						const hChildren = vvChildren
-							? h(VvFormTemplate, {
-									schema: vvChildren,
-							  })
-							: undefined
-						// render
-						if (vvName) {
-							acc.push(
-								h(
-									VvFormField,
-									{
-										name: vvName,
-										is: vvIs,
-										type: vvType,
-										defaultValue: vvDefaultValue,
-										showValid: vvShowValid,
-										props,
-									},
-									vvSlots ?? hChildren ?? vvContent,
+					// conditions
+					if (vvIf !== undefined) {
+						if (typeof vvIf === 'string') {
+							lastIf = Boolean(
+								get(
+									Object(injectedFormData.formData.value),
+									vvIf,
 								),
 							)
+						} else if (typeof vvIf === 'function') {
+							lastIf = unref(vvIf(injectedFormData))
+						} else {
+							lastIf = unref(vvIf)
+						}
+						if (!lastIf) {
 							return acc
 						}
-						if (vvIs) {
-							acc.push(
-								h(
-									vvIs as Component,
-									props,
-									vvSlots ?? hChildren ?? vvContent,
+					} else if (vvElseIf !== undefined && lastIf !== undefined) {
+						if (lastIf) {
+							return acc
+						}
+						if (typeof vvElseIf === 'string') {
+							lastIf = Boolean(
+								get(
+									Object(injectedFormData.formData.value),
+									vvElseIf,
 								),
 							)
-							return acc
+						} else if (typeof vvElseIf === 'function') {
+							lastIf = unref(vvElseIf(injectedFormData))
+						} else {
+							lastIf = unref(vvElseIf)
 						}
-						if (vvChildren) {
-							acc.push(hChildren)
+						if (!lastIf) {
 							return acc
 						}
+					} else {
+						lastIf = undefined
+					}
+					// children
+					const hChildren = vvChildren
+						? h(VvFormTemplate, {
+								schema: vvChildren,
+						  })
+						: undefined
+					// render
+					if (vvName) {
+						acc.push(
+							h(
+								VvFormField,
+								{
+									name: vvName,
+									is: vvIs,
+									type: vvType,
+									defaultValue: vvDefaultValue,
+									showValid: vvShowValid,
+									props,
+								},
+								vvSlots ?? hChildren ?? vvContent,
+							),
+						)
+						return acc
+					}
+					if (vvIs) {
+						acc.push(
+							h(
+								vvIs as Component,
+								props,
+								vvSlots ?? hChildren ?? vvContent,
+							),
+						)
+						return acc
+					}
+					if (vvChildren) {
+						acc.push(hChildren)
 						return acc
-					},
-					[
-						templateSlots?.default?.({
-							formData: injectedFormData?.formData.value,
-							submit: injectedFormData?.submit,
-							validate: injectedFormData?.validate,
-							errors: injectedFormData?.errors.value,
-							status: injectedFormData?.status.value,
-							invalid: injectedFormData?.invalid.value,
-						}),
-					],
+					}
+					return acc
+				}, [])
+				toReturn.push(
+					templateSlots?.default?.({
+						formData: injectedFormData?.formData.value,
+						submit: injectedFormData?.submit,
+						validate: injectedFormData?.validate,
+						errors: injectedFormData?.errors.value,
+						status: injectedFormData?.status.value,
+						invalid: injectedFormData?.invalid.value,
+					}),
 				)
+				return toReturn
 			}
 		},
 	})

package/src/index.ts

@@ -132,6 +132,7 @@ export type {
 	InjectedFormWrapperData,
 	InjectedFormFieldData,
 	FormComposableOptions,
+	FormSchema,
 	FormPluginOptions,
 	FormComponent,
 	FormWrapperComponent,