Give Woo Icon special treatment by making it a component (https://github.com/woocommerce/woocommerce-blocks/pull/1702)

* fix broken woo icon

* treat woo icon in a special way

* fix propType typo
This commit is contained in:
Seghir Nadir 2020-02-10 14:24:02 +01:00 committed by GitHub
parent 58867bc328
commit a39426495d
3 changed files with 12 additions and 13 deletions

View File

@ -16,7 +16,7 @@ function Icon( { srcElement, size = 24, ...props } ) {
);
}
Icon.PropTypes = {
Icon.propTypes = {
srcElement: PropTypes.oneOfType( [
PropTypes.instanceOf( SVG ),
// HTMLImageElement is a global interface

View File

@ -2,9 +2,15 @@
* External dependencies
*/
import { SVG } from '@wordpress/components';
const woo = (
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 245 145">
import classnames from 'classnames';
const woo = ( { className, size } ) => (
<SVG
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 245 145"
className={ classnames( 'woo-icon', className ) }
width={ Math.floor( size * 1.67 ) }
height={ size }
>
<path
fill="#96588A"
d="M22.76 0h199.1a22.77 22.77 0 0 1 22.8 22.76v75.92a22.77 22.77 0 0 1-22.78 22.78h-71.41l9.77 24-43.13-24H22.76C10.1946 121.449.011 111.2654 0 98.7V22.76C.011 10.1946 10.1946.011 22.76 0z"

View File

@ -3,7 +3,7 @@
*/
import { getCategories, setCategories } from '@wordpress/blocks';
import { __ } from '@wordpress/i18n';
import { Icon, woo } from '@woocommerce/icons';
import { woo as Icon } from '@woocommerce/icons';
/**
* Internal dependencies
@ -19,13 +19,6 @@ setCategories( [
{
slug: 'woocommerce',
title: __( 'WooCommerce', 'woo-gutenberg-products-block' ),
icon: (
<Icon
icon={ woo }
width={ Math.floor( 20 * 1.67 ) }
height={ 20 }
className="woo-icon"
/>
),
icon: <Icon />,
},
] );