* Switch to @wordpress/component's Button

* Finish button conversion

* Move to @wp/component's CheckboxControl

* Add  ImageUpload component

* Remove Newspack package

* CSS Cleanup

* Handle PR feedback: Fix tests, add ImageUploader basic test, fix FireFox/Safari Display issues, and  currency input bug
This commit is contained in:
Justin Shreve 2019-12-02 12:39:22 -05:00 committed by GitHub
parent 09ddedc8d9
commit 448e1f3e11
43 changed files with 453 additions and 391 deletions

View File

@ -49,6 +49,12 @@
}
}
.woocommerce-setting__options-group {
input[type='checkbox']:checked::before {
content: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27#{url-friendly-colour($studio-white)}%27%2F%3E%3C%2Fsvg%3E');
}
}
.woocommerce-settings-historical-data__progress-label {
display: inline-block;
font-weight: bold;

View File

@ -5,8 +5,7 @@
import { __, _x, sprintf } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { FormToggle } from '@wordpress/components';
import { Button } from 'newspack-components';
import { Button, FormToggle } from '@wordpress/components';
import { withDispatch } from '@wordpress/data';
import { keys, get, pickBy } from 'lodash';

View File

@ -4,7 +4,7 @@
*/
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import { Button, CheckboxControl } from 'newspack-components';
import { Button, CheckboxControl } from '@wordpress/components';
import { compose } from '@wordpress/compose';
import { filter, get, includes } from 'lodash';
import { withDispatch } from '@wordpress/data';
@ -106,6 +106,7 @@ class Industry extends Component {
label={ industries[ slug ] }
onChange={ () => this.onChange( slug ) }
checked={ selected.includes( slug ) }
className="woocommerce-profile-wizard__checkbox"
/>
);
} ) }

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __, sprintf } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { difference } from 'lodash';

View File

@ -5,7 +5,7 @@
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { Button, CheckboxControl } from 'newspack-components';
import { Button, CheckboxControl } from '@wordpress/components';
import { includes, filter, get } from 'lodash';
import interpolateComponents from 'interpolate-components';
import { withDispatch } from '@wordpress/data';
@ -129,6 +129,7 @@ class ProductTypes extends Component {
help={ helpText }
onChange={ () => this.onChange( slug ) }
checked={ selected.includes( slug ) }
className="woocommerce-profile-wizard__checkbox"
/>
);
} ) }

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __, sprintf } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import interpolateComponents from 'interpolate-components';

View File

@ -4,7 +4,7 @@
*/
import { __ } from '@wordpress/i18n';
import apiFetch from '@wordpress/api-fetch';
import { Button, CheckboxControl } from 'newspack-components';
import { Button, CheckboxControl } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { withDispatch } from '@wordpress/data';
@ -162,10 +162,13 @@ class StoreDetails extends Component {
/>
) }
<StoreAddress getInputProps={ getInputProps } setValue={ setValue } />
<CheckboxControl
label={ __( "I'm setting up a store for a client", 'woocommerce-admin' ) }
{ ...getInputProps( 'isClient' ) }
/>
<div className="woocommerce-profile-wizard__client">
<CheckboxControl
label={ __( "I'm setting up a store for a client", 'woocommerce-admin' ) }
{ ...getInputProps( 'isClient' ) }
/>
</div>
<Button isPrimary onClick={ handleSubmit } disabled={ ! isValidForm }>
{ __( 'Continue', 'woocommerce-admin' ) }

View File

@ -4,13 +4,12 @@
*/
import { __, sprintf } from '@wordpress/i18n';
import { addQueryArgs } from '@wordpress/url';
import { Button } from 'newspack-components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { decodeEntities } from '@wordpress/html-entities';
import { get } from 'lodash';
import Gridicon from 'gridicons';
import { TabPanel, Tooltip } from '@wordpress/components';
import { Button, TabPanel, Tooltip } from '@wordpress/components';
import { withDispatch } from '@wordpress/data';
/**

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __, sprintf } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import classnames from 'classnames';
import { Component } from '@wordpress/element';
import interpolateComponents from 'interpolate-components';

View File

@ -202,7 +202,7 @@
padding-right: $gap;
align-items: center;
.muriel-button.is-button.is-primary {
.is-button.is-primary {
height: 40px;
margin: 0;
@ -230,7 +230,7 @@
margin-left: auto;
margin-right: $gap;
.muriel-button {
.woocommerce-theme-preview__device {
padding: $gap-small;
color: $studio-gray-50;
margin: 0;

View File

@ -3,13 +3,12 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Button, CheckboxControl } from 'newspack-components';
import { Component } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { withDispatch } from '@wordpress/data';
import { get } from 'lodash';
import interpolateComponents from 'interpolate-components';
import { FormToggle, Modal } from '@wordpress/components';
import { Button, CheckboxControl, FormToggle, Modal } from '@wordpress/components';
/**
* Internal dependencies

View File

@ -27,7 +27,7 @@
color: $studio-gray-60;
text-align: left;
.muriel-button {
button.is-button {
display: flex;
margin: $gap-smaller auto 0;
width: 310px;
@ -190,6 +190,14 @@
}
.woocommerce-profile-wizard__tracking {
.woocommerce-profile-wizard__tracking-checkbox {
margin-top: $gap;
.components-checkbox-control__input[type='checkbox']:checked {
background-color: $studio-woocommerce-purple-60;
border-color: $studio-woocommerce-purple-60;
}
}
.components-form-toggle {
display: none;
}
@ -206,29 +214,23 @@
flex-direction: row-reverse;
align-items: center;
justify-content: flex-end;
.muriel-checkbox label.components-checkbox-control__label {
display: inline-block;
margin-left: $gap-small;
}
}
}
.woocommerce-profile-wizard__client {
margin-bottom: $gap-large;
}
.woocommerce-profile-wizard__checkbox-group {
margin: #{-$gap} #{-$gap} 0 -#{$gap};
.muriel-checkbox {
.woocommerce-profile-wizard__checkbox {
margin-top: 0;
margin-bottom: 0;
position: relative;
padding: $gap-small $gap;
min-height: 56px;
input[type='checkbox']:checked::before {
left: -1px;
top: 0;
}
&::after {
content: '';
position: absolute;
@ -249,7 +251,7 @@
.components-checkbox-control__input {
position: absolute;
top: 7px;
top: 0;
left: 3px;
}
@ -258,9 +260,13 @@
margin-top: $gap-smallest;
}
label.components-checkbox-control__label,
label.components-checkbox-control__label {
margin-left: $gap-large - $gap-smallest;
}
.components-base-control__help {
margin-left: $gap-large * 2;
margin-left: $gap-largest + $gap-smaller;
font-style: normal;
}
.components-base-control__help {
@ -277,6 +283,20 @@
}
}
}
svg.dashicon.components-checkbox-control__checked {
left: 1px;
top: -1px;
}
}
@include breakpoint( '<600px' ) {
svg.dashicon.components-checkbox-control__checked {
left: -2px;
top: -1px;
width: 21px;
height: 21px;
}
}
.woocommerce-select-control__control {
@ -331,7 +351,7 @@
margin-left: 44px;
min-height: 28px;
button.muriel-button {
button.is-button {
margin: 0;
height: 40px;
min-width: auto;
@ -384,17 +404,7 @@
}
button.is-primary {
min-width: 160px;
align-self: flex-end;
margin-bottom: 0;
}
.muriel-checkbox input[type='checkbox']:checked {
content: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27#{url-friendly-colour($studio-white)}%27%2F%3E%3C%2Fsvg%3E');
}
.muriel-checkbox label.components-checkbox-control__label {
font-size: 13px;
}
}
}

View File

@ -123,37 +123,6 @@
}
}
.muriel-checkbox label.components-checkbox-control__label {
margin-left: $gap-smaller;
}
.muriel-checkbox input[type='checkbox'] {
width: 18px;
height: 18px;
}
.muriel-button.is-button {
height: 48px;
&.is-busy {
cursor: progress;
/* stylelint-disable function-parentheses-space-inside, function-comma-space-after */
background-image: linear-gradient(
-45deg,
$studio-pink-50 28%,
color($studio-pink-50 shade(30%)) 28%,
color($studio-pink-50 shade(30%)) 72%,
$studio-pink-50 72%
) !important; // Gutenberg & PostCSS Add the gradient late in output, based on the 'primary' color, which in our case is purple. Our busy state should be pink.
/* stylelint-enable */
}
}
.muriel-checkbox input[type='checkbox']:checked {
background-color: $studio-woocommerce-purple-60;
border-color: $studio-woocommerce-purple-60;
}
.components-form-toggle {
display: inline-block;
@ -176,10 +145,6 @@
margin-bottom: 0;
}
.muriel-checkbox label.components-checkbox-control__label {
margin-left: $gap-large;
}
&.is-checked {
.components-form-toggle__track {
background-color: $studio-woocommerce-purple-60;
@ -188,3 +153,29 @@
}
}
}
.woocommerce-task-dashboard__container .components-button.is-button,
.woocommerce-profile-wizard__body .components-button.is-button,
.woocommerce-page .components-modal__frame .components-button.is-button {
height: 48px;
padding-left: 25px;
padding-right: 25px;
text-align: center;
font-size: 14px;
line-height: 36px;
font-weight: 500;
&.is-primary.is-busy,
&.is-primary.is-busy:active:enabled {
cursor: progress;
/* stylelint-disable function-parentheses-space-inside, function-comma-space-after */
background-image: linear-gradient(
-45deg,
$studio-pink-50 28%,
color($studio-pink-50 shade(30%)) 28%,
color($studio-pink-50 shade(30%)) 72%,
$studio-pink-50 72%
) !important; // Gutenberg & PostCSS Add the gradient late in output, based on the 'primary' color, which in our case is purple. Our busy state should be pink.
/* stylelint-enable */
}
}

View File

@ -16,12 +16,14 @@
margin-right: auto;
}
.muriel-button.components-button,
.woocommerce-task-dashboard__container .components-button:not(.components-icon-button),
.components-modal__frame .components-button.is-button {
height: 40px;
min-width: 106px;
margin: $gap $gap-smaller 0 0;
justify-content: center;
font-size: 14px;
font-weight: 500;
&:not(.is-primary) {
color: $studio-pink-50;
@ -182,7 +184,8 @@
position: relative;
.muriel-input-text input {
left: $gap * 2;
left: $gap;
max-width: 90%;
}
.components-base-control {
@ -194,7 +197,7 @@
display: none;
position: absolute;
left: $gap;
top: 28px;
top: 25px;
z-index: 1;
font-size: 16px;
line-height: 24px;
@ -302,9 +305,10 @@
margin-left: $gap-larger;
padding-top: $gap;
.components-base-control__field {
align-items: center;
display: flex;
svg.dashicon.components-checkbox-control__checked {
display: block;
left: -38px;
top: -1px;
}
.components-checkbox-control__input {
@ -367,7 +371,7 @@
}
.woocommerce-task-appearance {
.muriel-image-upload {
.woocommerce-image-upload {
margin-bottom: $gap-smallest;
}
}

View File

@ -4,7 +4,7 @@
*/
import { __ } from '@wordpress/i18n';
import apiFetch from '@wordpress/api-fetch';
import { Button, ImageUpload } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { difference, filter, isEmpty } from 'lodash';
@ -13,7 +13,7 @@ import { withDispatch } from '@wordpress/data';
/**
* WooCommerce dependencies
*/
import { Card, Stepper, TextControl } from '@woocommerce/components';
import { Card, Stepper, TextControl, ImageUpload } from '@woocommerce/components';
import { getHistory, getNewPath } from '@woocommerce/navigation';
import { getSetting, setSetting } from '@woocommerce/wc-admin-settings';

View File

@ -7,8 +7,7 @@ import { __ } from '@wordpress/i18n';
import { Fragment, Component } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { get, filter, noop, keys, pickBy, difference } from 'lodash';
import { FormToggle, CheckboxControl } from '@wordpress/components';
import { Button } from 'newspack-components';
import { Button, FormToggle, CheckboxControl } from '@wordpress/components';
import { withDispatch } from '@wordpress/data';
/**

View File

@ -4,7 +4,7 @@
*/
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import interpolateComponents from 'interpolate-components';
/**

View File

@ -5,8 +5,7 @@
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import apiFetch from '@wordpress/api-fetch';
import { Button } from 'newspack-components';
import { getQuery } from '@woocommerce/navigation';
import { Button } from '@wordpress/components';
import { withDispatch } from '@wordpress/data';
import { compose } from '@wordpress/compose';
import interpolateComponents from 'interpolate-components';
@ -15,6 +14,7 @@ import interpolateComponents from 'interpolate-components';
* WooCommerce dependencies
*/
import { WC_ADMIN_NAMESPACE } from 'wc-api/constants';
import { getQuery } from '@woocommerce/navigation';
import { Form, Link, TextControl } from '@woocommerce/components';
import withSelect from 'wc-api/with-select';
import { recordEvent } from 'lib/tracks';

View File

@ -5,7 +5,7 @@
import { __ } from '@wordpress/i18n';
import { Component, Fragment } from '@wordpress/element';
import apiFetch from '@wordpress/api-fetch';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { getQuery } from '@woocommerce/navigation';
import { withDispatch } from '@wordpress/data';
import { compose } from '@wordpress/compose';

View File

@ -8,8 +8,7 @@ import { compose } from '@wordpress/compose';
import apiFetch from '@wordpress/api-fetch';
import { withDispatch } from '@wordpress/data';
import interpolateComponents from 'interpolate-components';
import { Modal } from '@wordpress/components';
import { Button } from 'newspack-components';
import { Button, Modal } from '@wordpress/components';
import { getQuery } from '@woocommerce/navigation';
import { get } from 'lodash';

View File

@ -4,10 +4,9 @@
*/
import { __ } from '@wordpress/i18n';
import apiFetch from '@wordpress/api-fetch';
import { Button } from 'newspack-components';
import classnames from 'classnames';
import { Component, Fragment } from '@wordpress/element';
import { FormToggle } from '@wordpress/components';
import { Button, FormToggle } from '@wordpress/components';
import PropTypes from 'prop-types';
/**

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { withDispatch } from '@wordpress/data';

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
/**

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { difference, noop } from 'lodash';

View File

@ -3,7 +3,7 @@
* External dependencies
*/
import { __ } from '@wordpress/i18n';
import { Button } from 'newspack-components';
import { Button } from '@wordpress/components';
import { Component, Fragment } from '@wordpress/element';
import { compose } from '@wordpress/compose';
import { difference, filter, get } from 'lodash';

View File

@ -16,6 +16,7 @@
{ "component": "Form" },
{ "component": "Gravatar" },
{ "component": "ImageAsset" },
{ "component": "ImageUpload" },
{ "component": "Link" },
{ "component": "List" },
{ "component": "OrderStatus" },

View File

@ -47,24 +47,6 @@ $alert-red: $error-red;
$alert-yellow: $notice-yellow;
$alert-green: $valid-green;
// Newspack variables. These are temporary until we move away from Newspack components.
$muriel-white: $studio-white;
$muriel-hot-pink-400: $studio-pink-40;
$muriel-hot-pink-500: $studio-pink-50;
$muriel-hot-pink-700: $studio-pink-70;
$muriel-hot-purple-600: $studio-woocommerce-purple-60;
$muriel-gray-0: $studio-gray-0;
$muriel-gray-50: $studio-gray-5;
$muriel-gray-100: $studio-gray-10;
$muriel-gray-200: $studio-gray-20;
$muriel-gray-300: $studio-gray-30;
$muriel-gray-500: $studio-gray-50;
$muriel-gray-600: $studio-gray-60;
$muriel-gray-700: $studio-gray-70;
$muriel-gray-800: $studio-gray-80;
$muriel-green-400: $studio-green-40;
$muriel-red-500: $studio-red-50;
// WordPress defaults
$adminbar-height: 32px;
$adminbar-height-mobile: 46px;

View File

@ -139,38 +139,6 @@
margin-top: 4px;
background-color: $studio-white;
}
input[type='checkbox']:checked::before,
.muriel-checkbox input[type='checkbox']:checked::before {
font-size: 16px;
color: $studio-white;
content: url('data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27#{url-friendly-colour($studio-white)}%27%2F%3E%3C%2Fsvg%3E');
margin-left: -2px;
margin-top: 0;
height: 18px;
width: 16px;
}
.muriel-checkbox input[type='checkbox']:checked::before {
margin-left: 0;
margin-top: 0;
position: absolute;
left: 1px;
top: 4px;
}
.muriel-input-text input {
min-height: auto;
}
.muriel-input-text.with-value input {
top: 24px;
}
.muriel-checkbox .components-base-control__field {
align-items: center;
display: flex;
}
}
body.woocommerce-page {

View File

@ -25,6 +25,7 @@
* [Flag](components/packages/flag/README.md)
* [Form](components/packages/form/README.md)
* [Gravatar](components/packages/gravatar/README.md)
* [ImageUpload](components/packages/image-upload/README.md)
* [Link](components/packages/link/README.md)
* [List](components/packages/list/README.md)
* [OrderStatus](components/packages/order-status/README.md)

View File

@ -3706,9 +3706,9 @@
}
},
"@wordpress/dom": {
"version": "2.5.2",
"resolved": "https://registry.npmjs.org/@wordpress/dom/-/dom-2.5.2.tgz",
"integrity": "sha512-b/5MAKN24yKuXMUPP7A6Ha898bm0cSsOdrq5w9kjGZpO/ceP4DxeV/GNoE22uXX+KbV4px9KRXO5H9OcFJyroA==",
"version": "2.6.0",
"resolved": "https://registry.npmjs.org/@wordpress/dom/-/dom-2.6.0.tgz",
"integrity": "sha512-ERti77Y7Y0Oix7jfvIvBRX6Jx7hTvg6k6ke6LmeuMo+V7g5abmNEHLU4tL/dGSLNw9/SShStTIPu9Vg2IL44WA==",
"requires": {
"@babel/runtime": "^7.4.4",
"lodash": "^4.17.15"
@ -3914,69 +3914,6 @@
"rungen": "^0.3.2"
}
},
"@wordpress/rich-text": {
"version": "3.7.2",
"resolved": "https://registry.npmjs.org/@wordpress/rich-text/-/rich-text-3.7.2.tgz",
"integrity": "sha512-Mmq+qGBJiLwoEnFN/MqM+o7M2LF1EUYO7FgYwWhlM3m9G+HVBIX3nQeEFADsk3agVYojNbXXowO7Lv8qlZVFDg==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/compose": "^3.7.2",
"@wordpress/data": "^4.9.2",
"@wordpress/deprecated": "^2.6.1",
"@wordpress/element": "^2.8.2",
"@wordpress/escape-html": "^1.5.1",
"@wordpress/hooks": "^2.6.0",
"@wordpress/is-shallow-equal": "^1.6.1",
"@wordpress/keycodes": "^2.6.2",
"classnames": "^2.2.5",
"lodash": "^4.17.15",
"memize": "^1.0.5",
"rememo": "^3.0.0"
},
"dependencies": {
"@wordpress/data": {
"version": "4.9.2",
"resolved": "https://registry.npmjs.org/@wordpress/data/-/data-4.9.2.tgz",
"integrity": "sha512-wdFkR4yvkoRje7PBWpBOcI2AE6VM36yfZc1aSgX8XEFDWUXVovrIKPmhVEcW3b/E0ZxeR5BaIEnCYQbJKvDF+g==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/compose": "^3.7.2",
"@wordpress/deprecated": "^2.6.1",
"@wordpress/element": "^2.8.2",
"@wordpress/is-shallow-equal": "^1.6.1",
"@wordpress/priority-queue": "^1.3.1",
"@wordpress/redux-routine": "^3.6.2",
"equivalent-key-map": "^0.2.2",
"is-promise": "^2.1.0",
"lodash": "^4.17.15",
"redux": "^4.0.0",
"turbo-combine-reducers": "^1.0.2"
}
},
"@wordpress/element": {
"version": "2.8.2",
"resolved": "https://registry.npmjs.org/@wordpress/element/-/element-2.8.2.tgz",
"integrity": "sha512-pwy2qvbkNIoB+XTwtvsAKP/pmCoqFq3vyH9uakNIVHJF/DzOwwLS3y5I5hHTuNYmmgFuGALQVZlUVVkujRpWfg==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/escape-html": "^1.5.1",
"lodash": "^4.17.15",
"react": "^16.9.0",
"react-dom": "^16.9.0"
}
},
"@wordpress/keycodes": {
"version": "2.6.2",
"resolved": "https://registry.npmjs.org/@wordpress/keycodes/-/keycodes-2.6.2.tgz",
"integrity": "sha512-xWwyTYdyesZFc6V3RDn2Gjkx5bfa5fGDGrX0WcxT+vA2oEMFqLA2JzUqEzylR7aX3uFfsdDEp0GbPl8ipcLChw==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/i18n": "^3.6.1",
"lodash": "^4.17.15"
}
}
}
},
"@wordpress/scripts": {
"version": "3.4.0",
"resolved": "https://registry.npmjs.org/@wordpress/scripts/-/scripts-3.4.0.tgz",
@ -7890,9 +7827,10 @@
}
},
"diff": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/diff/-/diff-3.5.0.tgz",
"integrity": "sha512-A46qtFgd+g7pDZinpnwiRJtxbC1hpgf0uzP3iG89scHk0AUC7A1TGxf5OiiOUv/JMZR8GOt8hL900hV0bOy5xA=="
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
"integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k=",
"dev": true
},
"diff-sequences": {
"version": "24.9.0",
@ -9548,9 +9486,9 @@
"integrity": "sha512-a1hQMktqW9Nmqr5aktAux3JMNqaucxGcjtjWnZLHX7yyPCmlSV3M54nGYbqT8K+0GhF3NBgmJCc3ma+WOgX8Jg=="
},
"flatten": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.2.tgz",
"integrity": "sha1-2uRqnXj74lKSJYzB54CkHZXAN4I=",
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/flatten/-/flatten-1.0.3.tgz",
"integrity": "sha512-dVsPA/UwQ8+2uoFe5GHtiBMu48dWLTdsuEd7CKGlZlD78r1TTWBvDuFaFGKCo/ZfEr95Uk56vZoX86OsHkUeIg==",
"dev": true
},
"flow-parser": {
@ -9687,22 +9625,25 @@
"dependencies": {
"abbrev": {
"version": "1.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz",
"integrity": "sha512-nne9/IiQ/hzIhY6pdDnbBtz7DjPTKrY00P/zvPSm5pOFkl6xuGrGnXn/VtTNNfNtAfZ9/1RtehkszU9qcTii0Q==",
"optional": true
},
"ansi-regex": {
"version": "2.1.1",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
"integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
},
"aproba": {
"version": "1.2.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz",
"integrity": "sha512-Y9J6ZjXtoYh8RnXVCMOU/ttDmk1aBjunq9vO0ta5x85WDQiQfUF9sIPBITdbiiIVcBo03Hi3jMxigBtsddlXRw==",
"optional": true
},
"are-we-there-yet": {
"version": "1.1.5",
"bundled": true,
"resolved": "https://registry.npmjs.org/are-we-there-yet/-/are-we-there-yet-1.1.5.tgz",
"integrity": "sha512-5hYdAkZlcG8tOLujVDTgCT+uPX0VnpAH28gWsLfzpXYm7wP6mp5Q/gYyR7YQ0cKVJcXJnl3j2kpBan13PtQf6w==",
"optional": true,
"requires": {
"delegates": "^1.0.0",
@ -9711,13 +9652,13 @@
},
"balanced-match": {
"version": "1.0.0",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
"integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
},
"brace-expansion": {
"version": "1.1.11",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@ -9725,32 +9666,35 @@
},
"chownr": {
"version": "1.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/chownr/-/chownr-1.1.1.tgz",
"integrity": "sha512-j38EvO5+LHX84jlo6h4UzmOwi0UgW61WRyPtJz4qaadK5eY3BTS5TY/S1Stc3Uk2lIM6TPevAlULiEJwie860g==",
"optional": true
},
"code-point-at": {
"version": "1.1.0",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
"integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
},
"concat-map": {
"version": "0.0.1",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
"integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
},
"console-control-strings": {
"version": "1.1.0",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
"integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
},
"core-util-is": {
"version": "1.0.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz",
"integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=",
"optional": true
},
"debug": {
"version": "4.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/debug/-/debug-4.1.1.tgz",
"integrity": "sha512-pYAIzeRo8J6KPEaJ0VWOh5Pzkbw/RetuzehGM7QRRX5he4fPHx2rdKMB256ehJCkX+XRQm16eZLqLNS8RSZXZw==",
"optional": true,
"requires": {
"ms": "^2.1.1"
@ -9758,22 +9702,26 @@
},
"deep-extend": {
"version": "0.6.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/deep-extend/-/deep-extend-0.6.0.tgz",
"integrity": "sha512-LOHxIOaPYdHlJRtCQfDIVZtfw/ufM8+rVj649RIHzcm/vGwQRXFt6OPqIFWsm2XEMrNIEtWR64sY1LEKD2vAOA==",
"optional": true
},
"delegates": {
"version": "1.0.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz",
"integrity": "sha1-hMbhWbgZBP3KWaDvRM2HDTElD5o=",
"optional": true
},
"detect-libc": {
"version": "1.0.3",
"bundled": true,
"resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
"integrity": "sha1-+hN8S9aY7fVc1c0CrFWfkaTEups=",
"optional": true
},
"fs-minipass": {
"version": "1.2.5",
"bundled": true,
"resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-1.2.5.tgz",
"integrity": "sha512-JhBl0skXjUPCFH7x6x61gQxrKyXsxB5gcgePLZCwfyCGGsTISMoIeObbrvVeP6Xmyaudw4TT43qV2Gz+iyd2oQ==",
"optional": true,
"requires": {
"minipass": "^2.2.1"
@ -9781,12 +9729,14 @@
},
"fs.realpath": {
"version": "1.0.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz",
"integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=",
"optional": true
},
"gauge": {
"version": "2.7.4",
"bundled": true,
"resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz",
"integrity": "sha1-LANAXHU4w51+s3sxcCLjJfsBi/c=",
"optional": true,
"requires": {
"aproba": "^1.0.3",
@ -9801,7 +9751,8 @@
},
"glob": {
"version": "7.1.3",
"bundled": true,
"resolved": "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz",
"integrity": "sha512-vcfuiIxogLV4DlGBHIUOwI0IbrJ8HWPc4MU7HzviGeNho/UJDfi6B5p3sHeWIQ0KGIU0Jpxi5ZHxemQfLkkAwQ==",
"optional": true,
"requires": {
"fs.realpath": "^1.0.0",
@ -9814,12 +9765,14 @@
},
"has-unicode": {
"version": "2.0.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz",
"integrity": "sha1-4Ob+aijPUROIVeCG0Wkedx3iqLk=",
"optional": true
},
"iconv-lite": {
"version": "0.4.24",
"bundled": true,
"resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
"integrity": "sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==",
"optional": true,
"requires": {
"safer-buffer": ">= 2.1.2 < 3"
@ -9827,7 +9780,8 @@
},
"ignore-walk": {
"version": "3.0.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.1.tgz",
"integrity": "sha512-DTVlMx3IYPe0/JJcYP7Gxg7ttZZu3IInhuEhbchuqneY9wWe5Ojy2mXLBaQFUQmo0AW2r3qG7m1mg86js+gnlQ==",
"optional": true,
"requires": {
"minimatch": "^3.0.4"
@ -9835,7 +9789,8 @@
},
"inflight": {
"version": "1.0.6",
"bundled": true,
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
"integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=",
"optional": true,
"requires": {
"once": "^1.3.0",
@ -9844,44 +9799,46 @@
},
"inherits": {
"version": "2.0.3",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
"integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
},
"ini": {
"version": "1.3.5",
"bundled": true,
"resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
"integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==",
"optional": true
},
"is-fullwidth-code-point": {
"version": "1.0.0",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
"requires": {
"number-is-nan": "^1.0.0"
}
},
"isarray": {
"version": "1.0.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz",
"integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=",
"optional": true
},
"minimatch": {
"version": "3.0.4",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
"requires": {
"brace-expansion": "^1.1.7"
}
},
"minimist": {
"version": "0.0.8",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
"integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
},
"minipass": {
"version": "2.3.5",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/minipass/-/minipass-2.3.5.tgz",
"integrity": "sha512-Gi1W4k059gyRbyVUZQ4mEqLm0YIUiGYfvxhF6SIlk3ui1WVxMTGfGdQ2SInh3PDrRTVvPKgULkpJtT4RH10+VA==",
"requires": {
"safe-buffer": "^5.1.2",
"yallist": "^3.0.0"
@ -9889,7 +9846,8 @@
},
"minizlib": {
"version": "1.2.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.2.1.tgz",
"integrity": "sha512-7+4oTUOWKg7AuL3vloEWekXY2/D20cevzsrNT2kGWm+39J9hGTCBv8VI5Pm5lXZ/o3/mdR4f8rflAPhnQb8mPA==",
"optional": true,
"requires": {
"minipass": "^2.2.1"
@ -9897,20 +9855,22 @@
},
"mkdirp": {
"version": "0.5.1",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
"integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
"requires": {
"minimist": "0.0.8"
}
},
"ms": {
"version": "2.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.1.tgz",
"integrity": "sha512-tgp+dl5cGk28utYktBsrFqA7HKgrhgPsg6Z/EfhWI4gl1Hwq8B/GmY/0oXZ6nF8hDVesS/FpnYaD/kOWhYQvyg==",
"optional": true
},
"needle": {
"version": "2.3.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/needle/-/needle-2.3.0.tgz",
"integrity": "sha512-QBZu7aAFR0522EyaXZM0FZ9GLpq6lvQ3uq8gteiDUp7wKdy0lSd2hPlgFwVuW1CBkfEs9PfDQsQzZghLs/psdg==",
"optional": true,
"requires": {
"debug": "^4.1.0",
@ -9920,7 +9880,8 @@
},
"node-pre-gyp": {
"version": "0.12.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.12.0.tgz",
"integrity": "sha512-4KghwV8vH5k+g2ylT+sLTjy5wmUOb9vPhnM8NHvRf9dHmnW/CndrFXy2aRPaPST6dugXSdHXfeaHQm77PIz/1A==",
"optional": true,
"requires": {
"detect-libc": "^1.0.2",
@ -9937,7 +9898,8 @@
},
"nopt": {
"version": "4.0.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz",
"integrity": "sha1-0NRoWv1UFRk8jHUFYC0NF81kR00=",
"optional": true,
"requires": {
"abbrev": "1",
@ -9946,12 +9908,14 @@
},
"npm-bundled": {
"version": "1.0.6",
"bundled": true,
"resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-1.0.6.tgz",
"integrity": "sha512-8/JCaftHwbd//k6y2rEWp6k1wxVfpFzB6t1p825+cUb7Ym2XQfhwIC5KwhrvzZRJu+LtDE585zVaS32+CGtf0g==",
"optional": true
},
"npm-packlist": {
"version": "1.4.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.4.1.tgz",
"integrity": "sha512-+TcdO7HJJ8peiiYhvPxsEDhF3PJFGUGRcFsGve3vxvxdcpO2Z4Z7rkosRM0kWj6LfbK/P0gu3dzk5RU1ffvFcw==",
"optional": true,
"requires": {
"ignore-walk": "^3.0.1",
@ -9960,7 +9924,8 @@
},
"npmlog": {
"version": "4.1.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz",
"integrity": "sha512-2uUqazuKlTaSI/dC8AzicUck7+IrEaOnN/e0jd3Xtt1KcGpwx30v50mL7oPyr/h9bL3E4aZccVwpwP+5W9Vjkg==",
"optional": true,
"requires": {
"are-we-there-yet": "~1.1.2",
@ -9971,35 +9936,39 @@
},
"number-is-nan": {
"version": "1.0.1",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
"integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
},
"object-assign": {
"version": "4.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
"integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
"optional": true
},
"once": {
"version": "1.4.0",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
"requires": {
"wrappy": "1"
}
},
"os-homedir": {
"version": "1.0.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz",
"integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=",
"optional": true
},
"os-tmpdir": {
"version": "1.0.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz",
"integrity": "sha1-u+Z0BseaqFxc/sdm/lc0VV36EnQ=",
"optional": true
},
"osenv": {
"version": "0.1.5",
"bundled": true,
"resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz",
"integrity": "sha512-0CWcCECdMVc2Rw3U5w9ZjqX6ga6ubk1xDVKxtBQPK7wis/0F2r9T6k4ydGYhecl7YUBxBVxhL5oisPsNxAPe2g==",
"optional": true,
"requires": {
"os-homedir": "^1.0.0",
@ -10008,17 +9977,20 @@
},
"path-is-absolute": {
"version": "1.0.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz",
"integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=",
"optional": true
},
"process-nextick-args": {
"version": "2.0.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.0.tgz",
"integrity": "sha512-MtEC1TqN0EU5nephaJ4rAtThHtC86dNN9qCuEhtshvpVBkAW5ZO7BASN9REnF9eoXGcRub+pFuKEpOHE+HbEMw==",
"optional": true
},
"rc": {
"version": "1.2.8",
"bundled": true,
"resolved": "https://registry.npmjs.org/rc/-/rc-1.2.8.tgz",
"integrity": "sha512-y3bGgqKj3QBdxLbLkomlohkvsA8gdAiUQlSBJnBhfn+BPxg4bc62d8TcBW15wavDfgexCgccckhcZvywyQYPOw==",
"optional": true,
"requires": {
"deep-extend": "^0.6.0",
@ -10029,14 +10001,16 @@
"dependencies": {
"minimist": {
"version": "1.2.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.0.tgz",
"integrity": "sha1-o1AIsg9BOD7sH7kU9M1d95omQoQ=",
"optional": true
}
}
},
"readable-stream": {
"version": "2.3.6",
"bundled": true,
"resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
"integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
"optional": true,
"requires": {
"core-util-is": "~1.0.0",
@ -10050,7 +10024,8 @@
},
"rimraf": {
"version": "2.6.3",
"bundled": true,
"resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.3.tgz",
"integrity": "sha512-mwqeW5XsA2qAejG46gYdENaxXjx9onRNCfn7L0duuP4hCuTIi/QO7PDK07KJfp1d+izWPrzEJDcSqBa0OZQriA==",
"optional": true,
"requires": {
"glob": "^7.1.3"
@ -10058,38 +10033,43 @@
},
"safe-buffer": {
"version": "5.1.2",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.2.tgz",
"integrity": "sha512-Gd2UZBJDkXlY7GbJxfsE8/nvKkUEU1G38c1siN6QP6a9PT9MmHB8GnpscSmMJSoF8LOIrt8ud/wPtojys4G6+g=="
},
"safer-buffer": {
"version": "2.1.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
"integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
"optional": true
},
"sax": {
"version": "1.2.4",
"bundled": true,
"resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz",
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==",
"optional": true
},
"semver": {
"version": "5.7.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/semver/-/semver-5.7.0.tgz",
"integrity": "sha512-Ya52jSX2u7QKghxeoFGpLwCtGlt7j0oY9DYb5apt9nPlJ42ID+ulTXESnt/qAQcoSERyZ5sl3LDIOw0nAn/5DA==",
"optional": true
},
"set-blocking": {
"version": "2.0.0",
"bundled": true,
"resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz",
"integrity": "sha1-BF+XgtARrppoA93TgrJDkrPYkPc=",
"optional": true
},
"signal-exit": {
"version": "3.0.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz",
"integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=",
"optional": true
},
"string-width": {
"version": "1.0.2",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@ -10098,7 +10078,8 @@
},
"string_decoder": {
"version": "1.1.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz",
"integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==",
"optional": true,
"requires": {
"safe-buffer": "~5.1.0"
@ -10106,20 +10087,22 @@
},
"strip-ansi": {
"version": "3.0.1",
"bundled": true,
"optional": true,
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
"requires": {
"ansi-regex": "^2.0.0"
}
},
"strip-json-comments": {
"version": "2.0.1",
"bundled": true,
"resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz",
"integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=",
"optional": true
},
"tar": {
"version": "4.4.8",
"bundled": true,
"resolved": "https://registry.npmjs.org/tar/-/tar-4.4.8.tgz",
"integrity": "sha512-LzHF64s5chPQQS0IYBn9IN5h3i98c12bo4NCO7e0sGM2llXQ3p2FGC5sdENN4cTW48O915Sh+x+EXx7XW96xYQ==",
"optional": true,
"requires": {
"chownr": "^1.1.1",
@ -10133,12 +10116,14 @@
},
"util-deprecate": {
"version": "1.0.2",
"bundled": true,
"resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz",
"integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=",
"optional": true
},
"wide-align": {
"version": "1.1.3",
"bundled": true,
"resolved": "https://registry.npmjs.org/wide-align/-/wide-align-1.1.3.tgz",
"integrity": "sha512-QGkOQc8XL6Bt5PwnsExKBPuMKBxnGxWWW3fU55Xt4feHozMUhdUMaBCk290qpm/wG5u/RSKzwdAC4i51YigihA==",
"optional": true,
"requires": {
"string-width": "^1.0.2 || 2"
@ -10146,13 +10131,13 @@
},
"wrappy": {
"version": "1.0.2",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
},
"yallist": {
"version": "3.0.3",
"bundled": true,
"optional": true
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.3.tgz",
"integrity": "sha512-S+Zk8DEWE6oKpV+vI3qWkaK+jSbIK86pCwe2IF/xwIpQ8jEuxpw9NyaGjmp9+BoJv5FV2piqCDcoCtStppiq2A=="
}
}
},
@ -14116,76 +14101,6 @@
"integrity": "sha512-AO81vsIO1k1sM4Zrd6Hu7regmJN1NSiAja10gc4bX3F0wd+9rQmcuHQaHVQCYIEC8iFXnE+mavh23GOt7wBgug==",
"dev": true
},
"newspack-components": {
"version": "0.1.5",
"resolved": "https://registry.npmjs.org/newspack-components/-/newspack-components-0.1.5.tgz",
"integrity": "sha512-4Zjv6+9j4abH3tcQtGaQgtziadiRRmQkCdLTwSsq0YMgy2iu5NDMMAQ/uOZ+WbTdS6cG5az2OLd4YM1tBVdViQ==",
"requires": {
"@wordpress/components": "^7.3.1",
"@wordpress/element": "^2.3.0"
},
"dependencies": {
"@wordpress/api-fetch": {
"version": "3.6.3",
"resolved": "https://registry.npmjs.org/@wordpress/api-fetch/-/api-fetch-3.6.3.tgz",
"integrity": "sha512-k3mfIcOC0kmRq3hlidD2OL8q8vgU8bVlJlMDQRBBq2LjwcPVpUB91FI9Pp7tOgRpG6V54st0fDdtsjCdFnjdug==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/i18n": "^3.6.1",
"@wordpress/url": "^2.8.2"
},
"dependencies": {
"@wordpress/url": {
"version": "2.8.2",
"resolved": "https://registry.npmjs.org/@wordpress/url/-/url-2.8.2.tgz",
"integrity": "sha512-adTOs94K5G1riTQveIH/pJoDmFGegzBWFSDe/YzhP6mg64AGOWLQLwi0xzfIyoFC4d+kchx4fCyFTqYfcCbRVg==",
"requires": {
"@babel/runtime": "^7.4.4",
"qs": "^6.5.2"
}
}
}
},
"@wordpress/components": {
"version": "7.4.0",
"resolved": "https://registry.npmjs.org/@wordpress/components/-/components-7.4.0.tgz",
"integrity": "sha512-riVey0Z5835YdPZLWFSAs/4Hzo0nr7WA/393mRXwGuUtkqdk7ia++5emKfhyaCLYbinVBd6366xFFfiFxxcsCA==",
"requires": {
"@babel/runtime": "^7.4.4",
"@wordpress/a11y": "^2.3.0",
"@wordpress/api-fetch": "^3.2.0",
"@wordpress/compose": "^3.3.0",
"@wordpress/dom": "^2.3.0",
"@wordpress/element": "^2.4.0",
"@wordpress/hooks": "^2.3.0",
"@wordpress/i18n": "^3.4.0",
"@wordpress/is-shallow-equal": "^1.3.0",
"@wordpress/keycodes": "^2.3.0",
"@wordpress/rich-text": "^3.3.0",
"@wordpress/url": "^2.6.0",
"classnames": "^2.2.5",
"clipboard": "^2.0.1",
"diff": "^3.5.0",
"dom-scroll-into-view": "^1.2.1",
"lodash": "^4.17.11",
"memize": "^1.0.5",
"moment": "^2.22.1",
"mousetrap": "^1.6.2",
"re-resizable": "^4.7.1",
"react-click-outside": "^3.0.0",
"react-dates": "^17.1.1",
"rememo": "^3.0.0",
"tinycolor2": "^1.4.1",
"uuid": "^3.3.2"
}
},
"re-resizable": {
"version": "4.11.0",
"resolved": "https://registry.npmjs.org/re-resizable/-/re-resizable-4.11.0.tgz",
"integrity": "sha512-dye+7rERqNf/6mDT1iwps+4Gf42420xuZgygF33uX178DxffqcyeuHbBuJ382FIcB5iP6mMZOhfW7kI0uXwb/Q=="
}
}
},
"nice-try": {
"version": "1.0.5",
"resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",
@ -16289,12 +16204,6 @@
"require-from-string": "^2.0.1"
}
},
"diff": {
"version": "3.2.0",
"resolved": "https://registry.npmjs.org/diff/-/diff-3.2.0.tgz",
"integrity": "sha1-yc45Okt8vQsFinJck98pkCeGj/k=",
"dev": true
},
"emoji-regex": {
"version": "6.5.1",
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-6.5.1.tgz",

View File

@ -70,6 +70,7 @@
"@wordpress/components": "8.4.0",
"@wordpress/data": "4.9.1",
"@wordpress/date": "3.5.0",
"@wordpress/dom": "2.6.0",
"@wordpress/element": "2.8.1",
"@wordpress/hooks": "2.6.0",
"@wordpress/html-entities": "2.5.0",
@ -97,7 +98,6 @@
"interpolate-components": "1.1.1",
"marked": "0.7.0",
"memoize-one": "5.1.1",
"newspack-components": "0.1.5",
"prismjs": "1.17.1",
"qs": "6.9.1",
"react-click-outside": "3.0.1",

View File

@ -1,3 +1,6 @@
# 4.1.0 (Unreleased)
- Added `<ImageUpload />` component.
# 4.0.0
## Breaking Changes

View File

@ -29,6 +29,7 @@
"@wordpress/components": "8.4.0",
"@wordpress/compose": "3.7.1",
"@wordpress/date": "3.5.0",
"@wordpress/dom": "2.6.0",
"@wordpress/element": "2.8.1",
"@wordpress/html-entities": "2.5.0",
"@wordpress/i18n": "3.6.1",

View File

@ -0,0 +1,18 @@
ImageUpload
===
ImageUpload - Adds an upload area for selecting or uploading an image from the WordPress media gallery.
## Usage
```jsx
<ImageUpload image={ image } onChange={ newImage => setState( { url: newImage } ) } />
```
### Props
Name | Type | Default | Description
--- | --- | --- | ---
`image` | Object | `null` | Image information containing media gallery `id` and image `url`
`onChange` | Function | `null` | Function to trigger when the selected image changes
`className` | String | `null` | Additional class name to style the component

View File

@ -0,0 +1,18 @@
/** @format */
/**
* Internal dependencies
*/
import {
ImageUpload,
} from '@woocommerce/components';
/**
* External dependencies
*/
import { withState } from '@wordpress/compose';
export default withState( {
image: null,
} )( ( { setState, logo } ) => (
<ImageUpload image={ logo } onChange={ image => setState( { logo: image } ) } />
) );

View File

@ -0,0 +1,78 @@
/**
* External dependencies
*/
import { Component, Fragment } from '@wordpress/element';
import { Button } from '@wordpress/components';
import { __ } from '@wordpress/i18n';
import classNames from 'classnames';
class ImageUpload extends Component {
constructor() {
super( ...arguments );
this.state = {
frame: false,
};
this.openModal = this.openModal.bind( this );
this.handleImageSelect = this.handleImageSelect.bind( this );
this.removeImage = this.removeImage.bind( this );
}
openModal() {
if ( this.state.frame ) {
this.state.frame.open();
return;
}
this.state.frame = wp.media( {
title: __( 'Select or upload image' ),
button: {
text: __( 'Select' ),
},
library: {
type: 'image',
},
multiple: false,
} );
this.state.frame.on( 'select', this.handleImageSelect );
this.state.frame.open();
}
handleImageSelect() {
const { onChange } = this.props;
const attachment = this.state.frame.state().get( 'selection' ).first().toJSON();
onChange( attachment );
}
removeImage() {
const { onChange } = this.props;
onChange( null );
}
render() {
const { className, image } = this.props;
return (
<Fragment>
{ !! image && (
<div className={ classNames( 'woocommerce-image-upload', 'has-image', className ) }>
<div className="woocommerce-image-upload__image-preview">
<img src={ image.url } alt="" />
</div>
<Button className="woocommerce-image-upload__remove-image" onClick={ this.removeImage }>
{ __( 'Remove image', 'woocommerce-admin' ) }
</Button>
</div>
) }
{ ! image && (
<div className={ classNames( 'woocommerce-image-upload', 'no-image', className ) }>
<Button className="woocommerce-image-upload__add-image" onClick={ this.openModal }>
{ __( 'Add an image', 'woocommerce-admin' ) }
</Button>
</div>
) }
</Fragment>
);
}
}
export default ImageUpload;

View File

@ -0,0 +1,38 @@
.woocommerce-image-upload {
button {
color: $studio-pink;
font-size: 16px;
line-height: 24px;
padding: 0;
vertical-align: middle;
}
.woocommerce-image-upload__image-preview {
font-size: 16px;
margin-right: 2em;
img {
max-width: 240px;
height: auto;
}
}
&.no-image {
.woocommerce-image-upload__add-image {
&::before {
content: '';
/* stylelint-disable function-url-quotes */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23636d75' d='M18 20H4V6h9V4H4c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2v-9h-2v9zm-7.79-3.17l-1.96-2.36L5.5 18h11l-3.54-4.71zM20 4V1h-2v3h-3c.01.01 0 2 0 2h3v2.99c.01.01 2 0 2 0V6h3V4h-3z'/%3E%3C/svg%3E");
/* stylelint-enable */
width: 24px;
height: 24px;
margin-right: 12px;
}
}
}
&.has-image {
display: flex;
align-items: center;
}
}

View File

@ -0,0 +1,30 @@
/** @format */
/**
* External dependencies
*/
import { shallow } from 'enzyme';
/**
* Internal dependencies
*/
import ImageUpload from '../index';
describe( 'ImageUpload', () => {
describe( 'basic rendering', () => {
it( 'should render an image uploader ready for upload', () => {
const uploader = shallow( <ImageUpload /> );
expect( uploader.children().hasClass( 'woocommerce-image-upload' ) ).toBe( true );
expect( uploader.children().hasClass( 'no-image' ) ).toBe( true );
} );
it( 'should render an image uploader prepopulated with an upload', () => {
const image = {
id: 1234,
url: 'https://upload.wikimedia.org/wikipedia/en/a/a9/Example.jpg',
};
const uploader = shallow( <ImageUpload image={ image } /> );
expect( uploader.children().hasClass( 'woocommerce-image-upload' ) ).toBe( true );
expect( uploader.children().hasClass( 'has-image' ) ).toBe( true );
} );
} );
} );

View File

@ -24,6 +24,7 @@ export { default as Form } from './form';
export { default as FilterPicker } from './filter-picker';
export { default as Gravatar } from './gravatar';
export { H, Section } from './section';
export { default as ImageUpload } from './image-upload';
export { default as Link } from './link';
export { default as List } from './list';
export { default as MenuItem } from './ellipsis-menu/menu-item';

View File

@ -17,6 +17,7 @@
@import 'filters/style.scss';
@import 'flag/style.scss';
@import 'gravatar/style.scss';
@import 'image-upload/style.scss';
@import 'list/style.scss';
@import 'order-status/style.scss';
@import 'pagination/style.scss';

View File

@ -3,7 +3,8 @@
.muriel-input-text {
background: $studio-white;
border: 1px solid $studio-gray-20;
border-radius: 0;
border-radius: 3px;
height: 56px;
box-shadow: none;
padding: 12px 12px 4px;
position: relative;
@ -47,10 +48,16 @@
&.with-value {
.components-base-control__label {
display: block;
position: relative;
top: -8px;
width: 100%;
font-size: 12px;
}
input {
color: $studio-gray-80;
position: relative;
top: -12px;
}
}

View File

@ -23,8 +23,5 @@
"<rootDir>/.*/build/",
"<rootDir>/.*/build-module/"
],
"transformIgnorePatterns": [
"node_modules/(?!(newspack-components)/)"
],
"verbose": true
}

View File

@ -114,7 +114,6 @@ const webpackConfig = {
'|acorn-jsx' +
'|d3-array' +
'|debug' +
'|newspack-components' +
'|regexpu-core' +
'|unicode-match-property-ecmascript' +
'|unicode-match-property-value-ecmascript)/'