@iamjariwala/react-doc-viewer 1.0.0 → 1.1.0

package/README.md

@@ -23,7 +23,7 @@ Most React document viewers only handle PDFs or require expensive commercial lic
 | Feature | @iamjariwala/react-doc-viewer | react-pdf | @cyntler/react-doc-viewer | react-file-viewer |
 | ------- | :--: | :--: | :--: | :--: |
 | PDF rendering | Yes | Yes | Yes | Yes |
-| Office docs (Word, Excel, PPT) | Yes | -- | Yes | Partial |
+| Office docs (Word, Excel, PPT) | Download card | -- | Yes | Partial |
 | Images (PNG, JPG, GIF, WebP, TIFF, BMP) | Yes | -- | Yes | Partial |
 | Video (MP4) | Yes | -- | Yes | Yes |
 | CSV / TXT / HTML | Yes | -- | Yes | Partial |
@@ -35,7 +35,7 @@ Most React document viewers only handle PDFs or require expensive commercial lic
 | Custom renderers | Yes | -- | Yes | -- |
 | Theming | Yes | -- | Yes | -- |
 | TypeScript | Yes | Yes | Yes | -- |
-| Actively maintained (2024+) | Yes | Yes | -- | -- |
+| Actively maintained (2025+) | Yes | Yes | -- | -- |
 | License | Apache-2.0 | MIT | MIT | MIT |
 
 ---
@@ -50,12 +50,13 @@ Most React document viewers only handle PDFs or require expensive commercial lic
 
 ---
 
-### What's New in v0.2.0
+### What's New in v1.1.0
 
-- **Drag & Drop** -- Drop files directly onto the viewer to add or replace documents
-- **Thumbnail Sidebar** -- Visual page navigation with auto-scroll for PDFs
-- **Annotations** -- Highlight text, freehand draw, and add comments with export support
-- **Page Jump** -- Navigate to any page programmatically via ref or prop
+- **Security: HTML XSS fix** -- HTML renderer now sanitizes content with DOMPurify before rendering
+- **Security: MS Office docs** -- Removed external iframe dependency; Office files now render as download cards with file info
+- **Removed styled-components** -- All styling migrated to plain CSS with CSS custom properties, reducing bundle size
+- **Smaller bundle** -- Removed `styled-components`, `core-js`, and `ajv` dependencies (~300-400KB savings)
+- **CSS custom properties** -- Theming now uses `--rdv-*` CSS variables for full customizability
 
 ## Table of Contents
 
@@ -114,16 +115,16 @@ Most React document viewers only handle PDFs or require expensive commercial lic
 | txt | `text/plain` | |
 | htm / html | `text/htm`, `text/html` | |
 | mp4 | `video/mp4` | |
-| doc | `application/msword` | Public URLs only |
-| docx | `application/vnd.openxmlformats-officedocument.wordprocessingml.document` | Public URLs only |
-| xls | `application/vnd.ms-excel` | Public URLs only |
-| xlsx | `application/vnd.openxmlformats-officedocument.spreadsheetml.sheet` | Public URLs only |
-| ppt | `application/vnd.ms-powerpoint` | Public URLs only |
-| pptx | `application/vnd.openxmlformats-officedocument.presentationml.presentation` | Public URLs only |
+| doc | `application/msword` | Download card |
+| docx | `application/vnd.openxmlformats-officedocument.wordprocessingml.document` | Download card |
+| xls | `application/vnd.ms-excel` | Download card |
+| xlsx | `application/vnd.openxmlformats-officedocument.spreadsheetml.sheet` | Download card |
+| ppt | `application/vnd.ms-powerpoint` | Download card |
+| pptx | `application/vnd.openxmlformats-officedocument.presentationml.presentation` | Download card |
 | odt | `application/vnd.oasis.opendocument.text` | |
 
-> [!IMPORTANT]
-> MS Office documents (doc, docx, xls, xlsx, ppt, pptx) use Microsoft's online viewing service via iframe and **require publicly accessible URLs**.
+> [!NOTE]
+> MS Office documents (doc, docx, xls, xlsx, ppt, pptx) render as download cards showing file name, type, and a download link. No external service or public URL is required.
 
 ## Live Demo
 
@@ -580,24 +581,33 @@ Customize the viewer's appearance with a theme object:
 <DocViewer documents={docs} pluginRenderers={DocViewerRenderers} style={{ width: 500, height: 500 }} />
 ```
 
-**Styled Components:**
+**Override internal elements with CSS classes:**
 
-```tsx
-import styled from "styled-components";
-import DocViewer from "@iamjariwala/react-doc-viewer";
+All internal elements use `.rdv-*` class names that you can target:
 
-const MyDocViewer = styled(DocViewer)`
+```css
+.rdv-container {
   border-radius: 10px;
-`;
+}
 
-<MyDocViewer documents={docs} />;
+.rdv-header-bar {
+  background-color: #faf;
+}
+
+.rdv-pdf-controls {
+  gap: 12px;
+}
 ```
 
-**Override internal elements by DOM ID:**
+**Override CSS custom properties:**
+
+Theming is powered by CSS variables. Override them on the container or globally:
 
 ```css
-#react-doc-viewer #header-bar {
-  background-color: #faf;
+#react-doc-viewer {
+  --rdv-primary: #1a1a2e;
+  --rdv-secondary: #16213e;
+  --rdv-text-primary: #e94560;
 }
 ```
 
@@ -681,7 +691,7 @@ Provide custom headers for authenticated requests:
 Install `@iamjariwala/react-doc-viewer`, import `DocViewer` and `DocViewerRenderers`, pass your PDF URL as a document, and the component handles rendering, zoom, pagination, and page navigation automatically. See [Quick Start](#quick-start).
 
 **Can I view Word, Excel, and PowerPoint files in React?**
-Yes. This library renders `.doc`, `.docx`, `.xls`, `.xlsx`, `.ppt`, and `.pptx` files using Microsoft's online viewing service. The files must be accessible via a public URL.
+Yes. This library recognizes `.doc`, `.docx`, `.xls`, `.xlsx`, `.ppt`, and `.pptx` files and renders them as download cards showing file name, type, and a download link. No external service or public URL is required.
 
 **Does it support annotations and highlighting?**
 Yes. Enable annotations via config to get text highlighting, freehand drawing, comments, and an eraser tool. Annotations can be exported as JSON and pre-loaded from saved data. See [Annotations](#annotations).

package/dist/DocViewer.d.ts

@@ -0,0 +1,21 @@
+import { default as React, CSSProperties } from 'react';
+import { AvailableLanguages } from './i18n';
+import { DocRenderer, DocViewerRef, IConfig, IDocument, ITheme } from './models';
+
+export interface DocViewerProps {
+    documents: IDocument[];
+    className?: string;
+    style?: CSSProperties;
+    config?: IConfig;
+    theme?: ITheme;
+    pluginRenderers?: DocRenderer[];
+    prefetchMethod?: string;
+    requestHeaders?: Record<string, string>;
+    initialActiveDocument?: IDocument;
+    language?: AvailableLanguages;
+    activeDocument?: IDocument;
+    onDocumentChange?: (document: IDocument) => void;
+    jumpToPage?: number;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<DocViewerProps & React.RefAttributes<DocViewerRef>>>;
+export default _default;

package/dist/components/DocumentNav.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const DocumentNav: FC;

package/dist/components/FileName.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const FileName: FC;

package/dist/components/HeaderBar.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const HeaderBar: FC;

package/dist/components/LoadingTimout.d.ts

@@ -0,0 +1,3 @@
+import { FC, PropsWithChildren } from 'react';
+
+export declare const LoadingTimeout: FC<PropsWithChildren>;

package/dist/components/ProxyRenderer.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const ProxyRenderer: FC;

package/dist/components/common/Button.d.ts

@@ -0,0 +1,13 @@
+import { FC, ButtonHTMLAttributes, AnchorHTMLAttributes } from 'react';
+
+type ButtonProps = ButtonHTMLAttributes<HTMLButtonElement> & {
+    className?: string;
+};
+export declare const Button: FC<ButtonProps>;
+export declare const ButtonPrimary: FC<ButtonProps>;
+export declare const ButtonSecondary: FC<ButtonProps>;
+type LinkButtonProps = AnchorHTMLAttributes<HTMLAnchorElement> & {
+    className?: string;
+};
+export declare const LinkButton: FC<LinkButtonProps>;
+export {};

package/dist/components/common/index.d.ts

@@ -0,0 +1 @@
+export * from './Button';

package/dist/components/icons/index.d.ts

@@ -0,0 +1,8 @@
+export interface IIconProps {
+    color?: string;
+    size?: string | number | string | undefined;
+    reverse?: boolean;
+}
+export declare const PrevDocIcon: (props: IIconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const NextDocIcon: (props: IIconProps) => import("react/jsx-runtime").JSX.Element;
+export declare const LoadingIcon: (props: IIconProps) => import("react/jsx-runtime").JSX.Element;

package/dist/cssStyles.d.ts

@@ -0,0 +1 @@
+

package/dist/defaultTheme.d.ts

@@ -0,0 +1,3 @@
+import { ITheme } from '.';
+
+export declare const defaultTheme: ITheme;

package/dist/empty-DBAFSQIv.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e=null;exports.default=e;

package/dist/empty-GlqisfcO.js

@@ -0,0 +1,4 @@
+var a = null;
+export {
+  a as default
+};

package/dist/features/annotations/components/AnnotationLayer.d.ts

@@ -0,0 +1,10 @@
+import { FC } from 'react';
+
+interface AnnotationLayerProps {
+    pageNumber: number;
+    documentUri: string;
+    width: number;
+    height: number;
+}
+export declare const AnnotationLayer: FC<AnnotationLayerProps>;
+export {};

package/dist/features/annotations/components/AnnotationToolbar.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const AnnotationToolbar: FC;

package/dist/features/annotations/components/ColorPicker.d.ts

@@ -0,0 +1,3 @@
+import { FC } from 'react';
+
+export declare const ColorPicker: FC;

package/dist/features/annotations/components/CommentMarker.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { IAnnotation } from '../types';
+
+interface CommentMarkerProps {
+    annotation: IAnnotation;
+}
+export declare const CommentMarker: FC<CommentMarkerProps>;
+export {};

package/dist/features/annotations/components/CommentPopover.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { IAnnotation } from '../types';
+
+interface CommentPopoverProps {
+    annotation: IAnnotation;
+    onClose: () => void;
+}
+export declare const CommentPopover: FC<CommentPopoverProps>;
+export {};

package/dist/features/annotations/components/TextHighlight.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+import { IAnnotation } from '../types';
+
+interface TextHighlightProps {
+    annotation: IAnnotation;
+}
+export declare const TextHighlight: FC<TextHighlightProps>;
+export {};

package/dist/features/annotations/components/icons/index.d.ts

@@ -0,0 +1,13 @@
+import { FC } from 'react';
+
+export interface IIconProps {
+    color?: string;
+    size?: string | number;
+    isActive?: boolean;
+}
+export declare const SelectIcon: FC<IIconProps>;
+export declare const HighlightIcon: FC<IIconProps>;
+export declare const PenIcon: FC<IIconProps>;
+export declare const CommentIcon: FC<IIconProps>;
+export declare const EraserIcon: FC<IIconProps>;
+export declare const DeleteIcon: FC<IIconProps>;

package/dist/features/annotations/hooks/useAnnotationExport.d.ts

@@ -0,0 +1,9 @@
+import { IAnnotation } from '../types';
+
+export declare const useAnnotationExport: () => {
+    exportAnnotations: () => IAnnotation[];
+    exportAsJSON: () => string;
+    downloadAnnotations: (filename?: string) => void;
+    getAnnotationsForPage: (pageNumber: number, documentUri: string) => IAnnotation[];
+    annotationCount: number;
+};

package/dist/features/annotations/hooks/useDrawingCanvas.d.ts

@@ -0,0 +1,15 @@
+import { IAnnotation } from '../types';
+
+interface UseDrawingCanvasProps {
+    canvasRef: React.RefObject<HTMLCanvasElement>;
+    pageNumber: number;
+    documentUri: string;
+}
+export declare const useDrawingCanvas: ({ canvasRef, pageNumber, documentUri, }: UseDrawingCanvasProps) => {
+    startDrawing: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    draw: (e: React.MouseEvent<HTMLCanvasElement>) => void;
+    stopDrawing: () => void;
+    redrawAnnotations: (annotations: IAnnotation[]) => void;
+    isDrawing: boolean;
+};
+export {};

package/dist/features/annotations/hooks/useTextSelection.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+interface UseTextSelectionProps {
+    pageNumber: number;
+    documentUri: string;
+    containerRef: React.RefObject<HTMLDivElement>;
+}
+export declare const useTextSelection: ({ pageNumber, documentUri, containerRef, }: UseTextSelectionProps) => {
+    handleTextSelection: () => void;
+};
+export {};

package/dist/features/annotations/index.d.ts

@@ -0,0 +1,13 @@
+export { AnnotationLayer } from './components/AnnotationLayer';
+export { AnnotationToolbar } from './components/AnnotationToolbar';
+export { TextHighlight } from './components/TextHighlight';
+export { CommentMarker } from './components/CommentMarker';
+export { CommentPopover } from './components/CommentPopover';
+export { ColorPicker } from './components/ColorPicker';
+export * from './components/icons';
+export { AnnotationProvider, AnnotationContext } from './state';
+export { useDrawingCanvas } from './hooks/useDrawingCanvas';
+export { useTextSelection } from './hooks/useTextSelection';
+export { useAnnotationExport } from './hooks/useAnnotationExport';
+export * from './state/actions';
+export * from './types';

package/dist/features/annotations/state/actions.d.ts

@@ -0,0 +1,52 @@
+import { AnnotationTool, IAnnotation } from '../types';
+
+export declare const SET_ACTIVE_TOOL = "SET_ACTIVE_TOOL";
+export declare const SET_CURRENT_COLOR = "SET_CURRENT_COLOR";
+export declare const ADD_ANNOTATION = "ADD_ANNOTATION";
+export declare const UPDATE_ANNOTATION = "UPDATE_ANNOTATION";
+export declare const DELETE_ANNOTATION = "DELETE_ANNOTATION";
+export declare const SET_ANNOTATIONS = "SET_ANNOTATIONS";
+export declare const SET_SELECTED_ANNOTATION = "SET_SELECTED_ANNOTATION";
+export declare const SET_IS_DRAWING = "SET_IS_DRAWING";
+export interface SetActiveTool {
+    type: typeof SET_ACTIVE_TOOL;
+    tool: AnnotationTool;
+}
+export declare const setActiveTool: (tool: AnnotationTool) => SetActiveTool;
+export interface SetCurrentColor {
+    type: typeof SET_CURRENT_COLOR;
+    color: string;
+}
+export declare const setCurrentColor: (color: string) => SetCurrentColor;
+export interface AddAnnotation {
+    type: typeof ADD_ANNOTATION;
+    annotation: IAnnotation;
+}
+export declare const addAnnotation: (annotation: IAnnotation) => AddAnnotation;
+export interface UpdateAnnotation {
+    type: typeof UPDATE_ANNOTATION;
+    id: string;
+    updates: Partial<IAnnotation>;
+}
+export declare const updateAnnotation: (id: string, updates: Partial<IAnnotation>) => UpdateAnnotation;
+export interface DeleteAnnotation {
+    type: typeof DELETE_ANNOTATION;
+    id: string;
+}
+export declare const deleteAnnotation: (id: string) => DeleteAnnotation;
+export interface SetAnnotations {
+    type: typeof SET_ANNOTATIONS;
+    annotations: IAnnotation[];
+}
+export declare const setAnnotations: (annotations: IAnnotation[]) => SetAnnotations;
+export interface SetSelectedAnnotation {
+    type: typeof SET_SELECTED_ANNOTATION;
+    id: string | null;
+}
+export declare const setSelectedAnnotation: (id: string | null) => SetSelectedAnnotation;
+export interface SetIsDrawing {
+    type: typeof SET_IS_DRAWING;
+    isDrawing: boolean;
+}
+export declare const setIsDrawing: (isDrawing: boolean) => SetIsDrawing;
+export type AnnotationActions = SetActiveTool | SetCurrentColor | AddAnnotation | UpdateAnnotation | DeleteAnnotation | SetAnnotations | SetSelectedAnnotation | SetIsDrawing;

package/dist/features/annotations/state/index.d.ts

@@ -0,0 +1,17 @@
+import { default as React, Dispatch, FC, PropsWithChildren } from 'react';
+import { IAnnotationConfig } from '../../../models';
+import { AnnotationActions } from './actions';
+import { IAnnotationState } from './reducer';
+
+interface AnnotationContextValue {
+    state: IAnnotationState;
+    dispatch: Dispatch<AnnotationActions>;
+    config?: IAnnotationConfig;
+}
+export declare const AnnotationContext: React.Context<AnnotationContextValue>;
+interface AnnotationProviderProps {
+    config?: IAnnotationConfig;
+    documentUri?: string;
+}
+export declare const AnnotationProvider: FC<PropsWithChildren<AnnotationProviderProps>>;
+export {};

package/dist/features/annotations/state/reducer.d.ts

@@ -0,0 +1,17 @@
+import { AnnotationTool, IAnnotation } from '../types';
+import { AnnotationActions } from './actions';
+
+export interface IAnnotationState {
+    activeTool: AnnotationTool;
+    currentColor: string;
+    annotations: IAnnotation[];
+    selectedAnnotationId: string | null;
+    isDrawing: boolean;
+    availableColors: string[];
+    availableTools: AnnotationTool[];
+}
+export declare const DEFAULT_COLORS: string[];
+export declare const DEFAULT_TOOLS: AnnotationTool[];
+export declare const initialAnnotationState: IAnnotationState;
+export type AnnotationStateReducer = (state: IAnnotationState, action: AnnotationActions) => IAnnotationState;
+export declare const annotationReducer: AnnotationStateReducer;

package/dist/features/annotations/types/index.d.ts

@@ -0,0 +1,44 @@
+export type AnnotationTool = "select" | "highlight" | "pen" | "comment" | "eraser";
+export interface IAnnotation {
+    id: string;
+    type: "highlight" | "drawing" | "comment";
+    documentUri: string;
+    pageNumber: number;
+    color: string;
+    data?: IHighlightData | IDrawingData | ICommentData;
+}
+export interface IHighlightData {
+    rects: Array<{
+        x: number;
+        y: number;
+        width: number;
+        height: number;
+    }>;
+    text?: string;
+}
+export interface IDrawingData {
+    paths: Array<{
+        x: number;
+        y: number;
+    }[]>;
+    strokeWidth: number;
+}
+export interface ICommentData {
+    x: number;
+    y: number;
+    text: string;
+    author?: string;
+    timestamp?: number;
+}
+export interface IAnnotationConfig {
+    enableAnnotations?: boolean;
+    defaultColor?: string;
+    colors?: string[];
+    tools?: AnnotationTool[];
+    onAnnotationChange?: (annotations: IAnnotation[]) => void;
+    initialAnnotations?: IAnnotation[];
+}
+export interface IPoint {
+    x: number;
+    y: number;
+}

package/dist/features/drag-drop/components/DropZoneOverlay.d.ts

@@ -0,0 +1,9 @@
+import { FC } from 'react';
+import { IDragState } from '../types';
+
+interface DropZoneOverlayProps {
+    dragState: IDragState;
+    dropMessage?: string;
+}
+export declare const DropZoneOverlay: FC<DropZoneOverlayProps>;
+export {};

package/dist/features/drag-drop/hooks/useDragDrop.d.ts

@@ -0,0 +1,11 @@
+import { DragEvent } from 'react';
+import { IDragState } from '../types';
+
+export declare const useDragDrop: () => {
+    dragState: IDragState;
+    handleDragEnter: (e: DragEvent<HTMLDivElement>) => void;
+    handleDragLeave: (e: DragEvent<HTMLDivElement>) => void;
+    handleDragOver: (e: DragEvent<HTMLDivElement>) => void;
+    handleDrop: (e: DragEvent<HTMLDivElement>, onFilesDropped: (files: File[]) => void) => void;
+    resetDragState: () => void;
+};

package/dist/features/drag-drop/hooks/useFileProcessor.d.ts

@@ -0,0 +1,13 @@
+import { IDocument } from '../../../models';
+import { IDragDropConfig } from '../types';
+
+export declare const useFileProcessor: (config?: IDragDropConfig) => {
+    processFiles: (files: File[]) => Promise<IDocument[]>;
+    validateFiles: (files: File[]) => {
+        valid: File[];
+        invalidType: File[];
+        invalidSize: File[];
+    };
+    isFileTypeAccepted: (file: File) => boolean;
+    isFileSizeValid: (file: File) => boolean;
+};

package/dist/features/drag-drop/index.d.ts

@@ -0,0 +1,4 @@
+export { DropZoneOverlay } from './components/DropZoneOverlay';
+export { useDragDrop } from './hooks/useDragDrop';
+export { useFileProcessor } from './hooks/useFileProcessor';
+export * from './types';

package/dist/features/drag-drop/types/index.d.ts

@@ -0,0 +1,19 @@
+export interface IDragDropConfig {
+    enableDragDrop?: boolean;
+    acceptedFileTypes?: string[];
+    maxFileSize?: number;
+    dropBehavior?: "append" | "replace";
+    onDrop?: (files: File[]) => void;
+    onDropRejected?: (files: File[], reason: DropRejectionReason) => void;
+}
+export type DropRejectionReason = "file-type" | "file-size" | "unknown";
+export interface IDragState {
+    isDragging: boolean;
+    isOverDropZone: boolean;
+}
+export interface IProcessedFile {
+    uri: string;
+    fileType: string;
+    fileName: string;
+    fileData: string;
+}

package/dist/features/thumbnail-sidebar/components/ThumbnailItem.d.ts

@@ -0,0 +1,11 @@
+import { FC } from 'react';
+import { IThumbnail } from '../state/actions';
+
+interface ThumbnailItemProps {
+    thumbnail: IThumbnail;
+    isSelected: boolean;
+    width: number;
+    onClick: () => void;
+}
+export declare const ThumbnailItem: FC<ThumbnailItemProps>;
+export {};

package/dist/features/thumbnail-sidebar/components/ThumbnailSidebar.d.ts

@@ -0,0 +1,8 @@
+import { FC } from 'react';
+
+interface ThumbnailSidebarProps {
+    onPageSelect: (pageNumber: number) => void;
+    currentPage: number;
+}
+export declare const ThumbnailSidebar: FC<ThumbnailSidebarProps>;
+export {};

package/dist/features/thumbnail-sidebar/components/ThumbnailToggle.d.ts

@@ -0,0 +1,7 @@
+import { FC } from 'react';
+
+interface ThumbnailToggleProps {
+    title?: string;
+}
+export declare const ThumbnailToggle: FC<ThumbnailToggleProps>;
+export {};

package/dist/features/thumbnail-sidebar/hooks/useThumbnailGenerator.d.ts

@@ -0,0 +1,13 @@
+import { IThumbnail } from '../state/actions';
+
+interface UseThumbnailGeneratorProps {
+    numPages: number;
+    documentUri?: string;
+    scale?: number;
+}
+export declare const useThumbnailGenerator: ({ numPages, documentUri, scale, }: UseThumbnailGeneratorProps) => {
+    thumbnails: IThumbnail[];
+    generateThumbnailFromCanvas: (canvas: HTMLCanvasElement, pageNumber: number) => void;
+    scale: number;
+};
+export {};

package/dist/features/thumbnail-sidebar/index.d.ts

@@ -0,0 +1,6 @@
+export { ThumbnailSidebar } from './components/ThumbnailSidebar';
+export { ThumbnailItem } from './components/ThumbnailItem';
+export { ThumbnailToggle } from './components/ThumbnailToggle';
+export { ThumbnailProvider, ThumbnailContext } from './state';
+export { useThumbnailGenerator } from './hooks/useThumbnailGenerator';
+export * from './state/actions';

package/dist/features/thumbnail-sidebar/state/actions.d.ts

@@ -0,0 +1,31 @@
+export declare const SET_SIDEBAR_OPEN = "SET_SIDEBAR_OPEN";
+export declare const SET_THUMBNAILS = "SET_THUMBNAILS";
+export declare const SET_SELECTED_PAGE = "SET_SELECTED_PAGE";
+export declare const UPDATE_SINGLE_THUMBNAIL = "UPDATE_SINGLE_THUMBNAIL";
+export interface SetSidebarOpen {
+    type: typeof SET_SIDEBAR_OPEN;
+    isOpen: boolean;
+}
+export declare const setSidebarOpen: (isOpen: boolean) => SetSidebarOpen;
+export interface IThumbnail {
+    pageNumber: number;
+    dataUrl?: string;
+    isLoading: boolean;
+}
+export interface SetThumbnails {
+    type: typeof SET_THUMBNAILS;
+    thumbnails: IThumbnail[];
+}
+export declare const setThumbnails: (thumbnails: IThumbnail[]) => SetThumbnails;
+export interface SetSelectedPage {
+    type: typeof SET_SELECTED_PAGE;
+    pageNumber: number;
+}
+export declare const setSelectedPage: (pageNumber: number) => SetSelectedPage;
+export interface UpdateSingleThumbnail {
+    type: typeof UPDATE_SINGLE_THUMBNAIL;
+    pageNumber: number;
+    dataUrl: string;
+}
+export declare const updateSingleThumbnail: (pageNumber: number, dataUrl: string) => UpdateSingleThumbnail;
+export type ThumbnailActions = SetSidebarOpen | SetThumbnails | SetSelectedPage | UpdateSingleThumbnail;

package/dist/features/thumbnail-sidebar/state/index.d.ts

@@ -0,0 +1,15 @@
+import { default as React, Dispatch, FC, PropsWithChildren } from 'react';
+import { IThumbnailConfig } from '../../../models';
+import { ThumbnailActions } from './actions';
+import { IThumbnailState } from './reducer';
+
+interface ThumbnailContextValue {
+    state: IThumbnailState;
+    dispatch: Dispatch<ThumbnailActions>;
+}
+export declare const ThumbnailContext: React.Context<ThumbnailContextValue>;
+interface ThumbnailProviderProps {
+    config?: IThumbnailConfig;
+}
+export declare const ThumbnailProvider: FC<PropsWithChildren<ThumbnailProviderProps>>;
+export {};

package/dist/features/thumbnail-sidebar/state/reducer.d.ts

@@ -0,0 +1,11 @@
+import { ThumbnailActions, IThumbnail } from './actions';
+
+export interface IThumbnailState {
+    isOpen: boolean;
+    thumbnails: IThumbnail[];
+    selectedPage: number;
+    thumbnailWidth: number;
+}
+export declare const initialThumbnailState: IThumbnailState;
+export type ThumbnailStateReducer = (state: IThumbnailState, action: ThumbnailActions) => IThumbnailState;
+export declare const thumbnailReducer: ThumbnailStateReducer;