diff --git a/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js b/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js
index b46b83dfbbd..707ee5cc4ce 100644
--- a/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js
+++ b/plugins/woocommerce-admin/client/analytics/components/report-chart/index.js
@@ -21,11 +21,11 @@ import {
getChartTypeForQuery,
getPreviousDate,
} from '@woocommerce/date';
+import { Chart } from '@woocommerce/components';
/**
* Internal dependencies
*/
-import { Chart } from 'components';
import { getReportChartData, getTooltipValueFormat } from 'store/reports/utils';
import ReportError from 'analytics/components/report-error';
diff --git a/plugins/woocommerce-admin/client/analytics/components/report-chart/test/index.js b/plugins/woocommerce-admin/client/analytics/components/report-chart/test/index.js
index b30fb38b982..5bdb4539f33 100644
--- a/plugins/woocommerce-admin/client/analytics/components/report-chart/test/index.js
+++ b/plugins/woocommerce-admin/client/analytics/components/report-chart/test/index.js
@@ -9,8 +9,8 @@ import { shallow } from 'enzyme';
*/
import { ReportChart } from '../';
-jest.mock( 'components', () => ( {
- ...require.requireActual( 'components' ),
+jest.mock( '@woocommerce/components', () => ( {
+ ...require.requireActual( '@woocommerce/components' ),
Chart: () => null,
} ) );
diff --git a/plugins/woocommerce-admin/client/components/index.js b/plugins/woocommerce-admin/client/components/index.js
deleted file mode 100644
index 2940ffd5a14..00000000000
--- a/plugins/woocommerce-admin/client/components/index.js
+++ /dev/null
@@ -1,6 +0,0 @@
-/** @format */
-
-export { default as Chart } from './chart';
-export { default as ChartLegend } from './d3chart/legend';
-export { default as ChartPlaceholder } from './chart/placeholder';
-export { default as D3Chart } from './d3chart';
diff --git a/plugins/woocommerce-admin/package-lock.json b/plugins/woocommerce-admin/package-lock.json
index 7c64e2cf608..9a0af6e37ea 100644
--- a/plugins/woocommerce-admin/package-lock.json
+++ b/plugins/woocommerce-admin/package-lock.json
@@ -5203,11 +5203,11 @@
"integrity": "sha512-eTVLrBSt7fjbDygz805pMnstIs2VTBNkRm0qxZd+M7A5XDdxVRWO5MxGBXZhjY4cqLYLdtrGqRf8mBPmzwSpWQ==",
"dev": true,
"requires": {
- "nice-try": "1.0.5",
- "path-key": "2.0.1",
- "semver": "5.6.0",
- "shebang-command": "1.2.0",
- "which": "1.3.1"
+ "nice-try": "^1.0.4",
+ "path-key": "^2.0.1",
+ "semver": "^5.5.0",
+ "shebang-command": "^1.2.0",
+ "which": "^1.2.9"
}
},
"execa": {
@@ -5216,13 +5216,13 @@
"integrity": "sha512-7XOMnz8Ynx1gGo/3hyV9loYNPWM94jG3+3T3Y8tsfSstFmETmENCMU/A/zj8Lyaj1lkgEepKepvd6240tBRvlw==",
"dev": true,
"requires": {
- "cross-spawn": "6.0.5",
- "get-stream": "3.0.0",
- "is-stream": "1.1.0",
- "npm-run-path": "2.0.2",
- "p-finally": "1.0.0",
- "signal-exit": "3.0.2",
- "strip-eof": "1.0.0"
+ "cross-spawn": "^6.0.0",
+ "get-stream": "^3.0.0",
+ "is-stream": "^1.1.0",
+ "npm-run-path": "^2.0.0",
+ "p-finally": "^1.0.0",
+ "signal-exit": "^3.0.0",
+ "strip-eof": "^1.0.0"
}
},
"find-up": {
@@ -5231,7 +5231,7 @@
"integrity": "sha512-1yD6RmLI1XBfxugvORwlck6f75tYL+iR0jqwsOrOxMZyGYqUuDhJ0l4AXdO1iX/FTs9cBAMEk1gWSEx1kSbylg==",
"dev": true,
"requires": {
- "locate-path": "3.0.0"
+ "locate-path": "^3.0.0"
}
},
"has-flag": {
@@ -5252,7 +5252,7 @@
"integrity": "sha512-avPEb8P8EGnwXKClwsNUgryVjllcRqtMYa49NTsbQagYuT1DcXnl1915oxWjoyGrXR6zH/Y0Zc96xWsPcoDKeA==",
"dev": true,
"requires": {
- "invert-kv": "2.0.0"
+ "invert-kv": "^2.0.0"
}
},
"locate-path": {
@@ -5261,8 +5261,8 @@
"integrity": "sha512-7AO748wWnIhNqAuaty2ZWHkQHRSNfPVIsPIfwEOWO22AmaoVrWavlOcMR5nzTLNYvp36X220/maaRsrec1G65A==",
"dev": true,
"requires": {
- "p-locate": "3.0.0",
- "path-exists": "3.0.0"
+ "p-locate": "^3.0.0",
+ "path-exists": "^3.0.0"
}
},
"mem": {
@@ -5271,9 +5271,9 @@
"integrity": "sha512-WQxG/5xYc3tMbYLXoXPm81ET2WDULiU5FxbuIoNbJqLOOI8zehXFdZuiUEgfdrU2mVB1pxBZUGlYORSrpuJreA==",
"dev": true,
"requires": {
- "map-age-cleaner": "0.1.3",
- "mimic-fn": "1.2.0",
- "p-is-promise": "1.1.0"
+ "map-age-cleaner": "^0.1.1",
+ "mimic-fn": "^1.0.0",
+ "p-is-promise": "^1.1.0"
}
},
"os-locale": {
@@ -5282,9 +5282,9 @@
"integrity": "sha512-7g5e7dmXPtzcP4bgsZ8ixDVqA7oWYuEz4lOSujeWyliPai4gfVDiFIcwBg3aGCPnmSGfzOKTK3ccPn0CKv3DBw==",
"dev": true,
"requires": {
- "execa": "0.10.0",
- "lcid": "2.0.0",
- "mem": "4.0.0"
+ "execa": "^0.10.0",
+ "lcid": "^2.0.0",
+ "mem": "^4.0.0"
}
},
"p-limit": {
@@ -5293,7 +5293,7 @@
"integrity": "sha512-fl5s52lI5ahKCernzzIyAP0QAZbGIovtVHGwpcu1Jr/EpzLVDI2myISHwGqK7m8uQFugVWSrbxH7XnhGtvEc+A==",
"dev": true,
"requires": {
- "p-try": "2.0.0"
+ "p-try": "^2.0.0"
}
},
"p-locate": {
@@ -5302,7 +5302,7 @@
"integrity": "sha512-x+12w/To+4GFfgJhBEpiDcLozRJGegY+Ei7/z0tSLkMmxGZNybVMSfWj9aJn8Z5Fc7dBUNJOOVgPv2H7IwulSQ==",
"dev": true,
"requires": {
- "p-limit": "2.0.0"
+ "p-limit": "^2.0.0"
}
},
"p-try": {
@@ -5317,8 +5317,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
},
"pify": {
@@ -5333,9 +5333,9 @@
"integrity": "sha1-ljYlN48+HE1IyFhytabsfV0JMjc=",
"dev": true,
"requires": {
- "normalize-package-data": "2.4.0",
- "parse-json": "4.0.0",
- "pify": "3.0.0"
+ "normalize-package-data": "^2.3.2",
+ "parse-json": "^4.0.0",
+ "pify": "^3.0.0"
}
},
"rxjs": {
@@ -5353,7 +5353,7 @@
"integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=",
"dev": true,
"requires": {
- "has-flag": "2.0.0"
+ "has-flag": "^2.0.0"
}
},
"yargs": {
@@ -5612,10 +5612,10 @@
"integrity": "sha1-L19Fq5HjMhYjT9U62rZo607AmTs=",
"dev": true,
"requires": {
- "graceful-fs": "4.1.15",
- "parse-json": "4.0.0",
- "pify": "3.0.0",
- "strip-bom": "3.0.0"
+ "graceful-fs": "^4.1.2",
+ "parse-json": "^4.0.0",
+ "pify": "^3.0.0",
+ "strip-bom": "^3.0.0"
}
},
"meow": {
@@ -5624,15 +5624,15 @@
"integrity": "sha512-xcSBHD5Z86zaOc+781KrupuHAzeGXSLtiAOmBsiLDiPSaYSB6hdew2ng9EBAnZ62jagG9MHAOdxpDi/lWBFJ/A==",
"dev": true,
"requires": {
- "camelcase-keys": "4.2.0",
- "decamelize-keys": "1.1.0",
- "loud-rejection": "1.6.0",
- "minimist": "1.2.0",
- "minimist-options": "3.0.2",
- "normalize-package-data": "2.4.0",
- "read-pkg-up": "3.0.0",
- "redent": "2.0.0",
- "trim-newlines": "2.0.0"
+ "camelcase-keys": "^4.0.0",
+ "decamelize-keys": "^1.0.0",
+ "loud-rejection": "^1.0.0",
+ "minimist": "^1.1.3",
+ "minimist-options": "^3.0.1",
+ "normalize-package-data": "^2.3.4",
+ "read-pkg-up": "^3.0.0",
+ "redent": "^2.0.0",
+ "trim-newlines": "^2.0.0"
}
},
"minimist": {
@@ -5647,8 +5647,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
},
"path-type": {
@@ -5657,7 +5657,7 @@
"integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
"dev": true,
"requires": {
- "pify": "3.0.0"
+ "pify": "^3.0.0"
}
},
"pify": {
@@ -5672,9 +5672,9 @@
"integrity": "sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=",
"dev": true,
"requires": {
- "load-json-file": "4.0.0",
- "normalize-package-data": "2.4.0",
- "path-type": "3.0.0"
+ "load-json-file": "^4.0.0",
+ "normalize-package-data": "^2.3.2",
+ "path-type": "^3.0.0"
}
},
"read-pkg-up": {
@@ -5683,8 +5683,8 @@
"integrity": "sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc=",
"dev": true,
"requires": {
- "find-up": "2.1.0",
- "read-pkg": "3.0.0"
+ "find-up": "^2.0.0",
+ "read-pkg": "^3.0.0"
}
},
"strip-bom": {
@@ -5726,10 +5726,10 @@
"integrity": "sha1-L19Fq5HjMhYjT9U62rZo607AmTs=",
"dev": true,
"requires": {
- "graceful-fs": "4.1.15",
- "parse-json": "4.0.0",
- "pify": "3.0.0",
- "strip-bom": "3.0.0"
+ "graceful-fs": "^4.1.2",
+ "parse-json": "^4.0.0",
+ "pify": "^3.0.0",
+ "strip-bom": "^3.0.0"
}
},
"meow": {
@@ -5738,15 +5738,15 @@
"integrity": "sha512-xcSBHD5Z86zaOc+781KrupuHAzeGXSLtiAOmBsiLDiPSaYSB6hdew2ng9EBAnZ62jagG9MHAOdxpDi/lWBFJ/A==",
"dev": true,
"requires": {
- "camelcase-keys": "4.2.0",
- "decamelize-keys": "1.1.0",
- "loud-rejection": "1.6.0",
- "minimist": "1.2.0",
- "minimist-options": "3.0.2",
- "normalize-package-data": "2.4.0",
- "read-pkg-up": "3.0.0",
- "redent": "2.0.0",
- "trim-newlines": "2.0.0"
+ "camelcase-keys": "^4.0.0",
+ "decamelize-keys": "^1.0.0",
+ "loud-rejection": "^1.0.0",
+ "minimist": "^1.1.3",
+ "minimist-options": "^3.0.1",
+ "normalize-package-data": "^2.3.4",
+ "read-pkg-up": "^3.0.0",
+ "redent": "^2.0.0",
+ "trim-newlines": "^2.0.0"
}
},
"minimist": {
@@ -5761,8 +5761,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
},
"path-type": {
@@ -5771,7 +5771,7 @@
"integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
"dev": true,
"requires": {
- "pify": "3.0.0"
+ "pify": "^3.0.0"
}
},
"pify": {
@@ -5786,9 +5786,9 @@
"integrity": "sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=",
"dev": true,
"requires": {
- "load-json-file": "4.0.0",
- "normalize-package-data": "2.4.0",
- "path-type": "3.0.0"
+ "load-json-file": "^4.0.0",
+ "normalize-package-data": "^2.3.2",
+ "path-type": "^3.0.0"
}
},
"read-pkg-up": {
@@ -5797,8 +5797,8 @@
"integrity": "sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc=",
"dev": true,
"requires": {
- "find-up": "2.1.0",
- "read-pkg": "3.0.0"
+ "find-up": "^2.0.0",
+ "read-pkg": "^3.0.0"
}
},
"strip-bom": {
@@ -5831,10 +5831,10 @@
"integrity": "sha1-L19Fq5HjMhYjT9U62rZo607AmTs=",
"dev": true,
"requires": {
- "graceful-fs": "4.1.15",
- "parse-json": "4.0.0",
- "pify": "3.0.0",
- "strip-bom": "3.0.0"
+ "graceful-fs": "^4.1.2",
+ "parse-json": "^4.0.0",
+ "pify": "^3.0.0",
+ "strip-bom": "^3.0.0"
}
},
"meow": {
@@ -5843,15 +5843,15 @@
"integrity": "sha512-xcSBHD5Z86zaOc+781KrupuHAzeGXSLtiAOmBsiLDiPSaYSB6hdew2ng9EBAnZ62jagG9MHAOdxpDi/lWBFJ/A==",
"dev": true,
"requires": {
- "camelcase-keys": "4.2.0",
- "decamelize-keys": "1.1.0",
- "loud-rejection": "1.6.0",
- "minimist": "1.2.0",
- "minimist-options": "3.0.2",
- "normalize-package-data": "2.4.0",
- "read-pkg-up": "3.0.0",
- "redent": "2.0.0",
- "trim-newlines": "2.0.0"
+ "camelcase-keys": "^4.0.0",
+ "decamelize-keys": "^1.0.0",
+ "loud-rejection": "^1.0.0",
+ "minimist": "^1.1.3",
+ "minimist-options": "^3.0.1",
+ "normalize-package-data": "^2.3.4",
+ "read-pkg-up": "^3.0.0",
+ "redent": "^2.0.0",
+ "trim-newlines": "^2.0.0"
}
},
"minimist": {
@@ -5866,8 +5866,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
},
"path-type": {
@@ -5876,7 +5876,7 @@
"integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
"dev": true,
"requires": {
- "pify": "3.0.0"
+ "pify": "^3.0.0"
}
},
"pify": {
@@ -5891,9 +5891,9 @@
"integrity": "sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=",
"dev": true,
"requires": {
- "load-json-file": "4.0.0",
- "normalize-package-data": "2.4.0",
- "path-type": "3.0.0"
+ "load-json-file": "^4.0.0",
+ "normalize-package-data": "^2.3.2",
+ "path-type": "^3.0.0"
}
},
"read-pkg-up": {
@@ -5902,8 +5902,8 @@
"integrity": "sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc=",
"dev": true,
"requires": {
- "find-up": "2.1.0",
- "read-pkg": "3.0.0"
+ "find-up": "^2.0.0",
+ "read-pkg": "^3.0.0"
}
},
"strip-bom": {
@@ -6002,8 +6002,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
}
}
@@ -6219,9 +6219,9 @@
"integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=",
"dev": true,
"requires": {
- "regenerate": "1.4.0",
- "regjsgen": "0.2.0",
- "regjsparser": "0.1.5"
+ "regenerate": "^1.2.1",
+ "regjsgen": "^0.2.0",
+ "regjsparser": "^0.1.4"
}
},
"regjsgen": {
@@ -6236,7 +6236,7 @@
"integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
"dev": true,
"requires": {
- "jsesc": "0.5.0"
+ "jsesc": "~0.5.0"
}
}
}
@@ -6421,9 +6421,9 @@
"resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-7.0.0.tgz",
"integrity": "sha512-37GeVSIJ3kn1JgKyjiYNmSLP1yzbpb29jdmwBSgkD9h40/hyrR/OifpVUndji3tmwGgD8qpw7iQu3RSbCrBpsQ==",
"requires": {
- "lodash.sortby": "4.7.0",
- "tr46": "1.0.1",
- "webidl-conversions": "4.0.2"
+ "lodash.sortby": "^4.7.0",
+ "tr46": "^1.0.1",
+ "webidl-conversions": "^4.0.2"
}
}
}
@@ -8678,8 +8678,7 @@
"ansi-regex": {
"version": "2.1.1",
"resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz",
- "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=",
- "optional": true
+ "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8="
},
"aproba": {
"version": "1.2.0",
@@ -8700,14 +8699,12 @@
"balanced-match": {
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz",
- "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=",
- "optional": true
+ "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c="
},
"brace-expansion": {
"version": "1.1.11",
"resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
"integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==",
- "optional": true,
"requires": {
"balanced-match": "^1.0.0",
"concat-map": "0.0.1"
@@ -8722,20 +8719,17 @@
"code-point-at": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz",
- "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=",
- "optional": true
+ "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c="
},
"concat-map": {
"version": "0.0.1",
"resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz",
- "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=",
- "optional": true
+ "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s="
},
"console-control-strings": {
"version": "1.1.0",
"resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz",
- "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4=",
- "optional": true
+ "integrity": "sha1-PXz0Rk22RG6mRL9LOVB/mFEAjo4="
},
"core-util-is": {
"version": "1.0.2",
@@ -8852,8 +8846,7 @@
"inherits": {
"version": "2.0.3",
"resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz",
- "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=",
- "optional": true
+ "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4="
},
"ini": {
"version": "1.3.5",
@@ -8865,7 +8858,6 @@
"version": "1.0.0",
"resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz",
"integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=",
- "optional": true,
"requires": {
"number-is-nan": "^1.0.0"
}
@@ -8880,7 +8872,6 @@
"version": "3.0.4",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz",
"integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==",
- "optional": true,
"requires": {
"brace-expansion": "^1.1.7"
}
@@ -8888,14 +8879,12 @@
"minimist": {
"version": "0.0.8",
"resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz",
- "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
- "optional": true
+ "integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0="
},
"minipass": {
"version": "2.2.4",
"resolved": "https://registry.npmjs.org/minipass/-/minipass-2.2.4.tgz",
"integrity": "sha512-hzXIWWet/BzWhYs2b+u7dRHlruXhwdgvlTMDKC6Cb1U7ps6Ac6yQlR39xsbjWJE377YTCtKwIXIpJ5oP+j5y8g==",
- "optional": true,
"requires": {
"safe-buffer": "^5.1.1",
"yallist": "^3.0.0"
@@ -8914,7 +8903,6 @@
"version": "0.5.1",
"resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz",
"integrity": "sha1-MAV0OOrGz3+MR2fzhkjWaX11yQM=",
- "optional": true,
"requires": {
"minimist": "0.0.8"
}
@@ -8995,8 +8983,7 @@
"number-is-nan": {
"version": "1.0.1",
"resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",
- "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
- "optional": true
+ "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0="
},
"object-assign": {
"version": "4.1.1",
@@ -9008,7 +8995,6 @@
"version": "1.4.0",
"resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
"integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=",
- "optional": true,
"requires": {
"wrappy": "1"
}
@@ -9094,8 +9080,7 @@
"safe-buffer": {
"version": "5.1.1",
"resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.1.1.tgz",
- "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg==",
- "optional": true
+ "integrity": "sha512-kKvNJn6Mm93gAczWVJg7wH+wGYWNrDHdWvpUmHyEsgCtIwwo3bqPtV4tR5tuPaUhTOo/kvhVwd8XwwOllGYkbg=="
},
"safer-buffer": {
"version": "2.1.2",
@@ -9131,7 +9116,6 @@
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz",
"integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=",
- "optional": true,
"requires": {
"code-point-at": "^1.0.0",
"is-fullwidth-code-point": "^1.0.0",
@@ -9151,7 +9135,6 @@
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
"integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
- "optional": true,
"requires": {
"ansi-regex": "^2.0.0"
}
@@ -9195,14 +9178,12 @@
"wrappy": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
- "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
- "optional": true
+ "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
},
"yallist": {
"version": "3.0.2",
"resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.2.tgz",
- "integrity": "sha1-hFK0u36Dx8GI2AQcGoN8dz1ti7k=",
- "optional": true
+ "integrity": "sha1-hFK0u36Dx8GI2AQcGoN8dz1ti7k="
}
}
},
@@ -9577,10 +9558,10 @@
"integrity": "sha1-L19Fq5HjMhYjT9U62rZo607AmTs=",
"dev": true,
"requires": {
- "graceful-fs": "4.1.15",
- "parse-json": "4.0.0",
- "pify": "3.0.0",
- "strip-bom": "3.0.0"
+ "graceful-fs": "^4.1.2",
+ "parse-json": "^4.0.0",
+ "pify": "^3.0.0",
+ "strip-bom": "^3.0.0"
}
},
"meow": {
@@ -9589,15 +9570,15 @@
"integrity": "sha512-xcSBHD5Z86zaOc+781KrupuHAzeGXSLtiAOmBsiLDiPSaYSB6hdew2ng9EBAnZ62jagG9MHAOdxpDi/lWBFJ/A==",
"dev": true,
"requires": {
- "camelcase-keys": "4.2.0",
- "decamelize-keys": "1.1.0",
- "loud-rejection": "1.6.0",
- "minimist": "1.2.0",
- "minimist-options": "3.0.2",
- "normalize-package-data": "2.4.0",
- "read-pkg-up": "3.0.0",
- "redent": "2.0.0",
- "trim-newlines": "2.0.0"
+ "camelcase-keys": "^4.0.0",
+ "decamelize-keys": "^1.0.0",
+ "loud-rejection": "^1.0.0",
+ "minimist": "^1.1.3",
+ "minimist-options": "^3.0.1",
+ "normalize-package-data": "^2.3.4",
+ "read-pkg-up": "^3.0.0",
+ "redent": "^2.0.0",
+ "trim-newlines": "^2.0.0"
}
},
"minimist": {
@@ -9612,8 +9593,8 @@
"integrity": "sha1-vjX1Qlvh9/bHRxhPmKeIy5lHfuA=",
"dev": true,
"requires": {
- "error-ex": "1.3.2",
- "json-parse-better-errors": "1.0.2"
+ "error-ex": "^1.3.1",
+ "json-parse-better-errors": "^1.0.1"
}
},
"path-type": {
@@ -9622,7 +9603,7 @@
"integrity": "sha512-T2ZUsdZFHgA3u4e5PfPbjd7HDDpxPnQb5jN0SrDsjNSuVXHJqtwTnWqG0B1jZrgmJ/7lj1EmVIByWt1gxGkWvg==",
"dev": true,
"requires": {
- "pify": "3.0.0"
+ "pify": "^3.0.0"
}
},
"pify": {
@@ -9637,9 +9618,9 @@
"integrity": "sha1-nLxoaXj+5l0WwA4rGcI3/Pbjg4k=",
"dev": true,
"requires": {
- "load-json-file": "4.0.0",
- "normalize-package-data": "2.4.0",
- "path-type": "3.0.0"
+ "load-json-file": "^4.0.0",
+ "normalize-package-data": "^2.3.2",
+ "path-type": "^3.0.0"
}
},
"read-pkg-up": {
@@ -9648,8 +9629,8 @@
"integrity": "sha1-PtSWaF26D4/hGNBpHcUfSh/5bwc=",
"dev": true,
"requires": {
- "find-up": "2.1.0",
- "read-pkg": "3.0.0"
+ "find-up": "^2.0.0",
+ "read-pkg": "^3.0.0"
}
},
"strip-bom": {
@@ -12393,7 +12374,7 @@
"integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
"dev": true,
"requires": {
- "pump": "3.0.0"
+ "pump": "^3.0.0"
}
},
"pump": {
@@ -12402,8 +12383,8 @@
"integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
"dev": true,
"requires": {
- "end-of-stream": "1.4.1",
- "once": "1.4.0"
+ "end-of-stream": "^1.1.0",
+ "once": "^1.3.1"
}
}
}
@@ -14425,7 +14406,7 @@
"integrity": "sha512-GMat4EJ5161kIy2HevLlr4luNjBgvmj413KaQA7jt4V8B4RDsfpHk7WQ9GVqfYyyx8OS/L66Kox+rJRNklLK7w==",
"dev": true,
"requires": {
- "pump": "3.0.0"
+ "pump": "^3.0.0"
}
},
"mississippi": {
@@ -14434,16 +14415,16 @@
"integrity": "sha512-x471SsVjUtBRtcvd4BzKE9kFC+/2TeWgKCgw0bZcw1b9l2X3QX5vCWgF+KaZaYm87Ss//rHnWryupDrgLvmSkA==",
"dev": true,
"requires": {
- "concat-stream": "1.6.2",
- "duplexify": "3.6.1",
- "end-of-stream": "1.4.1",
- "flush-write-stream": "1.0.3",
- "from2": "2.3.0",
- "parallel-transform": "1.1.0",
- "pump": "3.0.0",
- "pumpify": "1.5.1",
- "stream-each": "1.2.3",
- "through2": "2.0.5"
+ "concat-stream": "^1.5.0",
+ "duplexify": "^3.4.2",
+ "end-of-stream": "^1.1.0",
+ "flush-write-stream": "^1.0.0",
+ "from2": "^2.1.0",
+ "parallel-transform": "^1.1.0",
+ "pump": "^3.0.0",
+ "pumpify": "^1.3.3",
+ "stream-each": "^1.1.0",
+ "through2": "^2.0.0"
}
},
"pump": {
@@ -14452,8 +14433,8 @@
"integrity": "sha512-LwZy+p3SFs1Pytd/jYct4wpv49HiYCqd9Rlc5ZVdk0V+8Yzv6jR5Blk3TRmPL1ft69TxP0IMZGJ+WPFU2BFhww==",
"dev": true,
"requires": {
- "end-of-stream": "1.4.1",
- "once": "1.4.0"
+ "end-of-stream": "^1.1.0",
+ "once": "^1.3.1"
}
},
"ssri": {
@@ -14462,7 +14443,7 @@
"integrity": "sha512-3Wge10hNcT1Kur4PDFwEieXSCMCJs/7WvSACcrMYrNp+b8kDL1/0wJch5Ni2WrtwEa2IO8OsVfeKIciKCDx/QA==",
"dev": true,
"requires": {
- "figgy-pudding": "3.5.1"
+ "figgy-pudding": "^3.5.1"
}
},
"tar": {
@@ -18836,9 +18817,9 @@
"integrity": "sha512-5h+MvEjnzu1qy6MabjuoPatsGAjjDV9B24e7Cktjl+ClNtjVjmvAXjOFQr1u7RlWULKNGYaYVE4s+DIIQ4bOGA==",
"dev": true,
"requires": {
- "cssesc": "1.0.1",
- "indexes-of": "1.0.1",
- "uniq": "1.0.1"
+ "cssesc": "^1.0.1",
+ "indexes-of": "^1.0.1",
+ "uniq": "^1.0.1"
}
}
}
diff --git a/plugins/woocommerce-admin/client/components/d3chart/index.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/chart.js
similarity index 99%
rename from plugins/woocommerce-admin/client/components/d3chart/index.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/chart.js
index 141b8b38b9f..2749c106e82 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/chart.js
@@ -13,8 +13,7 @@ import { select as d3Select } from 'd3-selection';
/**
* Internal dependencies
*/
-import './style.scss';
-import D3Base from './d3-base';
+import D3Base from './d3base';
import {
drawAxis,
drawBars,
diff --git a/plugins/woocommerce-admin/client/components/d3chart/d3-base/README.md b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/README.md
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/d3-base/README.md
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/README.md
diff --git a/plugins/woocommerce-admin/client/components/d3chart/d3-base/index.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/index.js
similarity index 97%
rename from plugins/woocommerce-admin/client/components/d3chart/d3-base/index.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/index.js
index c53abe394ca..9f259fdfe22 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/d3-base/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/index.js
@@ -9,11 +9,6 @@ import { Component, createRef } from '@wordpress/element';
import { isEqual } from 'lodash';
import { select as d3Select } from 'd3-selection';
-/**
- * Internal dependencies
- */
-import './style.scss';
-
/**
* Provides foundation to use D3 within React.
*
diff --git a/plugins/woocommerce-admin/client/components/d3chart/d3-base/style.scss b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/style.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/d3-base/style.scss
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/style.scss
diff --git a/plugins/woocommerce-admin/client/components/d3chart/d3-base/test/index.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/test/index.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/d3-base/test/index.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/d3base/test/index.js
diff --git a/plugins/woocommerce-admin/client/components/d3chart/example.md b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/example.md
similarity index 80%
rename from plugins/woocommerce-admin/client/components/d3chart/example.md
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/example.md
index 6dc1784ac57..0b84570aabe 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/example.md
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/example.md
@@ -1,7 +1,5 @@
```jsx
-import { D3Chart, Legend } from 'components';
-
-const noop = () => {};
+import { D3Chart, D3Legend } from 'react-d3-chart';
const data = [
{
@@ -32,7 +30,7 @@ const data = [
const MyChart = () => (
-
+
);
```
diff --git a/plugins/woocommerce-admin/packages/components/src/chart/d3chart/index.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/index.js
new file mode 100644
index 00000000000..b8b0f3d5a8a
--- /dev/null
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/index.js
@@ -0,0 +1,3 @@
+export { default as D3Chart } from './chart';
+export { default as D3Legend } from './legend';
+export { default as D3Base } from './d3base';
diff --git a/plugins/woocommerce-admin/client/components/d3chart/legend.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/legend.js
similarity index 78%
rename from plugins/woocommerce-admin/client/components/d3chart/legend.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/legend.js
index feab9362b93..c51111c326e 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/legend.js
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/legend.js
@@ -5,38 +5,16 @@
import classNames from 'classnames';
import { Component, createRef } from '@wordpress/element';
import PropTypes from 'prop-types';
-import { sprintf } from '@wordpress/i18n';
-
-/**
- * WooCommerce dependencies
- */
-import { formatCurrency } from '@woocommerce/currency';
/**
* Internal dependencies
*/
-import './legend.scss';
-import { getColor } from './utils';
-
-function getFormatedTotal( total, valueType ) {
- let rowTotal = total;
- switch ( valueType ) {
- case 'average':
- rowTotal = Math.round( total );
- break;
- case 'currency':
- rowTotal = formatCurrency( total );
- break;
- case 'number':
- break;
- }
- return rowTotal;
-}
+import { getColor, getFormatter } from './utils';
/**
* A legend specifically designed for the WooCommerce admin charts.
*/
-class Legend extends Component {
+class D3Legend extends Component {
constructor() {
super();
@@ -56,13 +34,13 @@ class Legend extends Component {
window.removeEventListener( 'resize', this.updateListScroll );
}
- updateListScroll = () => {
+ updateListScroll() {
const list = this.listRef.current;
const scrolledToEnd = list.scrollHeight - list.scrollTop <= list.offsetHeight;
this.setState( {
isScrollable: ! scrolledToEnd,
} );
- };
+ }
render() {
const {
@@ -70,9 +48,9 @@ class Legend extends Component {
data,
handleLegendHover,
handleLegendToggle,
- itemsLabel,
legendDirection,
- valueType,
+ legendValueFormat,
+ totalLabel,
} = this.props;
const { isScrollable } = this.state;
const colorParams = {
@@ -80,7 +58,7 @@ class Legend extends Component {
colorScheme,
};
const numberOfRowsVisible = data.filter( row => row.visible ).length;
- const showTotalLabel = legendDirection === 'column' && data.length > 5 && itemsLabel;
+ const showTotalLabel = legendDirection === 'column' && data.length > 5 && totalLabel;
return (
- { getFormatedTotal( row.total, valueType ) }
+ { getFormatter( legendValueFormat )( row.total ) }
@@ -136,14 +114,14 @@ class Legend extends Component {
) ) }
{ showTotalLabel && (
- { sprintf( itemsLabel, data.length ) }
+ { totalLabel }
) }
);
}
}
-Legend.propTypes = {
+D3Legend.propTypes = {
/**
* Additional CSS classes.
*/
@@ -168,19 +146,20 @@ Legend.propTypes = {
* Display legend items as a `row` or `column` inside a flex-box.
*/
legendDirection: PropTypes.oneOf( [ 'row', 'column' ] ),
+ /**
+ * A number formatting string or function to format the value displayed in the legend.
+ */
+ legendValueFormat: PropTypes.oneOfType( [ PropTypes.string, PropTypes.func ] ),
/**
* Label to describe the legend items. It will be displayed in the legend of
* comparison charts when there are many.
*/
- itemsLabel: PropTypes.string,
- /**
- * What type of data is to be displayed? Number, Average, String?
- */
- valueType: PropTypes.string,
+ totalLabel: PropTypes.string,
};
-Legend.defaultProps = {
+D3Legend.defaultProps = {
legendDirection: 'row',
+ legendValueFormat: ',',
};
-export default Legend;
+export default D3Legend;
diff --git a/plugins/woocommerce-admin/client/components/d3chart/legend.scss b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/legend.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/legend.scss
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/legend.scss
diff --git a/plugins/woocommerce-admin/client/components/d3chart/style.scss b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/style.scss
similarity index 97%
rename from plugins/woocommerce-admin/client/components/d3chart/style.scss
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/style.scss
index 449da3ab86a..00ba3b676dd 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/style.scss
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/style.scss
@@ -1,4 +1,8 @@
/** @format */
+/**
+ * Internal Dependencies
+ */
+@import './legend.scss';
.d3-chart__container {
position: relative;
diff --git a/plugins/woocommerce-admin/client/components/d3chart/test/fixtures/dummy-hour.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/fixtures/dummy-hour.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/test/fixtures/dummy-hour.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/fixtures/dummy-hour.js
diff --git a/plugins/woocommerce-admin/client/components/d3chart/test/fixtures/dummy.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/fixtures/dummy.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/test/fixtures/dummy.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/fixtures/dummy.js
diff --git a/plugins/woocommerce-admin/client/components/d3chart/test/legend.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/legend.js
similarity index 79%
rename from plugins/woocommerce-admin/client/components/d3chart/test/legend.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/legend.js
index 2604937ffe5..a1346adb665 100644
--- a/plugins/woocommerce-admin/client/components/d3chart/test/legend.js
+++ b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/legend.js
@@ -8,7 +8,7 @@ import { mount } from 'enzyme';
/**
* Internal dependencies
*/
-import Legend from '../legend';
+import D3Legend from '../legend';
const colorScheme = jest.fn();
const data = [
@@ -26,7 +26,7 @@ const data = [
describe( 'Legend', () => {
test( 'should not disable any button if more than one is active', () => {
- const legend = mount( );
+ const legend = mount( );
expect( legend.find( 'button' ).get( 0 ).props.disabled ).toBeFalsy();
expect( legend.find( 'button' ).get( 1 ).props.disabled ).toBeFalsy();
@@ -35,7 +35,7 @@ describe( 'Legend', () => {
test( 'should disable the last active button', () => {
data[ 1 ].visible = false;
- const legend = mount( );
+ const legend = mount( );
expect( legend.find( 'button' ).get( 0 ).props.disabled ).toBeTruthy();
expect( legend.find( 'button' ).get( 1 ).props.disabled ).toBeFalsy();
diff --git a/plugins/woocommerce-admin/client/components/d3chart/test/utils.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/utils.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/test/utils.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/test/utils.js
diff --git a/plugins/woocommerce-admin/client/components/d3chart/utils.js b/plugins/woocommerce-admin/packages/components/src/chart/d3chart/utils.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/d3chart/utils.js
rename to plugins/woocommerce-admin/packages/components/src/chart/d3chart/utils.js
diff --git a/plugins/woocommerce-admin/packages/components/src/chart/example.md b/plugins/woocommerce-admin/packages/components/src/chart/example.md
new file mode 100644
index 00000000000..6cb7758e072
--- /dev/null
+++ b/plugins/woocommerce-admin/packages/components/src/chart/example.md
@@ -0,0 +1,36 @@
+```jsx
+import { Chart } from '@woocommerce/components';
+
+const data = [
+ {
+ date: '2018-05-30T00:00:00',
+ Hoodie: { value: 21599 },
+ Sunglasses: { value: 38537 },
+ Cap: { value: 106010 },
+ },
+ {
+ date: '2018-05-31T00:00:00',
+ Hoodie: { value: 14205 },
+ Sunglasses: { value: 24721 },
+ Cap: { value: 70131 },
+ },
+ {
+ date: '2018-06-01T00:00:00',
+ Hoodie: { value: 10581 },
+ Sunglasses: { value: 19991 },
+ Cap: { value: 53552 },
+ },
+ {
+ date: '2018-06-02T00:00:00',
+ Hoodie: { value: 9250 },
+ Sunglasses: { value: 16072 },
+ Cap: { value: 47821 },
+ },
+];
+
+const MyChart = () => (
+
+
+
+);
+```
\ No newline at end of file
diff --git a/plugins/woocommerce-admin/client/components/chart/index.js b/plugins/woocommerce-admin/packages/components/src/chart/index.js
similarity index 97%
rename from plugins/woocommerce-admin/client/components/chart/index.js
rename to plugins/woocommerce-admin/packages/components/src/chart/index.js
index fa23b786d1b..47e4d0a28cd 100644
--- a/plugins/woocommerce-admin/client/components/chart/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/chart/index.js
@@ -2,7 +2,7 @@
/**
* External dependencies
*/
-import { __ } from '@wordpress/i18n';
+import { __, sprintf } from '@wordpress/i18n';
import classNames from 'classnames';
import { Component, createRef, Fragment } from '@wordpress/element';
import { decodeEntities } from '@wordpress/html-entities';
@@ -18,15 +18,13 @@ import { withViewportMatch } from '@wordpress/viewport';
* WooCommerce dependencies
*/
import { updateQueryString } from '@woocommerce/navigation';
-import { H, Section } from '@woocommerce/components';
/**
* Internal dependencies
*/
-import './style.scss';
-import D3Chart from 'components/d3chart';
-import Legend from 'components/d3chart/legend';
import ChartPlaceholder from './placeholder';
+import { H, Section } from '../section';
+import { D3Chart, D3Legend } from './d3chart';
d3FormatDefaultLocale( {
decimal: '.',
@@ -235,14 +233,14 @@ class Chart extends Component {
const chartHeight = this.getChartHeight();
const legend = (
-
);
const margin = {
diff --git a/plugins/woocommerce-admin/client/components/chart/placeholder.js b/plugins/woocommerce-admin/packages/components/src/chart/placeholder.js
similarity index 100%
rename from plugins/woocommerce-admin/client/components/chart/placeholder.js
rename to plugins/woocommerce-admin/packages/components/src/chart/placeholder.js
diff --git a/plugins/woocommerce-admin/client/components/chart/style.scss b/plugins/woocommerce-admin/packages/components/src/chart/style.scss
similarity index 100%
rename from plugins/woocommerce-admin/client/components/chart/style.scss
rename to plugins/woocommerce-admin/packages/components/src/chart/style.scss
diff --git a/plugins/woocommerce-admin/packages/components/src/index.js b/plugins/woocommerce-admin/packages/components/src/index.js
index 79b7de8dd4d..480c7d2fb8c 100644
--- a/plugins/woocommerce-admin/packages/components/src/index.js
+++ b/plugins/woocommerce-admin/packages/components/src/index.js
@@ -7,6 +7,8 @@ import 'react-dates/initialize';
export { default as AdvancedFilters } from './filters/advanced';
export { default as AnimationSlider } from './animation-slider';
+export { default as Chart } from './chart';
+export { default as ChartPlaceholder } from './chart/placeholder';
export { default as Card } from './card';
export { default as Count } from './count';
export { default as CompareFilter } from './filters/compare';
diff --git a/plugins/woocommerce-admin/packages/components/src/style.scss b/plugins/woocommerce-admin/packages/components/src/style.scss
index a59795b8115..ce246e36b8d 100644
--- a/plugins/woocommerce-admin/packages/components/src/style.scss
+++ b/plugins/woocommerce-admin/packages/components/src/style.scss
@@ -4,6 +4,9 @@
@import 'animation-slider/style.scss';
@import 'calendar/style.scss';
@import 'card/style.scss';
+@import 'chart/style.scss';
+@import 'chart/d3chart/style.scss';
+@import 'chart/d3chart/d3base/style.scss';
@import 'count/style.scss';
@import 'dropdown-button/style.scss';
@import 'ellipsis-menu/style.scss';