vite-awesome-svg-loader/vue-integration/index.d.ts

Imports SVGs as source code, base64 and data URI. Preserves stroke width, replaces colors with currentColor or custom colors. Optimizes SVGs with SVGO. Creates SVG sprites.

import { ComponentOptionsMixin } from 'vue';
import { ComponentProvideOptions } from 'vue';
import { DefineComponent } from 'vue';
import { PublicProps } from 'vue';

export declare const SvgIcon: DefineComponent<SvgIconProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<SvgIconProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, HTMLSpanElement>;

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

    /**
     * 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 const SvgImage: DefineComponent<SvgImageProps, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<SvgImageProps> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, false, {}, any>;

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

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

export { }