import React, { MutableRefObject } from 'react';

declare type BrightnessContrastOptions = {
    brightness: number;
    contrast: number;
};

declare type Vec2 = [number, number];
declare type CurvesOptions = {
    red: Vec2[];
    green?: Vec2[];
    blue?: Vec2[];
};

declare type DenoiseOptions = {
    exponent: number;
};

declare type HueSaturationOptions = {
    hue: number;
    saturation: number;
};

declare type NoiseOptions = {
    amount: number;
};

declare type SepiaOptions = {
    amount: number;
};

declare type SwirlOptions = {
    radius: number;
    angle: number;
    center: [number, number];
};

declare type VibranceOptions = {
    amount: number;
};

declare type EffectProps = {
    brightnessContrast?: BrightnessContrastOptions;
    denoise?: DenoiseOptions;
    noise?: NoiseOptions;
    hueSaturation?: HueSaturationOptions;
    vibrance?: VibranceOptions;
    sepia?: SepiaOptions;
    swirl?: SwirlOptions;
    curves?: CurvesOptions;
};
declare function applyEffects(image: TexImageSource, effects?: EffectProps[]): HTMLCanvasElement;
declare type CanvasProps = {
    width: number;
    height: number;
    image: TexImageSource;
    innerRef: MutableRefObject<HTMLCanvasElement | undefined>;
    effects?: EffectProps[];
    onClick?: () => void;
    onChange?: () => void;
};
declare const Canvas: React.FC<CanvasProps>;

export { Canvas, applyEffects };