The info icon: a 24 by 24 stroke glyph that takes its colour from the text around it.
The info icon: a 24 by 24 stroke glyph that takes its colour from the text around it.
Usage
The icon is hidden from assistive technology unless it is named: pass titleAccess (rendered as the svg's <title>) or aria-label. It sizes through size (sm, md, lg, xl) with the stylesheet of @behivetech/icons.base, which the app imports once. The default export is the same component.
Examples
Open all 2 →Properties
InfoIcon props
| Prop | Type | Default | Description |
|---|---|---|---|
className | string | — | Additional class names to merge with the component root element |
ref | Ref<SVGSVGElement> | — | Ref to the root svg element |
size | "sm" | "md" | "lg" | "xl" | — | Controls width/height; defaults to md |
titleAccess | string | — | Accessible name of the icon, rendered as the svg's `<title>`. When set the icon is exposed as an image with this name; without it (and without `aria-label` or `aria-labelledby`) the icon is decorative and hidden from assistive technology. Pass an already translated string. |
Functions
InfoIcon function
The info icon: a stroke glyph on a 24 by 24 grid that inherits the text colour.
InfoIcon(props: import("@behivetech/icons.base").IconBaseProps): import("react").ReactNode| Parameter | Type | Default | Description |
|---|---|---|---|
props | import("@behivetech/icons.base").IconBaseProps | — | — |
Returns import("react").ReactNode