import { AllHTMLAttributes } from 'react';
import { JSX as JSX_2 } from 'react/jsx-runtime';
import { SVGAttributes } from 'react';

export declare function SvgIcon({ src, size, color, colorTransition, ...attrs }: SvgIconProps): JSX_2.Element;

export declare interface SvgIconProps extends SvgIconProps_2, Omit<AllHTMLAttributes<HTMLSpanElement>, "size" | "src"> {
}

/**
 * Props of `<SvgIcon>` component
 */
declare interface SvgIconProps_2 {

    /**
     * Svg source, i.e. result of `import "/my/icon.svg"`
     */
    src: string;

    /**
     * Icon size.
     *
     * Should be a valid CSS unit value or a variable, i.e. `10px`, `0.1em`, `var(--icon-size)`.
     *
     * If `undefined` is passed, size won't be changed.
     *
     * @default undefined
     */
    size?: string;

    /**
     * Icon color.
     *
     * Should be a valid CSS color value or a variable, i.e. `#ff0000`, `red`, `var(--icon-color)`.
     *
     * If `undefined` is passed, color won't be changed.
     *
     * @default undefined
     */
    color?: string;

    /**
     * Icon color transition. Should contain only timing and easing functions.
     *
     * For example, if you want to set `transition: color 0.3s ease-out;`, you should pass only `0.3s ease-out`.
     *
     * @default "0.3s linear"
     */
    colorTransition?: string;
}

export declare function SvgImage({ src, useElAttrs, ...attrs }: SvgImageProps): JSX_2.Element;

export declare interface SvgImageProps extends SVGAttributes<SVGElement>, SvgImageProps_2 {
}

/**
 * Props of `<SvgImage>` component
 */
declare interface SvgImageProps_2 {
    /**
     * SVG image source code
     */
    src: string;

    /**
     * Attributes of `<use>` element
     */
    useElAttrs?: Record<string, any>;
}

export { }