Integration Components

Plug in auth, OTP, and billing with one clean integration layer.

Every integration component is pre-wired for real providers, fully themeable, secure by default, and typed for exceptional developer experience.

.env.local
# Auth (better-auth)
BETTER_AUTH_SECRET="replace-me"
BETTER_AUTH_URL="http://localhost:3000"

# Stripe
STRIPE_SECRET_KEY="sk_live_..."
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY="pk_live_..."
STRIPE_WEBHOOK_SECRET="whsec_..."

# OTP / Email / SMS
RESEND_API_KEY="re_..."
TWILIO_ACCOUNT_SID="AC..."
TWILIO_AUTH_TOKEN="..."

# Optional integrations
POSTHOG_KEY="phc_..."
MAILCHIMP_API_KEY="..."
ts
app/providers.tsx
import { SpinkIntegrationsProvider, createBetterAuthAdapter, createStripeAdapter } from '@/lib/integrations';import { authClient } from '@/lib/auth-client';import { createCheckoutSession, listInvoices } from '@/app/actions/billing';const config = {  authProvider: 'better-auth',  paymentProvider: 'stripe',  otpProvider: 'google',  auth: createBetterAuthAdapter(authClient),  payments: createStripeAdapter({    createCheckoutSession,    listInvoices,  }),};export function AppProviders({ children }) {  return <SpinkIntegrationsProvider config={config}>{children}</SpinkIntegrationsProvider>;}

Login

Email and password login pre-configured for better-auth.

Auth providerbetter-auth

Optional callback URL: default provider route

Register

Ship signup in minutes by passing your better-auth client adapter.

Auth providerbetter-auth

Magic Link

Auth providerbetter-auth

Forgot Password

Auth providerbetter-auth

Social Login + Profile

Auth providerbetter-auth

OTP Verification

Email, SMS, or authenticator verification with resend timer and auto-submit.

google
Code sent to swiss@spink.dev
Resend available in 30s

Verification Patterns

Stripe Pricing

stripe

Developer License

Annual license for one developer — covers up to 3 projects with full Spink UI access.

CHF 129 / year

  • 1 developer, up to 3 projects
  • Production-ready components
  • Implementation support

Team License

Annual team license for up to 10 members across up to 8 applications.

Popular

CHF 499 / year

  • Up to 10 team members
  • Up to 8 applications
  • Priority rollout guidance

Enterprise Terms

Tailored commercial package with onboarding and negotiated support terms.

Custom

  • Dedicated onboarding
  • Negotiated terms
  • Architecture advisory

Stripe Checkout

One-time and recurring billing via Stripe sessions.

stripe

Select plan

Payment method

Selected payment method: card

Subscription Management

Manage plan status and cancellation from your dashboard.

stripe

Invoice History

List paid and open invoices with downloadable links.

stripe

Payment successful

Your subscription has been activated.

Newsletter

Resend / Mailchimp

Presigned Upload

S3 / R2 / Supabase

Assets

Drop files here or browse

Uses presigned URL from your backend adapter.

Progress

Waiting for file...

Streaming AI Chat

SSE / fetch stream
0/1000
Response stream

No response yet.

Auth-Guarded Dashboard Skeleton