Vyaguta Icons

Original Library Information

Original Demo

[Original Repo] (https://github.com/react-icons/react-icons)

Include popular icons in your React projects easily with vyaguta-icons, which utilizes ES6 imports that allows you to include only the icons that your project is using.

Installation

Yarn

yarn add vyaguta-icons

NPM

npm install vyaguta-icons --save

Usage

import { UiAirplay } from 'vyaguta-icons/ui';

class Question extends React.Component {
    render() {
        return <h3> Lets go for a <UiAirplay />? </h3>
    }
}

View the documentation for further usage examples and how to use icons from other packages. NOTE: each Icon package has it's own subfolder under react-icons you import from.

For example, to use an icon from Material Design, your import would be: import { ICON_NAME } from 'react-icons/md';

Icons

| Icon Library | License | | ------------------------------------------------------------- | ----------------------------------------------------------------------------------------- | | Feather | MIT | | Unicons Icons | Apache License 2.0 |

Configuration

You can configure react-icons props using React Context API.

Requires React 16.3 or higher.

import { IconContext } from "vyaguta-icons";

<IconContext.Provider value={{ color: "blue", className: "global-class-name" }}>
  <div>
    <FaFolder />
  </div>
</IconContext.Provider>

| Key | Default | Notes | | ----------- | --------------------- | ------------------------------- | | color | undefined (inherit) | | | size | 1em | | | className | undefined | | | style | undefined | Can overwrite size and color | | attr | undefined | Overwritten by other attributes |

Ending up with a large JS bundle? Check out this issue.

Adjustment CSS

From version 3, vertical-align: middle is not automatically given. Please use IconContext to specify className or specify an inline style.

Global Inline Styling

<IconContext.Provider value={{ style: { verticalAlign: 'middle' } }}>

Global className Styling

Component

<IconContext.Provider value={{ className: 'vyaguta-icons' }}>

CSS

.vyaguta-icons {
  vertical-align: middle;
}

TypeScript native support

Dependencies on @types/vyaguta-icons can be deleted.

Yarn

yarn remove @types/vyaguta-icons

NPM

npm remove @types/vyaguta-icons

Contributing

Development

yarn
cd packages/vyaguta-icons
yarn build

Licence

MIT

• Icons are taken from the other projects so please check each project licences accordingly.