Devicons for Mithril.js

!NPM package downloads

Easy to use and customizable mithril.js icon components based on Devicon set with Typescript support.

Highlights

- First class Typescript support
- Ability to add any SVG attribute to the icons
- Tree-shaking friendly structure
- No m.trust calls - all the icons are defined explicitly

Installation

``
npm i @mithril-icons/devicon
`
or
`
yarn add @mithril-icons/devicon
`


Usage


Import all the icons:
`
import m from 'mithril'
import * as F from '@mithril-icons/devicon'

const Example = {
view: function () {
return m('div',
m(F.TypescriptPlain),
m(F.TypescriptOriginal),
}
}
`
Selectively import needed icons:
`
import m from 'mithril'
import { TypescriptPlain, TypescriptOriginal } from '@mithril-icons/devicon'

const Example = {
view: function () {
return m('div',
m(TypescriptPlain),
m(TypescriptOriginal)
}
}
`
You can also import only selected icons directly. This might reduce overall bundle size (depends on your bundler):
`
import m from 'mithril'
import TypescriptPlain from '@mithril-icons/devicon/icons/TypescriptPlain'
import TypescriptOriginal from '@mithril-icons/devicon/icons/TypescriptOriginal'

const Example = {
view: function () {
return m('div',
m(TypescriptPlain, { color: '#25ff56', 'stroke-linecap': 'butt' }),
m(TypescriptOriginal, { fill: '#ff4405', 'stroke-width': 2 }),
}
}
`
All of the icons are rendered directly to SVG VNode so specified attributes will be added to svg node. It means that:
`
m(TypescriptPlain, { width: 50, height: 50 })
`
will be rendered to:
`

`


$3


If you are not using bundler that can handle ES6 modules easily (e.g. Brunch) the library is also available as a CommonJS module - you can import it by adding /cjs postfix:
`
const m = require("mithril")
const i = require("@mithril-icons/devicon/cjs")

m.render(document.body, m(i.TypescriptPlain))
`


Typescript support

All of the icons are explicitly exported by name (no string dictionary kind of thing) so they are easy to work with.

> TIP: To explore available icons you just need to write import {} from '@mithril-icons/devicon'` and invoke autocompletion from within curly braces

In addition there are typings for SVG based attributes that can be attached to SVG's.

> NOTE: These typings are not 100% exhaustive, because there are a lot of possibilities there (take a look here). Instead typings are provided for most attributes that are most useful (at least in my opinion). PR for adding any useful attributes that I might have missed are welcome.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

License

MIT