@PayPing/icon package

How to add new icon

1. Get svg format of the new icon and add its file to images folder.

If you need to add initial conversions for your SVG code you can run the svgo script for your file

svgo -i src/images/Add.svg

2. The new icon's viewBox attribute should be the following:

 viewBox="0 0 24 24"

3. If viewBox needs to be changed, the size of our icon should also change, so we should open it with a svg editor (e.g. inkscape) and edit its size to fill the new viewBox.
4. After editing, we should save the new icon as Optimized svg (to remove all unnecessary attributes).
5. Depending on the type of icon we might need fill="currentColor" (e.g. ant icons) or fill="none" stroke="currentColor" (e.g. feather icons).

How build works

1. Initially there is only an images folder inside our src folder.
2. When build script is executed it will generate the icons folder by compiling images with .svgorc.json config.
3. This config files includes the required attribute that should be added to all icons (e.g. className="PayPing-icon).
4. A complete list for this config file is available at SVGO repo.

How to publish

1. Create a release branch for the new version.
2. Increase the version in package.json file.
3. Run customPublish script to publish it to npm.
4. Close release branch.