VueTech Welcome to [VueTech], a lightweight, powerful, and easy-to-use form validation library built with Vue.js and styled with Tailwind CSS. Whether you're building a simple contact form or a complex multi-step form, this library provides a seamless way to validate user inputs with minimal setup and maximum flexibility.

Why Use [VueTech]?

• 🚀 Simple Integration: Easily integrate with Vue.js projects.
• 🎨 Tailwind CSS Support: Designed to work seamlessly with Tailwind CSS for beautiful, responsive forms.
• ✅ Custom Validation Rules: Create custom validation rules tailored to your needs.
• 📦 Lightweight: Minimal footprint with zero unnecessary dependencies.
• 🔧 Extensible: Add or modify validation rules as your project grows.

Features

• Built-in validation for common input types (email, password, phone numbers, etc.).
• Custom error messages for each validation rule.
• Real-time validation feedback for a better user experience.
• Support for both single-field and form-wide validation.

Quick Start

• install the library

    npm i vuetech

• Import and use it in your Vue.js project:

    import { createApp } from 'vue'
    import './style.css'
    import App from './App.vue'
    import vueTech from 'vuetech'
    import 'vuetech/dist/style.css'
    createApp(App).use( vueTech).mount('#app')

• Add new variable call form in script tag

    const form = ref(null)

• Add validation Function

  function required(e) {
  if (isString(e)) {
    if (!e.trim()) {
      return "This input is required";
    }
    return false;
  }
  if (isEmpty(e) && e !==0) return "This input is required ";
  return false;
  }

• Add function submit in script tag

    const submit  = ()=>{
      form.value.validate().then(()=>{
        console.log('passed')
      })
    }

• Use in template tag and pass the funciton validation into prop rules .

 <VTform ref="form" @submit.prevent="submit">
      <VTtextFiled  :rules="[required]" v-model="data"  label="enter your name " variant="filled" ></VTtextFiled>
      <button type="submit" >submit</button>
 </VTform>

• And Done

We welcome contributions! If you'd like to improve [VueTech]