Agent skill · onmax

regle

Core Regle form validation in Vue 3 — setup with `useRegle`, the reactive `r object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad" /> object, validation properties, displaying errors, and modifiers. Use when ad","url":"https://atskills.one/onmax/regle","author":{"@type":"Organization","name":"onmax"},"isPartOf":{"@type":"WebSite","name":"@skills","url":"https://atskills.one"},"applicationCategory":"DeveloperApplication","offers":{"@type":"Offer","price":"0","priceCurrency":"USD"},"operatingSystem":"Any"} object, validation properties, displaying errors, and modifiers. Use when adding or editing Regle forms, binding `v-model` to `r$.$value`, or reading `$error`/`$errors`/`$invalid`/`$validate`/`$reset`. For validation rules see regle-rules; for advanced patterns see regle-advanced.

What it needs

About 2k tokens when loaded.

What this skill does

Regle Regle is a type-safe, model-based, headless form validation library for Vue 3. It provides full TypeScript inference, reactive validation, and works with any UI framework or design system. MCP Server Regle provides an MCP server that can be used to get documentation and autocomplete for Regle. If it's available, use it to get up-to-date information on the API. sh Core + built-in rules pnpm add @regle/core @regle/rules Optional: schema support (Zod, Valibot, ArkType) pnpm add @regle/schemas ts import { useRegle } from '@regle/core'; import { required, email, minLength } from '@regle/rules'; const { r$ } = useRegle( { name: '', email: '' }, { name: { required, minLength: minLength(3) }, email: { required, email }, } ); vue <template> <input v-model="r$.$value.name" placeholder="Name" /> <ul v-if="r$.$errors.name.length"> <li v-for="error of r$.$errors.name" :key="error">{{ error }}</li> </ul> <button @click="r$.$validate()">Submit</button> </template> Key Concepts State: first argument -- raw object, reactive, ref, or single value Rules: second argument -- mirrors the data structure, each field gets a rules object r$: returned reactive object with values, errors, dirty state, and validation methods All rules are optional by default; add required to enforce a field Core Topic Description Reference --------------------- ------------------------------------------------------------------------------------------------- ---------------------------------------------------------------------- useRegle State definition, rules declaration, dynamic rules, r$ object core-use-regle Validation Properties $invalid, $dirty, $error, $errors, $pending, $validate, $touch, $reset core-validation-properties Displaying Errors Showing errors, custom messages, getErrors, flatErrors core-displaying-errors Modifiers autoDirty, lazy, silent, rewardEarly, disabled, validationGroups, per-field modifiers core-modifiers Related skills regle-rules — built-in rules, custom rules (createRule), ru …

How to use it

Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:

@skills onmax/regle

View the source on GitHub

Browse the @skills marketplace