import { HighlighterCore } from 'shiki/core';
import { MagicMoveRenderOptions, MagicMoveDifferOptions, KeyedTokensInfo } from './types.js';
import * as React from 'react';
import 'diff-match-patch-es';

interface ShikiMagicMoveProps {
    highlighter: HighlighterCore;
    lang: string;
    theme: string;
    code: string;
    options?: MagicMoveRenderOptions & MagicMoveDifferOptions;
    onStart?: () => void;
    onEnd?: () => void;
    className?: string;
    tabindex?: number;
}
declare function ShikiMagicMove(props: ShikiMagicMoveProps): React.JSX.Element;

interface ShikiMagicMovePrecompiledProps {
    steps: KeyedTokensInfo[];
    step?: number;
    animate?: boolean;
    options?: MagicMoveRenderOptions & MagicMoveDifferOptions;
    onStart?: () => void;
    onEnd?: () => void;
}
/**
 * Component to render a compiled magic move step,
 * Where the tokens can be generated on build time.
 */
declare function ShikiMagicMovePrecompiled({ steps, step, animate, options, onStart, onEnd, }: ShikiMagicMovePrecompiledProps): React.JSX.Element;

interface ShikiMagicMoveRendererProps {
    animate?: boolean;
    tokens: KeyedTokensInfo;
    previous?: KeyedTokensInfo;
    options?: MagicMoveRenderOptions;
    onStart?: () => void;
    onEnd?: () => void;
    className?: string;
    style?: React.CSSProperties;
}
/**
 * A wrapper component to `MagicMoveRenderer`
 */
declare function ShikiMagicMoveRenderer({ animate, tokens, previous, options, onStart, onEnd, className, style, }: ShikiMagicMoveRendererProps): React.JSX.Element;

export { ShikiMagicMove, ShikiMagicMovePrecompiled, ShikiMagicMoveRenderer };