@papernote/ui/dist/components/Spreadsheet.d.ts

A modern React component library with a paper notebook aesthetic - minimal, professional, and expressive

import React from 'react';
import { CellBase, Matrix } from 'react-spreadsheet';
import './Spreadsheet.css';
export type { CellBase, Matrix } from 'react-spreadsheet';
/**
 * Enhanced cell type with formula support
 */
export interface SpreadsheetCell extends CellBase {
    value: string | number | boolean;
    formula?: string;
    readOnly?: boolean;
    className?: string;
}
/**
 * Spreadsheet component props
 */
export interface SpreadsheetProps {
    /** Initial data matrix */
    data?: Matrix<SpreadsheetCell>;
    /** Callback when data changes */
    onChange?: (data: Matrix<SpreadsheetCell>) => void;
    /** Number of rows to display */
    rows?: number;
    /** Number of columns to display */
    columns?: number;
    /** Column labels (A, B, C... if not provided) */
    columnLabels?: string[];
    /** Row labels (1, 2, 3... if not provided) */
    rowLabels?: string[];
    /** Show toolbar with actions */
    showToolbar?: boolean;
    /**
     * Enable Excel import
     * @deprecated Excel import has been disabled due to security vulnerabilities in the xlsx library.
     * This prop is kept for API compatibility but has no effect.
     */
    enableImport?: boolean;
    /** Enable Excel export */
    enableExport?: boolean;
    /** Enable save button */
    enableSave?: boolean;
    /** Save handler */
    onSave?: (data: Matrix<SpreadsheetCell>) => Promise<void> | void;
    /** Title to display in toolbar */
    title?: string;
    /** Additional toolbar actions */
    actions?: React.ReactNode;
    /** Wrap in Card component */
    wrapInCard?: boolean;
    /** Custom className for the spreadsheet container */
    className?: string;
    /** Make entire spreadsheet read-only */
    readOnly?: boolean;
    /** Default export filename */
    exportFileName?: string;
}
/**
 * Spreadsheet - Interactive spreadsheet component with formula support
 *
 * A full-featured spreadsheet component for report designers and data editing.
 * Built on react-spreadsheet with Fast Formula Parser (280+ Excel formulas).
 *
 * **Features:**
 * - Excel-like formula support (SUM, AVERAGE, VLOOKUP, IF, etc.)
 * - Excel import/export with SheetJS
 * - Save/load functionality
 * - Keyboard navigation
 * - Copy/paste support
 * - Customizable styling to match notebook-ui aesthetic
 *
 * @example
 * ```tsx
 * // Basic spreadsheet
 * <Spreadsheet
 *   rows={10}
 *   columns={5}
 *   showToolbar
 * />
 *
 * // Report designer with formulas
 * const [reportData, setReportData] = useState<Matrix<SpreadsheetCell>>([
 *   [{ value: 'Q1' }, { value: 100 }],
 *   [{ value: 'Q2' }, { value: 200 }],
 *   [{ value: 'Total' }, { formula: '=SUM(B1:B2)' }],
 * ]);
 *
 * <Spreadsheet
 *   data={reportData}
 *   onChange={setReportData}
 *   title="Sales Report"
 *   showToolbar
 *   enableImport
 *   enableExport
 *   enableSave
 *   onSave={async (data) => {
 *     await saveReport(data);
 *   }}
 * />
 *
 * // With custom actions
 * <Spreadsheet
 *   data={data}
 *   onChange={setData}
 *   showToolbar
 *   actions={
 *     <Button onClick={handleCustomAction}>Custom Action</Button>
 *   }
 * />
 * ```
 */
export declare const Spreadsheet: React.FC<SpreadsheetProps>;
/**
 * SpreadsheetReport - Pre-configured spreadsheet for report designer
 *
 * A ready-to-use spreadsheet component specifically designed for building
 * and editing reports with formulas, import/export, and save functionality.
 *
 * @example
 * ```tsx
 * const [reportData, setReportData] = useState<Matrix<SpreadsheetCell>>();
 *
 * <SpreadsheetReport
 *   data={reportData}
 *   onChange={setReportData}
 *   title="Monthly Sales Report"
 *   onSave={async (data) => {
 *     await api.saveReport(reportId, data);
 *   }}
 * />
 * ```
 */
export declare const SpreadsheetReport: React.FC<Omit<SpreadsheetProps, 'showToolbar' | 'enableImport' | 'enableExport' | 'enableSave' | 'wrapInCard'>>;
//# sourceMappingURL=Spreadsheet.d.ts.map