@fdls/file-viewer 0.2.0

package/dist/index.d.ts

@@ -0,0 +1,309 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { CSSProperties, ReactNode, ReactElement } from 'react';
+
+type SlotStyle = CSSProperties;
+type FileViewerDialogClassNames = {
+    backdrop?: string;
+    content?: string;
+    panel?: string;
+};
+type FileViewerDialogStyles = {
+    backdrop?: SlotStyle;
+    content?: SlotStyle;
+    panel?: SlotStyle;
+};
+type FileViewerClassNames = {
+    root?: string;
+    header?: string;
+    headerTitle?: string;
+    headerActions?: string;
+    closeButton?: string;
+    printButton?: string;
+    openInModalButton?: string;
+    downloadButton?: string;
+    viewer?: string;
+    loader?: string;
+    unsupported?: string;
+};
+type FileViewerStyles = {
+    root?: SlotStyle;
+    header?: SlotStyle;
+    headerTitle?: SlotStyle;
+    headerActions?: SlotStyle;
+    closeButton?: SlotStyle;
+    printButton?: SlotStyle;
+    openInModalButton?: SlotStyle;
+    downloadButton?: SlotStyle;
+    viewer?: SlotStyle;
+    loader?: SlotStyle;
+    unsupported?: SlotStyle;
+};
+type PdfViewerClassNames = {
+    root?: string;
+    scrollArea?: string;
+    scrollViewport?: string;
+    scrollbar?: string;
+    scrollbarThumb?: string;
+    page?: string;
+    pageInner?: string;
+    pageInput?: string;
+    pagination?: string;
+};
+type PdfViewerStyles = {
+    root?: SlotStyle;
+    scrollArea?: SlotStyle;
+    scrollViewport?: SlotStyle;
+    scrollbar?: SlotStyle;
+    scrollbarThumb?: SlotStyle;
+    page?: SlotStyle;
+    pageInner?: SlotStyle;
+    pageInput?: SlotStyle;
+    pagination?: SlotStyle;
+};
+type ImageViewerClassNames = {
+    root?: string;
+    loader?: string;
+    image?: string;
+    toolbar?: string;
+};
+type ImageViewerStyles = {
+    root?: SlotStyle;
+    loader?: SlotStyle;
+    image?: SlotStyle;
+    toolbar?: SlotStyle;
+};
+type ViewerToolbarClassNames = {
+    toolbar?: string;
+    divider?: string;
+    iconButton?: string;
+};
+type ViewerToolbarStyles = {
+    toolbar?: SlotStyle;
+    divider?: SlotStyle;
+    iconButton?: SlotStyle;
+};
+type FileViewerTooltipClassNames = {
+    content?: string;
+};
+type FileViewerTooltipStyles = {
+    content?: SlotStyle;
+};
+
+/** Plain string, or a function that receives structured values for formatting. */
+type FormattableMessage<P extends Record<string, unknown>> = string | ((params: P) => string);
+type UnsupportedFileTypeParams = {
+    extension: string;
+};
+type PdfPageInputAriaLabelParams = {
+    value: string;
+};
+type ViewerLanguage = 'english' | 'portuguese';
+interface FileViewerShellTranslations {
+    closeAriaLabel: string;
+    printAriaLabel: string;
+    printTooltip: string;
+    downloadAriaLabel: string;
+    downloadTooltip: string;
+    downloadInProgressAriaLabel: string;
+    downloadInProgressTooltip: string;
+    openInModalAriaLabel: string;
+    openInModalTooltip: string;
+    unsupportedFileType: FormattableMessage<UnsupportedFileTypeParams>;
+}
+interface ImageViewerTranslations {
+    zoomOutAriaLabel: string;
+    fitScreenAriaLabel: string;
+    zoomInAriaLabel: string;
+    zoomOutTooltip: string;
+    fitScreenTooltip: string;
+    zoomInTooltip: string;
+}
+interface PdfViewerTranslations {
+    pageLabel: string;
+    pageInputAriaLabel: FormattableMessage<PdfPageInputAriaLabelParams>;
+    previousPageAriaLabel: string;
+    nextPageAriaLabel: string;
+    previousPageTooltip: string;
+    nextPageTooltip: string;
+    zoomOutAriaLabel: string;
+    fitWidthAriaLabel: string;
+    zoomInAriaLabel: string;
+    zoomOutTooltip: string;
+    fitWidthTooltip: string;
+    zoomInTooltip: string;
+}
+interface FileViewerTranslations {
+    fileViewer: FileViewerShellTranslations;
+    imageViewer: ImageViewerTranslations;
+    pdfViewer: PdfViewerTranslations;
+}
+declare const fileViewerTranslationsByLanguage: Record<ViewerLanguage, FileViewerTranslations>;
+/** English defaults (same object as `fileViewerTranslationsByLanguage.english`). */
+declare const defaultFileViewerTranslations: FileViewerTranslations;
+declare function getFileViewerTranslations(language: ViewerLanguage): FileViewerTranslations;
+declare function resolveFormattedMessage<P extends Record<string, unknown>>(message: FormattableMessage<P>, params: P): string;
+
+type PdfViewMode = 'single' | 'continuous';
+interface PaginationRenderProps {
+    pageNumber: number;
+    numPages: number;
+    previousPage: () => void;
+    nextPage: () => void;
+    goToPage: (page: number) => void;
+    isFirstPage: boolean;
+    isLastPage: boolean;
+    viewMode: PdfViewMode;
+}
+interface PdfViewerProps {
+    url: string;
+    viewMode?: PdfViewMode;
+    debounceDelay?: number;
+    /** Debounce before re-rendering canvas at new resolution after zoom (default: 500ms). */
+    zoomDebounceDelay?: number;
+    renderTextLayer?: boolean;
+    renderAnnotationLayer?: boolean;
+    renderLoading?: ReactNode;
+    preloadAhead?: number;
+    onLoadSuccess?: (numPages: number) => void;
+    onLoadError?: (error: Error) => void;
+    onPageChange?: (page: number) => void;
+    defaultPage?: number;
+    renderPagination?: ((props: PaginationRenderProps) => ReactNode) | null;
+    paginationClassName?: string;
+    language?: ViewerLanguage;
+    className?: string;
+    pageClassName?: string;
+    classNames?: PdfViewerClassNames;
+    styles?: PdfViewerStyles;
+}
+declare function PdfViewer(props: PdfViewerProps): react_jsx_runtime.JSX.Element;
+
+interface FileViewerProps {
+    /**
+     * The display mode for the file viewer.
+     * - `inline`: fits to its parent container (default)
+     * - `modal`: renders as a full-screen fixed dialog overlay
+     */
+    mode?: 'modal' | 'inline';
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    name: string;
+    extension: string;
+    url?: string;
+    isLoading?: boolean;
+    /** Optional; defaults to built-in download of `url` as `name`. */
+    onDownload?: () => void;
+    pdfViewerProps?: Omit<PdfViewerProps, 'url' | 'language'>;
+    renderUnsupported?: ReactNode;
+    language?: ViewerLanguage;
+    /**
+     * When omitted: hidden in `inline` mode, visible in `modal` mode.
+     * Instance prop overrides global defaults from `setFileViewerDefaults`.
+     */
+    hideCloseButton?: boolean;
+    /**
+     * In `inline` mode, shows a control to open the same file in a full-screen modal.
+     * Defaults to `true`. Set to `false` to hide the button.
+     */
+    showOpenInModalButton?: boolean;
+    /** When set, called instead of the built-in modal preview. */
+    onOpenInModal?: () => void;
+    classNames?: FileViewerClassNames;
+    styles?: FileViewerStyles;
+    /** Extra classes per layer; appended to package defaults (use `!` utilities to override when needed). */
+    dialogClassNames?: FileViewerDialogClassNames;
+    dialogStyles?: FileViewerDialogStyles;
+}
+declare function FileViewer({ mode: modeProp, open, onOpenChange, name, extension, url, isLoading, onDownload, pdfViewerProps, renderUnsupported, language: languageProp, hideCloseButton: hideCloseButtonProp, showOpenInModalButton: showOpenInModalButtonProp, onOpenInModal, classNames, styles, dialogClassNames, dialogStyles, }: FileViewerProps): react_jsx_runtime.JSX.Element | null;
+
+interface ImageViewerProps {
+    url: string;
+    name: string;
+    language?: ViewerLanguage;
+    classNames?: ImageViewerClassNames;
+    styles?: ImageViewerStyles;
+}
+declare function ImageViewer({ url, name, language: languageProp, classNames: classNamesProp, styles: stylesProp, }: ImageViewerProps): react_jsx_runtime.JSX.Element;
+
+declare function FileViewerTooltipProvider({ children, }: {
+    children: ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function FileViewerTooltip({ content, children, disabled, classNames, styles, }: {
+    content: string;
+    children: ReactElement;
+    disabled?: boolean;
+    classNames?: FileViewerTooltipClassNames;
+    styles?: FileViewerTooltipStyles;
+}): react_jsx_runtime.JSX.Element;
+
+type ConfigureFileViewerPdfWorkerOptions = {
+    /**
+     * URL to `pdf.worker.min.mjs`.
+     *
+     * Prefer `getFileViewerPdfWorkerSrc()` (same version as react-pdf’s API).
+     *
+     * If you use `new URL('pdfjs-dist/build/pdf.worker.min.mjs', import.meta.url)`,
+     * pin `pdfjs-dist` to the same version as react-pdf (see `pdfjs.version`), or
+     * npm may hoist a newer `pdfjs-dist` and the worker will not match the API.
+     */
+    workerSrc?: string;
+};
+/**
+ * Worker URL for the **same** pdfjs version react-pdf uses (`pdfjs.version`).
+ * Use this as `workerSrc` to avoid API/worker mismatches (e.g. 4.8.69 vs 4.10.x).
+ */
+declare function getFileViewerPdfWorkerSrc(): string;
+/** @deprecated Use `getFileViewerPdfWorkerSrc` */
+declare const getFileViewerPdfWorkerCdnUrl: typeof getFileViewerPdfWorkerSrc;
+/** Whether `configureFileViewerPdfWorker` has been called. */
+declare function isFileViewerPdfWorkerConfigured(): boolean;
+/**
+ * Configures the PDF.js worker used by `FileViewer` / `PdfViewer`.
+ *
+ * Call once in your app entry **before** rendering PDFs.
+ *
+ * Default (`workerSrc` omitted): `getFileViewerPdfWorkerSrc()` (unpkg, needs network).
+ */
+declare function configureFileViewerPdfWorker(options?: ConfigureFileViewerPdfWorkerOptions): void;
+
+type DeepPartial<T> = T extends (...args: never[]) => unknown ? T : T extends object ? {
+    [K in keyof T]?: DeepPartial<T[K]>;
+} : T;
+
+interface FileViewerDefaults {
+    language?: ViewerLanguage;
+    fileViewer?: {
+        mode?: 'modal' | 'inline';
+        hideCloseButton?: boolean;
+        showOpenInModalButton?: boolean;
+        dialogClassNames?: FileViewerDialogClassNames;
+        dialogStyles?: FileViewerDialogStyles;
+        classNames?: FileViewerClassNames;
+        styles?: FileViewerStyles;
+        pdfViewerProps?: Omit<PdfViewerProps, 'url' | 'language'>;
+    };
+    pdfViewer?: Omit<PdfViewerProps, 'url' | 'language'>;
+    imageViewer?: Omit<ImageViewerProps, 'url' | 'name' | 'language'>;
+    toolbar?: {
+        classNames?: ViewerToolbarClassNames;
+        styles?: ViewerToolbarStyles;
+    };
+    tooltip?: {
+        delayDuration?: number;
+        skipDelayDuration?: number;
+        classNames?: FileViewerTooltipClassNames;
+        styles?: FileViewerTooltipStyles;
+    };
+    autoHide?: {
+        proximityThreshold?: number;
+        timeout?: number;
+    };
+    translations?: DeepPartial<Record<ViewerLanguage, FileViewerTranslations>>;
+}
+declare function setFileViewerDefaults(partial: DeepPartial<FileViewerDefaults>): void;
+declare function getFileViewerDefaults(): Readonly<FileViewerDefaults>;
+declare function resetFileViewerDefaults(): void;
+declare function resolvePdfViewerProps(instance?: Omit<PdfViewerProps, 'url' | 'language'>): Omit<PdfViewerProps, 'url' | 'language'>;
+declare function resolveImageViewerProps(instance?: Omit<ImageViewerProps, 'url' | 'name' | 'language'>): Omit<ImageViewerProps, 'url' | 'name' | 'language'>;
+
+export { type ConfigureFileViewerPdfWorkerOptions, type DeepPartial, FileViewer, type FileViewerClassNames, type FileViewerDefaults, type FileViewerDialogClassNames, type FileViewerDialogStyles, type FileViewerProps, type FileViewerShellTranslations, type FileViewerStyles, FileViewerTooltip, type FileViewerTooltipClassNames, FileViewerTooltipProvider, type FileViewerTooltipStyles, type FileViewerTranslations, type FormattableMessage, ImageViewer, type ImageViewerClassNames, type ImageViewerProps, type ImageViewerStyles, type ImageViewerTranslations, type PaginationRenderProps, type PdfPageInputAriaLabelParams, type PdfViewMode, PdfViewer, type PdfViewerClassNames, type PdfViewerProps, type PdfViewerStyles, type PdfViewerTranslations, type SlotStyle, type UnsupportedFileTypeParams, type ViewerLanguage, type ViewerToolbarClassNames, type ViewerToolbarStyles, configureFileViewerPdfWorker, defaultFileViewerTranslations, fileViewerTranslationsByLanguage, getFileViewerDefaults, getFileViewerPdfWorkerCdnUrl, getFileViewerPdfWorkerSrc, getFileViewerTranslations, isFileViewerPdfWorkerConfigured, resetFileViewerDefaults, resolveFormattedMessage, resolveImageViewerProps, resolvePdfViewerProps, setFileViewerDefaults };