https://github.com/victorgarciaesgi/regle

✅ Headless form validation library for Vue.js
https://github.com/victorgarciaesgi/regle

forms vue vue-form vue-forms vue-rules vue-validation vue-zod vuelidate zod

Last synced: 8 days ago
JSON representation

✅ Headless form validation library for Vue.js

• Host: GitHub
• URL: https://github.com/victorgarciaesgi/regle
• Owner: victorgarciaesgi
• License: mit
• Created: 2023-09-25T14:46:42.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2025-05-14T16:27:39.000Z (10 days ago)
• Last Synced: 2025-05-14T17:19:52.656Z (10 days ago)
• Topics: forms, vue, vue-form, vue-forms, vue-rules, vue-validation, vue-zod, vuelidate, zod
• Language: TypeScript
• Homepage: https://reglejs.dev
• Size: 8.53 MB
• Stars: 184
• Watchers: 2
• Forks: 6
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • Contributing: CONTRIBUTING.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        
[npm-version-src]: https://img.shields.io/npm/v/@regle/core.svg

[npm-version-href]: https://www.npmjs.com/package/@regle/core

[npm-downloads-src]: https://img.shields.io/npm/dm/@regle/core.svg

[npm-total-downloads-src]: https://img.shields.io/npm/dt/@regle/core.svg

[npm-downloads-href]: https://www.npmjs.com/package/@regle/core



  





    

    

    

    

   

  


# Regle

Regle \ʁɛɡl\ (French word for 'rule' ) is a headless model-based form validation library for Vue 3.

It's heavily inspired by Vuelidate and aims to replace it in modern apps.

## 📚 Documentation

[![Documentation](https://raw.githubusercontent.com/victorgarciaesgi/regle/refs/heads/main/.github/images/redirectDoc.svg)](https://reglejs.dev/)

## 🎮 Play with it

### Playground



| Simple demo  | Advanced Demo |

| ------------- | ------------- |

|[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/~/github.com/victorgarciaesgi/regle-examples/tree/main/examples/simple-example?file=examples/simple-example/src/App.vue&configPath=examples/simple-example)  | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/~/github.com/victorgarciaesgi/regle-examples/tree/main/examples/advanced-example?file=examples/advanced-example/src/App.vue&configPath=examples/advanced-example)  |

## 🧰 Features

- ✅ 100% type inference

- 📖 Model based validation

- 💀 Headless

- 🪗 Extensible

- 🛒 Collection validation

- Standard Schemas spec support

  - 🦸‍♂️ [Zod](https://zod.dev/)

  - 🤖 [Valibot](https://valibot.dev/)

  - 🚢 [ArkType](https://arktype.io)  🚧

## 🫶 Credits

- [Johannes Lacourly](https://www.behance.net/johanneslaf7dc) for designing logo and banners 🪄

- [Martins Zeltins](https://github.com/martinszeltins) who helped me identify a lot of bugs, find new features and contributed to docs.

- [Vuelidate](https://vuelidate-next.netlify.app) Which I loved and used for 8 years, and is my main inspiration for creating Regle

## Basic example

```vue

  

  


    


      {{ error }}

    

  


import { useRegle } from '@regle/core';

import { required, minLength, email } from '@regle/rules';

const { r$ } = useRegle({ email: '' }, {

  email: { required, minLength: minLength(4), email }

})

```

## Compatibility:

-  Vue 3.3+

-  Nuxt 3.1+

-  Pinia 2.2.5+

- Standard Schemas

  - 🦸‍♂️ Zod 3.24+

  - 🤖 Valibot 1.0+

  - 🚢 Arktype 2.0.0+

## ⬇️ Quick install

```bash

pnpm install @regle/core @regle/rules

# or

yarn add @regle/core @regle/rules

# or

npm install @regle/core @regle/rules

```

## 📑 License

[MIT License](./LICENSE)