registry:lib

Supabase Browser Client

v1.0.0beta

Browser-side Supabase client factory used by auth-aware blocks. Returns null when Supabase env vars are absent, so components degrade to a signed-out state instead of throwing.

Registry Endpoint

Open JSON

npx shadcn@latest add @aavya/supabase-client

One-time setup — add the @aavya registry to your components.json so branded dependencies resolve to Aavya (not stock shadcn):

"registries": { "@aavya": "https://registry-dev.aavya.com/r/{name}.json" }

Or install by full URL: npx shadcn@latest add https://registry-dev.aavya.com/r/supabase-client.json

Live Preview

Live preview is not configured yet for Supabase Browser Client.

Dependencies

npm

@supabase/auth-helpers-nextjs

Usage Snippet

import Client from '@/lib/supabase/client'

export default function Example() {
  return (
    <div className="p-6">
      <Client />
    </div>
  )
}

Source Preview

import { createBrowserClient } from '@supabase/auth-helpers-nextjs'

/**
 * Creates a Supabase client for use in Client Components ('use client').
 * Returns null when env vars are not available (e.g. stale build or local dev without Supabase).
 */
export function createClient() {
  const url = process.env.NEXT_PUBLIC_SUPABASE_URL
  const key = process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY
  if (!url || !key) return null
  return createBrowserClient(url, key)
}