@partylayer/react 0.2.4 → 0.2.6

package/LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2024 CantonConnect
+Copyright (c) 2024 PartyLayer
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

package/README.md

@@ -391,9 +391,9 @@ export default function App() {
 
 ## Links
 
-- [GitHub Repository](https://github.com/cayvox/PartyLayer)
-- [Documentation](https://github.com/cayvox/PartyLayer#readme)
-- [Report Issues](https://github.com/cayvox/PartyLayer/issues)
+- [GitHub Repository](https://github.com/PartyLayer/PartyLayer)
+- [Documentation](https://github.com/PartyLayer/PartyLayer#readme)
+- [Report Issues](https://github.com/PartyLayer/PartyLayer/issues)
 - [Canton Network](https://www.canton.network/)
 
 ---

package/dist/index.d.mts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _partylayer_sdk from '@partylayer/sdk';
-import { PartyLayerClient, Session, WalletInfo, ConnectOptions, RegistryStatus, SignMessageParams, SignedMessage, SignTransactionParams, SignedTransaction, SubmitTransactionParams, TxReceipt } from '@partylayer/sdk';
+import { PartyLayerClient, Session, WalletInfo, ConnectOptions, RegistryStatus, SignMessageParams, SignedMessage, SignTransactionParams, SignedTransaction, SubmitTransactionParams, TxReceipt, WalletAdapter, AdapterClass, WalletId, CIP0103Provider, CapabilityKey, AdapterDetectResult, AdapterContext, PartyId, AdapterConnectResult, DiscoveredProvider } from '@partylayer/sdk';
 import * as _partylayer_core from '@partylayer/core';
 export { RegistryStatus } from '@partylayer/registry-client';
 
@@ -15,8 +15,10 @@ declare function usePartyLayerContext(): PartyLayerContextValue;
 interface PartyLayerProviderProps {
     client: PartyLayerClient;
     children: React.ReactNode;
+    /** Network identifier for native CIP-0103 wallet discovery */
+    network?: string;
 }
-declare function PartyLayerProvider({ client, children, }: PartyLayerProviderProps): react_jsx_runtime.JSX.Element;
+declare function PartyLayerProvider({ client, children, network, }: PartyLayerProviderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Hook to access PartyLayer client
@@ -48,6 +50,7 @@ declare function useConnect(): {
     connect: (options?: ConnectOptions) => Promise<Session | null>;
     isConnecting: boolean;
     error: Error | null;
+    reset: () => void;
 };
 /**
  * Hook to disconnect from a wallet
@@ -83,13 +86,154 @@ declare function useSubmitTransaction(): {
 };
 
 /**
- * Wallet selection modal component
+ * Lightweight theme system for PartyLayer UI components.
+ * No external CSS-in-JS dependency — just a token object + React context.
  */
+interface PartyLayerTheme {
+    mode: 'light' | 'dark';
+    colors: {
+        primary: string;
+        primaryHover: string;
+        background: string;
+        surface: string;
+        text: string;
+        textSecondary: string;
+        border: string;
+        success: string;
+        successBg: string;
+        error: string;
+        errorBg: string;
+        warning: string;
+        warningBg: string;
+        overlay: string;
+    };
+    borderRadius: string;
+    fontFamily: string;
+}
+declare const lightTheme: PartyLayerTheme;
+declare const darkTheme: PartyLayerTheme;
+/**
+ * Access the current PartyLayer theme.
+ * Falls back to lightTheme if no ThemeProvider is present (backward-compatible).
+ */
+declare function useTheme(): PartyLayerTheme;
+interface ThemeProviderProps {
+    theme: 'light' | 'dark' | 'auto' | PartyLayerTheme;
+    children: React.ReactNode;
+}
+declare function ThemeProvider({ theme, children }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+/** Map of walletId → icon URL for custom wallet logos */
+type WalletIconMap = Record<string, string>;
+/** Access wallet icon overrides from PartyLayerKit */
+declare function useWalletIcons(): WalletIconMap;
+/**
+ * Resolve icon URL for a wallet. Priority:
+ * 1. walletIcons map (exact match or fuzzy)
+ * 2. wallet.icons.sm from registry
+ * 3. null (caller renders fallback)
+ */
+declare function resolveWalletIcon(walletId: string, walletIcons: WalletIconMap, registryIconUrl?: string): string | null;
+interface PartyLayerKitProps {
+    /** Canton network to connect to */
+    network: 'devnet' | 'testnet' | 'mainnet';
+    /** Application name shown to wallets during connection */
+    appName: string;
+    children: React.ReactNode;
+    /** Registry URL override (default: https://registry.partylayer.xyz) */
+    registryUrl?: string;
+    /** Registry channel (default: 'stable') */
+    channel?: 'stable' | 'beta';
+    /**
+     * Custom wallet adapters. If not provided, uses built-in adapters:
+     * Console Wallet, 5N Loop, Cantor8.
+     *
+     * For Bron (enterprise OAuth), pass explicitly:
+     *   adapters={[...getBuiltinAdapters(), new BronAdapter(config)]}
+     */
+    adapters?: (WalletAdapter | AdapterClass)[];
+    /** Theme preset or custom theme object (default: 'light') */
+    theme?: 'light' | 'dark' | 'auto' | PartyLayerTheme;
+    /** Custom wallet icon URLs by walletId */
+    walletIcons?: WalletIconMap;
+}
+declare function PartyLayerKit({ network, appName, children, registryUrl, channel, adapters, theme, walletIcons, }: PartyLayerKitProps): react_jsx_runtime.JSX.Element;
+
 interface WalletModalProps {
     isOpen: boolean;
     onClose: () => void;
     onConnect: (sessionId: string) => void;
+    /** Custom wallet icon URLs (merged with PartyLayerKit context) */
+    walletIcons?: WalletIconMap;
+}
+declare function WalletModal({ isOpen, onClose, onConnect, walletIcons: propIcons, }: WalletModalProps): react_jsx_runtime.JSX.Element | null;
+
+/**
+ * ConnectButton — Premium wallet connection button for Canton dApps.
+ *
+ * Manages the full lifecycle: disconnect → connect (via WalletModal) → connected state.
+ * Uses existing hooks (useSession, useConnect, useDisconnect) under the hood.
+ *
+ * Designed for dApp developers to embed directly — brand-aligned, accessible,
+ * and polished across light/dark themes.
+ */
+interface ConnectButtonProps {
+    /** Button label when disconnected (default: "Connect Wallet") */
+    label?: string;
+    /** What to show when connected: partyId address, wallet name, or custom */
+    connectedLabel?: 'address' | 'wallet' | 'custom';
+    /** Custom formatter for connected display (requires connectedLabel='custom') */
+    formatAddress?: (partyId: string) => string;
+    /** Additional CSS class name */
+    className?: string;
+    /** Additional inline styles */
+    style?: React.CSSProperties;
+    /** Show disconnect option in dropdown (default: true) */
+    showDisconnect?: boolean;
+}
+/**
+ * Truncate a partyId for display: "party-abc123def456" → "party-abc...456"
+ */
+declare function truncatePartyId(id: string, chars?: number): string;
+declare function ConnectButton({ label, connectedLabel, formatAddress, className, style, showDisconnect, }: ConnectButtonProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Native CIP-0103 Adapter
+ *
+ * Wraps a discovered CIP-0103 Provider into the PartyLayer WalletAdapter interface.
+ * This allows native CIP-0103 wallets (injected at window.canton.* etc.) to be used
+ * through the standard SDK connect flow alongside registry-based adapters.
+ */
+
+/**
+ * A WalletAdapter that delegates to a native CIP-0103 Provider.
+ *
+ * Created dynamically when a CIP-0103 provider is discovered at runtime.
+ * Routes all SDK operations through the provider's `request()` method.
+ */
+declare class NativeCIP0103Adapter implements WalletAdapter {
+    readonly walletId: WalletId;
+    readonly name: string;
+    private provider;
+    constructor(id: string, name: string, provider: CIP0103Provider);
+    getCapabilities(): CapabilityKey[];
+    detectInstalled(): Promise<AdapterDetectResult>;
+    connect(_ctx: AdapterContext, _opts?: {
+        timeoutMs?: number;
+        partyId?: PartyId;
+    }): Promise<AdapterConnectResult>;
+    disconnect(_ctx: AdapterContext, _session: Session): Promise<void>;
+    signMessage(_ctx: AdapterContext, _session: Session, params: SignMessageParams): Promise<SignedMessage>;
+    signTransaction(_ctx: AdapterContext, _session: Session, params: SignTransactionParams): Promise<SignedTransaction>;
+    submitTransaction(_ctx: AdapterContext, _session: Session, params: SubmitTransactionParams): Promise<TxReceipt>;
 }
-declare function WalletModal({ isOpen, onClose, onConnect, }: WalletModalProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * Create a WalletAdapter from a discovered CIP-0103 provider.
+ */
+declare function createNativeAdapter(discovered: DiscoveredProvider): NativeCIP0103Adapter;
+/**
+ * Create a synthetic WalletInfo for a discovered native CIP-0103 provider.
+ */
+declare function createSyntheticWalletInfo(discovered: DiscoveredProvider, network: string): WalletInfo;
 
-export { PartyLayerProvider as CantonConnectProvider, PartyLayerProvider, WalletModal, usePartyLayer as useCantonConnect, useConnect, useDisconnect, usePartyLayer, usePartyLayerContext, useRegistryStatus, useSession, useSignMessage, useSignTransaction, useSubmitTransaction, useWallets };
+export { PartyLayerProvider as CantonConnectProvider, ConnectButton, type ConnectButtonProps, NativeCIP0103Adapter, PartyLayerKit, type PartyLayerKitProps, PartyLayerProvider, type PartyLayerTheme, ThemeProvider, type WalletIconMap, WalletModal, type WalletModalProps, createNativeAdapter, createSyntheticWalletInfo, darkTheme, lightTheme, resolveWalletIcon, truncatePartyId, usePartyLayer as useCantonConnect, useConnect, useDisconnect, usePartyLayer, usePartyLayerContext, useRegistryStatus, useSession, useSignMessage, useSignTransaction, useSubmitTransaction, useTheme, useWalletIcons, useWallets };

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as _partylayer_sdk from '@partylayer/sdk';
-import { PartyLayerClient, Session, WalletInfo, ConnectOptions, RegistryStatus, SignMessageParams, SignedMessage, SignTransactionParams, SignedTransaction, SubmitTransactionParams, TxReceipt } from '@partylayer/sdk';
+import { PartyLayerClient, Session, WalletInfo, ConnectOptions, RegistryStatus, SignMessageParams, SignedMessage, SignTransactionParams, SignedTransaction, SubmitTransactionParams, TxReceipt, WalletAdapter, AdapterClass, WalletId, CIP0103Provider, CapabilityKey, AdapterDetectResult, AdapterContext, PartyId, AdapterConnectResult, DiscoveredProvider } from '@partylayer/sdk';
 import * as _partylayer_core from '@partylayer/core';
 export { RegistryStatus } from '@partylayer/registry-client';
 
@@ -15,8 +15,10 @@ declare function usePartyLayerContext(): PartyLayerContextValue;
 interface PartyLayerProviderProps {
     client: PartyLayerClient;
     children: React.ReactNode;
+    /** Network identifier for native CIP-0103 wallet discovery */
+    network?: string;
 }
-declare function PartyLayerProvider({ client, children, }: PartyLayerProviderProps): react_jsx_runtime.JSX.Element;
+declare function PartyLayerProvider({ client, children, network, }: PartyLayerProviderProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Hook to access PartyLayer client
@@ -48,6 +50,7 @@ declare function useConnect(): {
     connect: (options?: ConnectOptions) => Promise<Session | null>;
     isConnecting: boolean;
     error: Error | null;
+    reset: () => void;
 };
 /**
  * Hook to disconnect from a wallet
@@ -83,13 +86,154 @@ declare function useSubmitTransaction(): {
 };
 
 /**
- * Wallet selection modal component
+ * Lightweight theme system for PartyLayer UI components.
+ * No external CSS-in-JS dependency — just a token object + React context.
  */
+interface PartyLayerTheme {
+    mode: 'light' | 'dark';
+    colors: {
+        primary: string;
+        primaryHover: string;
+        background: string;
+        surface: string;
+        text: string;
+        textSecondary: string;
+        border: string;
+        success: string;
+        successBg: string;
+        error: string;
+        errorBg: string;
+        warning: string;
+        warningBg: string;
+        overlay: string;
+    };
+    borderRadius: string;
+    fontFamily: string;
+}
+declare const lightTheme: PartyLayerTheme;
+declare const darkTheme: PartyLayerTheme;
+/**
+ * Access the current PartyLayer theme.
+ * Falls back to lightTheme if no ThemeProvider is present (backward-compatible).
+ */
+declare function useTheme(): PartyLayerTheme;
+interface ThemeProviderProps {
+    theme: 'light' | 'dark' | 'auto' | PartyLayerTheme;
+    children: React.ReactNode;
+}
+declare function ThemeProvider({ theme, children }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
+
+/** Map of walletId → icon URL for custom wallet logos */
+type WalletIconMap = Record<string, string>;
+/** Access wallet icon overrides from PartyLayerKit */
+declare function useWalletIcons(): WalletIconMap;
+/**
+ * Resolve icon URL for a wallet. Priority:
+ * 1. walletIcons map (exact match or fuzzy)
+ * 2. wallet.icons.sm from registry
+ * 3. null (caller renders fallback)
+ */
+declare function resolveWalletIcon(walletId: string, walletIcons: WalletIconMap, registryIconUrl?: string): string | null;
+interface PartyLayerKitProps {
+    /** Canton network to connect to */
+    network: 'devnet' | 'testnet' | 'mainnet';
+    /** Application name shown to wallets during connection */
+    appName: string;
+    children: React.ReactNode;
+    /** Registry URL override (default: https://registry.partylayer.xyz) */
+    registryUrl?: string;
+    /** Registry channel (default: 'stable') */
+    channel?: 'stable' | 'beta';
+    /**
+     * Custom wallet adapters. If not provided, uses built-in adapters:
+     * Console Wallet, 5N Loop, Cantor8.
+     *
+     * For Bron (enterprise OAuth), pass explicitly:
+     *   adapters={[...getBuiltinAdapters(), new BronAdapter(config)]}
+     */
+    adapters?: (WalletAdapter | AdapterClass)[];
+    /** Theme preset or custom theme object (default: 'light') */
+    theme?: 'light' | 'dark' | 'auto' | PartyLayerTheme;
+    /** Custom wallet icon URLs by walletId */
+    walletIcons?: WalletIconMap;
+}
+declare function PartyLayerKit({ network, appName, children, registryUrl, channel, adapters, theme, walletIcons, }: PartyLayerKitProps): react_jsx_runtime.JSX.Element;
+
 interface WalletModalProps {
     isOpen: boolean;
     onClose: () => void;
     onConnect: (sessionId: string) => void;
+    /** Custom wallet icon URLs (merged with PartyLayerKit context) */
+    walletIcons?: WalletIconMap;
+}
+declare function WalletModal({ isOpen, onClose, onConnect, walletIcons: propIcons, }: WalletModalProps): react_jsx_runtime.JSX.Element | null;
+
+/**
+ * ConnectButton — Premium wallet connection button for Canton dApps.
+ *
+ * Manages the full lifecycle: disconnect → connect (via WalletModal) → connected state.
+ * Uses existing hooks (useSession, useConnect, useDisconnect) under the hood.
+ *
+ * Designed for dApp developers to embed directly — brand-aligned, accessible,
+ * and polished across light/dark themes.
+ */
+interface ConnectButtonProps {
+    /** Button label when disconnected (default: "Connect Wallet") */
+    label?: string;
+    /** What to show when connected: partyId address, wallet name, or custom */
+    connectedLabel?: 'address' | 'wallet' | 'custom';
+    /** Custom formatter for connected display (requires connectedLabel='custom') */
+    formatAddress?: (partyId: string) => string;
+    /** Additional CSS class name */
+    className?: string;
+    /** Additional inline styles */
+    style?: React.CSSProperties;
+    /** Show disconnect option in dropdown (default: true) */
+    showDisconnect?: boolean;
+}
+/**
+ * Truncate a partyId for display: "party-abc123def456" → "party-abc...456"
+ */
+declare function truncatePartyId(id: string, chars?: number): string;
+declare function ConnectButton({ label, connectedLabel, formatAddress, className, style, showDisconnect, }: ConnectButtonProps): react_jsx_runtime.JSX.Element;
+
+/**
+ * Native CIP-0103 Adapter
+ *
+ * Wraps a discovered CIP-0103 Provider into the PartyLayer WalletAdapter interface.
+ * This allows native CIP-0103 wallets (injected at window.canton.* etc.) to be used
+ * through the standard SDK connect flow alongside registry-based adapters.
+ */
+
+/**
+ * A WalletAdapter that delegates to a native CIP-0103 Provider.
+ *
+ * Created dynamically when a CIP-0103 provider is discovered at runtime.
+ * Routes all SDK operations through the provider's `request()` method.
+ */
+declare class NativeCIP0103Adapter implements WalletAdapter {
+    readonly walletId: WalletId;
+    readonly name: string;
+    private provider;
+    constructor(id: string, name: string, provider: CIP0103Provider);
+    getCapabilities(): CapabilityKey[];
+    detectInstalled(): Promise<AdapterDetectResult>;
+    connect(_ctx: AdapterContext, _opts?: {
+        timeoutMs?: number;
+        partyId?: PartyId;
+    }): Promise<AdapterConnectResult>;
+    disconnect(_ctx: AdapterContext, _session: Session): Promise<void>;
+    signMessage(_ctx: AdapterContext, _session: Session, params: SignMessageParams): Promise<SignedMessage>;
+    signTransaction(_ctx: AdapterContext, _session: Session, params: SignTransactionParams): Promise<SignedTransaction>;
+    submitTransaction(_ctx: AdapterContext, _session: Session, params: SubmitTransactionParams): Promise<TxReceipt>;
 }
-declare function WalletModal({ isOpen, onClose, onConnect, }: WalletModalProps): react_jsx_runtime.JSX.Element | null;
+/**
+ * Create a WalletAdapter from a discovered CIP-0103 provider.
+ */
+declare function createNativeAdapter(discovered: DiscoveredProvider): NativeCIP0103Adapter;
+/**
+ * Create a synthetic WalletInfo for a discovered native CIP-0103 provider.
+ */
+declare function createSyntheticWalletInfo(discovered: DiscoveredProvider, network: string): WalletInfo;
 
-export { PartyLayerProvider as CantonConnectProvider, PartyLayerProvider, WalletModal, usePartyLayer as useCantonConnect, useConnect, useDisconnect, usePartyLayer, usePartyLayerContext, useRegistryStatus, useSession, useSignMessage, useSignTransaction, useSubmitTransaction, useWallets };
+export { PartyLayerProvider as CantonConnectProvider, ConnectButton, type ConnectButtonProps, NativeCIP0103Adapter, PartyLayerKit, type PartyLayerKitProps, PartyLayerProvider, type PartyLayerTheme, ThemeProvider, type WalletIconMap, WalletModal, type WalletModalProps, createNativeAdapter, createSyntheticWalletInfo, darkTheme, lightTheme, resolveWalletIcon, truncatePartyId, usePartyLayer as useCantonConnect, useConnect, useDisconnect, usePartyLayer, usePartyLayerContext, useRegistryStatus, useSession, useSignMessage, useSignTransaction, useSubmitTransaction, useTheme, useWalletIcons, useWallets };