svelte-grommet-icons

Grommet SVG icons as Svelte components

Usage no npm install needed!

<script type="module">
  import svelteGrommetIcons from 'https://cdn.skypack.dev/svelte-grommet-icons';
</script>

README

svelte-grommet-icons

NPM

Grommet SVG icons as Svelte components.

Try it in the Svelte REPL.

Installation

Yarn

yarn add -D svelte-grommet-icons

NPM

npm i -D svelte-grommet-icons

pnpm

pnpm i -D svelte-grommet-icons

Usage

Basic

<script>
  import { Analytics, Camera, DocumentImage } from "svelte-grommet-icons";
</script>

<Analytics />
<Camera />
<DocumentImage />

Refer to ICON_INDEX.md for a list of supported icons.

Direct import

Use the direct import for faster compiling during development.

Note: even if using base imports, unused imports are still tree shakeable by application bundlers like Rollup or webpack.

<script>
  import Add from "svelte-grommet-icons/lib/Add.svelte";
</script>

Using svelte:component

<script>
  import * as icons from "svelte-grommet-icons";
</script>

{#each Object.entries(icons) as [icon, component]}
  <div>
    <svelte:component this={component} />
    {icon}
  </div>
{/each}

TypeScript

Svelte version 3.31 or greater is required to use this library with TypeScript.

Changelog

License

MIT