https://github.com/metonym/svelte-super-tiny-icons
Super Tiny Icons as Svelte components
https://github.com/metonym/svelte-super-tiny-icons
super-tiny-icons svelte-components svg-icon svg-to-svelte
Last synced: 3 months ago
JSON representation
Super Tiny Icons as Svelte components
- Host: GitHub
- URL: https://github.com/metonym/svelte-super-tiny-icons
- Owner: metonym
- License: mit
- Created: 2020-08-25T23:13:27.000Z (almost 5 years ago)
- Default Branch: master
- Last Pushed: 2021-07-30T12:58:44.000Z (almost 4 years ago)
- Last Synced: 2025-03-17T15:56:06.221Z (3 months ago)
- Topics: super-tiny-icons, svelte-components, svg-icon, svg-to-svelte
- Language: JavaScript
- Homepage: https://metonym.github.io/svelte-super-tiny-icons/
- Size: 698 KB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# svelte-super-tiny-icons
[![NPM][npm]][npm-url]
> [Super Tiny Icons](https://github.com/edent/SuperTinyIcons) as Svelte components.
Try it in the [Svelte REPL](https://svelte.dev/repl/8562c4d563724c85a7940a57499c5140).
---
## Installation
**Yarn**
```sh
yarn add -D svelte-super-tiny-icons
```
**NPM**
```sh
npm i -D svelte-super-tiny-icons
```
## Usage
```svelte
import { Svelte } from "svelte-super-tiny-icons";
```
See [ICON_INDEX.md](ICON_INDEX.md) for list of icons.
## API
`$$restProps` are forwarded to the `svg` element.
### Forwarded events
- on:click
- on:mouseover
- on:mouseenter
- on:mouseout
- on:keydown
## Using svelte:component
```svelte
import * as icons from "svelte-super-tiny-icons";
{#each Object.keys(icons) as icon}
{icon}
{/each}
```
## Changelog
[Changelog](CHANGELOG.md)
## Development workflow
Svelte components are generated from [Super Tiny Icons](https://github.com/edent/SuperTinyIcons) SVG files using [svg-to-svelte](https://github.com/metonym/svg-to-svelte).
A single script [build.js](build.js) generates the components, along with documentation in Markdown format.
The generated Svelte components are emitted to the `lib` folder, which is ignored by Git but published to NPM.
Documentation is generated using the list of icon module names from the source library.
## License
[MIT](LICENSE)
[npm]: https://img.shields.io/npm/v/svelte-super-tiny-icons.svg?color=%23ff3e00&style=for-the-badge
[npm-url]: https://npmjs.com/package/svelte-super-tiny-icons