Icon.svelte

A text-sized Svg icon: 1em square, inline with the text around it, and never squeezed by a flex container. A bare Svg is sized var(--font_size, auto) — text-sized only where fuz_css sets --font_size (headings, font_size_* classes), else auto — and fuz_css displays svg as a block capped at max-width: 100%, so beside text it can render huge, on its own line, or 0px wide in a shrinking button. Use Svg directly only with an explicit size.

view source

Declarations
#

Icon
#

Icon.svelte view source

accepts children

import Icon from '@fuzdev/zzz/Icon.svelte';

size?

Sets both the width and height of the svg. Overridden by the width and height props.

type string
optional default '1em'

inline?

Renders the SVG as an inline block with spacing appropriate for text. Defaults to false.

type boolean
optional default true

shrink?

type boolean
optional default false

style?

type string | null
optional

external types

ComponentProps<typeof Svg>

Imported by
#