⚛️ React + Vite

To begin integrating PramanAuth, install the SDK along with its peer dependency, tslib (required for bundler helper resolution):

npm install @praman-network/sdk tslib

If you are using Vite, you must configure polyfills for Node.js variables such as Buffer and global.

1. Install the Polyfill Plugin

npm install vite-plugin-node-polyfills --save-dev

2. Update vite.config.ts (or vite.config.js)

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import { nodePolyfills } from 'vite-plugin-node-polyfills'

export default defineConfig({
  plugins: [
    react(),
    // Ye plugin global, Buffer, process sabko browser me available kar dega
    nodePolyfills({
      globals: {
        Buffer: true,
        global: true,
        process: true,
      },
    }),
  ],
  optimizeDeps: {
    include: ['@praman-network/sdk', '@lit-protocol/lit-node-client', 'tslib']
  },
  build: {
    commonjsOptions: {
      transformMixedEsModules: true
    }
  }
})

---

Basic Usage Example

Once installed and configured, initialize the SDK and trigger login from a component:

import { useEffect } from 'react';
import { initPraman, loginWithPraman } from '@praman-network/sdk';

function App() {
  useEffect(() => {
    // Initialize with your developer API Key
    initPraman({
      apiKey: 'pm_dev_your_api_key_here',
      backendUrl: 'https://auth.praman.network'
    });
  }, []);

  const handleLogin = async () => {
    try {
      const authResult = await loginWithPraman();
      console.log('User Authenticated:', authResult);
    } catch (err) {
      console.error('Authentication error:', err);
    }
  };

  return (
    <button onClick={handleLogin}>
      Sign in with Praman
    </button>
  );
}

export default App;

Looking for a fully styled, production-ready login card instead? See the Premium Login Component Examples.