Array declaration, refactors, typescript improvements

Bimg upade

Alternative syntax to declare form rules. While this does not mimic the exact structure the main form has, it can simplify rule declaration. In most cases the user does not care what kind of key/id the rule is declared for. Those rules are almost exclusively declared as { validateName: validateName() }. To simplify use-cases as such, there should be a support to simply insert an array of rules.

New rule definition

Introducing the new defineRules helper. This helper produces a rules object, which can be then used by the useValidation composable. This might slightly alter the way you define form validation in your components.

// Define a form object as usual
const form = reactive({
  name: '',
  meta: {
    age: 0,
  }
})

// Define rules object using the helper
const rules = defineRules<typeof form>({
  // All the rules object keys are provided with your IDE autocomplete!!! Even nested items
  name: { required },
  meta: {
    // New syntax!! Define rules with an array, much shorter
    age: [required, minValue(3), maxValue(18)]
  }
})

Composable refactor

Some of the returned data from the composable have been changed. Removed run ans $ (which was the whole internal composable state)

const {
  // All of these are now refs!! Not sure why they weren't before
  anyError,
  pending,
  errors,
  // These are the same
  validate,
  addError,
  reset
} = useValidation(form, rules)

Renaming

• $def -> defineRule
• $defineParam -> defineRuleArg

Rule defining functions now have an optional third parameter to provide the name of the validator. These names are only used if you're referencing specific errors and in most cases you will be more than good with the default names.

Every single rule now has a name property. This property is used for the array declaration rules, because object declaration automatically supports naming.

---

Full Changelog: v1.1.2...v2.0.0

Buge Fixe v1.1.2

• Fixed all rule keys being required
• Fixed type import path in dist

Release 1.1.1.

• Fix missing dist

Release 1.1.0

• Added a new method addError which appends a new error item into the validation object. This method is available on the useValidation composable. closes (#3)

addError(validatedFormKey, {
    errorKey: 'my-error-id',
    message: 'It failed because I said so'
}

• Fixed an issue where resetting validation object would incorrectly assign properties to the wrong path. Closes (#1), Closes (#2)
• Improved typing on errors object. Now correctly hints at keys provided in the validated form and other methods
• Improved speed of autoclear to only reset after validation was performed

Full Release - v1.0.0

My first attempt at a full start to end library development has been concluded. I still need to sort out getting this thing into actual npm site, but here we go. Validation library inspired by vuelidate is out. Whoever tries it, please report any issues you find or any feedback you might think of. It's extremely valuable to me.