/**
 * SvgIcon component to display SVG icons.
 * It supports custom SVG paths, sizes, colors, and additional props.
 * @component
 * @param {Object} props - Component properties.
 * @param {string} [props.children] - The SVG icon name or path.
 * @param {number | string} [props.size=24] - Size of the icon (default is 24).
 * @param {object} [props.sx={}] - Additional styles for the icon.
 * @param {string} [props.className=""] - Additional CSS classes for customization.
 * @param {string} [props.color="inherit"] - Color of the icon (default is "inherit").
 * @param {string} [props.assetPath="/assets/icons/"] - Path to the SVG assets.
 * @param {string} [props.id] - Optional ID for testing purposes.
 * @returns {JSX.Element} The SvgIcon component.
 * @example
 * <SvgIcon
 *   children="icon-name"
 *   size={40}
 *   sx={{ color: "primary.main" }}
 *   className="custom-icon"
 *   color="primary"
 *   assetPath="/assets/custom-icons/"
 *   id="custom-icon"
 * />
 */
interface SvgIconProps {
    children?: string;
    size?: number | string;
    sx?: object;
    className?: string;
    color?: string;
    assetPath?: string;
    id?: string;
    [key: string]: any;
}
declare const SvgIcon: import('react').ForwardRefExoticComponent<Omit<SvgIconProps, "ref"> & import('react').RefAttributes<SVGSVGElement>>;
export default SvgIcon;
