export interface TourSelectors {
    sidebar?: string;
    tabText?: string;
    tabLayouts?: string;
    tabTables?: string;
    tabImages?: string;
    tabPlaceholders?: string;
    tabStyles?: string;
    textElementsList?: string;
    layoutPresetsList?: string;
    tablesSchemaList?: string;
    tableDragHandle?: string;
    tableColumnsToggle?: string;
    customTableBuilder?: string;
    imageElementsList?: string;
    placeholderSearch?: string;
    placeholderItemsList?: string;
    styleControlsPanel?: string;
}
export type BlockType = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'title' | 'subtitle' | 'p' | 'caption' | 'table' | 'image' | 'layout';
export interface TextStyle {
    fontSize: string;
    fontWeight: string;
    color: string;
    backgroundColor: string;
    textAlign: 'left' | 'center' | 'right' | 'justify';
    bold: boolean;
    italic: boolean;
    underline: boolean;
    strikethrough: boolean;
    width?: string;
    height?: string;
    marginBottom?: string;
    padding?: string;
    minHeight?: string;
    sameRow?: boolean;
    customCss?: string;
    objectFit?: 'contain' | 'cover' | 'fill' | 'none';
    opacity?: string;
    borderColor?: string;
    borderStyle?: 'none' | 'solid' | 'dashed' | 'dotted';
    borderWidth?: string;
    borderRadius?: string;
    gap?: string;
    [key: string]: any;
}
export interface TableColumn {
    columnName: string;
    placeholder: string;
    enabled?: boolean;
    loop?: boolean;
    columns?: TableColumn[];
    colspan?: number;
}
export interface TableSchemaInfo {
    tableName: string;
    columns: TableColumn[];
    loop: boolean;
    isNestable: boolean;
    parentPath: string;
    maxNestingDepth: number;
    nestingPrefix: string;
    showNestingLevel: boolean;
    loopStartTag?: string;
    loopEndTag?: string;
    loopType?: 'jinja' | 'handlebars' | 'smarty' | 'freemarker' | 'scriban' | 'custom' | string;
    mockRows?: any[];
}
export interface ImageInfo {
    imageType: 'logo' | 'banner' | 'barcode' | 'watermark';
    url?: string;
    barcodeValue?: string;
    barcodePlaceholder?: string;
}
export interface LayoutColumnData {
    id: string;
    width?: string;
    style?: Partial<TextStyle>;
    blocks: CanvasBlock[];
}
export interface LayoutInfo {
    columnsCount: number;
    columns: LayoutColumnData[];
    gap?: string;
}
export interface CanvasBlock {
    id: string;
    type: BlockType;
    content: string;
    style: TextStyle;
    tableInfo?: TableSchemaInfo;
    imageInfo?: ImageInfo;
    layoutInfo?: LayoutInfo;
}
export interface PlaceholderItem {
    label: string;
    placeholder: string;
    category?: string;
}
export interface DummyData {
    /** Map of placeholder keys to real values, e.g. { customerName: 'John Doe', orderId: 'ORD-9982' } */
    placeholders?: Record<string, string | number>;
    /** Map of table names/keys to array of row objects, e.g. { package: [{ packageNo: 'PKG-001', weight: '2.5kg' }] } */
    tables?: Record<string, Record<string, any>[]>;
    /** Map of image types or keys to image URLs or barcode values, e.g. { logo: 'https://...', barcode: 'SHIP-99201' } */
    images?: Record<string, string>;
    /** Fallback top-level properties directly accessible by key */
    [key: string]: any;
}
export interface HtmlEditorProps {
    tableSchemas?: TableSchemaInfo[];
    placeholders?: PlaceholderItem[];
    defaultLogo?: string;
    defaultBanner?: string;
    headerTitle?: string;
    headerSubtitle?: string;
    headerLogo?: React.ReactNode;
    typographySizes?: Array<{
        label: string;
        value: string;
    }>;
    typographyWeights?: Array<{
        label: string;
        value: string;
    }>;
    typographyFonts?: Array<{
        label: string;
        value: string;
    }>;
    templatingLanguage?: 'js' | 'ts' | 'handlebars' | 'liquid' | 'scriban' | 'dotnet' | 'csharp' | 'custom';
    loopSyntax?: 'each' | 'foreach';
    onChange?: (blocks: CanvasBlock[]) => void;
    onExport?: (html: string) => void;
    onExportPdf?: (html: string) => void;
    /** Callback prop to receive or retrieve the latest compiled template HTML code on demand / changes */
    getHTMLOutput?: (html: string) => void;
    initialBlocks?: CanvasBlock[];
    defaultStyles?: Record<string, Partial<TextStyle>>;
    showImportHtml?: boolean;
    showImportPdf?: boolean;
    showClearCanvas?: boolean;
    showPreview?: boolean;
    showExport?: boolean;
    showExportPdf?: boolean;
    /** Controls visibility of the View Dummy Data button (defaults to true if dummyData is passed) */
    showDummyDataPreview?: boolean;
    /** Dummy data object containing placeholders, tables array, and images for populated live previewing */
    dummyData?: DummyData;
    /** Callback fired when user toggles/clicks the View Dummy Data preview button */
    onToggleDummyDataPreview?: (isApplied: boolean) => void;
    /** Controls the position of the sidebar panel ('left' | 'right'). Defaults to 'left'. */
    sidebarPosition?: 'left' | 'right';
    /** Controls the position of the vertical tab navigation strip inside the sidebar relative to the tab content ('left' | 'right'). Defaults to 'left'. */
    tabNavigationPosition?: 'left' | 'right';
    tabsPosition?: 'left' | 'right';
    /** Primary theme color for the editor UI (defaults to '#ea580c' / orange). Supports any valid CSS color hex, rgb, or color name (e.g. '#3b82f6', '#10b981', 'purple'). */
    themeColor?: string;
    /** Alias for themeColor */
    primaryColor?: string;
    /** Show or hide top header bar (defaults to true) */
    showHeader?: boolean;
    /** Controls skeleton loading state in Tables tab */
    isTablesLoading?: boolean;
    tablesLoading?: boolean;
    /** Controls skeleton loading state in Placeholders tab */
    isPlaceholdersLoading?: boolean;
    placeholdersLoading?: boolean;
    /** Allows passing custom CSS inline style properties dynamically to any of the header actions (importHtml, importPdf, clearCanvas, preview, export, exportPdf, dummyDataPreview) */
    customButtonStyles?: Record<string, React.CSSProperties>;
    /** Allows passing custom CSS class names dynamically to customize/override button class sheets for header actions */
    customButtonClassNames?: Record<string, string>;
    /** Allows passing completely custom React components or labels for header actions. Receives an onClick prop to trigger the action. */
    customActionComponents?: {
        importHtml?: (props: {
            onClick: () => void;
        }) => React.ReactNode;
        importPdf?: (props: {
            onClick: () => void;
        }) => React.ReactNode;
        preview?: (props: {
            onClick: () => void;
        }) => React.ReactNode;
        exportPdf?: (props: {
            onClick: () => void;
        }) => React.ReactNode;
        export?: (props: {
            onClick: () => void;
        }) => React.ReactNode;
        dummyDataPreview?: (props: {
            onClick: () => void;
            isApplied: boolean;
        }) => React.ReactNode;
    };
    /** Optional custom data-tour attribute selectors passed from parent project for onboarding tutorials */
    tourSelectors?: TourSelectors;
    /** Forcefully loads / parses the provided raw HTML template string in the editor */
    importedHtml?: string;
}