UNPKG

vue-yup-form

Version:

Headless form validation with Vue and Yup

196 lines (194 loc) 6.17 kB
"use strict"; var __defProp = Object.defineProperty; var __getOwnPropDesc = Object.getOwnPropertyDescriptor; var __getOwnPropNames = Object.getOwnPropertyNames; var __hasOwnProp = Object.prototype.hasOwnProperty; var __export = (target, all) => { for (var name in all) __defProp(target, name, { get: all[name], enumerable: true }); }; var __copyProps = (to, from, except, desc) => { if (from && typeof from === "object" || typeof from === "function") { for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); } return to; }; var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod); // src/index.ts var src_exports = {}; __export(src_exports, { defineForm: () => defineForm, field: () => field, formsField: () => formsField, isValidForm: () => isValidForm, privateField: () => privateField, toObject: () => toObject }); module.exports = __toCommonJS(src_exports); var import_vue_demi = require("vue-demi"); var import_yup = require("yup"); var Field = class { constructor(value, schema, validateOptions) { this.$_valueRef = (0, import_vue_demi.isRef)(value) ? value : (0, import_vue_demi.shallowRef)(value); const isSchemaTypeFunction = typeof schema === "function"; const initialSchema = isSchemaTypeFunction ? schema() : schema; const isNumberSchemaField = initialSchema instanceof import_yup.NumberSchema; this.$_errorRef = (0, import_vue_demi.computed)( schema ? () => { const obtainedSchema = isSchemaTypeFunction ? schema() : schema; const targetValue = isNumberSchemaField && typeof this.$_valueRef.value !== "number" ? void 0 : this.$_valueRef.value; try { obtainedSchema.validateSync(targetValue, validateOptions); } catch (e) { return e; } return void 0; } : () => void 0 ); this.$label = (initialSchema == null ? void 0 : initialSchema.describe().label) || ""; } get $value() { return this.$_valueRef.value; } set $value(value) { this.$_valueRef.value = value; } get $error() { return this.$_errorRef.value; } get $errorMessages() { var _a; return ((_a = this.$_errorRef.value) == null ? void 0 : _a.errors) || []; } }; var PrivateField = class extends Field { }; var FormsField = class { constructor(generateForm, initialValueListOrLength, schema, validateOptions) { let count = 1; this.$generateFormWithKey = (initialValue) => { const form = generateForm(initialValue); form.$key = count++; return form; }; this.$_formsRef = (0, import_vue_demi.shallowRef)([]); this.$initialize(initialValueListOrLength); const isSchemaTypeFunction = typeof schema === "function"; this.$_errorRef = (0, import_vue_demi.computed)( schema ? () => { const obtainedSchema = isSchemaTypeFunction ? schema(new import_yup.ArraySchema()) : schema; try { obtainedSchema.validateSync( this.$_formsRef.value, validateOptions ); } catch (e) { return e; } return void 0; } : () => void 0 ); const initialSchema = isSchemaTypeFunction ? schema(new import_yup.ArraySchema()) : schema; this.$label = (initialSchema == null ? void 0 : initialSchema.describe().label) || ""; } get $forms() { return this.$_formsRef.value; } get $writableForms() { return this.$_formsRef.value; } set $writableForms(value) { this.$_formsRef.value = value; } get $error() { return this.$_errorRef.value; } get $errorMessages() { var _a; return ((_a = this.$_errorRef.value) == null ? void 0 : _a.errors) || []; } $initialize(initialValueListOrLength = []) { const initialValueList = typeof initialValueListOrLength === "number" ? [...Array(initialValueListOrLength)] : initialValueListOrLength; this.$_formsRef.value = initialValueList.map(this.$generateFormWithKey); } $append(initialValue) { const forms = this.$_formsRef.value.slice(); forms.push(this.$generateFormWithKey(initialValue)); this.$_formsRef.value = forms; } $prepend(initialValue) { const forms = this.$_formsRef.value.slice(); forms.unshift(this.$generateFormWithKey(initialValue)); this.$_formsRef.value = forms; } $remove(index) { const forms = this.$_formsRef.value.slice(); forms.splice(index + (index < 0 ? this.$_formsRef.value.length : 0), 1); this.$_formsRef.value = forms; } }; function defineForm(form) { return form; } function field(value, schema, validateOptions) { return new Field(value, schema, validateOptions); } function privateField(value, schema, validateOptions) { return new PrivateField(value, schema, validateOptions); } function formsField(generateForm, initialValueListOrLength = [], schema, validateOptions) { return new FormsField( generateForm, initialValueListOrLength, schema, validateOptions ); } function isValidForm(form) { for (const value of Object.values(form)) { if (typeof value !== "object") { continue; } if (value instanceof Field) { if (value.$error) { return false; } } else if ("$forms" in value) { if (value.$error || !value.$forms.every(isValidForm)) { return false; } } else if (!isValidForm(value)) { return false; } } return true; } function toObject(form) { const obj = {}; for (const [key, value] of Object.entries(form)) { if (typeof value !== "object") { continue; } if (value instanceof Field) { if (!(value instanceof PrivateField)) { obj[key] = value.$value; } } else if ("$forms" in value) { obj[key] = value.$forms.map(toObject); } else { obj[key] = toObject(value); } } return obj; } // Annotate the CommonJS export names for ESM import in node: 0 && (module.exports = { defineForm, field, formsField, isValidForm, privateField, toObject });