{
  "$schema": "https://shadcn-vue.com/schema/registry-item.json",
  "name": "auth-sign-up",
  "title": "Auth Sign Up",
  "type": "registry:block",
  "files": [
    {
      "path": "packages/registry-vue/blocks/auth-sign-up/AuthSignUp.vue",
      "content": "<script setup lang=\"ts\">\nimport { computed, ref } from 'vue'\nimport { Github, Chrome } from 'lucide-vue-next'\nimport { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from '@/components/ui/card'\nimport { Input } from '@/components/ui/input'\nimport { Label } from '@/components/ui/label'\nimport { Button } from '@/components/ui/button'\nimport { Checkbox } from '@/components/ui/checkbox'\nimport { Separator } from '@/components/ui/separator'\n\nwithDefaults(\n  defineProps<{\n    title?: string\n    description?: string\n    signInHref?: string\n    termsHref?: string\n    privacyHref?: string\n    oauthProviders?: Array<'github' | 'google'>\n  }>(),\n  {\n    title: 'Create your account',\n    description: 'Start your 14-day free trial. No credit card required.',\n    signInHref: '/login',\n    termsHref: '#',\n    privacyHref: '#',\n    oauthProviders: () => ['github', 'google'],\n  },\n)\n\nconst emit = defineEmits<{\n  (e: 'submit', payload: { name: string; email: string; password: string }): void\n  (e: 'oauth', provider: 'github' | 'google'): void\n}>()\n\nconst name = ref('')\nconst email = ref('')\nconst password = ref('')\nconst confirm = ref('')\nconst accept = ref(false)\n\nconst passwordsMatch = computed(() => !confirm.value || password.value === confirm.value)\nconst canSubmit = computed(() => name.value && email.value && password.value && passwordsMatch.value && accept.value)\n\nfunction onSubmit() {\n  if (!canSubmit.value) return\n  emit('submit', { name: name.value, email: email.value, password: password.value })\n}\n</script>\n\n<template>\n  <div class=\"bg-background flex min-h-svh items-center justify-center p-6\">\n    <Card class=\"w-full max-w-md\">\n      <CardHeader class=\"text-center\">\n        <CardTitle class=\"text-2xl\">{{ title }}</CardTitle>\n        <CardDescription>{{ description }}</CardDescription>\n      </CardHeader>\n      <CardContent>\n        <form class=\"space-y-4\" @submit.prevent=\"onSubmit\">\n          <div class=\"grid gap-2\">\n            <Label for=\"signup-name\">Full name</Label>\n            <Input id=\"signup-name\" v-model=\"name\" autocomplete=\"name\" required />\n          </div>\n          <div class=\"grid gap-2\">\n            <Label for=\"signup-email\">Email</Label>\n            <Input\n              id=\"signup-email\"\n              v-model=\"email\"\n              type=\"email\"\n              placeholder=\"you@company.com\"\n              autocomplete=\"email\"\n              required\n            />\n          </div>\n          <div class=\"grid gap-2\">\n            <Label for=\"signup-password\">Password</Label>\n            <Input id=\"signup-password\" v-model=\"password\" type=\"password\" autocomplete=\"new-password\" required />\n            <p class=\"text-muted-foreground text-xs\">8+ characters, mix of letters, numbers and symbols.</p>\n          </div>\n          <div class=\"grid gap-2\">\n            <Label for=\"signup-confirm\">Confirm password</Label>\n            <Input\n              id=\"signup-confirm\"\n              v-model=\"confirm\"\n              type=\"password\"\n              autocomplete=\"new-password\"\n              :aria-invalid=\"!passwordsMatch\"\n              required\n            />\n            <p v-if=\"!passwordsMatch\" class=\"text-destructive text-xs\">Passwords don't match.</p>\n          </div>\n          <div class=\"flex items-start gap-2\">\n            <Checkbox id=\"signup-accept\" v-model=\"accept\" />\n            <Label for=\"signup-accept\" class=\"text-sm leading-snug font-normal\">\n              I agree to the\n              <a :href=\"termsHref\" class=\"text-foreground underline-offset-4 hover:underline\">Terms of Service</a>\n              and\n              <a :href=\"privacyHref\" class=\"text-foreground underline-offset-4 hover:underline\">Privacy Policy</a>.\n            </Label>\n          </div>\n          <Button type=\"submit\" class=\"w-full\" :disabled=\"!canSubmit\">Create account</Button>\n        </form>\n\n        <template v-if=\"oauthProviders.length > 0\">\n          <div class=\"my-6 flex items-center gap-3\">\n            <Separator class=\"flex-1\" />\n            <span class=\"text-muted-foreground text-xs uppercase\">or continue with</span>\n            <Separator class=\"flex-1\" />\n          </div>\n          <div class=\"grid gap-2\" :class=\"oauthProviders.length > 1 ? 'sm:grid-cols-2' : ''\">\n            <Button\n              v-if=\"oauthProviders.includes('github')\"\n              variant=\"outline\"\n              type=\"button\"\n              @click=\"emit('oauth', 'github')\"\n            >\n              <Github class=\"mr-2 size-4\" />GitHub\n            </Button>\n            <Button\n              v-if=\"oauthProviders.includes('google')\"\n              variant=\"outline\"\n              type=\"button\"\n              @click=\"emit('oauth', 'google')\"\n            >\n              <Chrome class=\"mr-2 size-4\" />Google\n            </Button>\n          </div>\n        </template>\n      </CardContent>\n      <CardFooter class=\"justify-center\">\n        <p class=\"text-muted-foreground text-sm\">\n          Already have an account?\n          <a :href=\"signInHref\" class=\"text-foreground font-medium underline-offset-4 hover:underline\">Sign in</a>\n        </p>\n      </CardFooter>\n    </Card>\n  </div>\n</template>\n",
      "type": "registry:block",
      "target": "~/app/components/blocks/AuthSignUp.vue"
    }
  ],
  "dependencies": [
    "lucide-vue-next"
  ],
  "devDependencies": [],
  "registryDependencies": [
    "https://uipkge.dev/r/vue/card.json",
    "https://uipkge.dev/r/vue/input.json",
    "https://uipkge.dev/r/vue/label.json",
    "https://uipkge.dev/r/vue/button.json",
    "https://uipkge.dev/r/vue/checkbox.json",
    "https://uipkge.dev/r/vue/separator.json"
  ],
  "description": "Full-page sign-up surface. Name/email/password/confirm form with password-match validation, T&C acceptance gate, optional OAuth row, link back to sign-in. Emits `submit` with the validated payload and `oauth` with provider; consumer wires the actual auth call.",
  "categories": [
    "auth"
  ]
}