first commit
This commit is contained in:
@@ -0,0 +1,19 @@
|
||||
export { default as barcode } from './library/barcode';
|
||||
export { default as cart } from './library/cart';
|
||||
export { default as checkPayment } from './library/check-payment';
|
||||
export { default as eye } from './library/eye';
|
||||
export { default as fields } from './library/fields';
|
||||
export { default as filledCart } from './library/filled-cart';
|
||||
export { default as folderStarred } from './library/folder-starred';
|
||||
export { default as removeCart } from './library/remove-cart';
|
||||
export { default as thumbUp } from './library/thumb-up';
|
||||
export { default as toggle } from './library/toggle';
|
||||
export { default as totals } from './library/totals';
|
||||
export { default as woo } from './library/woo';
|
||||
export { default as miniCart } from './library/mini-cart';
|
||||
export { default as miniCartAlt } from './library/mini-cart-alt';
|
||||
export { default as stacks } from './library/stacks';
|
||||
export { default as Alert } from './library/alert';
|
||||
export { default as customerAccount } from './library/customer-account';
|
||||
export { default as customerAccountStyle } from './library/customer-account-style';
|
||||
export { default as customerAccountStyleAlt } from './library/customer-account-style-alt';
|
||||
@@ -0,0 +1,36 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { IconProps } from '@wordpress/icons/build-types/icon';
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
interface AlertProps {
|
||||
status?: 'warning' | 'error' | 'success' | 'info';
|
||||
props?: IconProps;
|
||||
}
|
||||
|
||||
const statusToColorMap = {
|
||||
warning: '#F0B849',
|
||||
error: '#CC1818',
|
||||
success: '#46B450',
|
||||
info: '#0073AA',
|
||||
};
|
||||
|
||||
const Alert = ( { status = 'warning', ...props }: AlertProps ) => (
|
||||
<SVG
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
{ ...props }
|
||||
>
|
||||
<path
|
||||
d="M12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z"
|
||||
stroke={ statusToColorMap[ status ] }
|
||||
strokeWidth="1.5"
|
||||
/>
|
||||
<path d="M13 7H11V13H13V7Z" fill={ statusToColorMap[ status ] } />
|
||||
<path d="M13 15H11V17H13V15Z" fill={ statusToColorMap[ status ] } />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default Alert;
|
||||
@@ -0,0 +1,12 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const barcode = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<path d="M2 6h2v12H2V6m3 0h1v12H5V6m2 0h3v12H7V6m4 0h1v12h-1V6m3 0h2v12h-2V6m3 0h3v12h-3V6m4 0h1v12h-1V6z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default barcode;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const cart = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<path fill="none" d="M0 0h24v24H0V0z" />
|
||||
<path d="M15.55 13c.75 0 1.41-.41 1.75-1.03l3.58-6.49c.37-.66-.11-1.48-.87-1.48H5.21l-.94-2H1v2h2l3.6 7.59-1.35 2.44C4.52 15.37 5.48 17 7 17h12v-2H7l1.1-2h7.45zM6.16 6h12.15l-2.76 5H8.53L6.16 6zM7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default cart;
|
||||
@@ -0,0 +1,24 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const checkPayment = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<g fill="none" fillRule="evenodd">
|
||||
<path d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="#000"
|
||||
fillRule="nonzero"
|
||||
d="M17.3 8v1c1 .2 1.4.9 1.4 1.7h-1c0-.6-.3-1-1-1-.8 0-1.3.4-1.3.9 0 .4.3.6 1.4 1 1 .2 2 .6 2 1.9 0 .9-.6 1.4-1.5 1.5v1H16v-1c-.9-.1-1.6-.7-1.7-1.7h1c0 .6.4 1 1.3 1 1 0 1.2-.5 1.2-.8 0-.4-.2-.8-1.3-1.1-1.3-.3-2.1-.8-2.1-1.8 0-.9.7-1.5 1.6-1.6V8h1.3zM12 10v1H6v-1h6zm2-2v1H6V8h8zM2 4v16h20V4H2zm2 14V6h16v12H4z"
|
||||
/>
|
||||
<path
|
||||
stroke="#000"
|
||||
strokeLinecap="round"
|
||||
d="M6 16c2.6 0 3.9-3 1.7-3-2 0-1 3 1.5 3 1 0 1-.8 2.8-.8"
|
||||
/>
|
||||
</g>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default checkPayment;
|
||||
@@ -0,0 +1,15 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const customerAccountStyleAlt = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 18 18">
|
||||
<path
|
||||
d="M9 0C4.03579 0 0 4.03579 0 9C0 13.9642 4.03579 18 9 18C13.9642 18 18 13.9642 18 9C18 4.03579 13.9642 0 9 0ZM9 4.32C10.5347 4.32 11.7664 5.57056 11.7664 7.08638C11.7664 8.62109 10.5158 9.85277 9 9.85277C7.4653 9.85277 6.23362 8.60221 6.23362 7.08638C6.23362 5.57056 7.46526 4.32 9 4.32ZM9 10.7242C11.1221 10.7242 12.96 12.2021 13.7937 14.4189C12.5242 15.5559 10.8379 16.238 9 16.238C7.16207 16.238 5.49474 15.5369 4.20632 14.4189C5.05891 12.2021 6.87793 10.7242 9 10.7242Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default customerAccountStyleAlt;
|
||||
@@ -0,0 +1,17 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const customerAccountStyle = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M8.00009 8.34785C10.3096 8.34785 12.1819 6.47909 12.1819 4.17393C12.1819 1.86876 10.3096 0 8.00009 0C5.69055 0 3.81824 1.86876 3.81824 4.17393C3.81824 6.47909 5.69055 8.34785 8.00009 8.34785ZM0.333496 15.6522C0.333496 15.8444 0.489412 16 0.681933 16H15.3184C15.5109 16 15.6668 15.8444 15.6668 15.6522V14.9565C15.6668 12.1428 13.7821 9.73911 10.0912 9.73911H5.90931C2.21828 9.73911 0.333645 12.1428 0.333645 14.9565L0.333496 15.6522Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default customerAccountStyle;
|
||||
@@ -0,0 +1,18 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const customerAccount = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<path
|
||||
id="icon/action/account_circle_24px_2"
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
fill="currentColor"
|
||||
d="M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM7.07 18.28C7.5 17.38 10.12 16.5 12 16.5C13.88 16.5 16.51 17.38 16.93 18.28C15.57 19.36 13.86 20 12 20C10.14 20 8.43 19.36 7.07 18.28ZM12 14.5C13.46 14.5 16.93 15.09 18.36 16.83C19.38 15.49 20 13.82 20 12C20 7.59 16.41 4 12 4C7.59 4 4 7.59 4 12C4 13.82 4.62 15.49 5.64 16.83C7.07 15.09 10.54 14.5 12 14.5ZM12 6C10.06 6 8.5 7.56 8.5 9.5C8.5 11.44 10.06 13 12 13C13.94 13 15.5 11.44 15.5 9.5C15.5 7.56 13.94 6 12 6ZM10.5 9.5C10.5 10.33 11.17 11 12 11C12.83 11 13.5 10.33 13.5 9.5C13.5 8.67 12.83 8 12 8C11.17 8 10.5 8.67 10.5 9.5Z"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default customerAccount;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const eye = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<path fill="none" d="M0 0h24v24H0V0z" />
|
||||
<path d="M12 6a9.77 9.77 0 0 1 8.82 5.5C19.17 14.87 15.79 17 12 17s-7.17-2.13-8.82-5.5A9.77 9.77 0 0 1 12 6m0-2C7 4 2.73 7.11 1 11.5 2.73 15.89 7 19 12 19s9.27-3.11 11-7.5C21.27 7.11 17 4 12 4zm0 5a2.5 2.5 0 0 1 0 5 2.5 2.5 0 0 1 0-5m0-2c-2.48 0-4.5 2.02-4.5 4.5S9.52 16 12 16s4.5-2.02 4.5-4.5S14.48 7 12 7z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default eye;
|
||||
@@ -0,0 +1,23 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const fields = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24" fill="none">
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeWidth="1.5"
|
||||
fill="none"
|
||||
d="M5 3.75h14c.69 0 1.25.56 1.25 1.25v14c0 .69-.56 1.25-1.25 1.25H5c-.69 0-1.25-.56-1.25-1.25V5c0-.69.56-1.25 1.25-1.25z"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
fillRule="evenodd"
|
||||
d="M6.4 10.75c0-.47.38-.85.85-.85h9.5c.47 0 .85.38.85.85v1.5c0 .47-.38.85-.85.85h-9.5a.85.85 0 01-.85-.85v-1.5zm1.2.35v.8h8.8v-.8H7.6zM12.4 15.25c0-.47.38-.85.85-.85h3.5c.47 0 .85.38.85.85v1.5c0 .47-.38.85-.85.85h-3.5a.85.85 0 01-.85-.85v-1.5zm1.2.35v.8h2.8v-.8h-2.8zM6.5 15.9a.6.6 0 01.6-.6h2.8a.6.6 0 010 1.2H7.1a.6.6 0 01-.6-.6zM6.5 7.9a.6.6 0 01.6-.6h9.8a.6.6 0 110 1.2H7.1a.6.6 0 01-.6-.6z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default fields;
|
||||
@@ -0,0 +1,19 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const filledCart = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<g fill="none" fillRule="evenodd">
|
||||
<path d="M0 0h24v24H0z" />
|
||||
<path
|
||||
fill="currentColor"
|
||||
fillRule="nonzero"
|
||||
d="M15.55 13c.75 0 1.41-.41 1.75-1.03l3.58-6.49A.996.996 0 0 0 20.01 4H5.21l-.94-2H1v2h2l3.6 7.59-1.35 2.44C4.52 15.37 5.48 17 7 17h12v-2H7l1.1-2h7.45ZM7 18c-1.1 0-1.99.9-1.99 2S5.9 22 7 22s2-.9 2-2-.9-2-2-2Zm10 0c-1.1 0-1.99.9-1.99 2s.89 2 1.99 2 2-.9 2-2-.9-2-2-2Z"
|
||||
/>
|
||||
</g>{ ' ' }
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default filledCart;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const folderStarred = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24">
|
||||
<path fill="none" d="M0 0h24v24H0V0z" />
|
||||
<path d="M20 6h-8l-2-2H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2zm0 12H4V6h5.17l2 2H20v10zm-6.92-3.96L12.39 17 15 15.47 17.61 17l-.69-2.96 2.3-1.99-3.03-.26L15 9l-1.19 2.79-3.03.26z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default folderStarred;
|
||||
@@ -0,0 +1,36 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const miniCartAlt = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<defs>
|
||||
<mask
|
||||
id="mask"
|
||||
x="0"
|
||||
y="0"
|
||||
width="24.01"
|
||||
height="24"
|
||||
maskUnits="userSpaceOnUse"
|
||||
>
|
||||
<g
|
||||
id="path-1-inside-1_928_1005"
|
||||
data-name="path-1-inside-1 928 1005"
|
||||
>
|
||||
<path
|
||||
d="M2,2V4H4l3.6,7.6L6.3,14A2,2,0,0,0,8,17H20V15H8l1.1-2h7.5a1.9,1.9,0,0,0,1.7-1l3.6-6.5A1,1,0,0,0,21,4H6.2L5.3,2ZM8,18a2,2,0,1,0,2,2A2,2,0,0,0,8,18Zm8,2a2,2,0,1,1,2,2A2,2,0,0,1,16,20Z"
|
||||
fill="#fff"
|
||||
fillRule="evenodd"
|
||||
/>
|
||||
</g>
|
||||
</mask>
|
||||
</defs>
|
||||
<g mask="url(#mask)">
|
||||
<path d="M2,4H0V6H2ZM2,2V0H0V2ZM4,4l1.8-.9L5.3,2H4Zm3.6,7.6,1.7,1,.5-.9-.4-1ZM6.3,14l-1.8-.9h0ZM20,17v2h2V17Zm0-2h2V13H20ZM8,15,6.2,14,4.6,17H8Zm1.1-2V11H7.9l-.6,1Zm9.2-1-1.8-1h0Zm3.6-6.5-1.8-1h0ZM6.2,4l-1.8.9L4.9,6H6.2ZM5.3,2l1.8-.9L6.5,0H5.3ZM4,4V2H0V4ZM4,2H2V6H4Zm5.4,8.7L5.8,3.1,2.2,4.9l3.6,7.5ZM8,15l1.3-2.4-3.5-2L4.5,13.1Zm0,0H8L4.5,13.1A4,4,0,0,0,8,19Zm12,0H8v4H20Zm-2,0v2h4V15ZM8,17H20V13H8Zm-.7-5L6.2,14l3.6,2,1.1-2Zm9.3-1H9.1v4h7.5Zm-.1,0h.1v4a4,4,0,0,0,3.5-2.1Zm3.6-6.5L16.5,11l3.6,1.9,3.5-6.5ZM21,6a1,1,0,0,1-.9-1.5l3.5,2A3,3,0,0,0,21,2ZM6.2,6H21V2H6.2ZM3.5,2.9l.9,2L8,3.1l-.9-2ZM2,4H5.3V0H2ZM8,20H8V16a4,4,0,0,0-4,4Zm0,0H4a4,4,0,0,0,4,4Zm0,0v4a4,4,0,0,0,4-4Zm0,0h4a4,4,0,0,0-4-4Zm10-4a4,4,0,0,0-4,4h4Zm4,4a4,4,0,0,0-4-4v4Zm-4,4a4,4,0,0,0,4-4H18Zm-4-4a4,4,0,0,0,4,4V20H14Z" />
|
||||
</g>
|
||||
<circle cx="20.2" cy="4.7" r="3.8" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default miniCartAlt;
|
||||
@@ -0,0 +1,29 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const miniCart = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="none">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M7.84614 18.2769C7.89712 18.2769 7.93845 18.2356 7.93845 18.1846C7.93845 18.1336 7.89712 18.0923 7.84614 18.0923C7.79516 18.0923 7.75384 18.1336 7.75384 18.1846C7.75384 18.2356 7.79516 18.2769 7.84614 18.2769ZM6.03076 18.1846C6.03076 17.182 6.84353 16.3692 7.84614 16.3692C8.84875 16.3692 9.66152 17.182 9.66152 18.1846C9.66152 19.1872 8.84875 20 7.84614 20C6.84353 20 6.03076 19.1872 6.03076 18.1846Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M17.3231 18.2769C17.3741 18.2769 17.4154 18.2356 17.4154 18.1846C17.4154 18.1336 17.3741 18.0923 17.3231 18.0923C17.2721 18.0923 17.2308 18.1336 17.2308 18.1846C17.2308 18.2356 17.2721 18.2769 17.3231 18.2769ZM15.5077 18.1846C15.5077 17.182 16.3205 16.3692 17.3231 16.3692C18.3257 16.3692 19.1385 17.182 19.1385 18.1846C19.1385 19.1872 18.3257 20 17.3231 20C16.3205 20 15.5077 19.1872 15.5077 18.1846Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M20.0631 9.53835L19.4662 12.6685L19.4648 12.6757L19.4648 12.6757C19.3424 13.2919 19.0072 13.8454 18.5178 14.2394C18.031 14.6312 17.4226 14.8404 16.798 14.8308H8.44017C7.81556 14.8404 7.20714 14.6312 6.72038 14.2394C6.2312 13.8456 5.89605 13.2924 5.77352 12.6765L5.77335 12.6757L4.33477 5.48814C4.3286 5.46282 4.32345 5.43711 4.31934 5.41104L3.61815 1.90768H0.953842C0.42705 1.90768 0 1.48063 0 0.953842C0 0.42705 0.42705 0 0.953842 0H4.4C4.85462 0 5.24607 0.320858 5.33529 0.766644L6.04403 4.30769H12.785C13.0114 4.99157 13.3319 5.63258 13.7312 6.21538H6.42585L7.64421 12.3026L7.64449 12.304C7.67966 12.4811 7.77599 12.6402 7.91662 12.7534C8.05725 12.8666 8.23322 12.9267 8.41372 12.9233L8.432 12.9231H16.8062L16.8244 12.9233C17.0049 12.9267 17.1809 12.8666 17.3215 12.7534C17.4614 12.6408 17.5575 12.4828 17.5931 12.3068L17.5937 12.304L18.1649 9.30867C18.762 9.45873 19.387 9.53842 20.0307 9.53842C20.0415 9.53842 20.0523 9.5384 20.0631 9.53835Z"
|
||||
fill="currentColor"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default miniCart;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const removeCart = (
|
||||
<SVG xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<path d="M22.7 22.7l-20-20L2 2l-.7-.7L0 2.5 4.4 7l2.2 4.7L5.2 14A2 2 0 007 17h7.5l1.3 1.4a2 2 0 102.8 2.8l2.9 2.8 1.2-1.3zM7.4 15a.2.2 0 01-.2-.3l.9-1.7h2.4l2 2h-5zm8.2-2a2 2 0 001.7-1l3.6-6.5.1-.5c0-.6-.4-1-1-1H6.5l9 9zM7 18a2 2 0 100 4 2 2 0 000-4z" />
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default removeCart;
|
||||
@@ -0,0 +1,16 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const stacks = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24">
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M4.5 19.375L4.5 7.625C4.5 7.55596 4.55596 7.5 4.625 7.5L16.375 7.5C16.444 7.5 16.5 7.55596 16.5 7.625L16.5 19.375C16.5 19.444 16.444 19.5 16.375 19.5L4.625 19.5C4.55596 19.5 4.5 19.444 4.5 19.375ZM4.625 21C3.72754 21 3 20.2725 3 19.375L3 7.625C3 6.72754 3.72754 6 4.625 6L16.375 6C17.2725 6 18 6.72754 18 7.625L18 19.375C18 20.2725 17.2725 21 16.375 21L4.625 21ZM19 3.75L8 3.75L8 2.25L19 2.25C20.5183 2.25 21.75 3.4796 21.75 4.99891L21.75 18L20.25 18L20.25 4.99891C20.25 4.30909 19.6909 3.75 19 3.75Z"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default stacks;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const thumbUp = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24">
|
||||
<path opacity=".87" fill="none" d="M0 0h24v24H0V0z" />
|
||||
<path d="M21 8h-6.31l.95-4.57.03-.32c0-.41-.17-.79-.44-1.06L14.17 1 7.59 7.59C7.22 7.95 7 8.45 7 9v10c0 1.1.9 2 2 2h9c.83 0 1.54-.5 1.84-1.22l3.02-7.05c.09-.23.14-.47.14-.73v-2c0-1.1-.9-2-2-2zm0 4l-3 7H9V9l4.34-4.34L12.23 10H21v2zM1 9h4v12H1z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default thumbUp;
|
||||
@@ -0,0 +1,13 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const toggle = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24">
|
||||
<path fill="none" d="M0 0h24v24H0z" />
|
||||
<path d="M17 6H7c-3.31 0-6 2.69-6 6s2.69 6 6 6h10c3.31 0 6-2.69 6-6s-2.69-6-6-6zm0 10H7c-2.21 0-4-1.79-4-4s1.79-4 4-4h10c2.21 0 4 1.79 4 4s-1.79 4-4 4zm0-7c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z" />
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default toggle;
|
||||
@@ -0,0 +1,27 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
|
||||
const totals = (
|
||||
<SVG xmlns="http://www.w3.org/2000/SVG" viewBox="0 0 24 24" fill="none">
|
||||
<path
|
||||
stroke="currentColor"
|
||||
strokeWidth="1.5"
|
||||
fill="none"
|
||||
d="M6 3.75h12c.69 0 1.25.56 1.25 1.25v14c0 .69-.56 1.25-1.25 1.25H6c-.69 0-1.25-.56-1.25-1.25V5c0-.69.56-1.25 1.25-1.25z"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
fillRule="evenodd"
|
||||
d="M6.9 7.5A1.1 1.1 0 018 6.4h8a1.1 1.1 0 011.1 1.1v2a1.1 1.1 0 01-1.1 1.1H8a1.1 1.1 0 01-1.1-1.1v-2zm1.2.1v1.8h7.8V7.6H8.1z"
|
||||
clipRule="evenodd"
|
||||
/>
|
||||
<path
|
||||
fill="currentColor"
|
||||
d="M8.5 12h1v1h-1v-1zM8.5 14h1v1h-1v-1zM8.5 16h1v1h-1v-1zM11.5 12h1v1h-1v-1zM11.5 14h1v1h-1v-1zM11.5 16h1v1h-1v-1zM14.5 12h1v1h-1v-1zM14.5 14h1v1h-1v-1zM14.5 16h1v1h-1v-1z"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
|
||||
export default totals;
|
||||
@@ -0,0 +1,31 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { SVG } from '@wordpress/primitives';
|
||||
import classnames from 'classnames';
|
||||
const Component = ( { className, height, width, ...props } ) => {
|
||||
return (
|
||||
<SVG
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 245 145"
|
||||
className={ classnames( 'woo-icon', className ) }
|
||||
width={ width }
|
||||
height={ height }
|
||||
{ ...props }
|
||||
>
|
||||
<path
|
||||
fill="#7f54b3"
|
||||
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"
|
||||
/>
|
||||
<path
|
||||
fill="#FFF"
|
||||
fillRule="nonzero"
|
||||
d="M12.32 20.63a8.16 8.16 0 0 1 6.25-3.09c5.0733-.36 7.9867 2.0333 8.74 7.18 3.14 20.86 6.4933 38.5633 10.06 53.11l21.92-41.69c2-3.76 4.49-5.76 7.52-6 4.3867-.3067 7.13 2.49 8.23 8.39a186 186 0 0 0 9.47 34.23c2.62-25.38 7.0133-43.7133 13.18-55a7.73 7.73 0 0 1 6.6-4.43 8.8 8.8 0 0 1 6.32 2 7.75 7.75 0 0 1 3.05 5.74 8.52 8.52 0 0 1-1 4.77c-3.9 7.24-7.12 19.28-9.66 36.12-2.48 16.2533-3.3967 28.9633-2.75 38.13a12.25 12.25 0 0 1-1.16 6.56 6.32 6.32 0 0 1-5.33 3.53c-2.6667.18-5.3033-1.0567-7.91-3.71-9.2933-9.54-16.6567-23.7267-22.09-42.56C57.3 76.7167 52.48 86.3333 49.3 92.76c-5.86 11.3333-10.89 17.13-15.09 17.39-2.7333.1933-5.0667-2.0933-7-6.86-5.1-13.0933-10.5833-38.4033-16.45-75.93a8.56 8.56 0 0 1 1.56-6.73zM227.23 36.34a23.17 23.17 0 0 0-16-11.59 26.25 26.25 0 0 0-5.42-.58c-9.5867 0-17.41 5-23.47 15a53 53 0 0 0-7.78 28.16c0 7.7333 1.6167 14.3333 4.85 19.8a23.15 23.15 0 0 0 16 11.59 26.28 26.28 0 0 0 5.42.59c9.68 0 17.5033-5 23.47-15A53.89 53.89 0 0 0 232.08 56c0-7.7333-1.6167-14.2867-4.85-19.66zm-12.61 27.72c-1.3733 6.56-3.9167 11.5-7.63 14.82-2.9267 2.6667-5.6133 3.7433-8.06 3.23-2.4467-.5133-4.4033-2.6667-5.87-6.46a25.68 25.68 0 0 1-1.76-9.09 35.9 35.9 0 0 1 .73-7.34 33 33 0 0 1 5.28-11.88c3.3333-4.8933 6.8067-6.9467 10.42-6.16 2.44.4867 4.3933 2.64 5.86 6.46a25.68 25.68 0 0 1 1.76 9.12 35.73 35.73 0 0 1-.73 7.33v-.03zM164.57 36.34a23.2 23.2 0 0 0-16-11.59 26.42 26.42 0 0 0-5.43-.58c-9.5933 0-17.4167 5-23.47 15a53 53 0 0 0-7.78 28.16c0 7.7333 1.6133 14.3333 4.84 19.8a23.19 23.19 0 0 0 16 11.59 26.44 26.44 0 0 0 5.43.59c9.68 0 17.5033-5 23.47-15A53.88 53.88 0 0 0 169.4 56c0-7.7333-1.6133-14.2867-4.84-19.66h.01zm-12.61 27.72c-1.3667 6.56-3.91 11.5-7.63 14.82-2.93 2.64-5.63 3.72-8.07 3.23-2.44-.49-4.4-2.64-5.86-6.46a25.7 25.7 0 0 1-1.77-9.09 35.9 35.9 0 0 1 .74-7.34 33 33 0 0 1 5.28-11.88c3.3333-4.8933 6.8067-6.9467 10.42-6.16 2.44.4867 4.3933 2.64 5.86 6.46a25.91 25.91 0 0 1 1.76 9.12 35.73 35.73 0 0 1-.73 7.33v-.03z"
|
||||
/>
|
||||
</SVG>
|
||||
);
|
||||
};
|
||||
|
||||
const woo = <Component />;
|
||||
|
||||
export default woo;
|
||||
@@ -0,0 +1,91 @@
|
||||
/**
|
||||
* External dependencies
|
||||
*/
|
||||
import { omitBy } from 'lodash';
|
||||
import type { Story } from '@storybook/react';
|
||||
import { useState } from '@wordpress/element';
|
||||
import { Icon } from '@wordpress/icons';
|
||||
|
||||
/**
|
||||
* Internal dependencies
|
||||
*/
|
||||
import * as icons from '../index';
|
||||
const { ...availableIcons } = icons;
|
||||
|
||||
export const Library: Story = ( args ) => {
|
||||
const [ filter, setFilter ] = useState( '' );
|
||||
const filteredIcons = omitBy( availableIcons, ( _, name ) => {
|
||||
return ! name.includes( filter );
|
||||
} );
|
||||
|
||||
return (
|
||||
<div style={ { padding: '20px' } }>
|
||||
<label htmlFor="filter-icons" style={ { paddingRight: '30px' } }>
|
||||
Filter Icons
|
||||
</label>
|
||||
<input
|
||||
id="filter-icons"
|
||||
type="search"
|
||||
value={ filter }
|
||||
placeholder="Icon name"
|
||||
onChange={ ( event ) => setFilter( event.target.value ) }
|
||||
/>
|
||||
<div
|
||||
style={ {
|
||||
display: 'flex',
|
||||
alignItems: 'bottom',
|
||||
flexWrap: 'wrap',
|
||||
} }
|
||||
>
|
||||
{ Object.entries( filteredIcons ).map( ( [ name, icon ] ) => {
|
||||
return (
|
||||
<div
|
||||
key={ name }
|
||||
style={ {
|
||||
display: 'flex',
|
||||
flexDirection: 'column',
|
||||
width: '25%',
|
||||
padding: '25px 0 25px 0',
|
||||
} }
|
||||
>
|
||||
<strong
|
||||
style={ {
|
||||
width: '200px',
|
||||
} }
|
||||
>
|
||||
{ name }
|
||||
</strong>
|
||||
<div
|
||||
style={ {
|
||||
display: 'flex',
|
||||
alignItems: 'center',
|
||||
} }
|
||||
>
|
||||
<Icon
|
||||
className={ args.className }
|
||||
icon={ icon }
|
||||
/>
|
||||
<Icon
|
||||
className={ args.className }
|
||||
style={ { paddingLeft: '10px' } }
|
||||
icon={ icon }
|
||||
size={ 36 }
|
||||
/>
|
||||
<Icon
|
||||
className={ args.className }
|
||||
style={ { paddingLeft: '10px' } }
|
||||
icon={ icon }
|
||||
size={ 48 }
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
} ) }
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
Library.parameters = {
|
||||
controls: { include: [], hideNoControlsWarning: true },
|
||||
};
|
||||
Library.storyName = 'Icon Library';
|
||||
Reference in New Issue
Block a user