import React from "react";
import type { CSSProperties, ReactElement } from "react";
import type { ConversionOptions, CompareOptions, Revision, Annotation, AddAnnotationRequest, AddAnnotationResponse, RemoveAnnotationResponse, DocumentStructure, DocumentElement, TableColumnInfo, AnnotationTarget, AddAnnotationWithTargetRequest, DocumentMetadata, SectionMetadata } from "./types.js";
import { AnnotationLabelMode, DocumentElementType, targetElement, targetParagraph, targetParagraphRange, targetRun, targetTable, targetTableRow, targetTableCell, targetTableColumn, targetSearch, targetSearchInElement, findElementById, findElementsByType, getParagraphs, getTables, getTableColumns } from "./types.js";
import { type PaginationOptions, type PaginationResult } from "./pagination.js";
export type { ConversionOptions, CompareOptions, Revision, PaginationOptions, PaginationResult, Annotation, AddAnnotationRequest, AddAnnotationResponse, RemoveAnnotationResponse, DocumentStructure, DocumentElement, TableColumnInfo, AnnotationTarget, AddAnnotationWithTargetRequest, DocumentMetadata, SectionMetadata, };
export { AnnotationLabelMode, DocumentElementType, targetElement, targetParagraph, targetParagraphRange, targetRun, targetTable, targetTableRow, targetTableCell, targetTableColumn, targetSearch, targetSearchInElement, findElementById, findElementsByType, getParagraphs, getTables, getTableColumns, };
export interface UseDocxodusResult {
    /** Whether the WASM runtime is loaded and ready */
    isReady: boolean;
    /** Whether the runtime is currently loading */
    isLoading: boolean;
    /** Error that occurred during initialization, if any */
    error: Error | null;
    /** Convert DOCX to HTML */
    convertToHtml: (document: File | Uint8Array, options?: ConversionOptions) => Promise<string>;
    /** Compare two documents and return redlined DOCX */
    compare: (original: File | Uint8Array, modified: File | Uint8Array, options?: CompareOptions) => Promise<Uint8Array>;
    /** Compare two documents and return HTML */
    compareToHtml: (original: File | Uint8Array, modified: File | Uint8Array, options?: CompareOptions) => Promise<string>;
    /** Get revisions from a compared document */
    getRevisions: (document: File | Uint8Array) => Promise<Revision[]>;
    /** Get all annotations from a document */
    getAnnotations: (document: File | Uint8Array) => Promise<Annotation[]>;
    /** Add an annotation to a document */
    addAnnotation: (document: File | Uint8Array, request: AddAnnotationRequest) => Promise<AddAnnotationResponse>;
    /** Add an annotation using flexible targeting (element ID, indices, or text search) */
    addAnnotationWithTarget: (document: File | Uint8Array, request: AddAnnotationWithTargetRequest) => Promise<AddAnnotationResponse>;
    /** Remove an annotation from a document */
    removeAnnotation: (document: File | Uint8Array, annotationId: string) => Promise<RemoveAnnotationResponse>;
    /** Check if a document has any annotations */
    hasAnnotations: (document: File | Uint8Array) => Promise<boolean>;
    /** Get the document structure for element-based annotation targeting */
    getDocumentStructure: (document: File | Uint8Array) => Promise<DocumentStructure>;
}
/**
 * React hook for using Docxodus WASM functionality.
 * Automatically initializes the WASM runtime on mount.
 *
 * WASM files are auto-detected from the module's location (works with CDN, npm, or local hosting).
 * Pass a custom path only if you need to host files at a different location.
 *
 * @param wasmBasePath - Optional custom path to WASM files. Leave empty for auto-detection.
 * @returns Object with ready state and document functions
 *
 * @example
 * ```tsx
 * function App() {
 *   // Auto-detects WASM location - no configuration needed!
 *   const { isReady, isLoading, error, convertToHtml } = useDocxodus();
 *
 *   const handleFile = async (file: File) => {
 *     if (!isReady) return;
 *     const html = await convertToHtml(file);
 *     setHtml(html);
 *   };
 *
 *   if (isLoading) return <div>Loading WASM...</div>;
 *   if (error) return <div>Error: {error.message}</div>;
 *
 *   return <input type="file" onChange={e => handleFile(e.target.files[0])} />;
 * }
 * ```
 */
export declare function useDocxodus(wasmBasePath?: string): UseDocxodusResult;
export interface UseConversionResult {
    /** The converted HTML output */
    html: string | null;
    /** Whether a conversion is in progress */
    isConverting: boolean;
    /** Error from the last conversion attempt */
    error: Error | null;
    /** Convert a DOCX file to HTML */
    convert: (document: File | Uint8Array, options?: ConversionOptions) => Promise<void>;
    /** Clear the current result */
    clear: () => void;
}
/**
 * React hook for DOCX to HTML conversion with state management.
 * WASM files are auto-detected from the module's location.
 *
 * @param wasmBasePath - Optional custom path to WASM files. Leave empty for auto-detection.
 *
 * @example
 * ```tsx
 * function Converter() {
 *   // Auto-detects WASM location - no configuration needed!
 *   const { html, isConverting, error, convert } = useConversion();
 *
 *   return (
 *     <div>
 *       <input
 *         type="file"
 *         accept=".docx"
 *         onChange={e => e.target.files?.[0] && convert(e.target.files[0])}
 *         disabled={isConverting}
 *       />
 *       {isConverting && <p>Converting...</p>}
 *       {error && <p>Error: {error.message}</p>}
 *       {html && <div dangerouslySetInnerHTML={{ __html: html }} />}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useConversion(wasmBasePath?: string): UseConversionResult;
export interface UseComparisonResult {
    /** The comparison result as a Uint8Array (redlined DOCX) */
    result: Uint8Array | null;
    /** The comparison result as HTML (if compareToHtml was used) */
    html: string | null;
    /** Revisions extracted from the comparison */
    revisions: Revision[] | null;
    /** Whether a comparison is in progress */
    isComparing: boolean;
    /** Error from the last comparison attempt */
    error: Error | null;
    /** Compare two documents and get redlined DOCX */
    compare: (original: File | Uint8Array, modified: File | Uint8Array, options?: CompareOptions) => Promise<void>;
    /** Compare two documents and get HTML */
    compareToHtml: (original: File | Uint8Array, modified: File | Uint8Array, options?: CompareOptions) => Promise<void>;
    /** Clear all results */
    clear: () => void;
    /** Download the result as a DOCX file */
    downloadResult: (filename?: string) => void;
}
/**
 * React hook for document comparison with state management.
 * WASM files are auto-detected from the module's location.
 *
 * @param wasmBasePath - Optional custom path to WASM files. Leave empty for auto-detection.
 *
 * @example
 * ```tsx
 * function Comparer() {
 *   // Auto-detects WASM location - no configuration needed!
 *   const { html, isComparing, error, compareToHtml, downloadResult } = useComparison();
 *   const [original, setOriginal] = useState<File | null>(null);
 *   const [modified, setModified] = useState<File | null>(null);
 *
 *   const handleCompare = () => {
 *     if (original && modified) {
 *       compareToHtml(original, modified, { authorName: 'User' });
 *     }
 *   };
 *
 *   return (
 *     <div>
 *       <input type="file" onChange={e => setOriginal(e.target.files?.[0] ?? null)} />
 *       <input type="file" onChange={e => setModified(e.target.files?.[0] ?? null)} />
 *       <button onClick={handleCompare} disabled={isComparing}>Compare</button>
 *       {html && <div dangerouslySetInnerHTML={{ __html: html }} />}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useComparison(wasmBasePath?: string): UseComparisonResult;
/**
 * Props for the PaginatedDocument component.
 */
export interface PaginatedDocumentProps {
    /** HTML string with pagination metadata (from convertDocxToHtml with PaginationMode.Paginated) */
    html: string;
    /** Scale factor for page rendering (1.0 = 100%). Default: 1 */
    scale?: number;
    /** Whether to show page numbers. Default: true */
    showPageNumbers?: boolean;
    /** Gap between pages in pixels. Default: 20 */
    pageGap?: number;
    /** Whether simple paragraphs may fragment across page boundaries. Default: true. */
    fragmentParagraphs?: boolean;
    /** Background color for the viewer. Default: "#525659" */
    backgroundColor?: string;
    /** CSS class prefix used in the HTML. Default: "page-" */
    cssPrefix?: string;
    /** Callback when pagination completes */
    onPaginationComplete?: (result: PaginationResult) => void;
    /** Callback when a page becomes visible (for tracking current page) */
    onPageVisible?: (pageNumber: number) => void;
    /** Additional CSS class for the container */
    className?: string;
    /** Additional inline styles for the container */
    style?: CSSProperties;
}
/**
 * Result of the usePagination hook.
 */
export interface UsePaginationResult {
    /** Pagination result after processing */
    result: PaginationResult | null;
    /** Whether pagination is in progress */
    isPaginating: boolean;
    /** Error that occurred during pagination */
    error: Error | null;
    /** Manually trigger pagination */
    paginate: () => void;
}
/**
 * React hook for pagination state management.
 *
 * @param html - HTML string with pagination metadata
 * @param containerRef - Ref to the container element
 * @param options - Pagination options
 * @returns Pagination state and controls
 *
 * @example
 * ```tsx
 * function Viewer({ html }: { html: string }) {
 *   const containerRef = useRef<HTMLDivElement>(null);
 *   const { result, isPaginating, error, paginate } = usePagination(html, containerRef);
 *
 *   return (
 *     <div ref={containerRef} style={{ minHeight: '100vh' }}>
 *       {isPaginating && <div>Paginating...</div>}
 *       {result && <div>Total pages: {result.totalPages}</div>}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function usePagination(html: string, containerRef: React.RefObject<HTMLElement | null>, options?: PaginationOptions): UsePaginationResult;
/**
 * React component for displaying a paginated document view (PDF.js style).
 *
 * @example
 * ```tsx
 * import { useState, useEffect } from 'react';
 * import { useDocxodus, PaginatedDocument, PaginationMode } from 'docxodus/react';
 *
 * function DocumentViewer() {
 *   const { isReady, convertToHtml } = useDocxodus();
 *   const [html, setHtml] = useState<string | null>(null);
 *
 *   const handleFile = async (file: File) => {
 *     const result = await convertToHtml(file, {
 *       paginationMode: PaginationMode.Paginated,
 *       paginationScale: 0.8
 *     });
 *     setHtml(result);
 *   };
 *
 *   return (
 *     <div>
 *       <input type="file" accept=".docx" onChange={e => e.target.files?.[0] && handleFile(e.target.files[0])} />
 *       {html && (
 *         <PaginatedDocument
 *           html={html}
 *           scale={0.8}
 *           onPaginationComplete={result => console.log(`${result.totalPages} pages`)}
 *         />
 *       )}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function PaginatedDocument({ html, scale, showPageNumbers, pageGap, fragmentParagraphs, backgroundColor, cssPrefix, onPaginationComplete, onPageVisible, className, style, }: PaginatedDocumentProps): ReactElement;
/**
 * Result of the useAnnotations hook.
 */
export interface UseAnnotationsResult {
    /** All annotations in the document */
    annotations: Annotation[];
    /** Whether annotations are being loaded or modified */
    isLoading: boolean;
    /** Error from the last operation */
    error: Error | null;
    /** Reload annotations from the document */
    reload: () => Promise<void>;
    /** Add a new annotation */
    add: (request: AddAnnotationRequest) => Promise<AddAnnotationResponse | null>;
    /** Remove an annotation by ID */
    remove: (annotationId: string) => Promise<RemoveAnnotationResponse | null>;
    /** The current document bytes (updated after add/remove) */
    documentBytes: Uint8Array | null;
}
/**
 * React hook for managing document annotations.
 *
 * @param document - DOCX file as File object or Uint8Array
 * @param wasmBasePath - Optional custom path to WASM files
 * @returns Annotation state and CRUD operations
 *
 * @example
 * ```tsx
 * function AnnotationManager({ docxFile }: { docxFile: File }) {
 *   const { annotations, isLoading, add, remove, documentBytes } = useAnnotations(docxFile);
 *
 *   const handleAddAnnotation = async () => {
 *     await add({
 *       id: `annot-${Date.now()}`,
 *       labelId: "CLAUSE_A",
 *       label: "Important Clause",
 *       color: "#FFEB3B",
 *       searchText: "shall not be liable"
 *     });
 *   };
 *
 *   return (
 *     <div>
 *       <h2>Annotations ({annotations.length})</h2>
 *       {annotations.map(a => (
 *         <div key={a.id} style={{ backgroundColor: a.color }}>
 *           <span>{a.label}: {a.annotatedText}</span>
 *           <button onClick={() => remove(a.id)}>Remove</button>
 *         </div>
 *       ))}
 *       <button onClick={handleAddAnnotation}>Add Annotation</button>
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useAnnotations(document: File | Uint8Array | null, wasmBasePath?: string): UseAnnotationsResult;
/**
 * Props for the AnnotatedDocument component.
 */
export interface AnnotatedDocumentProps {
    /** HTML string with annotation highlights (from convertDocxToHtml with renderAnnotations: true) */
    html: string;
    /** Callback when an annotation highlight is clicked */
    onAnnotationClick?: (annotationId: string, annotation: Annotation | null) => void;
    /** Callback when an annotation highlight is hovered */
    onAnnotationHover?: (annotationId: string | null, annotation: Annotation | null) => void;
    /** List of annotations for looking up details on click/hover */
    annotations?: Annotation[];
    /** CSS class prefix for annotation elements. Default: "annot-" */
    cssPrefix?: string;
    /** Additional CSS class for the container */
    className?: string;
    /** Additional inline styles for the container */
    style?: CSSProperties;
}
/**
 * React component for displaying a document with annotation highlights.
 * Handles click and hover events on annotation spans.
 *
 * @example
 * ```tsx
 * import { useState, useEffect } from 'react';
 * import { useDocxodus, useAnnotations, AnnotatedDocument, AnnotationLabelMode } from 'docxodus/react';
 *
 * function DocumentWithAnnotations({ docxFile }: { docxFile: File }) {
 *   const { isReady, convertToHtml } = useDocxodus();
 *   const { annotations } = useAnnotations(docxFile);
 *   const [html, setHtml] = useState<string | null>(null);
 *   const [selectedAnnotation, setSelectedAnnotation] = useState<Annotation | null>(null);
 *
 *   useEffect(() => {
 *     if (isReady) {
 *       convertToHtml(docxFile, {
 *         renderAnnotations: true,
 *         annotationLabelMode: AnnotationLabelMode.Above
 *       }).then(setHtml);
 *     }
 *   }, [isReady, docxFile]);
 *
 *   return (
 *     <div>
 *       {html && (
 *         <AnnotatedDocument
 *           html={html}
 *           annotations={annotations}
 *           onAnnotationClick={(id, annot) => setSelectedAnnotation(annot)}
 *         />
 *       )}
 *       {selectedAnnotation && (
 *         <div className="sidebar">
 *           <h3>{selectedAnnotation.label}</h3>
 *           <p>{selectedAnnotation.annotatedText}</p>
 *         </div>
 *       )}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function AnnotatedDocument({ html, onAnnotationClick, onAnnotationHover, annotations, cssPrefix, className, style, }: AnnotatedDocumentProps): ReactElement;
/**
 * Result of the useDocumentStructure hook.
 */
export interface UseDocumentStructureResult {
    /** The document structure tree */
    structure: DocumentStructure | null;
    /** Whether the structure is being loaded */
    isLoading: boolean;
    /** Error from loading the structure */
    error: Error | null;
    /** Reload the document structure */
    reload: () => Promise<void>;
    /** Find an element by ID */
    findById: (elementId: string) => DocumentElement | undefined;
    /** Find all elements of a specific type */
    findByType: (type: DocumentElementType | string) => DocumentElement[];
    /** Get all paragraphs */
    paragraphs: DocumentElement[];
    /** Get all tables */
    tables: DocumentElement[];
    /** Get columns for a specific table */
    getColumns: (tableId: string) => TableColumnInfo[];
}
/**
 * React hook for exploring document structure for element-based annotation targeting.
 *
 * @param document - DOCX file as File object or Uint8Array
 * @param wasmBasePath - Optional custom path to WASM files
 * @returns Document structure state and navigation helpers
 *
 * @example
 * ```tsx
 * function DocumentExplorer({ docxFile }: { docxFile: File }) {
 *   const {
 *     structure,
 *     isLoading,
 *     paragraphs,
 *     tables,
 *     findById,
 *     getColumns
 *   } = useDocumentStructure(docxFile);
 *
 *   if (isLoading || !structure) {
 *     return <div>Loading structure...</div>;
 *   }
 *
 *   return (
 *     <div>
 *       <h2>Document Structure</h2>
 *       <h3>Paragraphs ({paragraphs.length})</h3>
 *       <ul>
 *         {paragraphs.map(p => (
 *           <li key={p.id}>
 *             {p.id}: {p.textPreview}
 *           </li>
 *         ))}
 *       </ul>
 *       <h3>Tables ({tables.length})</h3>
 *       {tables.map(t => (
 *         <div key={t.id}>
 *           <h4>{t.id}</h4>
 *           <p>Columns: {getColumns(t.id).length}</p>
 *         </div>
 *       ))}
 *     </div>
 *   );
 * }
 * ```
 */
export declare function useDocumentStructure(document: File | Uint8Array | null, wasmBasePath?: string): UseDocumentStructureResult;
//# sourceMappingURL=react.d.ts.map