import { iconsMap } from '../../icons/index.js';
import { InferComponentProps } from '../../types.js';
import { DetailedHTMLProps, HTMLAttributes } from 'react';
declare const sizeMap: {
    small: string;
    medium: string;
    large: string;
};
export type SizeMapType = keyof typeof sizeMap | number;
export type IconProps = DetailedHTMLProps<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement> & {
    /** Any of our custom SVG icons, or see https://marella.me/material-symbols/demo/ for full list of available symbols. */
    name: string;
    className?: string;
    /** Toggles to the filled outlines version of the icon, if applicable */
    isFilled?: boolean;
    /** Had 3 default sizes 'small, 'medium', 'large', and any number value, ie: 50 */
    size?: SizeMapType;
};
export declare const getIconSize: (size: SizeMapType) => string | number;
type CustomIconComponent = (typeof iconsMap)[keyof typeof iconsMap];
type CustomIconProps = InferComponentProps<CustomIconComponent>;
export declare const CustomIcon: ({ name, className, size, Component, ...rest }: CustomIconProps & {
    size?: SizeMapType;
    Component?: CustomIconComponent;
}) => import("react/jsx-runtime").JSX.Element | null;
/**
 * Icon component that handles both our existing custom SVG icons, and uses Material Symbols.
 * CustomIcon is exported separately if we ever need to use it. By default we should only need to use Icon.
 *
 * @description Adds a loading spinner with a pulsing color animation and a message.
 *
 * @returns either one of our `<svg>` custom icons, or a `<span>` Material Symbols font icon
 */
export declare const Icon: import("styled-components/dist/types.js").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").ClassAttributes<HTMLSpanElement> & HTMLAttributes<HTMLSpanElement> & {
    /** Any of our custom SVG icons, or see https://marella.me/material-symbols/demo/ for full list of available symbols. */
    name: string;
    className?: string;
    /** Toggles to the filled outlines version of the icon, if applicable */
    isFilled?: boolean;
    /** Had 3 default sizes 'small, 'medium', 'large', and any number value, ie: 50 */
    size?: SizeMapType;
}, never>> & string & Omit<({ name, className, size, isFilled, ...rest }: IconProps) => import("react/jsx-runtime").JSX.Element | null, keyof import("react").Component<any, {}, any>>;
export {};