Skip to content

Getting Started

Welcome to PayAdvantage UI Components - a Vue 3 component library for PayAdvantage applications.

What is PayAdvantage UI Components?

PayAdvantage UI Components is a collection of Vue 3 components designed specifically for PayAdvantage applications. The library provides components with consistent styling and behavior patterns.

Quick Example

After installation and setup, you can use components in your templates:

vue
<template>
  <div>
    <pa-button variant="primary" @click="handleClick">
      Click me!
    </pa-button>
    <pa-input v-model="message" placeholder="Enter text..." />
  </div>
</template>

<script setup>
import { ref } from 'vue'

const message = ref('')

const handleClick = () => {
  console.log('Button clicked! Message:', message.value)
}
</script>

What's Next?

  1. Install the library - Set up PayAdvantage UI Components in your project
  2. Learn component usage - Understand how to use components effectively
  3. Explore components - Browse all available components

Need Help?