@c7-digital/react 0.0.4 → 0.0.6

package/README.md

@@ -1,4 +1,4 @@
-# @c7/react
+# @c7-digital/react
 
 React hooks for Daml ledger integration using Canton JSON API v2
 
@@ -12,11 +12,11 @@ React hooks for Daml ledger integration using Canton JSON API v2
 
 ## Versioning
 
-This package follows the Canton SDK versioning scheme, matching the `@c7/ledger` package it depends on.
+This package follows the Canton SDK versioning scheme, matching the `@c7-digital/ledger` package it depends on.
 
 **Current version**: `3.3.0-snapshot.20250507.0`
 
-- Versioned to match the Canton SDK and `@c7/ledger` package
+- Versioned to match the Canton SDK and `@c7-digital/ledger` package
 - Ensures compatibility with the specific Canton OpenAPI types
 - When Canton releases a new version, both packages will be updated together
 
@@ -25,7 +25,7 @@ This package follows the Canton SDK versioning scheme, matching the `@c7/ledger`
 ## Installation
 
 ```bash
-pnpm install @c7/react @c7/ledger
+pnpm install @c7-digital/react @c7-digital/ledger
 ```
 
 ## Build Output
@@ -43,8 +43,8 @@ The library builds to the `dist/` folder with:
 Wrap your app with `DamlLedger` provider:
 
 ```tsx
-import { DamlLedger } from "@c7/react";
-import { Ledger } from "@c7/ledger";
+import { DamlLedger } from "@c7-digital/react";
+import { Ledger } from "@c7-digital/ledger";
 
 const ledger = new Ledger({
   baseUrl: "http://localhost:7575",
@@ -66,7 +66,7 @@ function App() {
 Use `useQuery` to fetch active contracts:
 
 ```tsx
-import { useQuery } from "@c7/react";
+import { useQuery } from "@c7-digital/react";
 
 function MyComponent() {
   const { contracts, loading, error, reload } = useQuery(
@@ -96,7 +96,7 @@ function MyComponent() {
 Use `useLedger` to get the ledger instance and `useUser` for the current user information:
 
 ```tsx
-import { useLedger, useUser } from "@c7/react";
+import { useLedger, useUser } from "@c7-digital/react";
 
 function ApprovalComponent({ contractId }: { contractId: string }) {
   const ledger = useLedger();
@@ -129,7 +129,7 @@ function ApprovalComponent({ contractId }: { contractId: string }) {
 Use `useStreamQuery` for live updates:
 
 ```tsx
-import { useStreamQuery } from "@c7/react";
+import { useStreamQuery } from "@c7-digital/react";
 
 function LiveContracts() {
   const { contracts, loading, connected, error } = useStreamQuery(
@@ -239,7 +239,7 @@ function useReload(): () => void;
 
 This package provides a compatible API with `@daml/react` but uses the newer Canton JSON API v2:
 
-| @daml/react        | @c7/react            | Notes                          |
+| @daml/react        | @c7-digital/react            | Notes                          |
 | ------------------ | -------------------- | ------------------------------ |
 | `DamlLedger`       | `DamlLedger`         | Same API, different backend    |
 | `useParty()`       | `useParty()`         | Identical                      |

package/dist/context.d.ts

@@ -0,0 +1,107 @@
+/**
+ * React context for Daml ledger integration
+ */
+import { ReactNode } from "react";
+import type { FunctionComponent } from "react";
+import type { InterfaceCompanion, Template } from "@daml/types";
+import { Ledger, type LedgerOptions, type TemplateMapping, type InterfaceMapping } from "@c7-digital/ledger/lite";
+import type { DamlLedgerConfig, QueryOptions, QueryResult, InterfaceQueryResult, StreamQueryResult, StreamQueryInterfaceResult, UserResult, MultiStreamQueryResult, MultiStreamInterfaceQueryResult } from "./types";
+export interface DamlLedgerProps extends LedgerOptions {
+    children: ReactNode;
+}
+/**
+ * Provider component that wraps your app and provides ledger access to hooks
+ */
+export declare const DamlLedger: FunctionComponent<DamlLedgerProps>;
+/**
+ * Hook to get the current ledger configuration
+ * @internal
+ */
+export declare function useDamlLedgerContext(): DamlLedgerConfig;
+/**
+ * Hook to get the ledger instance
+ * @returns The Ledger instance from the context
+ */
+export declare function useLedger(): Ledger;
+/**
+ * Hook to get the current user information from the token
+ * @returns Object with user data, loading state, and error
+ */
+export declare function useUser(): UserResult;
+/**
+ * Hook to get decomposed user rights
+ *
+ * @param userId Default to the user defined by the token.
+ * @returns Object of { actAsParties, readAsParties, loading, error }
+ */
+export declare function useRightsAs(userId?: string): {
+    actAsParties: string[];
+    readAsParties: string[];
+    loading: boolean;
+    error: string | null;
+};
+/**
+ * Hook to get a reload function for refreshing queries
+ * @returns Function that can be used to trigger query reloads across all hooks
+ */
+export declare function useReload(): () => void;
+/**
+ * Hook to query active contracts for a specific template
+ * @param template - The template to query
+ * @param options - Query options
+ * @returns Query result with contracts, loading state, and reload function
+ */
+export declare function useQuery<TContract extends object = object, TKey = any, TTemplateId extends string = string>(template: Template<TContract, TKey, TTemplateId>, options?: QueryOptions): QueryResult<TContract, TKey>;
+/**
+ * Hook to query interface views for a specific interface
+ * @param interface_ - The Daml interface to query
+ * @param options - Query options
+ * @returns Query result with contracts, loading state, and reload function
+ */
+export declare function useQueryInterface<TInterface extends object = object, TKey = unknown, TInterfaceId extends string = string>(interface_: InterfaceCompanion<TInterface, TKey, TInterfaceId>, options?: QueryOptions): InterfaceQueryResult<TInterface>;
+/**
+ * Hook to stream active contracts for a single template with real-time updates
+ * @param template - The template to query
+ * @param options - Query options
+ * @returns Stream query result with contracts, loading state, connection status, and reload function
+ */
+export declare function useStreamQuery<TContract extends object = object, TKey = any, TTemplateId extends string = string>(template: Template<TContract, TKey, TTemplateId>, options?: QueryOptions): StreamQueryResult<TContract, TKey>;
+/**
+ * Hook to stream active contracts for a single interface with real-time updates
+ * @param interface_ - The interface to query
+ * @param options - Query options
+ * @returns Stream query result with contracts, loading state, connection status, and reload function
+ */
+export declare function useStreamQueryInterface<IContract extends object = object, IId extends string = string>(interface_: InterfaceCompanion<IContract, unknown, IId>, options?: QueryOptions): StreamQueryInterfaceResult<IContract>;
+/**
+ * Hook to stream active contracts for multiple templates with real-time updates
+ * @param templateMapping - Mapping of template IDs to their contract and key types
+ * @param options - Query options
+ * @returns Multi-stream query result with stream instance, loading state, connection status, and reload function
+ */
+export declare function useMultiStreamQuery<TM extends TemplateMapping>(templateMapping: TM, options?: QueryOptions): MultiStreamQueryResult<TM>;
+/**
+ * Hook to stream active contracts for multiple interfaces with real-time updates
+ * @param interfaceMapping - Mapping of interface IDs to their contract types
+ * @param options - Query options
+ * @returns Multi-stream query result with stream instance, loading state, connection status, and reload function
+ */
+export declare function useMultiStreamInterfaceQuery<IM extends InterfaceMapping>(interfaceMapping: IM, options?: QueryOptions): MultiStreamInterfaceQueryResult<IM>;
+/**
+ * Creates a ledger context object with hooks for accessing ledger functionality
+ * This maintains compatibility with @daml/react patterns while using our new implementation
+ */
+export declare function createLedgerContext(): {
+    DamlLedger: FunctionComponent<DamlLedgerProps>;
+    useLedger: typeof useLedger;
+    useUser: typeof useUser;
+    useReload: typeof useReload;
+    useQuery: typeof useQuery;
+    useQueryInterface: typeof useQueryInterface;
+    useStreamQuery: typeof useStreamQuery;
+    useStreamQueryInterface: typeof useStreamQueryInterface;
+    useMultiStreamQuery: typeof useMultiStreamQuery;
+    useMultiStreamInterfaceQuery: typeof useMultiStreamInterfaceQuery;
+    useRightsAs: typeof useRightsAs;
+};
+//# sourceMappingURL=context.d.ts.map

package/dist/context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.d.ts","sourceRoot":"","sources":["../src/context.ts"],"names":[],"mappings":"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"}

package/dist/context.js

@@ -0,0 +1,527 @@
+/**
+ * React context for Daml ledger integration
+ */
+import { createContext, useContext, createElement, useMemo, useState, useEffect, useCallback, useRef, } from "react";
+import { Ledger, } from "@c7-digital/ledger/lite";
+const DamlLedgerContext = createContext(null);
+/**
+ * Provider component that wraps your app and provides ledger access to hooks
+ */
+export const DamlLedger = props => {
+    const { children, token, ...otherOptions } = props;
+    const [reloadTrigger, setReloadTrigger] = useState(0);
+    // Capture initial options on first render and never change them
+    // These options should be static for the lifetime of the component
+    const initialOptionsRef = useRef(otherOptions);
+    // Create ledger with initial token, but don't recreate when token changes
+    // Token updates are handled via updateToken() on streams
+    // Only recreate when reloadTrigger changes (explicit reload requested)
+    const ledger = useMemo(() => {
+        return new Ledger({ ...initialOptionsRef.current, token });
+    }, [reloadTrigger]);
+    const triggerReload = useCallback(() => {
+        setReloadTrigger(prev => prev + 1);
+    }, []);
+    const contextValue = useMemo(() => ({
+        ledger,
+        reloadTrigger,
+        triggerReload,
+    }), [ledger, reloadTrigger, triggerReload]);
+    return createElement(DamlLedgerContext.Provider, { value: contextValue }, children);
+};
+/**
+ * Hook to get the current ledger configuration
+ * @internal
+ */
+export function useDamlLedgerContext() {
+    const context = useContext(DamlLedgerContext);
+    if (!context) {
+        throw new Error("useDamlLedgerContext must be used within a DamlLedger provider");
+    }
+    return context;
+}
+/**
+ * Hook to get the ledger instance
+ * @returns The Ledger instance from the context
+ */
+export function useLedger() {
+    const { ledger } = useDamlLedgerContext();
+    return ledger;
+}
+/**
+ * Hook to get the current user information from the token
+ * @returns Object with user data, loading state, and error
+ */
+export function useUser() {
+    const ledger = useLedger();
+    const [user, setUser] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        const fetchUser = async () => {
+            try {
+                setLoading(true);
+                setError(null);
+                const userInfo = await ledger.getTokenUserInfo();
+                setUser(userInfo);
+            }
+            catch (err) {
+                const errorMessage = err instanceof Error ? err : new Error("Failed to get user info");
+                setError(errorMessage);
+                setUser(null);
+            }
+            finally {
+                setLoading(false);
+            }
+        };
+        void fetchUser();
+    }, [ledger]);
+    return { user, loading, error };
+}
+/**
+ * Hook to get decomposed user rights
+ *
+ * @param userId Default to the user defined by the token.
+ * @returns Object of { actAsParties, readAsParties, loading, error }
+ */
+export function useRightsAs(userId) {
+    const ledger = useLedger();
+    const [actAsParties, setActAsParties] = useState([]);
+    const [readAsParties, setReadAsParties] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        const fetchActAsParties = async () => {
+            try {
+                const rights = await ledger.getUserInfo(userId || ledger.getTokenUserId());
+                const [actAsParties, readAsParties] = (rights?.rights || []).reduce((acc, right) => {
+                    if (right.type === "canActAs" && right.party) {
+                        acc[0].push(right.party);
+                    }
+                    else if (right.type === "canReadAs" && right.party) {
+                        acc[1].push(right.party);
+                    }
+                    else {
+                        console.warn(`This party has a right that is not canActAs or canReadAs: ${JSON.stringify(right)}`);
+                    }
+                    return acc;
+                }, [[], []]);
+                setActAsParties(actAsParties);
+                setReadAsParties(readAsParties);
+            }
+            catch (err) {
+                setError(err instanceof Error ? err.message : "Failed to fetch user rights");
+            }
+            finally {
+                setLoading(false);
+            }
+        };
+        fetchActAsParties();
+    }, [ledger, userId]);
+    return {
+        actAsParties,
+        readAsParties,
+        loading,
+        error,
+    };
+}
+/**
+ * Hook to get a reload function for refreshing queries
+ * @returns Function that can be used to trigger query reloads across all hooks
+ */
+export function useReload() {
+    const { triggerReload } = useDamlLedgerContext();
+    return triggerReload;
+}
+/**
+ * Hook to query active contracts for a specific template
+ * @param template - The template to query
+ * @param options - Query options
+ * @returns Query result with contracts, loading state, and reload function
+ */
+export function useQuery(template, options = {}) {
+    const { ledger, reloadTrigger } = useDamlLedgerContext();
+    const [contracts, setContracts] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    // Extract options values to avoid object reference issues in useEffect
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    const reload = useCallback(async () => {
+        try {
+            setLoading(true);
+            setError(null);
+            const result = await ledger.query(template, atOffset, includeCreatedEventBlob, false, // do not care about verbose stream
+            readAsParties);
+            setContracts(result);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err : new Error("Failed to query contracts");
+            setError(errorMessage);
+            setContracts([]);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [ledger, template, atOffset, includeCreatedEventBlob]);
+    // Initial load and reload when trigger changes
+    useEffect(() => {
+        reload();
+    }, [reload, reloadTrigger]);
+    return {
+        contracts,
+        loading,
+        error,
+        reload,
+    };
+}
+/**
+ * Hook to query interface views for a specific interface
+ * @param interface_ - The Daml interface to query
+ * @param options - Query options
+ * @returns Query result with contracts, loading state, and reload function
+ */
+export function useQueryInterface(interface_, options = {}) {
+    const { ledger, reloadTrigger } = useDamlLedgerContext();
+    const [interfaces, setInterfaces] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    // Extract options values to avoid object reference issues in useEffect
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    const reload = useCallback(async () => {
+        try {
+            setLoading(true);
+            setError(null);
+            const result = await ledger.queryInterface(interface_, atOffset, includeCreatedEventBlob, false, // do not care about verbose stream
+            readAsParties);
+            setInterfaces(result);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err : new Error("Failed to query contracts");
+            setError(errorMessage);
+            setInterfaces([]);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [ledger, interface_, atOffset, includeCreatedEventBlob]);
+    // Initial load and reload when trigger changes
+    useEffect(() => {
+        reload();
+    }, [reload, reloadTrigger]);
+    return {
+        interfaces,
+        loading,
+        error,
+        reload,
+    };
+}
+/**
+ * Base hook for streaming functionality - handles common state management and lifecycle
+ */
+function useStreamBase(createStream, setupAdditionalEventHandlers, dependencies = []) {
+    const { reloadTrigger } = useDamlLedgerContext();
+    const [contractsMap, setContractsMap] = useState(() => new Map());
+    const [loading, setLoading] = useState(true);
+    const [connected, setConnected] = useState(false);
+    const [error, setError] = useState(null);
+    // Use refs to prevent garbage collection
+    const streamRef = useRef(null);
+    const isCleanedUpRef = useRef(false);
+    const reconnectTimeoutRef = useRef(null);
+    const reload = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        setContractsMap(new Map());
+    }, []);
+    const updateToken = useCallback((newToken) => {
+        if (streamRef.current) {
+            streamRef.current.updateToken(newToken);
+        }
+    }, []);
+    // Setup real streaming connection
+    useEffect(() => {
+        isCleanedUpRef.current = false;
+        const setupStream = async () => {
+            if (isCleanedUpRef.current)
+                return;
+            try {
+                setLoading(true);
+                setError(null);
+                streamRef.current = await createStream();
+                // Handle common create events
+                streamRef.current.on("create", (event) => {
+                    setContractsMap((prevMap) => new Map(prevMap).set(event.contractId, event));
+                });
+                // Handle common archive events
+                streamRef.current.on("archive", (event) => {
+                    setContractsMap((prevMap) => {
+                        const newMap = new Map(prevMap);
+                        newMap.delete(event.contractId);
+                        return newMap;
+                    });
+                });
+                // Setup additional event handlers (e.g., interfaceView for interface streams)
+                if (setupAdditionalEventHandlers) {
+                    setupAdditionalEventHandlers(streamRef.current);
+                }
+                // Common error and state handling
+                streamRef.current.on("error", (err) => {
+                    setError(err.cause);
+                    setConnected(false);
+                });
+                streamRef.current.on("state", (state) => {
+                    setConnected(state === "live");
+                    if (state === "live") {
+                        setLoading(false);
+                    }
+                });
+                streamRef.current.start();
+            }
+            catch (err) {
+                if (!isCleanedUpRef.current) {
+                    const errorMessage = err instanceof Error ? `${err.name}: ${err.message}` : "Failed to setup stream";
+                    setError(errorMessage);
+                    setConnected(false);
+                    setLoading(false);
+                    reconnectTimeoutRef.current = setTimeout(() => {
+                        void setupStream();
+                    }, 5000);
+                }
+            }
+        };
+        void setupStream();
+        return () => {
+            isCleanedUpRef.current = true;
+            if (reconnectTimeoutRef.current) {
+                clearTimeout(reconnectTimeoutRef.current);
+                reconnectTimeoutRef.current = null;
+            }
+            if (streamRef.current) {
+                streamRef.current.close();
+                streamRef.current = null;
+            }
+            setConnected(false);
+        };
+    }, dependencies);
+    // Handle manual reload triggers
+    useEffect(() => {
+        if (reloadTrigger > 0) {
+            reload();
+        }
+    }, [reloadTrigger, reload]);
+    return {
+        contractsMap,
+        loading,
+        connected,
+        error,
+        reload,
+        updateToken,
+    };
+}
+/**
+ * Hook to stream active contracts for a single template with real-time updates
+ * @param template - The template to query
+ * @param options - Query options
+ * @returns Stream query result with contracts, loading state, connection status, and reload function
+ */
+export function useStreamQuery(template, options = {}) {
+    const { ledger } = useDamlLedgerContext();
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    const result = useStreamBase(() => ledger.streamQuery(template, atOffset, false, includeCreatedEventBlob, readAsParties), undefined, // No additional event handlers needed for template streaming
+    [ledger, template.templateId, atOffset, includeCreatedEventBlob, readAsParties]);
+    // Return only the fields expected by StreamQueryResult (without interfacesMap)
+    return {
+        ...result,
+        contractsMap: result.contractsMap,
+    };
+}
+/**
+ * Hook to stream active contracts for a single interface with real-time updates
+ * @param interface_ - The interface to query
+ * @param options - Query options
+ * @returns Stream query result with contracts, loading state, connection status, and reload function
+ */
+export function useStreamQueryInterface(interface_, options = {}) {
+    const { ledger } = useDamlLedgerContext();
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    // Manage interfacesMap state locally since it's interface-specific
+    const [interfacesMap, setInterfacesMap] = useState(() => new Map());
+    const result = useStreamBase(() => ledger.streamQueryInterface(interface_, atOffset, false, includeCreatedEventBlob, readAsParties), (stream) => {
+        // Handle interface view events (create/archive handled by base hook)
+        stream.on("interfaceView", (interfaceEvent) => {
+            setInterfacesMap((prevMap) => new Map(prevMap).set(interfaceEvent.contractId, interfaceEvent));
+        });
+        // Handle archived contracts for interfacesMap (contractsMap handled by base hook)
+        stream.on("archive", (event) => {
+            setInterfacesMap((prevMap) => {
+                const newMap = new Map(prevMap);
+                newMap.delete(event.contractId);
+                return newMap;
+            });
+        });
+    }, [ledger, interface_.templateId, atOffset, includeCreatedEventBlob, readAsParties]);
+    // Override the base hook's reload to also clear interfacesMap
+    const reload = useCallback(async () => {
+        setInterfacesMap(new Map());
+        await result.reload();
+    }, [result.reload]);
+    return {
+        ...result,
+        contractsMap: result.contractsMap,
+        interfacesMap,
+        reload, // Override with our custom reload that also clears interfacesMap
+    };
+}
+/**
+ * Base hook for multi-stream functionality - handles common state management and lifecycle
+ */
+function useMultiStreamBase(createStream, dependencies) {
+    const { reloadTrigger } = useDamlLedgerContext();
+    const [multiStream, setMultiStream] = useState(null);
+    const [loading, setLoading] = useState(true);
+    const [connected, setConnected] = useState(false);
+    const [error, setError] = useState(null);
+    // Use refs to prevent garbage collection
+    const streamRef = useRef(null);
+    const isCleanedUpRef = useRef(false);
+    const reconnectTimeoutRef = useRef(null);
+    const reload = useCallback(async () => {
+        setLoading(true);
+        setError(null);
+        setMultiStream(null);
+    }, []);
+    const updateToken = useCallback((newToken) => {
+        if (streamRef.current) {
+            streamRef.current.updateToken(newToken);
+        }
+    }, []);
+    // Setup real streaming connection
+    useEffect(() => {
+        isCleanedUpRef.current = false;
+        const setupStream = async () => {
+            if (isCleanedUpRef.current)
+                return;
+            try {
+                setLoading(true);
+                setError(null);
+                streamRef.current = await createStream();
+                // Handle connection state
+                streamRef.current.onState((state) => {
+                    setConnected(state === "live");
+                    if (state === "live") {
+                        setLoading(false);
+                    }
+                });
+                // Handle errors
+                streamRef.current.onError((err) => {
+                    setError(err.cause);
+                });
+                setMultiStream(streamRef.current);
+                streamRef.current.start();
+            }
+            catch (err) {
+                const errorMessage = err instanceof Error ? `${err.name}: ${err.message}` : "Failed to setup multi-stream";
+                setError(errorMessage);
+                setConnected(false);
+                setLoading(false);
+                // Retry on setup failure (unless cleaned up)
+                if (!isCleanedUpRef.current) {
+                    reconnectTimeoutRef.current = setTimeout(() => {
+                        void setupStream();
+                    }, 5000);
+                }
+            }
+        };
+        void setupStream();
+        return () => {
+            isCleanedUpRef.current = true;
+            if (reconnectTimeoutRef.current) {
+                clearTimeout(reconnectTimeoutRef.current);
+                reconnectTimeoutRef.current = null;
+            }
+            if (streamRef.current) {
+                streamRef.current.close();
+                streamRef.current = null;
+            }
+            setConnected(false);
+            setMultiStream(null);
+        };
+    }, dependencies);
+    // Handle manual reload triggers
+    useEffect(() => {
+        if (reloadTrigger > 0) {
+            reload();
+        }
+    }, [reloadTrigger, reload]);
+    return {
+        multiStream,
+        loading,
+        connected,
+        error,
+        reload,
+        updateToken,
+    };
+}
+/**
+ * Hook to stream active contracts for multiple templates with real-time updates
+ * @param templateMapping - Mapping of template IDs to their contract and key types
+ * @param options - Query options
+ * @returns Multi-stream query result with stream instance, loading state, connection status, and reload function
+ */
+export function useMultiStreamQuery(templateMapping, options = {}) {
+    const { ledger } = useDamlLedgerContext();
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    const result = useMultiStreamBase(() => ledger.createMultiStream(templateMapping, atOffset, false, // skipAcs
+    includeCreatedEventBlob, readAsParties), [
+        ledger,
+        JSON.stringify(templateMapping),
+        atOffset,
+        includeCreatedEventBlob,
+        JSON.stringify(readAsParties),
+    ]);
+    return {
+        ...result,
+        multiStream: result.multiStream,
+    };
+}
+/**
+ * Hook to stream active contracts for multiple interfaces with real-time updates
+ * @param interfaceMapping - Mapping of interface IDs to their contract types
+ * @param options - Query options
+ * @returns Multi-stream query result with stream instance, loading state, connection status, and reload function
+ */
+export function useMultiStreamInterfaceQuery(interfaceMapping, options = {}) {
+    const { ledger } = useDamlLedgerContext();
+    const { atOffset = "end", includeCreatedEventBlob = false, readAsParties } = options;
+    const result = useMultiStreamBase(() => ledger.createMultiInterfaceStream(interfaceMapping, atOffset, false, // skipAcs
+    includeCreatedEventBlob, readAsParties), [
+        ledger,
+        JSON.stringify(interfaceMapping),
+        atOffset,
+        includeCreatedEventBlob,
+        JSON.stringify(readAsParties),
+    ]);
+    return {
+        ...result,
+        multiStream: result.multiStream,
+    };
+}
+/**
+ * Creates a ledger context object with hooks for accessing ledger functionality
+ * This maintains compatibility with @daml/react patterns while using our new implementation
+ */
+export function createLedgerContext() {
+    return {
+        DamlLedger,
+        useLedger,
+        useUser,
+        useReload,
+        useQuery,
+        useQueryInterface,
+        useStreamQuery,
+        useStreamQueryInterface,
+        useMultiStreamQuery,
+        useMultiStreamInterfaceQuery,
+        useRightsAs,
+    };
+}

package/dist/defaultLedgerContext.d.ts

@@ -0,0 +1,2 @@
+export declare const DamlLedger: import("react").FunctionComponent<import("./context").DamlLedgerProps>, useLedger: typeof import("./context").useLedger, useUser: typeof import("./context").useUser, useReload: typeof import("./context").useReload, useQuery: typeof import("./context").useQuery, useQueryInterface: typeof import("./context").useQueryInterface, useStreamQuery: typeof import("./context").useStreamQuery, useStreamQueryInterface: typeof import("./context").useStreamQueryInterface, useMultiStreamQuery: typeof import("./context").useMultiStreamQuery, useMultiStreamInterfaceQuery: typeof import("./context").useMultiStreamInterfaceQuery, useRightsAs: typeof import("./context").useRightsAs;
+//# sourceMappingURL=defaultLedgerContext.d.ts.map

package/dist/defaultLedgerContext.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaultLedgerContext.d.ts","sourceRoot":"","sources":["../src/defaultLedgerContext.ts"],"names":[],"mappings":"AAOA,eAAO,MACL,UAAU,0EACV,SAAS,wCACT,OAAO,sCACP,SAAS,wCACT,QAAQ,uCACR,iBAAiB,gDACjB,cAAc,6CACd,uBAAuB,sDACvB,mBAAmB,kDACnB,4BAA4B,2DAC5B,WAAW,wCACY,CAAC"}

package/dist/defaultLedgerContext.js

@@ -0,0 +1,7 @@
+/**
+ * Default ledger context - provides the standard hooks implementation
+ * This is the equivalent of @daml/react's default exports
+ */
+import { createLedgerContext } from "./context";
+// Create and export the default context
+export const { DamlLedger, useLedger, useUser, useReload, useQuery, useQueryInterface, useStreamQuery, useStreamQueryInterface, useMultiStreamQuery, useMultiStreamInterfaceQuery, useRightsAs, } = createLedgerContext();

package/dist/index.d.ts

@@ -0,0 +1,12 @@
+/**
+ * @c7-digital/react - React hooks for Daml ledger integration
+ *
+ * A replacement for @daml/react that uses the Canton JSON API v2
+ * with TypeScript support and modern React patterns.
+ */
+export { createLedgerContext } from "./context";
+export type { DamlLedgerProps } from "./context";
+export { DamlLedger, useLedger, useUser, useReload, useQuery, useQueryInterface, useStreamQuery, useStreamQueryInterface, useMultiStreamQuery, useMultiStreamInterfaceQuery, useRightsAs, } from "./defaultLedgerContext";
+export type { DamlLedgerConfig, QueryOptions, QueryResult, InterfaceQueryResult, StreamQueryResult, UserResult, TemplateId, } from "./types";
+export type { Ledger, User, CreateEvent, ArchiveEvent, Event, Interface } from "@c7-digital/ledger/lite";
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AAGH,OAAO,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAC;AAChD,YAAY,EAAE,eAAe,EAAE,MAAM,WAAW,CAAC;AAGjD,OAAO,EACL,UAAU,EACV,SAAS,EACT,OAAO,EACP,SAAS,EACT,QAAQ,EACR,iBAAiB,EACjB,cAAc,EACd,uBAAuB,EACvB,mBAAmB,EACnB,4BAA4B,EAC5B,WAAW,GACZ,MAAM,wBAAwB,CAAC;AAGhC,YAAY,EACV,gBAAgB,EAChB,YAAY,EACZ,WAAW,EACX,oBAAoB,EACpB,iBAAiB,EACjB,UAAU,EACV,UAAU,GACX,MAAM,SAAS,CAAC;AAGjB,YAAY,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,YAAY,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC"}

package/dist/index.js

@@ -0,0 +1,10 @@
+/**
+ * @c7-digital/react - React hooks for Daml ledger integration
+ *
+ * A replacement for @daml/react that uses the Canton JSON API v2
+ * with TypeScript support and modern React patterns.
+ */
+// Core components and context utilities
+export { createLedgerContext } from "./context";
+// Default hooks (the main exports most users will use)
+export { DamlLedger, useLedger, useUser, useReload, useQuery, useQueryInterface, useStreamQuery, useStreamQueryInterface, useMultiStreamQuery, useMultiStreamInterfaceQuery, useRightsAs, } from "./defaultLedgerContext";

package/dist/types.d.ts

@@ -0,0 +1,94 @@
+import { ContractId, Party } from "@daml/types";
+import { type Ledger, type User, type CreateEvent, LedgerOffset, type MultiStream, type TemplateMapping, type InterfaceMapping, type InterfaceMultiStream, CantonError, Interface } from "@c7-digital/ledger/lite";
+export type TemplateId = string & {
+    readonly __templateId: unique symbol;
+};
+export interface DamlLedgerConfig {
+    readonly ledger: Ledger;
+    readonly reloadTrigger: number;
+    readonly triggerReload: () => void;
+}
+export interface QueryOptions {
+    /** The offset to query at, defaults to "end" */
+    readonly atOffset?: LedgerOffset;
+    /** Whether to include the created event blob, defaults to false */
+    readonly includeCreatedEventBlob?: boolean;
+    /** Whether to query as a specific party, defaults to all of the Parties in the token. */
+    readonly readAsParties?: Party[];
+    /** Whether to automatically reload on updates, defaults to false */
+    readonly autoReload?: boolean;
+}
+export interface QueryResult<TContract extends object = object, TKey = any> {
+    /** Array of matching contracts */
+    readonly contracts: readonly CreateEvent<TContract, TKey>[];
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if query failed */
+    readonly error: Error | null;
+    /** Function to manually reload the query */
+    readonly reload: () => void;
+}
+export interface InterfaceQueryResult<TInterface extends object = object> {
+    /** Array of matching interface contracts */
+    readonly interfaces: readonly Interface<TInterface>[];
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if query failed */
+    readonly error: Error | null;
+    /** Function to manually reload the query */
+    readonly reload: () => void;
+}
+export interface StreamQueryResult<TContract extends object = object, TKey = any> {
+    /** Map of matching contracts, with contractId as key */
+    readonly contractsMap: ReadonlyMap<ContractId<TContract>, CreateEvent<TContract, TKey>>;
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if query failed */
+    readonly error: CantonError | string | null;
+    /** Function to manually reload the query */
+    readonly reload: () => void;
+    /** Whether the stream is connected */
+    readonly connected: boolean;
+    /** Function to update the authentication token */
+    readonly updateToken: (newToken: string) => void;
+}
+export interface StreamQueryInterfaceResult<IContract extends object> extends StreamQueryResult<object, unknown> {
+    readonly interfacesMap: ReadonlyMap<ContractId<IContract>, Interface<IContract>>;
+}
+export interface UserResult {
+    /** The user information from the token */
+    readonly user: User | null;
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if user fetch failed */
+    readonly error: Error | null;
+}
+export interface MultiStreamQueryResult<TM extends TemplateMapping> {
+    /** The multi-stream instance for registering template-specific handlers */
+    readonly multiStream: MultiStream<TM> | null;
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if stream setup failed */
+    readonly error: CantonError | string | null;
+    /** Function to manually reload the query */
+    readonly reload: () => void;
+    /** Whether the stream is connected */
+    readonly connected: boolean;
+    /** Function to update the authentication token */
+    readonly updateToken: (newToken: string) => void;
+}
+export interface MultiStreamInterfaceQueryResult<IM extends InterfaceMapping> {
+    /** The multi-stream instance for interface streaming */
+    readonly multiStream: InterfaceMultiStream<IM> | null;
+    /** Loading state */
+    readonly loading: boolean;
+    /** Error if query failed */
+    readonly error: CantonError | string | null;
+    /** Function to manually reload the query */
+    readonly reload: () => void;
+    /** Whether the stream is connected */
+    readonly connected: boolean;
+    /** Function to update the authentication token */
+    readonly updateToken: (newToken: string) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../src/types.ts"],"names":[],"mappings":"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"}

package/dist/types.js

@@ -0,0 +1 @@
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@c7-digital/react",
-  "version": "0.0.4",
+  "version": "0.0.6",
   "description": "React hooks for Daml ledger integration using Canton JSON API v2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -10,7 +10,7 @@
   "scripts": {
     "build": "tsc",
     "dev": "tsc --watch",
-    "clean": "rm -rf dist",
+    "clean": "rm -rf dist tsconfig.tsbuildinfo",
     "prepare": "tsc",
     "prepublishOnly": "pnpm run clean && pnpm run build"
   },
@@ -25,7 +25,7 @@
   "author": "",
   "license": "Apache-2.0",
   "peerDependencies": {
-    "@c7/ledger": "^0.0.4",
+    "@c7-digital/ledger": "^0.0.6",
     "react": "^18.0.0"
   },
   "dependencies": {