Steve-Dee-Designs
/
woocommerce
mirror of https://github.com/woocommerce/woocommerce.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity
woocommerce/plugins/woocommerce-blocks/assets/js/icons
History
dependabot[bot] 471b9a1b60 Bump @wordpress/icons from 6.1.1 to 9.36.0 (https://github.com/woocommerce/woocommerce-blocks/pull/11611) 
* Bump @wordpress/icons from 6.1.1 to 9.36.0

Bumps [@wordpress/icons](https://github.com/WordPress/gutenberg/tree/HEAD/packages/icons) from 6.1.1 to 9.36.0.
- [Release notes](https://github.com/WordPress/gutenberg/releases)
- [Changelog](https://github.com/WordPress/gutenberg/blob/trunk/packages/icons/CHANGELOG.md)
- [Commits](https://github.com/WordPress/gutenberg/commits/@wordpress/icons@9.36.0/packages/icons)

---
updated-dependencies:
- dependency-name: "@wordpress/icons"
  dependency-type: direct:production
  update-type: version-update:semver-major
...

Signed-off-by: dependabot[bot] <support@github.com>

* Add sparkles icon to codebase

* Fix failing JS-unit tests

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
Co-authored-by: Niels Lange <info@nielslange.de>
 		2023-11-16 17:40:53 +00:00
..
docs Add Notices Documentation to Storybook and upgrade to Storybook 7 (https://github.com/woocommerce/woocommerce-blocks/pull/11524) 2023-11-02 13:01:42 +00:00
library Bump @wordpress/icons from 6.1.1 to 9.36.0 (https://github.com/woocommerce/woocommerce-blocks/pull/11611) 2023-11-16 17:40:53 +00:00
README.md Improve the structure of the WooCommerce Blocks Handbook (https://github.com/woocommerce/woocommerce-blocks/pull/6429) 2022-06-09 17:52:19 +02:00
index.js Bump @wordpress/icons from 6.1.1 to 9.36.0 (https://github.com/woocommerce/woocommerce-blocks/pull/11611) 2023-11-16 17:40:53 +00:00

README.md

Icons

Table of contents

WooCommerce Blocks Icons Library.

Usage

Note we use the Icon component from @wordpress/icons. We use some SVG icons from @woocommerce/icons for WC Blocks specific icons, but we also use existing icons from @wordpress/icons.

import { woo } from '@woocommerce/icons';
import { Icon, postComments } from '@wordpress/icons';

<Icon icon={ woo } /> // icon  from '@woocommerce/icons'
<Icon icon={ postComments } /> // icon from '@wordpress/icons'
<Icon icon={ woo } size={ 16 } />
<Icon icon={ woo } width={ 20 } height={ Math.floor( 20 * 1.67 ) } />

Adding Icons

Before adding a new icon, make sure the icon is not already included in the Library that comes with @wordpress/icons package. If there is no existing icon suitable:

  1. Add the icon file to ./library folder.
  2. Make sure to use SVG primitive from @wordpress/primitives and not a native svg. SVG offers more accessibility features.
  3. Remove width and height since they're handled by Icon.
  4. Remove any hardcoded colors on the svg. If necessary, use CurrentColor.
  5. Export the Icon in ./library/index.js.

We're hiring! Come work with us!

🐞 Found a mistake, or have a suggestion? Leave feedback about this document here.