Install

npm install @idui/react-icon

yarn add @idui/react-icon

Icon React Component

Install

 npm install --save @idui/react-icon

 yarn add @idui/react-icon

See props in Docs

Configuration

you can call configureIcons as many times as you want, icons will be merged
color, which you want to specify in props should be currentColor (e.g fill="currentColor", stroke="currentColor")

 import React, { Fragment } from 'react';
import { configureIcons } from "@idui/react-icon";

configureIcons({
    // [name]: {
    //     viewBox: svg viewBox,
    //     content: <Fragment>
    //         // svg inner content
    //     </Fragment>
    // }

    search: {
        viewBox: '0 0 19 20',
        content: <Fragment>
            <path d="M12 12.5L18.0001 18.364" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
            <path d="M13.7025 7.5C13.7025 11.1088 10.8401 14 7.35124 14C3.86234 14 1 11.1088 1 7.5C1 3.89117 3.86234 1 7.35124 1C10.8401 1 13.7025 3.89117 13.7025 7.5Z" stroke="currentColor" strokeWidth="2" strokeLinecap="round"/>
        </Fragment>
    },
    add: {
        viewBox: '0 0 12 12',
        content: <Fragment>
            <rect x="5" width="2" height="12" rx="1" fill="currentColor"/>
            <rect y="7" width="2" height="12" rx="1" transform="rotate(-90 0 7)" fill="currentColor"/>
        </Fragment>
    },
})

Usage Example

 import React from 'react'
import Icon from '@idui/react-icon'

function Example() {
  return <Icon 
      name="add"
      color="gray" 
      hoverColor="black"
      size="2rem"
      cursor="pointer"
  />
}