viewdoc 0.1.1 → 0.2.0

package/dist/index.d.ts

@@ -1,5 +1,7 @@
 import * as react from 'react';
 import { ReactNode, CSSProperties } from 'react';
+import { V as ViewerTheme, P as Position } from './useDraggable-QvFR-4DD.js';
+export { D as DraggableControls, U as UseDraggableOptions, u as useDraggable } from './useDraggable-QvFR-4DD.js';
 
 type DocViewerFileType = 'image' | 'pdf' | 'docx' | 'xlsx';
 /**
@@ -10,38 +12,6 @@ declare function getUrlExtension(uri: string): string | null;
 /** Maps a URL (or explicit extension/mime hint) to the viewer type DocViewer should render. */
 declare function detectFileType(uri: string, hint?: string): DocViewerFileType | null;
 
-interface ViewerTheme {
-    /** Background color of the viewer canvas area. */
-    background?: string;
-    /** Background color of the toolbar strip. */
-    toolbarBackground?: string;
-    /** Border color under the toolbar. */
-    toolbarBorderColor?: string;
-    /** Hover background for toolbar buttons. */
-    toolbarButtonHoverBackground?: string;
-    /** Text/icon color used across the toolbar. */
-    textColor?: string;
-    /** Corner radius of the outer viewer container. */
-    borderRadius?: string;
-    /** Corner radius of individual toolbar buttons. */
-    toolbarButtonRadius?: string;
-}
-
-interface Position {
-    x: number;
-    y: number;
-}
-interface UseDraggableOptions {
-    defaultPosition?: Position;
-    /** Allow dragging via the returned handle props. Default: true. */
-    draggable?: boolean;
-}
-interface DraggableControls {
-    position: Position;
-    onDragHandlePointerDown: (e: React.PointerEvent) => void;
-}
-declare function useDraggable(options?: UseDraggableOptions): DraggableControls;
-
 interface DocViewerProps {
     /** URL of the file to display. */
     uri: string;
@@ -55,6 +25,11 @@ interface DocViewerProps {
     type?: DocViewerFileType | string;
     /** Rendered when the file type can't be detected and no `type` override was given. */
     fallback?: ReactNode;
+    /**
+     * Rendered while the PDF/DOCX/XLSX viewer's code is being downloaded (those are lazy-loaded so
+     * that using DocViewer for images alone doesn't pull in pdfjs-dist/mammoth/xlsx). Default: null.
+     */
+    loadingFallback?: ReactNode;
     className?: string;
     style?: CSSProperties;
     /** Width of the viewer. Accepts any CSS size (e.g. 1200, '1200px', '100%'). Default: 1200. */
@@ -77,7 +52,7 @@ interface DocViewerProps {
     /** Initial position when floating. Default: centered in the viewport. */
     defaultPosition?: Position;
 }
-declare function DocViewer({ uri, fileName, type, fallback, ...rest }: DocViewerProps): react.JSX.Element;
+declare function DocViewer({ uri, fileName, type, fallback, loadingFallback, ...rest }: DocViewerProps): react.JSX.Element;
 
 interface ImageViewerProps {
     /** URL or data URI of the image to display. */
@@ -119,122 +94,6 @@ interface ImageViewerProps {
 }
 declare function ImageViewer({ uri, fileName, className, style, width, height, minScale, maxScale, zoomStep, enableZoomControls, enableWheelZoom, enablePan, enableFullscreen, enableDownload, onDownload, theme, floating, windowDraggable, defaultPosition, }: ImageViewerProps): react.JSX.Element;
 
-interface PdfViewerProps {
-    /** URL or data URI of the PDF to display. */
-    uri: string;
-    /** Used as the suggested filename on download. */
-    fileName?: string;
-    className?: string;
-    style?: CSSProperties;
-    /** Width of the viewer. Accepts any CSS size (e.g. 1200, '1200px', '100%'). Default: 1200. */
-    width?: number | string;
-    /** Height of the viewer. Accepts any CSS size (e.g. 700, '700px', '100vh'). Default: 700. */
-    height?: number | string;
-    /** Minimum zoom scale. Default: 0.25 */
-    minScale?: number;
-    /** Maximum zoom scale. Default: 5 */
-    maxScale?: number;
-    /** Zoom increment per step (buttons / Ctrl+scroll). Default: 0.25 */
-    zoomStep?: number;
-    /** Canvas render resolution multiplier (crispness at high zoom). Default: 1.5 */
-    renderScale?: number;
-    /** Show zoom in/out and reset-to-100% controls. Default: true. */
-    enableZoomControls?: boolean;
-    /** Allow Ctrl/Cmd + scroll wheel to zoom. Default: true. */
-    enableWheelZoom?: boolean;
-    /** Show the fullscreen toggle button. Default: true. */
-    enableFullscreen?: boolean;
-    /** Show the download button. Default: true. */
-    enableDownload?: boolean;
-    /** Called when the download button is clicked. If omitted, downloads `uri` directly. */
-    onDownload?: () => void;
-    /** Colors/radii to override the default look (toolbar background, text color, etc). */
-    theme?: ViewerTheme;
-    /** Render as a floating window (position: fixed) that can be dragged, instead of filling the parent. Default: true. */
-    floating?: boolean;
-    /** When floating, allow dragging the window by its toolbar. Default: true. */
-    windowDraggable?: boolean;
-    /** Initial position when floating. Default: centered in the viewport. */
-    defaultPosition?: Position;
-}
-declare function PdfViewer({ uri, fileName, className, style, width, height, minScale, maxScale, zoomStep, renderScale, enableZoomControls, enableWheelZoom, enableFullscreen, enableDownload, onDownload, theme, floating, windowDraggable, defaultPosition, }: PdfViewerProps): react.JSX.Element;
-
-interface DocxViewerProps {
-    /** URL of the .docx file to display. */
-    uri: string;
-    /** Used as the suggested filename on download. */
-    fileName?: string;
-    className?: string;
-    style?: CSSProperties;
-    /** Width of the viewer. Accepts any CSS size (e.g. 1200, '1200px', '100%'). Default: 1200. */
-    width?: number | string;
-    /** Height of the viewer. Accepts any CSS size (e.g. 700, '700px', '100vh'). Default: 700. */
-    height?: number | string;
-    /** Minimum zoom scale. Default: 0.5 */
-    minScale?: number;
-    /** Maximum zoom scale. Default: 3 */
-    maxScale?: number;
-    /** Zoom increment per step (buttons / Ctrl+scroll). Default: 0.25 */
-    zoomStep?: number;
-    /** Show zoom in/out and reset-to-100% controls. Default: true. */
-    enableZoomControls?: boolean;
-    /** Allow Ctrl/Cmd + scroll wheel to zoom. Default: true. */
-    enableWheelZoom?: boolean;
-    /** Show the fullscreen toggle button. Default: true. */
-    enableFullscreen?: boolean;
-    /** Show the download button. Default: true. */
-    enableDownload?: boolean;
-    /** Called when the download button is clicked. If omitted, downloads `uri` directly. */
-    onDownload?: () => void;
-    /** Colors/radii to override the default look (toolbar background, text color, etc). */
-    theme?: ViewerTheme;
-    /** Render as a floating window (position: fixed) that can be dragged, instead of filling the parent. Default: true. */
-    floating?: boolean;
-    /** When floating, allow dragging the window by its toolbar. Default: true. */
-    windowDraggable?: boolean;
-    /** Initial position when floating. Default: centered in the viewport. */
-    defaultPosition?: Position;
-}
-declare function DocxViewer({ uri, fileName, className, style, width, height, minScale, maxScale, zoomStep, enableZoomControls, enableWheelZoom, enableFullscreen, enableDownload, onDownload, theme, floating, windowDraggable, defaultPosition, }: DocxViewerProps): react.JSX.Element;
-
-interface XlsxViewerProps {
-    /** URL of the .xlsx/.xls (legacy binary supported)/.csv file to display. */
-    uri: string;
-    /** Used as the suggested filename on download. */
-    fileName?: string;
-    className?: string;
-    style?: CSSProperties;
-    /** Width of the viewer. Accepts any CSS size (e.g. 1200, '1200px', '100%'). Default: 1200. */
-    width?: number | string;
-    /** Height of the viewer. Accepts any CSS size (e.g. 700, '700px', '100vh'). Default: 700. */
-    height?: number | string;
-    /** Minimum zoom scale. Default: 0.5 */
-    minScale?: number;
-    /** Maximum zoom scale. Default: 3 */
-    maxScale?: number;
-    /** Zoom increment per step (buttons / Ctrl+scroll). Default: 0.25 */
-    zoomStep?: number;
-    /** Show zoom in/out and reset-to-100% controls. Default: true. */
-    enableZoomControls?: boolean;
-    /** Allow Ctrl/Cmd + scroll wheel to zoom. Default: true. */
-    enableWheelZoom?: boolean;
-    /** Show the fullscreen toggle button. Default: true. */
-    enableFullscreen?: boolean;
-    /** Show the download button. Default: true. */
-    enableDownload?: boolean;
-    /** Called when the download button is clicked. If omitted, downloads `uri` directly. */
-    onDownload?: () => void;
-    /** Colors/radii to override the default look (toolbar background, text color, etc). */
-    theme?: ViewerTheme;
-    /** Render as a floating window (position: fixed) that can be dragged, instead of filling the parent. Default: true. */
-    floating?: boolean;
-    /** When floating, allow dragging the window by its toolbar. Default: true. */
-    windowDraggable?: boolean;
-    /** Initial position when floating. Default: centered in the viewport. */
-    defaultPosition?: Position;
-}
-declare function XlsxViewer({ uri, fileName, className, style, width, height, minScale, maxScale, zoomStep, enableZoomControls, enableWheelZoom, enableFullscreen, enableDownload, onDownload, theme, floating, windowDraggable, defaultPosition, }: XlsxViewerProps): react.JSX.Element;
-
 interface ZoomPanState {
     scale: number;
     translateX: number;
@@ -313,4 +172,4 @@ interface ToolbarProps {
 }
 declare function Toolbar({ scale, onZoomIn, onZoomOut, onReset, onFullscreen, onDownload, isFullscreen, showZoomControls, dragHandle, onDragHandlePointerDown, extra, }: ToolbarProps): react.JSX.Element;
 
-export { DocViewer, type DocViewerFileType, type DocViewerProps, DocxViewer, type DocxViewerProps, type DraggableControls, ImageViewer, type ImageViewerProps, PdfViewer, type PdfViewerProps, type Position, Toolbar, type UseDraggableOptions, ViewerShell, type ViewerTheme, XlsxViewer, type XlsxViewerProps, type ZoomPanControls, type ZoomPanOptions, type ZoomPanState, detectFileType, getUrlExtension, useDraggable, useZoomPan };
+export { DocViewer, type DocViewerFileType, type DocViewerProps, ImageViewer, type ImageViewerProps, Position, Toolbar, ViewerShell, ViewerTheme, type ZoomPanControls, type ZoomPanOptions, type ZoomPanState, detectFileType, getUrlExtension, useZoomPan };