react-modern-gantt
Version:
A modern, customizable Gantt chart component for React applications with export functionality
88 lines (87 loc) • 1.97 kB
TypeScript
import React from "react";
import { ExportOptions, ExportFormat } from "@/types";
/**
* Props for ExportButton component
*/
export interface ExportButtonProps {
/**
* Export function to call when button is clicked.
* Signature: (filename?: string, options?: ExportOptions) => Promise<any>
*/
onExport: (filename?: string, options?: Omit<ExportOptions, "format" | "filename">) => Promise<any>;
/**
* Export format
* @default 'png'
*/
format?: ExportFormat;
/**
* Filename for export (without extension)
* @default 'gantt-chart'
*/
filename?: string;
/**
* Button label
*/
label?: string;
/**
* Button icon (emoji or component)
*/
icon?: React.ReactNode;
/**
* Custom className
*/
className?: string;
/**
* Custom styles
*/
style?: React.CSSProperties;
/**
* Disabled state
*/
disabled?: boolean;
/**
* Loading state
*/
loading?: boolean;
/**
* Additional export options
*/
exportOptions?: Omit<ExportOptions, "format" | "filename">;
/**
* Variant style
* @default 'primary'
*/
variant?: "primary" | "secondary" | "outline" | "ghost";
/**
* Size
* @default 'medium'
*/
size?: "small" | "medium" | "large";
}
/**
* ExportButton Component
* A customizable button for exporting Gantt charts
*
* @example
* ```tsx
* import { ExportButton, useGanttExport } from 'react-modern-gantt';
*
* function MyComponent() {
* const { ganttRef, exportAsPng } = useGanttExport();
*
* return (
* <>
* <GanttChart ref={ganttRef} tasks={tasks} />
* <ExportButton
* onExport={exportAsPng}
* format="png"
* label="Export PNG"
* icon="📥"
* />
* </>
* );
* }
* ```
*/
export declare const ExportButton: React.FC<ExportButtonProps>;
export default ExportButton;