snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

apps/v4/app/(app)/examples/authentication/components/user-auth-form.tsx

@@ -0,0 +1,65 @@
+"use client"
+
+import * as React from "react"
+import { cn } from "cn"
+
+import { Icons } from "@/components/icons"
+import { Button } from "@/registry/new-york-v4/ui/button"
+import {
+  Field,
+  FieldGroup,
+  FieldLabel,
+  FieldSeparator,
+} from "@/registry/new-york-v4/ui/field"
+import { Input } from "@/registry/new-york-v4/ui/input"
+import { Spinner } from "@/registry/new-york-v4/ui/spinner"
+
+export function UserAuthForm({
+  className,
+  ...props
+}: React.ComponentProps<"div">) {
+  const [isLoading, setIsLoading] = React.useState<boolean>(false)
+
+  async function onSubmit(event: React.SyntheticEvent) {
+    event.preventDefault()
+    setIsLoading(true)
+
+    setTimeout(() => {
+      setIsLoading(false)
+    }, 3000)
+  }
+
+  return (
+    <div className={cn("grid gap-6", className)} {...props}>
+      <form onSubmit={onSubmit}>
+        <FieldGroup>
+          <Field>
+            <FieldLabel className="sr-only" htmlFor="email">
+              Email
+            </FieldLabel>
+            <Input
+              id="email"
+              placeholder="name@example.com"
+              type="email"
+              autoCapitalize="none"
+              autoComplete="email"
+              autoCorrect="off"
+              disabled={isLoading}
+            />
+          </Field>
+          <Field>
+            <Button disabled={isLoading}>
+              {isLoading && <Spinner />}
+              Sign In with Email
+            </Button>
+          </Field>
+        </FieldGroup>
+      </form>
+      <FieldSeparator>Or continue with</FieldSeparator>
+      <Button variant="outline" type="button" disabled={isLoading}>
+        {isLoading ? <Spinner /> : <Icons.gitHub className="mr-2 h-4 w-4" />}{" "}
+        GitHub
+      </Button>
+    </div>
+  )
+}

apps/v4/app/(app)/examples/authentication/page.tsx

@@ -0,0 +1,92 @@
+import { type Metadata } from "next"
+import Image from "next/image"
+import Link from "next/link"
+import { cn } from "cn"
+
+import { buttonVariants } from "@/registry/new-york-v4/ui/button"
+import { FieldDescription } from "@/registry/new-york-v4/ui/field"
+import { UserAuthForm } from "@/app/(app)/examples/authentication/components/user-auth-form"
+
+export const metadata: Metadata = {
+  title: "Authentication",
+  description: "Authentication forms built using the components.",
+}
+
+export default function AuthenticationPage() {
+  return (
+    <>
+      <div className="md:hidden">
+        <Image
+          src="/examples/authentication-light.png"
+          width={1280}
+          height={843}
+          alt="Authentication"
+          className="block dark:hidden"
+          priority
+        />
+        <Image
+          src="/examples/authentication-dark.png"
+          width={1280}
+          height={843}
+          alt="Authentication"
+          className="hidden dark:block"
+          priority
+        />
+      </div>
+      <div className="relative container hidden flex-1 shrink-0 items-center justify-center md:grid lg:max-w-none lg:grid-cols-2 lg:px-0">
+        <Link
+          href="/examples/authentication"
+          className={cn(
+            buttonVariants({ variant: "ghost" }),
+            "absolute top-4 right-4 md:top-8 md:right-8"
+          )}
+        >
+          Login
+        </Link>
+        <div className="relative hidden h-full flex-col p-10 text-primary lg:flex dark:border-r">
+          <div className="absolute inset-0 bg-primary/5" />
+          <div className="relative z-20 flex items-center text-lg font-medium">
+            <svg
+              xmlns="http://www.w3.org/2000/svg"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              className="mr-2 h-6 w-6"
+            >
+              <path d="M15 6v12a3 3 0 1 0 3-3H6a3 3 0 1 0 3 3V6a3 3 0 1 0-3 3h12a3 3 0 1 0-3-3" />
+            </svg>
+            Acme Inc
+          </div>
+          <div className="relative z-20 mt-auto">
+            <blockquote className="leading-normal text-balance">
+              &ldquo;This library has saved me countless hours of work and
+              helped me deliver stunning designs to my clients faster than ever
+              before.&rdquo; - Sofia Davis
+            </blockquote>
+          </div>
+        </div>
+        <div className="flex items-center justify-center lg:h-[1000px] lg:p-8">
+          <div className="mx-auto flex w-full flex-col justify-center gap-6 sm:w-[350px]">
+            <div className="flex flex-col gap-2 text-center">
+              <h1 className="text-2xl font-semibold tracking-tight">
+                Create an account
+              </h1>
+              <p className="text-sm text-muted-foreground">
+                Enter your email below to create your account
+              </p>
+            </div>
+            <UserAuthForm />
+            <FieldDescription className="px-6 text-center">
+              By clicking continue, you agree to our{" "}
+              <Link href="/terms">Terms of Service</Link> and{" "}
+              <Link href="/privacy">Privacy Policy</Link>.
+            </FieldDescription>
+          </div>
+        </div>
+      </div>
+    </>
+  )
+}