@yorkie-js/react 0.6.35 → 0.6.37

package/dist/yorkie-js-react.d.ts

@@ -1,14 +1,46 @@
 import { ClientOptions } from '@yorkie-js/sdk';
 import { default as default_2 } from 'react';
-import { DocPresence } from '@yorkie-js/sdk';
 import { Document as Document_2 } from '@yorkie-js/sdk';
 import { Indexable } from '@yorkie-js/sdk';
 import { JSONArray } from '@yorkie-js/sdk';
 import { JSONObject } from '@yorkie-js/sdk';
 import { JSX } from 'react/jsx-dev-runtime';
+import { Presence } from '@yorkie-js/sdk';
 import { PropsWithChildren } from 'react';
 import { StreamConnectionStatus } from '@yorkie-js/sdk';
 
+/**
+ * `ChannelProvider` is a component that provides Channel context to its children.
+ * It must be used within a YorkieProvider to access the client.
+ *
+ * @example
+ * ```tsx
+ * <YorkieProvider apiKey="..." rpcAddr="...">
+ *   <ChannelProvider channelKey="room-123" isRealtime={true}>
+ *     <ChatRoom />
+ *   </ChannelProvider>
+ * </YorkieProvider>
+ * ```
+ */
+export declare const ChannelProvider: React.FC<ChannelProviderProps>;
+
+/**
+ * `ChannelProviderProps` represents the props for ChannelProvider.
+ */
+declare type ChannelProviderProps = PropsWithChildren<{
+    /**
+     * `channelKey` is the key for the channel.
+     */
+    channelKey: string;
+    /**
+     * `isRealtime` determines the synchronization mode.
+     * - true: Realtime mode (automatic updates via watch stream)
+     * - false: Manual mode (requires manual sync)
+     * @default true
+     */
+    isRealtime?: boolean;
+}>;
+
 /**
  * `createDocumentSelector` is a factory function that provides a selector-based `useDocument` hook.
  * By currying this function, type T can be inferred from the selector function.
@@ -25,7 +57,7 @@ declare type DocumentContextType<R, P extends Indexable = Indexable> = {
         presence: P;
     }>;
     connection: StreamConnectionStatus;
-    update: (callback: (root: R, presence: DocPresence<P>) => void) => void;
+    update: (callback: (root: R, presence: Presence<P>) => void) => void;
     loading: boolean;
     error: Error | undefined;
 };
@@ -51,6 +83,30 @@ export { JSONObject }
  */
 export declare function shallowEqual<T>(valueA: T, valueB: T): boolean;
 
+/**
+ * `useChannel` is a custom hook that returns the channel state.
+ * It must be used within a ChannelProvider.
+ *
+ * @returns An object containing count, loading, and error state
+ *
+ * @example
+ * ```tsx
+ * function ChatRoom() {
+ *   const { count, loading, error } = useChannel();
+ *
+ *   if (loading) return <div>Loading...</div>;
+ *   if (error) return <div>Error: {error.message}</div>;
+ *
+ *   return <div>{count} users online</div>;
+ * }
+ * ```
+ */
+export declare const useChannel: () => {
+    count: number;
+    loading: boolean;
+    error: Error | undefined;
+};
+
 /**
  * `useConnection` is a custom hook that returns the connection status of the document.
  */
@@ -63,6 +119,23 @@ export declare const useConnection: () => StreamConnectionStatus;
  */
 export declare function useDocument<R, P extends Indexable = Indexable>(): DocumentContextType<R, P>;
 
+/**
+ * `usePresenceCount` is a custom hook that returns only the count value.
+ * It must be used within a PresenceProvider.
+ * This is a convenience hook for when you only need the count.
+ *
+ * @returns The current online user count
+ *
+ * @example
+ * ```tsx
+ * function UserCounter() {
+ *   const count = usePresenceCount();
+ *   return <span>{count} users online</span>;
+ * }
+ * ```
+ */
+export declare const usePresenceCount: () => number;
+
 /**
  * `usePresences` is a custom hook that returns the presences of the document.
  */
@@ -93,7 +166,7 @@ export declare function useYorkieDoc<R, P extends Indexable = Indexable>(apiKey:
         presence: P;
     }>;
     connection: StreamConnectionStatus;
-    update: (callback: (root: R, presence: DocPresence<P>) => void) => void;
+    update: (callback: (root: R, presence: Presence<P>) => void) => void;
     loading: boolean;
     error: Error | undefined;
 };