chore: refactor replane sdk

Author: tilyupo

packages/admin/src/version.ts

@@ -1,3 +1,3 @@
 // Auto-generated - do not edit manually
-export const VERSION = "0.8.14";
+export const VERSION = "0.8.20";
 export const DEFAULT_AGENT = `replane-js-admin/${VERSION}`;

packages/next/src/index.tsx

@@ -86,29 +86,21 @@ export {
   createReplaneHook,
   createConfigHook,
   clearSuspenseCache,
+  Replane,
+  ReplaneError,
+  ReplaneErrorCode,
 } from "@replanejs/react";
 
 export type {
   ReplaneProviderProps,
   ReplaneProviderWithClientProps,
   ReplaneProviderWithOptionsProps,
+  ReplaneProviderOptions,
   GetReplaneSnapshotOptions,
-} from "@replanejs/react";
-
-export {
-  createReplaneClient,
-  createInMemoryReplaneClient,
-  restoreReplaneClient,
-  ReplaneError,
-  ReplaneErrorCode,
-} from "@replanejs/sdk";
-
-export type {
-  ReplaneClient,
-  ReplaneClientOptions,
   ReplaneSnapshot,
   ReplaneContext,
   ReplaneLogger,
+  ReplaneOptions,
+  ConnectOptions,
   GetConfigOptions,
-  RestoreReplaneClientOptions,
-} from "@replanejs/sdk";
+} from "@replanejs/react";

packages/next/src/root.tsx

@@ -4,8 +4,8 @@
  */
 
 import type { ReactNode } from "react";
-import { getReplaneSnapshot, type ReplaneClientOptions } from "@replanejs/sdk";
-import { ReplaneProvider } from "@replanejs/react";
+import { getReplaneSnapshot } from "@replanejs/sdk";
+import { ReplaneProvider, type ReplaneProviderOptions } from "@replanejs/react";
 import { DEFAULT_AGENT } from "./version";
 
 /**
@@ -16,7 +16,7 @@ export interface ReplaneRootProps<T extends object> {
    * Options for Replane client.
    * Used for both server-side fetching and client-side live updates.
    */
-  options: ReplaneClientOptions<T>;
+  options: ReplaneProviderOptions<T>;
   /**
    * React children to render inside the provider
    */

packages/next/src/version.ts

@@ -1,3 +1,3 @@
 // Auto-generated - do not edit manually
-export const VERSION = "0.8.14";
+export const VERSION = "0.8.20";
 export const DEFAULT_AGENT = `replane-js-next/${VERSION}`;

packages/react/src/hooks.ts

@@ -3,14 +3,14 @@
 import { useCallback, useContext, useEffect, useRef, useSyncExternalStore } from "react";
 import { ReplaneContext } from "./context";
 import type { UntypedReplaneConfig } from "./types";
-import type { ReplaneClient, GetConfigOptions } from "@replanejs/sdk";
+import type { Replane, GetConfigOptions } from "@replanejs/sdk";
 
-export function useReplane<T extends object = UntypedReplaneConfig>(): ReplaneClient<T> {
+export function useReplane<T extends object = UntypedReplaneConfig>(): Replane<T> {
   const context = useContext(ReplaneContext);
   if (!context) {
     throw new Error("useReplane must be used within a ReplaneProvider");
   }
-  return context.client as ReplaneClient<T>;
+  return context.client as Replane<T>;
 }
 
 export function useConfig<T>(name: string, options?: GetConfigOptions<T>): T {
@@ -51,7 +51,7 @@ export function useConfig<T>(name: string, options?: GetConfigOptions<T>): T {
  * ```
  */
 export function createReplaneHook<TConfigs extends object>() {
-  return function useTypedReplane(): ReplaneClient<TConfigs> {
+  return function useTypedReplane(): Replane<TConfigs> {
     return useReplane<TConfigs>();
   };
 }

packages/react/src/index.ts

@@ -7,8 +7,17 @@ export type {
   ReplaneProviderProps,
   ReplaneProviderWithClientProps,
   ReplaneProviderWithOptionsProps,
+  ReplaneProviderOptions,
 } from "./types";
 
-// Re-export snapshot utilities from SDK
-export { getReplaneSnapshot } from "@replanejs/sdk";
-export type { GetReplaneSnapshotOptions } from "@replanejs/sdk";
+// Re-export from SDK
+export { Replane, getReplaneSnapshot, ReplaneError, ReplaneErrorCode } from "@replanejs/sdk";
+export type {
+  ReplaneSnapshot,
+  ReplaneContext,
+  ReplaneLogger,
+  ReplaneOptions,
+  ConnectOptions,
+  GetConfigOptions,
+  GetReplaneSnapshotOptions,
+} from "@replanejs/sdk";

packages/react/src/provider.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { useMemo } from "react";
-import { restoreReplaneClient } from "@replanejs/sdk";
+import { Replane } from "@replanejs/sdk";
 import { ReplaneContext } from "./context";
 import { useReplaneClientInternal, useReplaneClientSuspense } from "./useReplaneClient";
 import { useStateful } from "./hooks";
@@ -27,7 +27,7 @@ function ReplaneProviderWithClient<T extends object>({
 
 /**
  * Internal provider component for restoring client from snapshot.
- * Uses restoreReplaneClient which is synchronous.
+ * Creates a Replane client synchronously and connects in background.
  */
 function ReplaneProviderWithSnapshot<T extends object>({
   options,
@@ -37,22 +37,27 @@ function ReplaneProviderWithSnapshot<T extends object>({
   snapshot: NonNullable<ReplaneProviderWithOptionsProps<T>["snapshot"]>;
 }) {
   const client = useStateful(
-    () =>
-      restoreReplaneClient<T>({
+    () => {
+      const replane = new Replane<T>({
         snapshot,
-        connection: {
-          baseUrl: options.baseUrl,
-          sdkKey: options.sdkKey,
-          fetchFn: options.fetchFn,
-          requestTimeoutMs: options.requestTimeoutMs,
-          retryDelayMs: options.retryDelayMs,
-          inactivityTimeoutMs: options.inactivityTimeoutMs,
-          logger: options.logger,
-          agent: options.agent ?? DEFAULT_AGENT,
-        },
+        logger: options.logger,
         context: options.context,
-      }),
-    (c) => c.close(),
+        defaults: options.defaults,
+      });
+      // Start connection in background (don't await)
+      replane.connect({
+        baseUrl: options.baseUrl,
+        sdkKey: options.sdkKey,
+        fetchFn: options.fetchFn,
+        requestTimeoutMs: options.requestTimeoutMs,
+        retryDelayMs: options.retryDelayMs,
+        inactivityTimeoutMs: options.inactivityTimeoutMs,
+        connectTimeoutMs: options.connectTimeoutMs,
+        agent: options.agent ?? DEFAULT_AGENT,
+      });
+      return replane;
+    },
+    (c) => c.disconnect(),
     [snapshot, options]
   );
   const value = useMemo<ReplaneContextValue<T>>(() => ({ client }), [client]);
@@ -96,13 +101,14 @@ function ReplaneProviderWithSuspense<T extends object>({
 }
 
 /**
- * Provider component that makes a ReplaneClient available to the component tree.
+ * Provider component that makes a Replane client available to the component tree.
  *
- * Can be used in three ways:
+ * Can be used in several ways:
  *
  * 1. With a pre-created client:
  * ```tsx
- * const client = await createReplaneClient({ ... });
+ * const client = new Replane({ defaults: { ... } });
+ * await client.connect({ baseUrl: '...', sdkKey: '...' });
  * <ReplaneProvider client={client}>
  *   <App />
  * </ReplaneProvider>

packages/react/src/types.ts

@@ -1,31 +1,90 @@
 import type {
-  ReplaneClient,
-  ReplaneClientOptions,
+  Replane,
   ReplaneSnapshot,
+  ReplaneContext,
+  ReplaneLogger,
 } from "@replanejs/sdk";
 import type { ReactNode } from "react";
 
 export type UntypedReplaneConfig = Record<string, unknown>;
 
 export interface ReplaneContextValue<T extends object = UntypedReplaneConfig> {
-  client: ReplaneClient<T>;
+  client: Replane<T>;
+}
+
+/**
+ * Combined options for ReplaneProvider.
+ * Includes both constructor options (context, logger, defaults) and connection options.
+ */
+export interface ReplaneProviderOptions<T extends object = UntypedReplaneConfig> {
+  /**
+   * Base URL of the Replane instance (no trailing slash).
+   * @example "https://app.replane.dev"
+   */
+  baseUrl: string;
+  /**
+   * Project SDK key for authorization.
+   * @example "rp_XXXXXXXXX"
+   */
+  sdkKey: string;
+  /**
+   * Default context for all config evaluations.
+   * Can be overridden per-request in `client.get()`.
+   */
+  context?: ReplaneContext;
+  /**
+   * Optional logger (defaults to console).
+   */
+  logger?: ReplaneLogger;
+  /**
+   * Default values to use before connection is established.
+   */
+  defaults?: { [K in keyof T]?: T[K] };
+  /**
+   * Optional timeout in ms for the initial connection.
+   * @default 5000
+   */
+  connectTimeoutMs?: number;
+  /**
+   * Delay between retries in ms.
+   * @default 200
+   */
+  retryDelayMs?: number;
+  /**
+   * Optional timeout in ms for individual requests.
+   * @default 2000
+   */
+  requestTimeoutMs?: number;
+  /**
+   * Timeout in ms for SSE connection inactivity.
+   * @default 30000
+   */
+  inactivityTimeoutMs?: number;
+  /**
+   * Custom fetch implementation (useful for tests / polyfills).
+   */
+  fetchFn?: typeof fetch;
+  /**
+   * Agent identifier sent in User-Agent header.
+   */
+  agent?: string;
 }
 
 /**
  * Props for ReplaneProvider when using a pre-created client.
  */
 export interface ReplaneProviderWithClientProps<T extends object = UntypedReplaneConfig> {
-  /** Pre-created ReplaneClient instance */
-  client: ReplaneClient<T>;
+  /** Pre-created Replane client instance */
+  client: Replane<T>;
   children: ReactNode;
 }
 
 /**
  * Props for ReplaneProvider when letting it manage the client internally.
  */
 export interface ReplaneProviderWithOptionsProps<T extends object = UntypedReplaneConfig> {
-  /** Options to create or restore the ReplaneClient */
-  options: ReplaneClientOptions<T>;
+  /** Options to create or restore the Replane client */
+  options: ReplaneProviderOptions<T>;
   children: ReactNode;
   /**
    * Optional snapshot from server-side rendering.