import { FRoot } from "../../mixins/components/f-root/f-root";
export type FIconState = "default" | "secondary" | "subtle" | "primary" | "success" | "danger" | "warning" | "neutral" | "inherit" | `custom, ${string}`;
export declare class FIcon extends FRoot {
    /**
     * css loaded from scss file
     */
    static styles: import("lit").CSSResult[];
    /**
     * @attribute local state for managing custom fill.
     */
    fill?: string;
    private _source;
    /**
     * @attribute The small size is the default.
     */
    size?: "x-large" | "large" | "medium" | "small" | "x-small" | "xx-small";
    /**
     * @attribute The state of an Icon helps in indicating the degree of emphasis. The Icon component inherits the state from the parent component. By default it is subtle.
     */
    state?: FIconState;
    /**
     * @attribute Source property defines what will be displayed on the icon. For icon variant It can take the icon name from a library , any inline SVG or any URL for the image. For emoji, it takes emoji as inline text.
     */
    get source(): string;
    set source(value: string);
    /**
     * @attribute The disabled attribute can be set to keep a user from clicking on the f-icon.
     */
    disabled?: boolean;
    /**
     * @attribute display loader
     */
    loading?: boolean;
    /**
     * @attribute is clickable
     */
    clickable?: boolean;
    /**
     * @attribute is given source is url
     */
    url?: boolean;
    readonly required: string[];
    /**
     * validation for all atrributes
     */
    validateProperties(): void;
    /**
     * apply inline styles to shadow-dom for custom fill.
     */
    applyStyles(): string;
    computeSource(value: string): void;
    render(): import("lit-html").TemplateResult<1>;
}
/**
 * Required for typescript
 */
declare global {
    interface HTMLElementTagNameMap {
        "f-icon": FIcon;
    }
}
