pptx-react-viewer 1.0.0

package/dist/viewer/index.d.ts

@@ -0,0 +1,267 @@
+import { C as CollaborationConfig, d as ConnectionStatus, U as UserPresence, e as CollaborationContextValue } from '../PowerPointViewer-K2URyPlJ.js';
+export { A as AccessibilityIssue, f as AnimationPresetOption, h as CanvasSize, i as ConnectorArrowOption, j as ConnectorGeometryOption, k as ConnectorGeometryType, l as ConnectorPathGeometry, D as DragState, m as DrawingTool, E as EditorHistorySnapshot, n as ElementBounds, o as ElementClipboardPayload, p as ElementContextMenuAction, q as ElementContextMenuState, F as FileViewerHandle, M as MarqueeSelectionState, r as ParsedTableCell, s as ParsedTableData, P as PowerPointViewer, b as PowerPointViewerHandle, c as PowerPointViewerProps, t as PresentationAnimationRuntime, R as ResizeHandle, u as ResizeState, S as ShapeAdjustmentDragState, v as ShapeAdjustmentHandleDescriptor, w as ShapePreset, x as ShapeQuickStyle, y as ShortcutReferenceItem, z as SlideAlignment, B as SlideSectionGroup, G as SlideTransitionOption, H as StrokeDashOption, I as SupportedShapeType, T as TableCellEditorState, J as ToolbarSection, K as ViewerMode, g as getAnimationInitialStyle } from '../PowerPointViewer-K2URyPlJ.js';
+import { PptxThemePreset, PptxThemeColorScheme, PptxThemeFontScheme, PptxHandler, PptxData } from 'pptx-viewer-core';
+import React__default, { RefObject } from 'react';
+
+/** Returns true if the current page was opened as an audience tab. */
+declare function isAudienceTab(): boolean;
+
+/**
+ * Load PPTX content bytes stored by the presenter tab.
+ * Returns `null` if nothing is stored.
+ */
+declare function loadAudienceContent(): Promise<Uint8Array | null>;
+/**
+ * Remove stored audience content (cleanup).
+ */
+declare function clearAudienceContent(): Promise<void>;
+
+interface UseThemeSwitchingInput {
+    /** Ref to the PptxHandler instance. */
+    handlerRef: RefObject<PptxHandler | null>;
+    /** Current parsed presentation data (null when nothing is loaded). */
+    data: PptxData | null;
+    /** Callback to update the presentation data after theme switch. */
+    onDataChange: (newData: PptxData) => void;
+    /** Optional callback fired when theme switch completes successfully. */
+    onThemeChanged?: (preset: PptxThemePreset) => void;
+}
+interface ThemeSwitchingResult {
+    /** All available built-in theme presets. */
+    presets: readonly PptxThemePreset[];
+    /**
+     * Apply a theme preset to the current presentation.
+     * Updates both the in-memory ZIP and all resolved element colours.
+     */
+    switchToPreset: (preset: PptxThemePreset) => Promise<void>;
+    /**
+     * Apply a custom colour scheme (and optional font scheme) to the
+     * current presentation.
+     */
+    switchToCustom: (colorScheme: PptxThemeColorScheme, fontScheme?: PptxThemeFontScheme, themeName?: string) => Promise<void>;
+    /**
+     * Get the preset matching the current presentation theme (if any).
+     * Returns undefined if the current theme does not match a built-in preset.
+     */
+    currentPreset: PptxThemePreset | undefined;
+}
+/**
+ * React hook providing theme switching capabilities for the PowerPoint viewer.
+ *
+ * @example
+ * ```tsx
+ * const { presets, switchToPreset, currentPreset } = useThemeSwitching({
+ *   handlerRef,
+ *   data,
+ *   onDataChange: setData,
+ * });
+ *
+ * return (
+ *   <div>
+ *     {presets.map(preset => (
+ *       <button
+ *         key={preset.id}
+ *         onClick={() => switchToPreset(preset)}
+ *         aria-pressed={preset.id === currentPreset?.id}
+ *       >
+ *         {preset.name}
+ *       </button>
+ *     ))}
+ *   </div>
+ * );
+ * ```
+ */
+declare function useThemeSwitching(input: UseThemeSwitchingInput): ThemeSwitchingResult;
+
+interface YDoc {
+    destroy: () => void;
+    getMap: (name: string) => any;
+    getArray: (name: string) => any;
+}
+interface Awareness$1 {
+    setLocalStateField: (field: string, value: any) => void;
+    getLocalState: () => any;
+    getStates: () => Map<number, any>;
+    on: (event: string, cb: (...args: any[]) => void) => void;
+    off: (event: string, cb: (...args: any[]) => void) => void;
+    clientID: number;
+}
+interface UseYjsProviderInput {
+    config: CollaborationConfig;
+}
+interface UseYjsProviderResult {
+    /** Current WebSocket connection status. */
+    status: ConnectionStatus;
+    /** The Yjs awareness instance (null until connected). */
+    awareness: Awareness$1 | null;
+    /** The Yjs document (null until initialised). */
+    doc: YDoc | null;
+    /** Local awareness client ID. */
+    clientId: number | null;
+}
+/**
+ * Lazily loads `yjs` and `y-websocket`, creates a Y.Doc and
+ * WebSocketProvider, and tracks the connection lifecycle.
+ *
+ * The Yjs packages are dynamically imported so they are fully
+ * tree-shaken when collaboration is not enabled.
+ */
+declare function useYjsProvider({ config }: UseYjsProviderInput): UseYjsProviderResult;
+
+interface Awareness {
+    setLocalStateField: (field: string, value: any) => void;
+    getLocalState: () => any;
+    getStates: () => Map<number, any>;
+    on: (event: string, cb: (...args: any[]) => void) => void;
+    off: (event: string, cb: (...args: any[]) => void) => void;
+    clientID: number;
+}
+interface UsePresenceTrackingInput {
+    awareness: Awareness | null;
+    localClientId: number | null;
+    userName: string;
+    userColor: string;
+    userAvatar?: string;
+    canvasWidth: number;
+    canvasHeight: number;
+}
+interface UsePresenceTrackingResult {
+    /** Presence data for all remote users (excludes local). */
+    remoteUsers: UserPresence[];
+    /** Broadcast a partial presence update for the local user. */
+    broadcastPresence: (update: Partial<Omit<UserPresence, 'clientId'>>) => void;
+}
+declare function usePresenceTracking({ awareness, localClientId, userName, userColor, userAvatar, canvasWidth, canvasHeight, }: UsePresenceTrackingInput): UsePresenceTrackingResult;
+
+/**
+ * useCollaborativeState — Composes the Yjs provider and presence tracking
+ * into a single hook for the collaboration system.
+ *
+ * This is the primary hook consumed by the `CollaborationProvider` context.
+ * It orchestrates:
+ * - Yjs WebSocket connection lifecycle
+ * - Presence tracking (broadcast + receive)
+ * - Connection status
+ *
+ * @module collaboration/useCollaborativeState
+ */
+
+interface UseCollaborativeStateInput {
+    config: CollaborationConfig;
+    canvasWidth: number;
+    canvasHeight: number;
+}
+declare function useCollaborativeState({ config, canvasWidth, canvasHeight, }: UseCollaborativeStateInput): CollaborationContextValue;
+
+interface UseCollaborativeHistoryInput {
+    /** The local user's client ID (from Yjs awareness). */
+    localClientId: number | null;
+    /** Standard history undo function. */
+    handleUndo: () => void;
+    /** Standard history redo function. */
+    handleRedo: () => void;
+    /** Whether undo is available. */
+    canUndo: boolean;
+    /** Whether redo is available. */
+    canRedo: boolean;
+}
+interface UseCollaborativeHistoryResult {
+    /** Undo the last local change. */
+    handleUndo: () => void;
+    /** Redo the last undone local change. */
+    handleRedo: () => void;
+    /** Whether undo is available. */
+    canUndo: boolean;
+    /** Whether redo is available. */
+    canRedo: boolean;
+}
+declare function useCollaborativeHistory({ localClientId: _localClientId, handleUndo, handleRedo, canUndo, canRedo, }: UseCollaborativeHistoryInput): UseCollaborativeHistoryResult;
+
+/**
+ * CollaborationProvider — React context provider for real-time collaboration.
+ *
+ * Wraps the viewer content and exposes collaboration state (connection status,
+ * remote user presence, broadcast function) to all child components via
+ * `useCollaboration()`.
+ *
+ * This component is only rendered when `collaboration` config is provided to
+ * `PowerPointViewer`, ensuring zero bundle/runtime cost when unused.
+ *
+ * @module collaboration/CollaborationProvider
+ */
+
+interface CollaborationProviderProps {
+    config: CollaborationConfig;
+    canvasWidth: number;
+    canvasHeight: number;
+    children: React__default.ReactNode;
+}
+declare function CollaborationProvider({ config, canvasWidth, canvasHeight, children, }: CollaborationProviderProps): React__default.ReactElement;
+
+/**
+ * RemoteUserCursors — Renders other users' cursors as an SVG overlay
+ * on the slide canvas.
+ *
+ * Each remote user's cursor is drawn as a coloured pointer arrow with
+ * their username label. Only cursors on the same slide as the local
+ * user are displayed.
+ *
+ * @module collaboration/RemoteUserCursors
+ */
+
+interface RemoteUserCursorsProps {
+    /** Presence data for remote users. */
+    remoteUsers: UserPresence[];
+    /** The slide index the local user is currently viewing. */
+    activeSlideIndex: number;
+    /** Canvas width in CSS px (for SVG viewBox). */
+    canvasWidth: number;
+    /** Canvas height in CSS px (for SVG viewBox). */
+    canvasHeight: number;
+}
+declare function RemoteUserCursors({ remoteUsers, activeSlideIndex, canvasWidth, canvasHeight, }: RemoteUserCursorsProps): React__default.ReactElement | null;
+
+/**
+ * UserAvatarBar — Displays connected collaborators as a row of avatar circles
+ * in the toolbar area.
+ *
+ * Shows up to 5 avatar circles with a "+N" overflow indicator.
+ * Each circle shows the user's avatar image (if available) or their initials.
+ *
+ * @module collaboration/UserAvatarBar
+ */
+
+interface UserAvatarBarProps {
+    /** Remote user presence data. */
+    remoteUsers: UserPresence[];
+    /** Local user display name. */
+    localUserName: string;
+    /** Local user's colour. */
+    localUserColor: string;
+    /** Local user's avatar URL. */
+    localUserAvatar?: string;
+    /** Connection status. */
+    status: ConnectionStatus;
+    /** Maximum visible avatars before showing overflow (default: 5). */
+    maxVisible?: number;
+}
+declare function UserAvatarBar({ remoteUsers, localUserName, localUserColor, localUserAvatar, status, maxVisible, }: UserAvatarBarProps): React__default.ReactElement | null;
+
+/**
+ * CollaborationStatusIndicator — A small status pill that shows the
+ * WebSocket connection state and connected user count.
+ *
+ * Designed to sit in the status bar area at the bottom of the viewer.
+ *
+ * @module collaboration/CollaborationStatusIndicator
+ */
+
+interface CollaborationStatusIndicatorProps {
+    /** Current WebSocket connection status. */
+    status: ConnectionStatus;
+    /** Number of connected users (including local). */
+    connectedCount: number;
+}
+declare function CollaborationStatusIndicator({ status, connectedCount, }: CollaborationStatusIndicatorProps): React__default.ReactElement;
+
+export { CollaborationConfig, CollaborationContextValue, CollaborationProvider, CollaborationStatusIndicator, type CollaborationStatusIndicatorProps, ConnectionStatus, RemoteUserCursors, type RemoteUserCursorsProps, type ThemeSwitchingResult, type UseCollaborativeHistoryResult, type UseCollaborativeStateInput, type UsePresenceTrackingResult, type UseThemeSwitchingInput, UserAvatarBar, type UserAvatarBarProps, UserPresence, clearAudienceContent, isAudienceTab, loadAudienceContent, useCollaborativeHistory, useCollaborativeState, usePresenceTracking, useThemeSwitching, useYjsProvider };