# @abw/react-icon

> A description for react-icon

Latest version **0.0.3** (published 2023-11-19) · 0 weekly downloads

## Install

```sh
npm install @abw/react-icon
pnpm add @abw/react-icon
yarn add @abw/react-icon
bun add @abw/react-icon
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: esm support; no vulnerabilities.

Warnings: low downloads; no types; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.0.3 |
| Published | 2023-11-19 |
| First published | 2023-11-19 |
| Weekly downloads | 0 |
| TypeScript types | none |
| Module format | ESM + CommonJS |
| Dependencies | 3 |
| Unpacked size | 27.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | Andy Wardley |
| Maintainers | abw |
| Keywords | react |

## Links

- npm: https://www.npmjs.com/package/@abw/react-icon
- Repository: https://github.com/abw/react-icon
- Homepage: https://github.com/abw/react-icon#readme
- Issues: https://github.com/abw/react-icon/issues
- npm.io page: https://npm.io/package/@abw/react-icon

## Dependencies (3)

- [react](https://npm.io/package/react.md) ^18.2.0
- [react-dom](https://npm.io/package/react-dom.md) ^18.2.0
- [@abw/badger-utils](https://npm.io/package/@abw/badger-utils.md) ^1.0.21

## Alternatives

- [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads
- [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads
- [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads
- [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads
- [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads

## Recent versions

- 0.0.3 (latest) — 2023-11-19

## README

# badger-icon

This module implements a React component for rendering SVG icons.

What makes this unique is that icon names can have modifiers to change the
orientation, size, position and style properties of the icon.  For example,
if you have an `arrow` icon defined, pointing up, then specifying the name
as `arrow-right` will rotate it through 90 degrees to point to the right.

Similarly, `arrow-thick` will increase the stroke width and `arrow-thin` will
reduce it.

See the [website](https://abw.github.io/badger-icon) for full documentation
and examples.

## Getting Started

Add the `@abw/badger-icon` module to your project using your favourite
package manager.

```bash
## using npm
$ npm add @abw/badger-icon

## using yarn
$ yarn add @abw/badger-icon

## using pnpm
$ pnpm add @abw/badger-icon
```

You can then import the modules and start using them.

```jsx
import { Icon } from '@abw/badger-icon'

const YourComponent = () =>
  <Icon name="arrow-right"/>

export default YourComponent
```

## Notes for Maintainers

Check out the repository.

```bash
$ git clone https://github.com/abw/badger-icon.git
$ cd badger-icon
```

Install the dependencies.

```bash
$ pnpm install
```

To run the development server.

```bash
$ pnpm dev
```

To run the tests.

```bash
$ pnpm test
```

To build for production.

```bash
$ pnpm build
```

To build just the library code for production.

```bash
$ pnpm build:lib
```

To build just the the documentation.

```bash
$ pnpm build:docs
```

To preview the documentation.

```bash
$ pnpm preview
```

Check source code for formatting errors.

```bash
$ pnpm lint
```

## Author

Andy Wardley

---
_Source: https://npm.io/package/@abw/react-icon · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._