import { HintDesignerData, HintDesignerSettings, StringPair } from "./hint-designer-models";
/**
 * GVE Hint Designer Web Component.
 * A minimalist editing environment to design hints and test their animations.
 */
export declare class GveHintDesigner extends HTMLElement {
    private _data;
    private _settings;
    private _hintId?;
    private _hintVariables;
    private _logger;
    private _shadow;
    private _svgDisplay?;
    private _messagePanel?;
    private _zoomLevel;
    private _panX;
    private _panY;
    private _isPanning;
    private _lastPanX;
    private _lastPanY;
    private _svgTextarea?;
    private _jsTextarea?;
    private _svgHighlightContainer?;
    private _jsHighlightContainer?;
    private _hintsDropdown?;
    private _svgWordWrapEnabled;
    private _jsWordWrapEnabled;
    private _animationsDropdown?;
    private _embeddedJsCheckbox?;
    private _newAnimationCheckbox?;
    private _positionSelect?;
    private _offsetXInput?;
    private _offsetYInput?;
    private _scaleXInput?;
    private _scaleYInput?;
    private _rotationInput?;
    private _solidCheckbox?;
    private _displacedRefSpanInput?;
    private _variablesTable?;
    private _playButton?;
    private _pauseButton?;
    private _restartButton?;
    private _progressBar?;
    private _variablesValidationMsg?;
    private _variablesPanelHeader?;
    private _currentTimeline?;
    private _isPlaying;
    private _progressUpdateInterval?;
    constructor();
    /**
     * Called when component is added to the DOM.
     */
    connectedCallback(): void;
    /**
     * Called when component is removed from the DOM.
     */
    disconnectedCallback(): void;
    /**
     * Data property (bindable).
     */
    get data(): HintDesignerData;
    set data(value: HintDesignerData);
    /**
     * Settings property (bindable).
     */
    get settings(): HintDesignerSettings;
    set settings(value: HintDesignerSettings);
    /**
     * Hint ID property (bindable).
     */
    get hintId(): string | undefined;
    set hintId(value: string | undefined);
    /**
     * Hint variables property (bindable).
     */
    get hintVariables(): StringPair[];
    set hintVariables(value: StringPair[]);
    /**
     * Render the component UI.
     */
    private render;
    /**
     * Create the toolbar.
     */
    private createToolbar;
    /**
     * Create the SVG display panel.
     */
    private createSvgDisplay;
    /**
     * Add grid and rulers to the SVG display as background.
     */
    private addGridAndRulers;
    /**
     * Create the timeline player.
     */
    private createTimelinePlayer;
    /**
     * Create the message panel.
     */
    private createMessagePanel;
    /**
     * Create the hint properties editor.
     */
    private createHintPropertiesEditor;
    /**
     * Create the hint variables list.
     */
    private createHintVariablesList;
    /**
     * Create a button element with a Feather icon.
     */
    private createButton;
    /**
     * Create an input element.
     */
    private createInput;
    /**
     * Create a form row with label and control.
     */
    private createFormRow;
    /**
     * Create position select dropdown.
     */
    private createPositionSelect;
    /**
     * Make a splitter resizable between two panels.
     * @param panelAbove The panel above the splitter
     * @param _panelBelow The panel below the splitter (unused but kept for API clarity)
     * @param splitter The splitter element between them
     */
    private makeResizable;
    /**
     * Initialize event listeners.
     */
    private initializeEventListeners;
    /**
     * Initialize panning with mouse drag.
     */
    private initializePanning;
    /**
     * Initialize zooming with mouse wheel.
     */
    private initializeWheelZoom;
    /**
     * Add click listener to a button by ID.
     */
    private addClickListener;
    /**
     * Cleanup resources.
     */
    private cleanup;
    /**
     * Refresh the entire UI.
     */
    private refreshUI;
    /**
     * Refresh the hints dropdown.
     */
    private refreshHintsDropdown;
    /**
     * Refresh the animations dropdown.
     */
    private refreshAnimationsDropdown;
    /**
     * Load a hint for editing.
     */
    private loadHint;
    /**
     * Clear the hint form.
     */
    private clearHintForm;
    /**
     * Validate SVG code for well-formedness and structure.
     * Returns an error message if validation fails, or null if valid.
     */
    private validateSvgCode;
    /**
     * Add a new hint.
     */
    private addHint;
    /**
     * Save the current hint.
     */
    private saveHint;
    /**
     * Delete the current hint.
     */
    private deleteHint;
    /**
     * Parse offset value (number or string with suffix).
     */
    private parseOffset;
    /**
     * Refresh the SVG display.
     */
    private refreshSvgDisplay;
    /**
     * Resolve variables in SVG code.
     */
    private resolveVariables;
    /**
     * Extract variable names from SVG code (variables in {{...}} placeholders).
     */
    private extractVariablesFromSvg;
    /**
     * Validate SVG variables and update validation message.
     * Shows a warning if any variables used in SVG are not defined in hint variables.
     */
    private validateSvgVariables;
    /**
     * Update warning icon in variables panel header.
     */
    private updateVariablesHeaderWarning;
    /**
     * Play animation.
     */
    private playAnimation;
    /**
     * Create the GSAP timeline for the current hint.
     */
    private createTimeline;
    /**
     * Pause animation.
     */
    private pauseAnimation;
    /**
     * Restart animation.
     */
    private restartAnimation;
    /**
     * Seek animation (timeline scrubbing).
     */
    private seekAnimation;
    /**
     * Start updating progress bar.
     */
    private startProgressUpdate;
    /**
     * Stop updating progress bar.
     */
    private stopProgressUpdate;
    /**
     * Zoom in.
     */
    private zoomIn;
    /**
     * Zoom out.
     */
    private zoomOut;
    /**
     * Reset zoom.
     */
    private resetZoom;
    /**
     * Update SVG transform based on zoom and pan.
     */
    private updateSvgTransform;
    /**
     * Size to fit the SVG content.
     */
    private sizeToFit;
    /**
     * Toggle word wrap for SVG textarea.
     */
    private toggleSvgWordWrap;
    /**
     * Toggle word wrap for JS textarea.
     */
    private toggleJsWordWrap;
    /**
     * Save data to file.
     */
    private saveData;
    /**
     * Load data from file.
     */
    private loadData;
    /**
     * Clear all data.
     */
    private clearData;
    /**
     * Load animation code from catalog.
     */
    private loadAnimationCode;
    /**
     * Add a new variable.
     */
    private addVariable;
    /**
     * Delete a variable.
     */
    private deleteVariable;
    /**
     * Edit a variable.
     */
    private editVariable;
    /**
     * Delete all variables.
     */
    private deleteAllVariables;
    /**
     * Extract all variable names from all hints in data.
     * Returns a sorted array of unique variable names.
     */
    private extractAllVariablesFromHints;
    /**
     * Populate hint variables from all hints.
     * Extracts all variables from all hints' SVG code and merges them into hintVariables.
     * Only adds variables that don't already exist.
     */
    private populateVariablesFromHints;
    /**
     * Refresh the variables table.
     */
    private refreshVariablesTable;
    /**
     * Show a message in the message panel.
     */
    private showMessage;
    /**
     * Apply syntax highlighting to SVG textarea.
     */
    private highlightSvg;
    /**
     * Apply syntax highlighting to JS textarea.
     */
    private highlightJs;
    /**
     * Sync scroll position for SVG textarea and highlight container.
     */
    private syncSvgScroll;
    /**
     * Sync scroll position for JS textarea and highlight container.
     */
    private syncJsScroll;
    /**
     * Fire a custom event.
     */
    private fireEvent;
    /**
     * Get component styles.
     */
    private getStyles;
}
