<script setup lang="ts">
const providers = ref([
  {
    label: 'Google',
    icon: 'simple-icons-google',
    color: 'neutral' as const,
    variant: 'subtle' as const
  },
  {
    label: 'GitHub',
    icon: 'simple-icons-github',
    color: 'neutral' as const,
    variant: 'subtle' as const
  }
])
const fields = ref([
  {
    name: 'email',
    type: 'text' as const,
    label: 'Email'
  },
  {
    name: 'password',
    type: 'password' as const,
    label: 'Password'
  }
])
</script>

<template>
  <UAuthForm

    class="max-w-md"
    title="登录"
    description="使用社交账号或邮箱登录"
    icon="lucide-user"
    :fields="fields"
    :providers="providers"
    :separator="{
      icon: 'lucide-user'
    }"
  />
</template>
