Built-in rules

All built-in rules are available though @regle/rules.

Don't forget to install it if you haven't

pnpm

pnpm add @regle/rules

npm

npm install @regle/rules

yarn

yarn add @regle/rules

bun

bun add @regle/rules

required

Requires non-empty data. Checks for empty arrays and strings containing only whitespaces.

import {required} from '@regle/rules';

const {errors} = useRegle({name: ''}, {
  name: {required},
})

requiredIf

Params

• condition: Ref<unknown> | unknown | () => unknown - the property to base the required validator on.

Requires non-empty data, only if provided data property, ref, or a function resolve to true.

import {requiredIf} from '@regle/rules';

const form = ref({name: '', condition: false});

const conditionRef = ref(false);

const {errors} = useRegle(form, {
  name: {
    required: requiredIf(() => form.value.condition),
    required: requiredIf(conditionRef),
  },
})

requiredUnless

Params

• condition: Ref<unknown> | unknown | () => unknown - the property to base the required validator on.

Requires non-empty data, only if provided data property, ref, or a function resolve to false.

import {requiredUnless} from '@regle/rules';

const form = ref({name: '', condition: false});

const conditionRef = ref(false);

const {errors} = useRegle(form, {
  name: {
    required: requiredUnless(() => form.value.condition),
    required: requiredUnless(conditionRef)
  },
})

checked

Requires a boolean value to be true. This is useful for checkbox inputs.

minLength

Params

• min: Ref<number> | number | () => number

Works with

• Array | Record | string | number

Requires the input value to have a minimum specified length, inclusive. Works with arrays, objects and strings.

import {minLength} from '@regle/rules';

const minValue = ref(6);

const {errors} = useRegle({name: ''}, {
  name: {
    minLength: minLength(6),
    minLength: minLength(minValue),
    minLength: minLength(() => minValue.value)
  },
})

maxLength

Params

• max: Ref<number> | number | () => number

Works with

• Array | Record | string | number

Requires the input value to have a maximum specified length, inclusive. Works with arrays, objects and strings.

import {maxLength} from '@regle/rules';

const maxValue = ref(6);

const {errors} = useRegle({name: ''}, {
  name: {
    maxLength: maxLength(6),
    maxLength: maxLength(maxValue),
    maxLength: maxLength(() => maxValue.value)
  },
})

minValue

Params

• min: Ref<number> | number | () => number

Works with

• number

Requires entry to have a specified minimum numeric value.

import {minValue} from '@regle/rules';

const minCount = ref(6);

const {errors} = useRegle({count: 0}, {
  count: {
    minValue: minValue(6),
    minValue: minValue(minCount),
    minValue: minValue(() => minCount.value)
  },
})

maxValue

Params

• min: Ref<number> | number | () => number

Requires entry to have a specified maximum numeric value.

import {maxValue} from '@regle/rules';

const maxCount = ref(6);

const {errors} = useRegle({count: 0}, {
  count: {
    maxValue: maxValue(6),
    maxValue: maxValue(maxCount),
    maxValue: maxValue(() => maxCount.value)
  },
})

between

Params

• min: Ref<number> | number | () => number
• max: Ref<number> | number | () => number

Checks if a number is in specified bounds. min and max are both inclusive.

import {between} from '@regle/rules';

const maxCount = ref(6);

const {errors} = useRegle({count: 0}, {
  count: {
    between: between(1, 6),
    between: between(1, maxCount),
    between: between(() => maxCount.value, 10)
  },
})

contains

Params

• contain: Ref<string> | string | () => string

Checks is an string contains the corresponding string parameter.

startsWith

Params

• start: Ref<string> | string | () => string

Checks is an string starts with the corresponding string parameter.

endsWith

Params

• end: Ref<string> | string | () => string

Checks is an string ends with the corresponding string parameter.

regex

Params

• ...regexps: [...Ref<RegExp> | RegExp | () => RegExp]

Checks is the string or number match one or multiple RegExp patterns.

dateBefore

Params

• before: Ref<string | Date> | string | Date | () => string | Date

Checks if the input date is before the given Date param.

Metadata

| true
| {
    $valid: false;
    error: 'date-not-before';
  }
| {
    $valid: false;
    error: 'value-or-paramater-not-a-date';
  }

dateAfter

Params

• after: Ref<string | Date> | string | Date | () => string | Date

Checks if the input date is after the given Date param.

Metadata

| true
| {
    $valid: false;
    error: 'date-not-after';
  }
| {
    $valid: false;
    error: 'value-or-paramater-not-a-date';
  }

dateBetweeen

Params

• before: Ref<string | Date> | string | Date | () => string | Date
• after: Ref<string | Date> | string | Date | () => string | Date

Checks if the input date is in the range of the two given Date params.

alpha

Accepts only alphabet characters.

alphaNum

Accepts only alphanumerics.

numeric

Accepts only numerics. String numbers are also numeric.

integer

Accepts positive and negative integers.

decimal

Accepts positive and negative decimal numbers.

email

Accepts valid email addresses. Keep in mind you still have to carefully verify it on your server, as it is impossible to tell if the address is real without sending verification email.

ipAddress

Accepts valid IPv4 addresses in dotted decimal notation like 127.0.0.1.

macAddress

Params

• separator?: string | Ref<string> | () => string

Accepts valid MAC addresses like 00:ff:11:22:33:44:55. Don't forget to call it as a function macAddress(), as it has an optional parameter. You can specify your own separator instead of ':'. Provide empty separator macAddress('') to validate MAC addresses like 00ff1122334455.

import {useRegle} from '@regle/core';
import {ref} from 'vue';
// ---cut---
import {macAddress} from '@regle/rules';

const maxCount = ref(6);

const {errors} = useRegle({address: ''}, {
  address: {
    macAddress: macAddress(),
  },
})

sameAs

Params

• target: unknown

Checks for equality with a given property. Accepts a ref, a direct reference to a data property, or a raw value to compare to it directly.

import {useRegle} from '@regle/core';
import {ref} from 'vue';
// ---cut---
import {sameAs} from '@regle/rules';

const form = ref({
  password: '',
  confirmPassword: '',
});

const {errors} = useRegle(form, {
  confirmPassword: {
    sameAs: sameAs(() => form.value.password),
  }
})

url

Accepts only URLs.