import * as React from "react"; import type { BaseProps } from "./~utils.js"; interface IconProps extends Omit, "children"> { /** * URL of the `.svg` file (e.g. from `@stratakit/icons`). * * The URL can contain a hash pointing to a specific symbol within the SVG (e.g. `#icon`, `#icon-large`). * By default, the `#icon` symbol is used if no hash is provided. * * Note: The `.svg` must be an external HTTP resource for it to be processed by * the `` element. As a fallback, JS will be used to `fetch` the SVG from * non-supported URLs; the fetched SVG content will be sanitized using the * `unstable_htmlSanitizer` function passed to ``. */ href?: string; /** * Size of the icon. This only affects the icon's physical dimensions (not the SVG contents). * * Defaults to `"regular"` (16px) and can be optionally set to `"large"` (24px). */ size?: "regular" | "large"; /** * Alternative text describing the icon. * * When this prop is passed, the SVG gets rendered as `role="img"` and labelled * using the provided text. * * This prop is not required if the icon is purely decorative. By default, the icon * will be hidden from the accessibility tree. */ alt?: string; } /** * Icon component that provides fill and sizing to the SVGs from `@stratakit/icons`. * * ```tsx * const arrowIcon = new URL("@stratakit/icons/arrow.svg", import.meta.url).href; * * ``` * * The `href` can point to a specific symbol (e.g. `#icon`, `#icon-large`) within the SVG file: * * ```tsx * * ``` * * It also accepts a custom SVG, via the `render `prop: * * ```tsx * } /> * ``` * * By default, this component assumes that the icon is decorative, so it adds `aria-hidden` by default. * * If the icon is semantically meaningful, the `alt` prop can be used to provide alternative text. * * ```tsx * * ``` */ export declare const Icon: React.ForwardRefExoticComponent>; export {};