Full Code of feathericons/feather for AI

Repository: feathericons/feather
Branch: main
Commit: 3dc050d97405
Files: 56
Total size: 63.7 KB

Directory structure:
gitextract_6lb9fqmi/

├── .babelrc
├── .changeset/
│   ├── README.md
│   └── config.json
├── .eslintignore
├── .eslintrc.js
├── .github/
│   ├── CODEOWNERS
│   ├── ISSUE_TEMPLATE/
│   │   ├── 01-icon-request.yml
│   │   └── 02-bug-report.yml
│   └── workflows/
│       ├── ci.yml
│       └── release.yml
├── .gitignore
├── .lintstagedrc
├── .prettierignore
├── CHANGELOG.md
├── CODE_OF_CONDUCT.md
├── CONTRIBUTING.md
├── LICENSE
├── README.md
├── bin/
│   ├── .eslintrc.json
│   ├── __tests__/
│   │   ├── __snapshots__/
│   │   │   ├── build-icons-object.test.js.snap
│   │   │   ├── build-sprite-string.test.js.snap
│   │   │   └── optimize-svg.test.js.snap
│   │   ├── build-icons-object.test.js
│   │   ├── build-sprite-string.test.js
│   │   └── optimize-svg.test.js
│   ├── build-icons-json.js
│   ├── build-icons-object.js
│   ├── build-sprite-string.js
│   ├── build-sprite.js
│   ├── build-svgs.js
│   ├── build.sh
│   ├── optimize-svg.js
│   ├── optimize-svgs.js
│   └── setup.sh
├── commitlint.config.js
├── examples/
│   └── index.html
├── package.json
├── src/
│   ├── __tests__/
│   │   ├── __snapshots__/
│   │   │   ├── icon.test.js.snap
│   │   │   ├── icons.test.js.snap
│   │   │   ├── replace.node.test.js.snap
│   │   │   ├── replace.test.js.snap
│   │   │   └── to-svg.test.js.snap
│   │   ├── icon.test.js
│   │   ├── icons.test.js
│   │   ├── index.test.js
│   │   ├── replace.node.test.js
│   │   ├── replace.test.js
│   │   └── to-svg.test.js
│   ├── default-attrs.json
│   ├── icon.js
│   ├── icons.js
│   ├── index.js
│   ├── replace.js
│   ├── tags.json
│   └── to-svg.js
└── webpack.config.js

================================================
FILE CONTENTS
================================================

================================================
FILE: .babelrc
================================================
{
  "presets": [
    [
      "env",
      {
        "targets": {
          "browsers": ["last 2 versions"]
        }
      }
    ],
    "stage-2"
  ]
}


================================================
FILE: .changeset/README.md
================================================
# Changesets

Hello and welcome! This folder has been automatically generated by `@changesets/cli`, a build tool that works with mono-repos or single package repos to help you version and release your code. You can find the full documentation for it [in our repository](https://github.com/changesets/changesets)

We have a quick list of common questions to get you started engaging with this project in [our documentation](https://github.com/changesets/changesets/blob/main/docs/common-questions.md)


================================================
FILE: .changeset/config.json
================================================
{
  "$schema": "https://unpkg.com/@changesets/config@2.3.1/schema.json",
  "changelog": [
    "@changesets/changelog-github",
    { "repo": "feathericons/feather" }
  ],
  "commit": false,
  "fixed": [],
  "linked": [],
  "access": "public",
  "baseBranch": "main",
  "updateInternalDependencies": "patch",
  "ignore": []
}


================================================
FILE: .eslintignore
================================================
dist
coverage

================================================
FILE: .eslintrc.js
================================================
module.exports = {
  env: {
    browser: true,
    es2021: true,
    node: true,
  },
  extends: 'eslint:recommended',
  overrides: [
    {
      env: {
        node: true,
      },
      files: ['.eslintrc.{js,cjs}'],
      parserOptions: {
        sourceType: 'script',
      },
    },
  ],
  parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module',
  },
  rules: {},
};


================================================
FILE: .github/CODEOWNERS
================================================
* @colebemis


================================================
FILE: .github/ISSUE_TEMPLATE/01-icon-request.yml
================================================
name: 🙏 Icon request
description: Request a new icon
title: 'Icon request: '
labels: ['icon request']
projects: ['feathericons/1']
body:
  - type: input
    id: icon-name
    attributes:
      label: Icon name
      placeholder: e.g. star
    validations:
      required: true
  - type: textarea
    id: use-case
    attributes:
      label: Use case
      description: Please describe your use case for the requested icon.
      placeholder: e.g. I need a star icon to use in my rating system.
    validations:
      required: true
  - type: textarea
    id: screenshots
    attributes:
      label: Screenshots of similar icons
      description: Please attach screenshots of similar icons from other icon sets to help us visualize your request.
      placeholder: e.g. ![Screenshot of similar icon](https://example.com/screenshot.png)
    validations:
      required: true
  - type: checkboxes
    id: checklist
    attributes:
      label: Checklist
      description: Please check the following items before submitting your request.
      options:
        - label: I have searched the existing icons to make sure this icon does not already exist.
          required: true
        - label: I have searched the existing issues to make sure this icon has not already been requested.
          required: true
        - label: This icon is not a logo.
          required: true


================================================
FILE: .github/ISSUE_TEMPLATE/02-bug-report.yml
================================================
name: 🐛 Bug report
description: Report a bug
title: 'Bug: '
labels: ['bug']
projects: ['feathericons/1']
body:
  - type: textarea
    id: description
    attributes:
      label: Description
      description: "Tell us more about the problem that you're running into."
      placeholder: 'e.g. When I try to do X, Y happens instead of Z'
    validations:
      required: true
  - type: textarea
    id: reproduce
    attributes:
      label: Steps to reproduce
      description: 'How can we reproduce the error you described above? Please provide a link to a live example, or steps to reproduce locally.'
      placeholder: |
        1. Go to '...'
        2. Click on '....'
        3. Scroll down to '....'
        4. See error
    validations:
      required: true
  - type: input
    id: version
    attributes:
      label: Version
      description: 'What version of `feather-icons` are you using?'
      placeholder: e.g. v4.29.0
    validations:
      required: false
  - type: dropdown
    id: browser
    attributes:
      label: Browser
      description: In which browser(s) are you experiencing the issue?
      multiple: true
      options:
        - Chrome
        - Safari
        - Firefox
        - Edge
        - iOS Safari
        - Other
    validations:
      required: false
  - type: dropdown
    id: os
    attributes:
      label: Operating system
      description: On which operating system(s) are you experiencing the issue?
      multiple: true
      options:
        - macOS
        - Windows
        - Linux
        - iOS
        - Android
        - Other
    validations:
      required: false
  - type: checkboxes
    id: checklist
    attributes:
      label: Checklist
      description: Please check the following items before submitting your issue.
      options:
        - label: I have searched the existing issues to make sure this bug has not already been reported.
          required: true


================================================
FILE: .github/workflows/ci.yml
================================================
name: CI

on: push

jobs:
  ci:
    name: CI
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repository
        uses: actions/checkout@v3

      - name: Setup Node.js 16.x
        uses: actions/setup-node@v3
        with:
          node-version: 16.x
          cache: 'npm'

      - name: Install dependencies
        run: npm ci --legacy-peer-deps

      - name: Build
        run: npm run build

      - name: Test
        run: npm run test:coverage

      - name: Lint
        run: npm run lint

      - name: Optimize SVGs
        run: |
          npm run optimize-svgs
          if git diff --quiet; then
            echo "All SVGs are optimized ✔︎"
          else
            echo "The following SVGs are not optimized:"
            git diff --name-only
            echo
            echo "Please run 'npm run optimize-svgs' and commit the changes"
            exit 1
          fi


================================================
FILE: .github/workflows/release.yml
================================================
name: Release

on:
  push:
    branches:
      - main

concurrency: ${{ github.workflow }}-${{ github.ref }}

jobs:
  release:
    name: Release
    runs-on: ubuntu-latest
    steps:
      - name: Checkout repository
        uses: actions/checkout@v3

      - name: Setup Node.js 16.x
        uses: actions/setup-node@v3
        with:
          node-version: 16.x
          cache: 'npm'

      - name: Install dependencies
        run: npm ci --legacy-peer-deps

      - name: Create release pull request or publish to npm
        id: changesets
        uses: changesets/action@v1
        with:
          title: 'Release'
          publish: npm run release
        env:
          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}


================================================
FILE: .gitignore
================================================
.DS_Store
node_modules
dist
sandbox
stash
coverage

================================================
FILE: .lintstagedrc
================================================
{
  "*.js": "eslint"
}


================================================
FILE: .prettierignore
================================================
dist
coverage


================================================
FILE: CHANGELOG.md
================================================
# feather-icons

## 4.29.2

### Patch Changes

- [#1241](https://github.com/feathericons/feather/pull/1241) [`6e449d4`](https://github.com/feathericons/feather/commit/6e449d481e7ec7568103289eb4494999843b68ce) Thanks [@braden-godley](https://github.com/braden-godley)! - Feather no longer breaks when trying to replace an icon using an invalid name

## 4.29.1

### Patch Changes

- [#1213](https://github.com/feathericons/feather/pull/1213) [`8f0cc0e`](https://github.com/feathericons/feather/commit/8f0cc0e6667e88b7de391ccaf75820a6e57f4f13) Thanks [@colebemis](https://github.com/colebemis)! - Test [changesets](https://github.com/changesets/changesets) release


================================================
FILE: CODE_OF_CONDUCT.md
================================================
# Contributor Covenant Code of Conduct

## Our Pledge

In the interest of fostering an open and welcoming environment, we as
contributors and maintainers pledge to making participation in our project and
our community a harassment-free experience for everyone, regardless of age, body
size, disability, ethnicity, gender identity and expression, level of experience,
nationality, personal appearance, race, religion, or sexual identity and
orientation.

## Our Standards

Examples of behavior that contributes to creating a positive environment
include:

- Using welcoming and inclusive language
- Being respectful of differing viewpoints and experiences
- Gracefully accepting constructive criticism
- Focusing on what is best for the community
- Showing empathy towards other community members

Examples of unacceptable behavior by participants include:

- The use of sexualized language or imagery and unwelcome sexual attention or
  advances
- Trolling, insulting/derogatory comments, and personal or political attacks
- Public or private harassment
- Publishing others' private information, such as a physical or electronic
  address, without explicit permission
- Other conduct which could reasonably be considered inappropriate in a
  professional setting

## Our Responsibilities

Project maintainers are responsible for clarifying the standards of acceptable
behavior and are expected to take appropriate and fair corrective action in
response to any instances of unacceptable behavior.

Project maintainers have the right and responsibility to remove, edit, or
reject comments, commits, code, wiki edits, issues, and other contributions
that are not aligned to this Code of Conduct, or to ban temporarily or
permanently any contributor for other behaviors that they deem inappropriate,
threatening, offensive, or harmful.

## Scope

This Code of Conduct applies both within project spaces and in public spaces
when an individual is representing the project or its community. Examples of
representing a project or community include using an official project e-mail
address, posting via an official social media account, or acting as an appointed
representative at an online or offline event. Representation of a project may be
further defined and clarified by project maintainers.

## Enforcement

Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported by contacting the project team at cole@colebemis.com. All
complaints will be reviewed and investigated and will result in a response that
is deemed necessary and appropriate to the circumstances. The project team is
obligated to maintain confidentiality with regard to the reporter of an incident.
Further details of specific enforcement policies may be posted separately.

Project maintainers who do not follow or enforce the Code of Conduct in good
faith may face temporary or permanent repercussions as determined by other
members of the project's leadership.

## Attribution

This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4,
available at [http://contributor-covenant.org/version/1/4][version]

[homepage]: http://contributor-covenant.org
[version]: http://contributor-covenant.org/version/1/4/


================================================
FILE: CONTRIBUTING.md
================================================
# Contribution guidelines

First off, thanks for taking the time to contribute!

The following is a set of guidelines for contributing to Feather. Feel free to propose changes to this document in a pull request.

## Pull requests

> [!IMPORTANT]
> We are not accepting pull requests containing **icons**. If you want to add a new icon, please create an [icon request](#icon-requests).

Pull requests for bug fixes and improvements are welcome. If you’re not sure if something is worth doing, please open an issue first.

**Working on your first Pull Request?** You can learn how from this _free_ series
[How to Contribute to an Open Source Project on GitHub](https://egghead.io/courses/how-to-contribute-to-an-open-source-project-on-github).

Here are a few things you can do that will increase the likelihood of your pull request being accepted:

- **Make your commit messages as descriptive as possible.** Include as much information as you can. Explain anything that might be unclear.
- **Document your pull request**. Explain your changes, link to the relevant issue, and add screenshots when applicable.
- **Include only related work**. If you have unrelated changes, please split them into separate pull requests.

## Icon requests

To request a new icon, please fill out the [icon request form](https://github.com/feathericons/feather/issues/new?template=01-icon-request.yml).

## Bug reports

To report a bug, please fill out the [bug report form](https://github.com/feathericons/feather/issues/new?template=02-bug-report.yml).

## Local development

Follow these steps to set up Feather for local development:

```shell
# 1. Clone the repository
git clone https://github.com/feathericons/feather.git
cd feather

# 2. Run setup script
npm run setup
```


================================================
FILE: LICENSE
================================================
The MIT License (MIT)

Copyright (c) 2013-2023 Cole Bemis

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.


================================================
FILE: README.md
================================================
# Feather

[![Coverage](https://img.shields.io/codecov/c/github/feathericons/feather/master.svg?style=flat-square)](https://codecov.io/gh/feathericons/feather)
[![npm downloads](https://img.shields.io/npm/dm/feather-icons.svg?style=flat-square)](https://www.npmjs.com/package/feather-icons)
[![npm version](https://img.shields.io/npm/v/feather-icons.svg?style=flat-square)](https://www.npmjs.com/package/feather-icons)
[![CDNJS version](https://img.shields.io/cdnjs/v/feather-icons.svg?style=flat-square)](https://cdnjs.com/libraries/feather-icons)

## What is Feather?

Feather is a collection of simply beautiful open-source icons. Each icon is designed on a 24x24 grid with an emphasis on simplicity, consistency, and flexibility.

https://feathericons.com

```shell
npm install feather-icons
```

## Table of contents

- [Quick start](#quick-start)
- [Usage](#usage)
  - [Client-side JavaScript](#client-side-javascript)
  - [Node](#node)
  - [SVG sprite](#svg-sprite)
  - [Figma](#figma)
- [API reference](#api-reference)
  - [`feather.icons`](#feathericons)
  - [`feather.icons[name].toSvg()`](#feathericonsnametosvgattrs)
  - [`feather.replace()`](#featherreplaceattrs)
  - [`feather.toSvg()` (DEPRECATED) ](#feathertosvgname-attrs-deprecated)
- [Contributing](#contributing)
- [Related projects](#related-projects)
- [License](#license)

## Quick start

Start with this [CodePen Template](https://codepen.io/pen?template=WOJZdM) to begin prototyping with Feather in the browser.

Or copy and paste the following code snippet into a blank `html` file.

```html
<!DOCTYPE html>
<html lang="en">
  <title></title>
  <script src="https://unpkg.com/feather-icons"></script>
  <body>
    <!-- example icon -->
    <i data-feather="circle"></i>

    <script>
      feather.replace();
    </script>
  </body>
</html>
```

## Usage

At its core, Feather is a collection of [SVG](https://svgontheweb.com/#svg) files. This means that you can use Feather icons in all the same ways you can use SVGs (e.g. `img`, `background-image`, `inline`, `object`, `embed`, `iframe`). Here's a helpful article detailing the many ways SVGs can be used on the web: [SVG on the Web – Implementation Options](https://svgontheweb.com/#implementation)

The following are additional ways you can use Feather.

### Client-side JavaScript

#### 1. Install

> [!NOTE]
> If you intend to use Feather with a CDN, you can skip this installation step.

Install with [npm](https://docs.npmjs.com/getting-started/what-is-npm).

```shell
npm install feather-icons --save
```

Or just copy [`feather.js`](https://unpkg.com/feather-icons/dist/feather.js) or [`feather.min.js`](https://unpkg.com/feather-icons/dist/feather.min.js) into your project directory. You don't need both `feather.js` and `feather.min.js`.

#### 2. Include

Include `feather.js` or `feather.min.js` with a `<script>` tag:

```html
<script src="path/to/dist/feather.js"></script>
```

> [!NOTE]
> `feather.js` and `feather.min.js` are located in the `dist` directory of the npm package.

Or load the script from a CDN provider:

```html
<!-- choose one -->
<script src="https://unpkg.com/feather-icons"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
```

After including the script, `feather` will be available as a global variable.

#### 3. Use

To use an icon on your page, add a `data-feather` attribute with the icon name to an element:

```html
<i data-feather="circle"></i>
```

See the complete list of icons at [feathericons.com](https://feathericons.com).

#### 4. Replace

Call the `feather.replace()` method:

```html
<script>
  feather.replace();
</script>
```

All elements that have a `data-feather` attribute will be replaced with SVG markup corresponding to their `data-feather` attribute value. See the [API Reference](#api-reference) for more information about `feather.replace()`.

### Node

#### 1. Install

Install with [npm](https://docs.npmjs.com/getting-started/what-is-npm):

```shell
npm install feather-icons --save
```

#### 2. Require

```js
const feather = require('feather-icons');
```

#### 3. Use

```js
feather.icons.x;
// {
//    name: 'x',
//    contents: '<line ... /><line ... />`,
//    tags: ['cancel', 'close', 'delete', 'remove'],
//    attrs: {
//      class: 'feather feather-x',
//      xmlns: 'http://www.w3.org/2000/svg',
//      width: 24,
//      height: 24,
//      viewBox: '0 0 24 24',
//      fill: 'none',
//      stroke: 'currentColor',
//      'stroke-width': 2,
//      'stroke-linecap': 'round',
//      'stroke-linejoin': 'round',
//    },
//    toSvg: [Function],
// }

feather.icons.x.toSvg();
// <svg class="feather feather-x" ...><line ... /><line ... /></svg>

feather.icons.x.toSvg({ class: 'foo bar', 'stroke-width': 1, color: 'red' });
// <svg class="feather feather-x foo bar" stroke-width="1" color="red" ...><line ... /><line ... /></svg>
```

See the [API Reference](#api-reference) for more information about the available properties and methods of the `feather` object.

### SVG sprite

#### 1. Install

> [!NOTE]
> If you intend to use Feather with a CDN, you can skip this installation step.

Install with [npm](https://docs.npmjs.com/getting-started/what-is-npm).

```shell
npm install feather-icons --save
```

Or just copy [`feather-sprite.svg`](https://unpkg.com/feather-icons/dist/feather-sprite.svg) into your project directory.

#### 2. Use

Include an icon on your page with the following markup:

```html
<svg
  width="24"
  height="24"
  fill="none"
  stroke="currentColor"
  stroke-width="2"
  stroke-linecap="round"
  stroke-linejoin="round"
>
  <use href="path/to/feather-sprite.svg#circle" />
</svg>
```

> [!NOTE]
> `circle` in the above example can be replaced with any valid icon name. See the complete list of icon names at [feathericons.com](https://feathericons.com).

However, this markup can be simplified using a simple CSS class to avoid repetition of SVG attributes between icons:

```css
.feather {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  fill: none;
}
```

```html
<svg class="feather">
  <use href="path/to/dist/feather-sprite.svg#circle" />
</svg>
```

### Figma

Feather is available as a [Figma component library](https://www.figma.com/file/dyJRSFTIajik4cdkcXN8yA3K/Feather-Component-Library). To use the components, log in to your Figma account and **duplicate** the file to your drafts.

## API reference

### `feather.icons`

An object with data about every icon.

#### Usage

```js
feather.icons.x;
// {
//    name: 'x',
//    contents: '<line ... /><line ... />',
//    tags: ['cancel', 'close', 'delete', 'remove'],
//    attrs: {
//      class: 'feather feather-x',
//      xmlns: 'http://www.w3.org/2000/svg',
//      width: 24,
//      height: 24,
//      viewBox: '0 0 24 24',
//      fill: 'none',
//      stroke: 'currentColor',
//      'stroke-width': 2,
//      'stroke-linecap': 'round',
//      'stroke-linejoin': 'round',
//    },
//    toSvg: [Function],
// }

feather.icons.x.toString();
// '<line ... /><line ... />'
```

> [!NOTE]
> `x` in the above example can be replaced with any valid icon name. See the complete list of icon names at [feathericons.com](https://feathericons.com). Icons with multi-word names (e.g. `arrow-right`) **cannot** be accessed using dot notation (e.g. `feather.icons.x`). Instead, use bracket notation (e.g. `feather.icons['arrow-right']`).

[View Source](https://github.com/feathericons/feather/blob/master/src/icons.js)

---

### `feather.icons[name].toSvg([attrs])`

Returns an SVG string.

#### Parameters

| Name               | Type   | Description                                                                                                                                                                                                                  |
| ------------------ | ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `attrs` (optional) | Object | Key-value pairs in the `attrs` object will be mapped to HTML attributes on the `<svg>` tag (e.g. `{ foo: 'bar' }` maps to `foo="bar"`). All default attributes on the `<svg>` tag can be overridden with the `attrs` object. |

> [!NOTE]
> You might find these SVG attributes helpful for manipulating icons:
>
> - [`color`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/color)
> - [`width`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/width)
> - [`height`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/height)
> - [`stroke-width`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-width)
> - [`stroke-linecap`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linecap)
> - [`stroke-linejoin`](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/stroke-linejoin)

#### Usage

```js
feather.icons.circle.toSvg();
// '<svg class="feather feather-circle" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'

feather.icons.circle.toSvg({ 'stroke-width': 1 });
// '<svg class="feather feather-circle" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'

feather.icons.circle.toSvg({ class: 'foo bar' });
// '<svg class="feather feather-circle foo bar" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'
```

[View Source](https://github.com/feathericons/feather/blob/master/src/icon.js)

---

### `feather.replace([attrs])`

Replaces all elements that have a `data-feather` attribute with SVG markup corresponding to the element's `data-feather` attribute value.

#### Parameters

| Name               | Type   | Description                                                                                                                                                                                                                  |
| ------------------ | ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `attrs` (optional) | Object | Key-value pairs in the `attrs` object will be mapped to HTML attributes on the `<svg>` tag (e.g. `{ foo: 'bar' }` maps to `foo="bar"`). All default attributes on the `<svg>` tag can be overridden with the `attrs` object. |

#### Usage

> [!IMPORTANT]
> `feather.replace()` only works in a browser environment.

Simple usage:

```html
<i data-feather="circle"></i>
<!--
<i> will be replaced with:
<svg class="feather feather-circle" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>
-->

<script>
  feather.replace();
</script>
```

You can pass `feather.replace()` an `attrs` object:

```html
<i data-feather="circle"></i>
<!--
<i> will be replaced with:
<svg class="feather feather-circle foo bar" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>
-->

<script>
  feather.replace({ class: 'foo bar', 'stroke-width': 1 });
</script>
```

All attributes on the placeholder element (i.e. `<i>`) will be copied to the `<svg>` tag:

```html
<i data-feather="circle" id="my-circle" class="foo bar" stroke-width="1"></i>
<!--
<i> will be replaced with:
<svg id="my-circle" class="feather feather-circle foo bar" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>
-->

<script>
  feather.replace();
</script>
```

[View Source](https://github.com/feathericons/feather/blob/master/src/replace.js)

---

### `feather.toSvg(name, [attrs])` (DEPRECATED)

> [!WARNING]
> `feather.toSvg()` is deprecated. Please use `feather.icons[name].toSvg()` instead.

Returns an SVG string.

#### Parameters

| Name               | Type   | Description                                                                                                                                                                                                                  |
| ------------------ | ------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `name`             | string | Icon name                                                                                                                                                                                                                    |
| `attrs` (optional) | Object | Key-value pairs in the `attrs` object will be mapped to HTML attributes on the `<svg>` tag (e.g. `{ foo: 'bar' }` maps to `foo="bar"`). All default attributes on the `<svg>` tag can be overridden with the `attrs` object. |

#### Usage

```js
feather.toSvg('circle');
// '<svg class="feather feather-circle" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'

feather.toSvg('circle', { 'stroke-width': 1 });
// '<svg class="feather feather-circle" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'

feather.toSvg('circle', { class: 'foo bar' });
// '<svg class="feather feather-circle foo bar" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle></svg>'
```

[View Source](https://github.com/feathericons/feather/blob/master/src/to-svg.js)

## Contributing

For more info on how to contribute please see the [contribution guidelines](https://github.com/feathericons/feather/blob/master/CONTRIBUTING.md).

Caught a mistake or want to contribute to the documentation? [Edit this page on Github](https://github.com/feathericons/feather/blob/master/README.md)

## Related projects

- [feathericons.dev](http://feathericons.dev) - Feather viewer featuring [30+ brand icons](https://feathericons.dev/?iconset=brands) and [40+ payment services icons](https://feathericons.dev/?iconset=payments)
- [angular-feather](https://github.com/michaelbazos/angular-feather) - Feather icons for Angular applications
- [elm-feather](https://github.com/1602/elm-feather) - Feather icons for Elm applications
- [react-feather](https://github.com/carmelopullara/react-feather) - Feather icons as React components
- [sketch-feather](https://github.com/odmln/sketch-feather) - Feather icons as a Sketch library
- [vue-feather-icons](https://github.com/egoist/vue-feather-icons) - Feather icons as Vue components
- [php-feather](https://github.com/Pixelrobin/php-feather) - Feather icons as a PHP Library
- [hyva-feather](https://github.com/Siteation/magento2-hyva-icons-feather) - Feather icons as a Magento 2 Hyva template tag
- [wp-php-feather](https://github.com/reatlat/wp-php-feather) - Feather icons as a WordPress template tag
- [django-feather](https://pypi.org/project/django-feather/) - Feather icons as Django Template Tag
- [svelte-feather-icons](https://github.com/dylanblokhuis/svelte-feather-icons) - Feather icons as Svelte components
- [gulp-feather](https://github.com/oToToT/gulp-feather) - Feather icons rendering using gulp
- [astro-feather](https://github.com/gabrlyg/astro-feather) - Feather icons as Astro components
- [qwik-feather-icons](https://github.com/yeyon/qwik-feather-icons) - Feather icons for Qwik, the Resumable Framework
- [figma-feather](https://github.com/kevintoepfer/figma-feather) – Feather icons as a Figma component
- [delphi-feather-icons](https://github.com/shaunroselt/Delphi-Feather-Icons) - Feather icons as a Delphi Library
- [eleventy-plugin-feathericons](https://github.com/reatlat/eleventy-plugin-feathericons) - Feather icons as a plugin for [11ty](https://github.com/11ty/eleventy)

## License

Feather is licensed under the [MIT License](https://github.com/feathericons/feather/blob/master/LICENSE).


================================================
FILE: bin/.eslintrc.json
================================================
{
  "rules": {
    "import/no-extraneous-dependencies": "off",
    "no-console": "off"
  }
}


================================================
FILE: bin/__tests__/__snapshots__/build-icons-object.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`builds object correctly 1`] = `
Object {
  "icon1": "<line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"></line><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"></line>",
  "icon2": "<circle cx=\\"12\\" cy=\\"12\\" r=\\"11\\"></circle>",
}
`;


================================================
FILE: bin/__tests__/__snapshots__/build-sprite-string.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`builds sprite correctly 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\"><defs><symbol id=\\"icon1\\" viewBox=\\"0 0 24 24\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"></line><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"></line></symbol><symbol id=\\"icon2\\" viewBox=\\"0 0 24 24\\"><circle cx=\\"12\\" cy=\\"12\\" r=\\"11\\"></circle></symbol></defs></svg>"`;


================================================
FILE: bin/__tests__/__snapshots__/optimize-svg.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`optimizes SVG correctly 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"/><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"/></svg>"`;

exports[`rejects when passed unparsable SVG string 1`] = `
[Error: Error in parsing SVG: Unclosed root tag
Line: 0
Column: 10
Char: ]
`;


================================================
FILE: bin/__tests__/build-icons-object.test.js
================================================
/* eslint-env jest */
import buildIconsObject from '../build-icons-object';

const SVG_FILES = {
  'icon1.svg':
    '<svg\n  xmlns="http://www.w3.org/2000/svg"\n  width="24"\n  height="24"\n  viewBox="0 0 24 24"\n>\n  <line x1="23" y1="1" x2="1" y2="23" />\n  <line x1="1" y1="1" x2="23" y2="23" />\n</svg>',
  'icon2.svg':
    '<svg\n  xmlns="http://www.w3.org/2000/svg"\n  width="24"\n  height="24"\n  viewBox="0 0 24 24"\n>\n  <circle cx="12" cy="12" r="11" />\n</svg>',
};

function getSvg(svgFile) {
  return SVG_FILES[svgFile];
}

test('builds object correctly', () => {
  expect(buildIconsObject(Object.keys(SVG_FILES), getSvg)).toMatchSnapshot();
});


================================================
FILE: bin/__tests__/build-sprite-string.test.js
================================================
/* eslint-env jest */
import buildSpriteString from '../build-sprite-string';

const icons = {
  icon1:
    '<line x1="23" y1="1" x2="1" y2="23"></line><line x1="1" y1="1" x2="23" y2="23"></line>',
  icon2: '<circle cx="12" cy="12" r="11"></circle>',
};

test('builds sprite correctly', () => {
  expect(buildSpriteString(icons)).toMatchSnapshot();
});


================================================
FILE: bin/__tests__/optimize-svg.test.js
================================================
/* eslint-env jest */
import optimizeSvg from '../optimize-svg';

test('optimizes SVG correctly', () => {
  const SVG =
    '<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><title>Title</title><line x1="23" y1="1" x2="1" y2="23" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/><line x1="1" y1="1" x2="23" y2="23" fill="none" stroke="#000" stroke-linecap="round" stroke-linejoin="round" stroke-width="2"/></svg>';

  expect(optimizeSvg(SVG)).resolves.toMatchSnapshot();
});

test('rejects when passed unparsable SVG string', () => {
  const UNPARSABLE_SVG = '<svg></svg';

  expect(optimizeSvg(UNPARSABLE_SVG)).rejects.toMatchSnapshot();
});


================================================
FILE: bin/build-icons-json.js
================================================
import fs from 'fs';
import path from 'path';

import buildIconsObject from './build-icons-object';

const IN_DIR = path.resolve(__dirname, '../icons');
const OUT_FILE = path.resolve(__dirname, '../dist/icons.json');

console.log(`Building ${OUT_FILE}...`);

const svgFiles = fs
  .readdirSync(IN_DIR)
  .filter(file => path.extname(file) === '.svg');

const getSvg = svgFile => fs.readFileSync(path.join(IN_DIR, svgFile));

const icons = buildIconsObject(svgFiles, getSvg);

fs.writeFileSync(OUT_FILE, JSON.stringify(icons));


================================================
FILE: bin/build-icons-object.js
================================================
import path from 'path';
import cheerio from 'cheerio';
import { minify } from 'html-minifier';

/**
 * Build an object in the format: `{ <name>: <contents> }`.
 * @param {string[]} svgFiles - A list of filenames.
 * @param {Function} getSvg - A function that returns the contents of an SVG file given a filename.
 * @returns {Object}
 */
function buildIconsObject(svgFiles, getSvg) {
  return svgFiles
    .map(svgFile => {
      const name = path.basename(svgFile, '.svg');
      const svg = getSvg(svgFile);
      const contents = getSvgContents(svg);
      return { name, contents };
    })
    .reduce((icons, icon) => {
      icons[icon.name] = icon.contents;
      return icons;
    }, {});
}

/**
 * Get contents between opening and closing `<svg>` tags.
 * @param {string} svg
 * @returns {string}
 */
function getSvgContents(svg) {
  const $ = cheerio.load(svg);
  return minify($('svg').html(), { collapseWhitespace: true });
}

export default buildIconsObject;


================================================
FILE: bin/build-sprite-string.js
================================================
import DEFAULT_ATTRS from '../src/default-attrs.json';

/**
 * Build an SVG sprite string containing SVG symbols.
 * @param {Object} icons
 * @returns {string}
 */
function buildSpriteString(icons) {
  const symbols = Object.keys(icons)
    .map(icon => toSvgSymbol(icon, icons[icon]))
    .join('');

  return `<svg xmlns="${DEFAULT_ATTRS.xmlns}"><defs>${symbols}</defs></svg>`;
}

/**
 * Create an SVG symbol string.
 * @param {string} name - Icon name
 * @param {string} contents - SVG contents
 * @returns {string}
 */
function toSvgSymbol(name, contents) {
  return `<symbol id="${name}" viewBox="${DEFAULT_ATTRS.viewBox}">${contents}</symbol>`;
}

export default buildSpriteString;


================================================
FILE: bin/build-sprite.js
================================================
import fs from 'fs';
import path from 'path';
import icons from '../dist/icons.json';
import buildSpriteString from './build-sprite-string';

const OUT_FILE = path.resolve(__dirname, '../dist/feather-sprite.svg');

console.log(`Building ${OUT_FILE}...`);

fs.writeFileSync(OUT_FILE, buildSpriteString(icons));


================================================
FILE: bin/build-svgs.js
================================================
import fs from 'fs';
import path from 'path';
import icons from '../src/icons';

const OUT_DIR = path.resolve(__dirname, '../dist/icons');

console.log(`Building SVGs in ${OUT_DIR}...`);

Object.keys(icons).forEach(name => {
  const svg = icons[name].toSvg();

  fs.writeFileSync(path.join(OUT_DIR, `${name}.svg`), svg);
});


================================================
FILE: bin/build.sh
================================================
#!/bin/bash

# Create dist directory
npx rimraf dist
mkdir dist

# Build icons.json
npx babel-node bin/build-icons-json.js

# Build SVG sprite
npx babel-node bin/build-sprite.js

# Create dist/icons directory
npx rimraf dist/icons
mkdir dist/icons

# Build SVG icons
npx babel-node bin/build-svgs.js

# Build JavaScript library
npx webpack --output-filename feather.js --mode development
npx webpack --output-filename feather.min.js --mode production


================================================
FILE: bin/optimize-svg.js
================================================
import Svgo from 'svgo';
import cheerio from 'cheerio';

import DEFAULT_ATTRS from '../src/default-attrs.json';

/**
 * Optimize SVG string.
 * @param {string} svg - An SVG string.
 * @returns {Promise<string>}
 */
function optimizeSvg(svg) {
  return svgo(svg).then(setAttrs);
}

/**
 * Run SVGO on SVG string.
 * @param {string} svg - An SVG string.
 * @returns {Promise<string>}
 */
function svgo(svg) {
  const s = new Svgo({
    plugins: [
      { convertShapeToPath: false },
      { mergePaths: false },
      { removeAttrs: { attrs: '(fill|stroke.*)' } },
      { removeTitle: true },
    ],
  });

  return new Promise(resolve => {
    s.optimize(svg, ({ data }) => resolve(data));
  });
}

/**
 * Set default attributes on SVG.
 * @param {string} svg - An SVG string.
 * @returns {string}
 */
function setAttrs(svg) {
  const $ = cheerio.load(svg);

  Object.keys(DEFAULT_ATTRS).forEach(key =>
    $('svg').attr(key, DEFAULT_ATTRS[key]),
  );

  return $('body').html();
}

export default optimizeSvg;


================================================
FILE: bin/optimize-svgs.js
================================================
import fs from 'fs';
import path from 'path';

import optimizeSvg from './optimize-svg';

const IN_DIR = path.resolve(__dirname, '../icons');

console.log(`Optimizing SVGs in ${IN_DIR}...`);

fs.readdirSync(IN_DIR)
  .filter(file => path.extname(file) === '.svg')
  .forEach(svgFile => {
    const svg = fs.readFileSync(path.join(IN_DIR, svgFile));
    optimizeSvg(svg).then(svg =>
      fs.writeFileSync(path.join(IN_DIR, svgFile), svg),
    );
  });


================================================
FILE: bin/setup.sh
================================================
#!/bin/bash

npm install --legacy-peer-deps
npm run build
npm run test:coverage
npm run lint


================================================
FILE: commitlint.config.js
================================================
module.exports = {
  extends: ['@commitlint/config-conventional'],
  rules: {
    'scope-case': [0],
    'subject-case': [2, 'always', 'sentence-case'],
    'header-max-length': [0],
  },
};


================================================
FILE: examples/index.html
================================================
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>Feather</title>
  </head>
  <body>
    <i data-feather="eye"></i>
    <i data-feather="heart"></i>
    <i data-feather="feather"></i>

    <script src="https://unpkg.com/feather-icons"></script>
    <script>
      feather.replace();
    </script>
  </body>
</html>


================================================
FILE: package.json
================================================
{
  "name": "feather-icons",
  "version": "4.29.2",
  "description": "Simply beautiful open source icons",
  "repository": {
    "type": "git",
    "url": "https://github.com/feathericons/feather.git"
  },
  "author": "Cole Bemis <cole@colebemis.com> (https://colebemis.com)",
  "license": "MIT",
  "main": "dist/feather.js",
  "unpkg": "dist/feather.min.js",
  "files": [
    "dist"
  ],
  "scripts": {
    "setup": "./bin/setup.sh",
    "build": "./bin/build.sh",
    "test": "jest",
    "test:watch": "jest --watch",
    "test:coverage": "jest --coverage",
    "lint": "eslint .",
    "format": "prettier --write .",
    "optimize-svgs": "babel-node bin/optimize-svgs.js",
    "release": "yarn build && changeset publish"
  },
  "jest": {
    "collectCoverageFrom": [
      "src/**/*.js"
    ]
  },
  "dependencies": {
    "classnames": "^2.2.5",
    "core-js": "^3.1.3"
  },
  "devDependencies": {
    "@changesets/changelog-github": "^0.4.8",
    "@changesets/cli": "^2.26.2",
    "babel-cli": "^6.24.1",
    "babel-loader": "^7.1.1",
    "babel-preset-env": "^1.7.0",
    "babel-preset-stage-2": "^6.24.1",
    "cheerio": "^1.0.0-rc.2",
    "eslint": "^8.47.0",
    "html-minifier": "^3.5.8",
    "jest": "^22.4.4",
    "prettier": "^2.8.8",
    "svgo": "^0.7.2",
    "webpack": "^4.8.3",
    "webpack-cli": "^2.1.3"
  },
  "prettier": {
    "singleQuote": true,
    "trailingComma": "all",
    "arrowParens": "avoid"
  }
}


================================================
FILE: src/__tests__/__snapshots__/icon.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`constructs icon object correctly 1`] = `
Icon {
  "attrs": Object {
    "class": "feather feather-test",
    "fill": "none",
    "height": 24,
    "stroke": "currentColor",
    "stroke-linecap": "round",
    "stroke-linejoin": "round",
    "stroke-width": 2,
    "viewBox": "0 0 24 24",
    "width": 24,
    "xmlns": "http://www.w3.org/2000/svg",
  },
  "contents": "<line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" />",
  "name": "test",
  "tags": Array [
    "hello",
    "world",
    "foo",
    "bar",
  ],
}
`;

exports[`constructs icon object correctly 2`] = `
Icon {
  "attrs": Object {
    "class": "feather feather-test",
    "fill": "none",
    "height": 24,
    "stroke": "currentColor",
    "stroke-linecap": "round",
    "stroke-linejoin": "round",
    "stroke-width": 2,
    "viewBox": "0 0 24 24",
    "width": 24,
    "xmlns": "http://www.w3.org/2000/svg",
  },
  "contents": "<line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" />",
  "name": "test",
  "tags": Array [],
}
`;

exports[`toString() returns correct string 1`] = `"<line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" />"`;

exports[`toSvg() returns correct string 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-test\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;

exports[`toSvg() returns correct string 2`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-test\\" color=\\"red\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;

exports[`toSvg() returns correct string 3`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-test foo bar\\" color=\\"red\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;


================================================
FILE: src/__tests__/__snapshots__/icons.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`exports correct object 1`] = `
Object {
  "icon1": Icon {
    "attrs": Object {
      "class": "feather feather-icon1",
      "fill": "none",
      "height": 24,
      "stroke": "currentColor",
      "stroke-linecap": "round",
      "stroke-linejoin": "round",
      "stroke-width": 2,
      "viewBox": "0 0 24 24",
      "width": 24,
      "xmlns": "http://www.w3.org/2000/svg",
    },
    "contents": "<line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" />",
    "name": "icon1",
    "tags": Array [
      "foo",
      "bar",
      "hello",
      "world",
    ],
  },
  "icon2": Icon {
    "attrs": Object {
      "class": "feather feather-icon2",
      "fill": "none",
      "height": 24,
      "stroke": "currentColor",
      "stroke-linecap": "round",
      "stroke-linejoin": "round",
      "stroke-width": 2,
      "viewBox": "0 0 24 24",
      "width": 24,
      "xmlns": "http://www.w3.org/2000/svg",
    },
    "contents": "<circle cx=\\"12\\" cy=\\"12\\" r=\\"11\\" />",
    "name": "icon2",
    "tags": Array [],
  },
}
`;


================================================
FILE: src/__tests__/__snapshots__/replace.node.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`throws an error when run in node environment 1`] = `"\`feather.replace()\` only works in a browser environment."`;


================================================
FILE: src/__tests__/__snapshots__/replace.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`copies placeholder element attributes to <svg> tag 1`] = `"<i data-feather=\\"icon1\\" id=\\"test\\" class=\\"foo bar\\" stroke-width=\\"1\\"></i>"`;

exports[`copies placeholder element attributes to <svg> tag 2`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1 foo bar\\" id=\\"test\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"></line><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"></line></svg>"`;

exports[`replaces [data-feather] elements with SVG markup 1`] = `"<i data-feather=\\"icon1\\"></i><span data-feather=\\"icon2\\"></span>"`;

exports[`replaces [data-feather] elements with SVG markup 2`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"></line><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"></line></svg><svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon2\\"><circle cx=\\"12\\" cy=\\"12\\" r=\\"11\\"></circle></svg>"`;

exports[`sets attributes passed as parameters 1`] = `"<i data-feather=\\"icon1\\" id=\\"test\\" class=\\"foo bar\\" stroke-width=\\"1\\"></i>"`;

exports[`sets attributes passed as parameters 2`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1 foo bar hello\\" color=\\"salmon\\" id=\\"test\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\"></line><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\"></line></svg>"`;


================================================
FILE: src/__tests__/__snapshots__/to-svg.test.js.snap
================================================
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`returns correct string 1`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;

exports[`returns correct string 2`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"1\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1\\" color=\\"red\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;

exports[`returns correct string 3`] = `"<svg xmlns=\\"http://www.w3.org/2000/svg\\" width=\\"24\\" height=\\"24\\" viewBox=\\"0 0 24 24\\" fill=\\"none\\" stroke=\\"currentColor\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\" class=\\"feather feather-icon1 foo bar\\" color=\\"red\\"><line x1=\\"23\\" y1=\\"1\\" x2=\\"1\\" y2=\\"23\\" /><line x1=\\"1\\" y1=\\"1\\" x2=\\"23\\" y2=\\"23\\" /></svg>"`;


================================================
FILE: src/__tests__/icon.test.js
================================================
/* eslint-env jest */
import Icon from '../icon';

const icon1 = new Icon(
  'test',
  '<line x1="23" y1="1" x2="1" y2="23" /><line x1="1" y1="1" x2="23" y2="23" />',
  ['hello', 'world', 'foo', 'bar'],
);

const icon2 = new Icon(
  'test',
  '<line x1="23" y1="1" x2="1" y2="23" /><line x1="1" y1="1" x2="23" y2="23" />',
);

test('constructs icon object correctly', () => {
  expect(icon1).toMatchSnapshot();
  expect(icon2).toMatchSnapshot();
});

test('toSvg() returns correct string', () => {
  expect(icon1.toSvg()).toMatchSnapshot();
  expect(icon1.toSvg({ 'stroke-width': 1, color: 'red' })).toMatchSnapshot();
  expect(icon1.toSvg({ class: 'foo bar', color: 'red' })).toMatchSnapshot();
});

test('toString() returns correct string', () => {
  expect(icon1.toString()).toMatchSnapshot();
});


================================================
FILE: src/__tests__/icons.test.js
================================================
/* eslint-env jest */
import icons from '../icons';

jest.mock('../../dist/icons.json', () => ({
  icon1:
    '<line x1="23" y1="1" x2="1" y2="23" /><line x1="1" y1="1" x2="23" y2="23" />',
  icon2: '<circle cx="12" cy="12" r="11" />',
}));

jest.mock('../tags.json', () => ({
  icon1: ['foo', 'bar', 'hello', 'world'],
}));

test('exports correct object', () => {
  expect(icons).toMatchSnapshot();
});


================================================
FILE: src/__tests__/index.test.js
================================================
/* eslint-env jest */
import feather from '../index';

test('has correct properties', () => {
  expect(feather).toHaveProperty('icons');
  expect(feather).toHaveProperty('toSvg');
  expect(feather).toHaveProperty('replace');
});


================================================
FILE: src/__tests__/replace.node.test.js
================================================
/**
 * @jest-environment node
 */

/* eslint-env jest */
import replace from '../replace';

test('throws an error when run in node environment', () => {
  expect(replace).toThrowErrorMatchingSnapshot();
});


================================================
FILE: src/__tests__/replace.test.js
================================================
/* eslint-env jest, browser */
import replace from '../replace';

jest.mock('../../dist/icons.json', () => ({
  icon1:
    '<line x1="23" y1="1" x2="1" y2="23" /><line x1="1" y1="1" x2="23" y2="23" />',
  icon2: '<circle cx="12" cy="12" r="11" />',
}));

test('replaces [data-feather] elements with SVG markup', () => {
  document.body.innerHTML =
    '<i data-feather="icon1"></i><span data-feather="icon2"></i>';
  expect(document.body.innerHTML).toMatchSnapshot();
  replace();
  expect(document.body.innerHTML).toMatchSnapshot();
});

test('copies placeholder element attributes to <svg> tag', () => {
  document.body.innerHTML =
    '<i data-feather="icon1" id="test" class="foo bar" stroke-width="1"></i>';
  expect(document.body.innerHTML).toMatchSnapshot();
  replace();
  expect(document.body.innerHTML).toMatchSnapshot();
});

test('sets attributes passed as parameters', () => {
  document.body.innerHTML =
    '<i data-feather="icon1" id="test" class="foo bar" stroke-width="1"></i>';
  expect(document.body.innerHTML).toMatchSnapshot();
  replace({ class: 'foo bar hello', 'stroke-width': 1.5, color: 'salmon' });
  expect(document.body.innerHTML).toMatchSnapshot();
});


================================================
FILE: src/__tests__/to-svg.test.js
================================================
/* eslint-env jest */
import toSvg from '../to-svg';

jest.mock('../../dist/icons.json', () => ({
  icon1:
    '<line x1="23" y1="1" x2="1" y2="23" /><line x1="1" y1="1" x2="23" y2="23" />',
}));

test('returns correct string', () => {
  expect(toSvg('icon1')).toMatchSnapshot();
  expect(toSvg('icon1', { 'stroke-width': 1, color: 'red' })).toMatchSnapshot();
  expect(toSvg('icon1', { class: 'foo bar', color: 'red' })).toMatchSnapshot();
});

test('throws error when `name` parameter is undefined', () => {
  expect(() => toSvg()).toThrow();
});

test('throws error when passed unknown icon name', () => {
  expect(() => toSvg('foo')).toThrow();
});


================================================
FILE: src/default-attrs.json
================================================
{
  "xmlns": "http://www.w3.org/2000/svg",
  "width": 24,
  "height": 24,
  "viewBox": "0 0 24 24",
  "fill": "none",
  "stroke": "currentColor",
  "stroke-width": 2,
  "stroke-linecap": "round",
  "stroke-linejoin": "round"
}


================================================
FILE: src/icon.js
================================================
import classnames from 'classnames/dedupe';

import DEFAULT_ATTRS from './default-attrs.json';

class Icon {
  constructor(name, contents, tags = []) {
    this.name = name;
    this.contents = contents;
    this.tags = tags;
    this.attrs = {
      ...DEFAULT_ATTRS,
      ...{ class: `feather feather-${name}` },
    };
  }

  /**
   * Create an SVG string.
   * @param {Object} attrs
   * @returns {string}
   */
  toSvg(attrs = {}) {
    const combinedAttrs = {
      ...this.attrs,
      ...attrs,
      ...{ class: classnames(this.attrs.class, attrs.class) },
    };

    return `<svg ${attrsToString(combinedAttrs)}>${this.contents}</svg>`;
  }

  /**
   * Return string representation of an `Icon`.
   *
   * Added for backward compatibility. If old code expects `feather.icons.<name>`
   * to be a string, `toString()` will get implicitly called.
   *
   * @returns {string}
   */
  toString() {
    return this.contents;
  }
}

/**
 * Convert attributes object to string of HTML attributes.
 * @param {Object} attrs
 * @returns {string}
 */
function attrsToString(attrs) {
  return Object.keys(attrs)
    .map(key => `${key}="${attrs[key]}"`)
    .join(' ');
}

export default Icon;


================================================
FILE: src/icons.js
================================================
import Icon from './icon';
import icons from '../dist/icons.json';
import tags from './tags.json';

export default Object.keys(icons)
  .map(key => new Icon(key, icons[key], tags[key]))
  .reduce((object, icon) => {
    object[icon.name] = icon;
    return object;
  }, {});


================================================
FILE: src/index.js
================================================
import icons from './icons';
import toSvg from './to-svg';
import replace from './replace';

module.exports = { icons, toSvg, replace };


================================================
FILE: src/replace.js
================================================
/* eslint-env browser */
import classnames from 'classnames/dedupe';

import icons from './icons';

/**
 * Replace all HTML elements that have a `data-feather` attribute with SVG markup
 * corresponding to the element's `data-feather` attribute value.
 * @param {Object} attrs
 */
function replace(attrs = {}) {
  if (typeof document === 'undefined') {
    throw new Error('`feather.replace()` only works in a browser environment.');
  }

  const elementsToReplace = document.querySelectorAll('[data-feather]');

  Array.from(elementsToReplace).forEach(element =>
    replaceElement(element, attrs),
  );
}

/**
 * Replace a single HTML element with SVG markup
 * corresponding to the element's `data-feather` attribute value.
 * @param {HTMLElement} element
 * @param {Object} attrs
 */
function replaceElement(element, attrs = {}) {
  const elementAttrs = getAttrs(element);
  const name = elementAttrs['data-feather'];
  delete elementAttrs['data-feather'];

  if (icons[name] === undefined) {
    console.warn(`feather: '${name}' is not a valid icon`);
    return;
  }

  const svgString = icons[name].toSvg({
    ...attrs,
    ...elementAttrs,
    ...{ class: classnames(attrs.class, elementAttrs.class) },
  });
  const svgDocument = new DOMParser().parseFromString(
    svgString,
    'image/svg+xml',
  );
  const svgElement = svgDocument.querySelector('svg');

  element.parentNode.replaceChild(svgElement, element);
}

/**
 * Get the attributes of an HTML element.
 * @param {HTMLElement} element
 * @returns {Object}
 */
function getAttrs(element) {
  return Array.from(element.attributes).reduce((attrs, attr) => {
    attrs[attr.name] = attr.value;
    return attrs;
  }, {});
}

export default replace;


================================================
FILE: src/tags.json
================================================
{
  "activity": ["pulse", "health", "action", "motion"],
  "airplay": ["stream", "cast", "mirroring"],
  "alert-circle": ["warning", "alert", "danger"],
  "alert-octagon": ["warning", "alert", "danger"],
  "alert-triangle": ["warning", "alert", "danger"],
  "align-center": ["text alignment", "center"],
  "align-justify": ["text alignment", "justified"],
  "align-left": ["text alignment", "left"],
  "align-right": ["text alignment", "right"],
  "anchor": [],
  "archive": ["index", "box"],
  "at-sign": ["mention", "at", "email", "message"],
  "award": ["achievement", "badge"],
  "aperture": ["camera", "photo"],
  "bar-chart": ["statistics", "diagram", "graph"],
  "bar-chart-2": ["statistics", "diagram", "graph"],
  "battery": ["power", "electricity"],
  "battery-charging": ["power", "electricity"],
  "bell": ["alarm", "notification", "sound"],
  "bell-off": ["alarm", "notification", "silent"],
  "bluetooth": ["wireless"],
  "book-open": ["read", "library"],
  "book": ["read", "dictionary", "booklet", "magazine", "library"],
  "bookmark": ["read", "clip", "marker", "tag"],
  "box": ["cube"],
  "briefcase": ["work", "bag", "baggage", "folder"],
  "calendar": ["date"],
  "camera": ["photo"],
  "cast": ["chromecast", "airplay"],
  "chevron-down": ["expand"],
  "chevron-up": ["collapse"],
  "circle": ["off", "zero", "record"],
  "clipboard": ["copy"],
  "clock": ["time", "watch", "alarm"],
  "cloud-drizzle": ["weather", "shower"],
  "cloud-lightning": ["weather", "bolt"],
  "cloud-rain": ["weather"],
  "cloud-snow": ["weather", "blizzard"],
  "cloud": ["weather"],
  "codepen": ["logo"],
  "codesandbox": ["logo"],
  "code": ["source", "programming"],
  "coffee": ["drink", "cup", "mug", "tea", "cafe", "hot", "beverage"],
  "columns": ["layout"],
  "command": ["keyboard", "cmd", "terminal", "prompt"],
  "compass": ["navigation", "safari", "travel", "direction"],
  "copy": ["clone", "duplicate"],
  "corner-down-left": ["arrow", "return"],
  "corner-down-right": ["arrow"],
  "corner-left-down": ["arrow"],
  "corner-left-up": ["arrow"],
  "corner-right-down": ["arrow"],
  "corner-right-up": ["arrow"],
  "corner-up-left": ["arrow"],
  "corner-up-right": ["arrow"],
  "cpu": ["processor", "technology"],
  "credit-card": ["purchase", "payment", "cc"],
  "crop": ["photo", "image"],
  "crosshair": ["aim", "target"],
  "database": ["storage", "memory"],
  "delete": ["remove"],
  "disc": ["album", "cd", "dvd", "music"],
  "dollar-sign": ["currency", "money", "payment"],
  "droplet": ["water"],
  "edit": ["pencil", "change"],
  "edit-2": ["pencil", "change"],
  "edit-3": ["pencil", "change"],
  "eye": ["view", "watch"],
  "eye-off": ["view", "watch", "hide", "hidden"],
  "external-link": ["outbound"],
  "facebook": ["logo", "social"],
  "fast-forward": ["music"],
  "figma": ["logo", "design", "tool"],
  "file-minus": ["delete", "remove", "erase"],
  "file-plus": ["add", "create", "new"],
  "file-text": ["data", "txt", "pdf"],
  "film": ["movie", "video"],
  "filter": ["funnel", "hopper"],
  "flag": ["report"],
  "folder-minus": ["directory"],
  "folder-plus": ["directory"],
  "folder": ["directory"],
  "framer": ["logo", "design", "tool"],
  "frown": ["emoji", "face", "bad", "sad", "emotion"],
  "gift": ["present", "box", "birthday", "party"],
  "git-branch": ["code", "version control"],
  "git-commit": ["code", "version control"],
  "git-merge": ["code", "version control"],
  "git-pull-request": ["code", "version control"],
  "github": ["logo", "version control"],
  "gitlab": ["logo", "version control"],
  "globe": ["world", "browser", "language", "translate"],
  "hard-drive": ["computer", "server", "memory", "data"],
  "hash": ["hashtag", "number", "pound"],
  "headphones": ["music", "audio", "sound"],
  "heart": ["like", "love", "emotion"],
  "help-circle": ["question mark"],
  "hexagon": ["shape", "node.js", "logo"],
  "home": ["house", "living"],
  "image": ["picture"],
  "inbox": ["email"],
  "instagram": ["logo", "camera"],
  "key": ["password", "login", "authentication", "secure"],
  "layers": ["stack"],
  "layout": ["window", "webpage"],
  "life-buoy": ["help", "life ring", "support"],
  "link": ["chain", "url"],
  "link-2": ["chain", "url"],
  "linkedin": ["logo", "social media"],
  "list": ["options"],
  "lock": ["security", "password", "secure"],
  "log-in": ["sign in", "arrow", "enter"],
  "log-out": ["sign out", "arrow", "exit"],
  "mail": ["email", "message"],
  "map-pin": ["location", "navigation", "travel", "marker"],
  "map": ["location", "navigation", "travel"],
  "maximize": ["fullscreen"],
  "maximize-2": ["fullscreen", "arrows", "expand"],
  "meh": ["emoji", "face", "neutral", "emotion"],
  "menu": ["bars", "navigation", "hamburger"],
  "message-circle": ["comment", "chat"],
  "message-square": ["comment", "chat"],
  "mic-off": ["record", "sound", "mute"],
  "mic": ["record", "sound", "listen"],
  "minimize": ["exit fullscreen", "close"],
  "minimize-2": ["exit fullscreen", "arrows", "close"],
  "minus": ["subtract"],
  "monitor": ["tv", "screen", "display"],
  "moon": ["dark", "night"],
  "more-horizontal": ["ellipsis"],
  "more-vertical": ["ellipsis"],
  "mouse-pointer": ["arrow", "cursor"],
  "move": ["arrows"],
  "music": ["note"],
  "navigation": ["location", "travel"],
  "navigation-2": ["location", "travel"],
  "octagon": ["stop"],
  "package": ["box", "container"],
  "paperclip": ["attachment"],
  "pause": ["music", "stop"],
  "pause-circle": ["music", "audio", "stop"],
  "pen-tool": ["vector", "drawing"],
  "percent": ["discount"],
  "phone-call": ["ring"],
  "phone-forwarded": ["call"],
  "phone-incoming": ["call"],
  "phone-missed": ["call"],
  "phone-off": ["call", "mute"],
  "phone-outgoing": ["call"],
  "phone": ["call"],
  "play": ["music", "start"],
  "pie-chart": ["statistics", "diagram"],
  "play-circle": ["music", "start"],
  "plus": ["add", "new"],
  "plus-circle": ["add", "new"],
  "plus-square": ["add", "new"],
  "pocket": ["logo", "save"],
  "power": ["on", "off"],
  "printer": ["fax", "office", "device"],
  "radio": ["signal"],
  "refresh-cw": ["synchronise", "arrows"],
  "refresh-ccw": ["arrows"],
  "repeat": ["loop", "arrows"],
  "rewind": ["music"],
  "rotate-ccw": ["arrow"],
  "rotate-cw": ["arrow"],
  "rss": ["feed", "subscribe"],
  "save": ["floppy disk"],
  "scissors": ["cut"],
  "search": ["find", "magnifier", "magnifying glass"],
  "send": ["message", "mail", "email", "paper airplane", "paper aeroplane"],
  "settings": ["cog", "edit", "gear", "preferences"],
  "share-2": ["network", "connections"],
  "shield": ["security", "secure"],
  "shield-off": ["security", "insecure"],
  "shopping-bag": ["ecommerce", "cart", "purchase", "store"],
  "shopping-cart": ["ecommerce", "cart", "purchase", "store"],
  "shuffle": ["music"],
  "skip-back": ["music"],
  "skip-forward": ["music"],
  "slack": ["logo"],
  "slash": ["ban", "no"],
  "sliders": ["settings", "controls"],
  "smartphone": ["cellphone", "device"],
  "smile": ["emoji", "face", "happy", "good", "emotion"],
  "speaker": ["audio", "music"],
  "star": ["bookmark", "favorite", "like"],
  "stop-circle": ["media", "music"],
  "sun": ["brightness", "weather", "light"],
  "sunrise": ["weather", "time", "morning", "day"],
  "sunset": ["weather", "time", "evening", "night"],
  "tablet": ["device"],
  "tag": ["label"],
  "target": ["logo", "bullseye"],
  "terminal": ["code", "command line", "prompt"],
  "thermometer": ["temperature", "celsius", "fahrenheit", "weather"],
  "thumbs-down": ["dislike", "bad", "emotion"],
  "thumbs-up": ["like", "good", "emotion"],
  "toggle-left": ["on", "off", "switch"],
  "toggle-right": ["on", "off", "switch"],
  "tool": ["settings", "spanner"],
  "trash": ["garbage", "delete", "remove", "bin"],
  "trash-2": ["garbage", "delete", "remove", "bin"],
  "triangle": ["delta"],
  "truck": ["delivery", "van", "shipping", "transport", "lorry"],
  "tv": ["television", "stream"],
  "twitch": ["logo"],
  "twitter": ["logo", "social"],
  "type": ["text"],
  "umbrella": ["rain", "weather"],
  "unlock": ["security"],
  "user-check": ["followed", "subscribed"],
  "user-minus": ["delete", "remove", "unfollow", "unsubscribe"],
  "user-plus": ["new", "add", "create", "follow", "subscribe"],
  "user-x": ["delete", "remove", "unfollow", "unsubscribe", "unavailable"],
  "user": ["person", "account"],
  "users": ["group"],
  "video-off": ["camera", "movie", "film"],
  "video": ["camera", "movie", "film"],
  "voicemail": ["phone"],
  "volume": ["music", "sound", "mute"],
  "volume-1": ["music", "sound"],
  "volume-2": ["music", "sound"],
  "volume-x": ["music", "sound", "mute"],
  "watch": ["clock", "time"],
  "wifi-off": ["disabled"],
  "wifi": ["connection", "signal", "wireless"],
  "wind": ["weather", "air"],
  "x-circle": ["cancel", "close", "delete", "remove", "times", "clear"],
  "x-octagon": ["delete", "stop", "alert", "warning", "times", "clear"],
  "x-square": ["cancel", "close", "delete", "remove", "times", "clear"],
  "x": ["cancel", "close", "delete", "remove", "times", "clear"],
  "youtube": ["logo", "video", "play"],
  "zap-off": ["flash", "camera", "lightning"],
  "zap": ["flash", "camera", "lightning"],
  "zoom-in": ["magnifying glass"],
  "zoom-out": ["magnifying glass"]
}


================================================
FILE: src/to-svg.js
================================================
import icons from './icons';

/**
 * Create an SVG string.
 * @deprecated
 * @param {string} name
 * @param {Object} attrs
 * @returns {string}
 */
function toSvg(name, attrs = {}) {
  console.warn(
    'feather.toSvg() is deprecated. Please use feather.icons[name].toSvg() instead.',
  );

  if (!name) {
    throw new Error('The required `key` (icon name) parameter is missing.');
  }

  if (!icons[name]) {
    throw new Error(
      `No icon matching '${name}'. See the complete list of icons at https://feathericons.com`,
    );
  }

  return icons[name].toSvg(attrs);
}

export default toSvg;


================================================
FILE: webpack.config.js
================================================
const path = require('path');

module.exports = {
  entry: ['core-js/es/array/from', path.resolve(__dirname, 'src/index.js')],
  output: {
    path: path.resolve(__dirname, 'dist'),
    libraryTarget: 'umd',
    library: 'feather',
    // Prevents webpack from referencing `window` in the UMD build
    // Source: https://git.io/vppgU
    globalObject: "typeof self !== 'undefined' ? self : this",
  },
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.js$/,
        loader: 'babel-loader',
        exclude: /node_modules/,
      },
    ],
  },
};