/**
 * WaveformRenderer - Framework-agnostic waveform visualization module
 *
 * Provides pure functions and classes for rendering waveforms to canvas.
 * Works with any framework (Astro, React, Vue, vanilla JS) and supports
 * multiple visualization styles including peaks, bars, and spectrograms.
 *
 * @module WaveformRenderer
 * @author PlecoXA Audio Analysis
 */
/**
 * Waveform rendering configuration
 * @typedef {Object} WaveformRenderOptions
 * @property {string} [style='peaks'] - Rendering style: 'peaks', 'bars', 'line', 'filled'
 * @property {string} [color='#3498db'] - Primary color
 * @property {string} [backgroundColor='transparent'] - Background color
 * @property {number} [lineWidth=1] - Line width for line-style rendering
 * @property {boolean} [mirror=true] - Mirror waveform vertically
 * @property {number} [gap=0] - Gap between bars (for bar style)
 * @property {Object} [gradient=null] - Gradient configuration
 * @property {boolean} [responsive=true] - Auto-resize with canvas
 * @property {number} [pixelRatio=window.devicePixelRatio] - Pixel ratio for HiDPI
 */
/**
 * Loop region configuration
 * @typedef {Object} LoopRegion
 * @property {number} start - Start time in seconds
 * @property {number} end - End time in seconds
 * @property {string} [color='rgba(255,255,0,0.3)'] - Region color
 * @property {string} [borderColor='#ffff00'] - Border color
 * @property {number} [borderWidth=2] - Border width
 */
/**
 * Renders waveform data to a canvas element
 *
 * @param {HTMLCanvasElement} canvas - Target canvas element
 * @param {Float32Array} waveformData - Waveform peak data
 * @param {WaveformRenderOptions} [options={}] - Rendering options
 *
 * @example
 * ```javascript
 * import { renderWaveform } from './WaveformRenderer.js';
 * import { getWaveformPeaks } from './analysis/WaveformData.ts';
 *
 * const canvas = document.getElementById('waveform');
 * const peaks = getWaveformPeaks(audioBuffer, { width: canvas.width });
 *
 * renderWaveform(canvas, peaks.data, {
 *   style: 'filled',
 *   color: '#e74c3c',
 *   mirror: true
 * });
 * ```
 */
export function renderWaveform(canvas: HTMLCanvasElement, waveformData: Float32Array, options?: WaveformRenderOptions): void;
/**
 * Renders stereo waveform with separate channels
 *
 * @param {HTMLCanvasElement} canvas - Target canvas element
 * @param {Object} stereoData - Stereo waveform data with left and right properties
 * @param {WaveformRenderOptions} [options={}] - Rendering options
 *
 * @example
 * ```javascript
 * import { renderStereoWaveform } from './WaveformRenderer.js';
 *
 * renderStereoWaveform(canvas, stereoWaveformData, {
 *   leftColor: '#e74c3c',
 *   rightColor: '#3498db',
 *   style: 'filled'
 * });
 * ```
 */
export function renderStereoWaveform(canvas: HTMLCanvasElement, stereoData: any, options?: WaveformRenderOptions): void;
/**
 * Adds loop region overlays to existing waveform
 *
 * @param {HTMLCanvasElement} canvas - Canvas with existing waveform
 * @param {LoopRegion[]} loops - Array of loop regions to render
 * @param {number} duration - Total audio duration in seconds
 *
 * @example
 * ```javascript
 * import { addLoopRegions } from './WaveformRenderer.js';
 *
 * addLoopRegions(canvas, [
 *   { start: 1.5, end: 3.2, color: 'rgba(255,255,0,0.3)' },
 *   { start: 4.0, end: 6.5, color: 'rgba(0,255,0,0.3)' }
 * ], audioBuffer.duration);
 * ```
 */
export function addLoopRegions(canvas: HTMLCanvasElement, loops: LoopRegion[], duration: number): void;
/**
 * Creates an interactive waveform renderer with events
 *
 * @param {HTMLCanvasElement} canvas - Target canvas element
 * @param {Object} [options={}] - Renderer configuration
 * @returns {Object} Interactive renderer instance
 *
 * @example
 * ```javascript
 * import { createInteractiveRenderer } from './WaveformRenderer.js';
 *
 * const renderer = createInteractiveRenderer(canvas, {
 *   enableSelection: true,
 *   enableZoom: true
 * });
 *
 * renderer.on('select', (start, end) => {
 *   console.log(`Selected: ${start}s - ${end}s`);
 * });
 *
 * renderer.render(waveformData);
 * ```
 */
export function createInteractiveRenderer(canvas: HTMLCanvasElement, options?: any): any;
/**
 * WaveformRenderer - Framework-agnostic waveform visualization module
 *
 * Provides pure functions and classes for rendering waveforms to canvas.
 * Works with any framework (Astro, React, Vue, vanilla JS) and supports
 * multiple visualization styles including peaks, bars, and spectrograms.
 *
 * @module WaveformRenderer
 * @author PlecoXA Audio Analysis
 */
/**
 * Waveform rendering configuration
 * @typedef {Object} WaveformRenderOptions
 * @property {string} [style='peaks'] - Rendering style: 'peaks', 'bars', 'line', 'filled'
 * @property {string} [color='#3498db'] - Primary color
 * @property {string} [backgroundColor='transparent'] - Background color
 * @property {number} [lineWidth=1] - Line width for line-style rendering
 * @property {boolean} [mirror=true] - Mirror waveform vertically
 * @property {number} [gap=0] - Gap between bars (for bar style)
 * @property {Object} [gradient=null] - Gradient configuration
 * @property {boolean} [responsive=true] - Auto-resize with canvas
 * @property {number} [pixelRatio=window.devicePixelRatio] - Pixel ratio for HiDPI
 */
/**
 * Loop region configuration
 * @typedef {Object} LoopRegion
 * @property {number} start - Start time in seconds
 * @property {number} end - End time in seconds
 * @property {string} [color='rgba(255,255,0,0.3)'] - Region color
 * @property {string} [borderColor='#ffff00'] - Border color
 * @property {number} [borderWidth=2] - Border width
 */
/**
 * Renders waveform data to a canvas element
 *
 * @param {HTMLCanvasElement} canvas - Target canvas element
 * @param {Float32Array} waveformData - Waveform peak data
 * @param {WaveformRenderOptions} [options={}] - Rendering options
 *
 * @example
 * ```javascript
 * import { renderWaveform } from './WaveformRenderer.js';
 * import { getWaveformPeaks } from './analysis/WaveformData.ts';
 *
 * const canvas = document.getElementById('waveform');
 * const peaks = getWaveformPeaks(audioBuffer, { width: canvas.width });
 *
 * renderWaveform(canvas, peaks.data, {
 *   style: 'filled',
 *   color: '#e74c3c',
 *   mirror: true
 * });
 * ```
 */
export function WaveformRenderer(canvas: HTMLCanvasElement, waveformData: Float32Array, options?: WaveformRenderOptions): void;
/**
 * Waveform rendering configuration
 */
export type WaveformRenderOptions = {
    /**
     * - Rendering style: 'peaks', 'bars', 'line', 'filled'
     */
    style?: string;
    /**
     * - Primary color
     */
    color?: string;
    /**
     * - Background color
     */
    backgroundColor?: string;
    /**
     * - Line width for line-style rendering
     */
    lineWidth?: number;
    /**
     * - Mirror waveform vertically
     */
    mirror?: boolean;
    /**
     * - Gap between bars (for bar style)
     */
    gap?: number;
    /**
     * - Gradient configuration
     */
    gradient?: any;
    /**
     * - Auto-resize with canvas
     */
    responsive?: boolean;
    /**
     * - Pixel ratio for HiDPI
     */
    pixelRatio?: number;
};
/**
 * Loop region configuration
 */
export type LoopRegion = {
    /**
     * - Start time in seconds
     */
    start: number;
    /**
     * - End time in seconds
     */
    end: number;
    /**
     * - Region color
     */
    color?: string;
    /**
     * - Border color
     */
    borderColor?: string;
    /**
     * - Border width
     */
    borderWidth?: number;
};