Icon: Icons - Svizzle

We need to pass the `glyph` prop (a Svelte component that renders SVG tags) to `Icon`.

We provide Feather icons glyphs (https://feathericons.com/) in `@svizzle/ui`, where component names are camel cased Feather ids: e.g. `alert-triangle` => `AlertTriangle`.

Later on we might provide more icon collections. Or of course you can use your own glyphs!

To style an icon, use `fill`, `stroke` (strings) and `strokeWidth` (a number).

To size the icon, use `size` (a number).

`Icon` exports there readonly props: `defaultFill = "none"`, `defaultSize = 24`, `defaultStroke = "currentColor"`, `defaultStrokeWidth = 2`.

Choose an example

Usage

<script>
  import {Icon, Settings} from '@svizzle/ui';
</script>

<Icon glyph={Settings} />

Props

`glyph`

▶ { render: ƒ ,$$render: ƒ }

render: ƒ (props = {}, { $$slots = {}, context = new Map()
$$render: ƒ $$render(result, props, bindings, slots, context)