Commit Graph

103 Commits

Author SHA1 Message Date
Albert Juhé Lluveras e4f05f31cb Make ChartPlaceholder have the same height than the resulting Chart (https://github.com/woocommerce/woocommerce-admin/pull/908)
* Make ChartPlaceholder have the same height than the resulting Chart

* Update Chart docs
2018-11-23 07:54:53 -06:00
Paul Sealock 77589bae6f Merge pull request woocommerce/woocommerce-admin#902 from woocommerce/fix/chart-placeholder
Chart: persist orderedKeys when requesting data
2018-11-23 09:57:45 +13:00
Paul Sealock 7d65df783c Chart: Persist orderedKeys between state changes 2018-11-23 09:49:28 +13:00
Albert Juhé Lluveras 56d3a69d13 Default charts to 'time-comparison' (https://github.com/woocommerce/woocommerce-admin/pull/905)
* Default charts to 'time-comparison'

* Fix broken test in ReportChart
2018-11-22 07:03:35 -06:00
Paul Sealock ab70ef4099 Chart: Persist orderedKeys between state changes 2018-11-22 13:12:03 +13:00
Robert Elliott 24758bc80d squashed commits for chart packaging
expand formatting function to xFormats

adding getTooltipValueFormat

remove old chart examples

remove magic numbers and use variables

refactor getTooltipRowValue

update package-lock

allow function formatters and use @wordpress/elements
2018-11-21 16:10:56 +02:00
Paul Sealock 0d59998625 Persist chart settings 2018-11-20 12:55:30 +13:00
Albert Juhé Lluveras 209a200e78 Fix wrong variable name in Legend tests (https://github.com/woocommerce/woocommerce-admin/pull/889) 2018-11-19 14:27:06 -06:00
Kelly Dwan 2a9cb6509b Build: Move components to packages dir (https://github.com/woocommerce/woocommerce-admin/pull/804)
* Move components to packages folder

* Update documentation generator to handle packages/components and client/components

* Update component locations

* Update CSS build process

* Remove react-dates css, this is already included by gutenberg

* Fix CSS style - single quotes

* Fix incorrect imports

* Update package-lock with new dependencies

* Update component locations for devdocs

* Fix location of tests
2018-11-15 13:16:23 -05:00
Albert Juhé Lluveras 8997d4ca26 Update chart breakpoints (https://github.com/woocommerce/woocommerce-admin/pull/838)
* Update chart breakpoints to match the other parts or wc-admin

* Make chart have always the specified height so it matches the legend total label

* Remove obsolete test

* Remove exports no longer needed

* Remove @wordpress/viewport dependency from chart.js

* Update chart docs

* Make tooltipPosition PropType more strict
2018-11-15 09:27:55 -06:00
Robert Elliott bd1997b725 Merge pull request woocommerce/woocommerce-admin#785 from woocommerce/add/chart-63day-x1month-x2year
Component - chart: more than 9 weeks of ticks change xFormat to months & x2Format to yrs
2018-11-13 10:16:01 +02:00
Albert Juhé Lluveras 5033a1ba5c Update comparison chart design and show it on the Product report (https://github.com/woocommerce/woocommerce-admin/pull/816)
* Display comparison chart in Product detail report

* Make legend to overflow in comparison charts

* Show comparison chart also when comparing products

* Update comparison chart legend design

* Send itemsLabel and comparisonChart as props to the ReportChart component

* Update styles and create a legend.scss file

* Minor cleanup

* Fix legend test

* Sort props alphabetically
2018-11-12 15:41:33 -06:00
Robert Elliott 703c1ca33a update from feedback 2018-11-07 11:54:20 +02:00
Robert Elliott d59594c4f6 at more than 9 weeks of ticks change xFormat to months and x2Format to years 2018-11-06 16:02:16 +02:00
Kelly Dwan d27cb26ef7 Build: Move `lib/nav-utils` and `lib/history` to `@woocommerce/navigation` (https://github.com/woocommerce/woocommerce-admin/pull/763)
* Move nav-utils and history to new package

* Update config to build and use new navigation package

* Update all imports to use new navigation package

* Remove unnecessary README

* Update nav-utils path
2018-11-05 16:02:04 -05:00
Kelly Dwan c29043a3bc Switch to using `@wordpress/viewport` for responsive screen layouts (https://github.com/woocommerce/woocommerce-admin/pull/761)
* Switch to Gutenberg viewport package

* Switch CSS breakpoints to core-supported values

* Fix double-calendar logic
2018-11-02 15:20:11 -04:00
Jonathan Belcher b16c056c32 Makes stylelint config match prettier settings (https://github.com/woocommerce/woocommerce-admin/pull/733)
* Makes stylelint config match prettier settings

* Fix/all css lints (https://github.com/woocommerce/woocommerce-admin/pull/734)

* Fix all sass lints!

* Delete settings.json

* Update newline rule, which also conflicts with prettier

* Fix remaining stylelint issues

* Disable stylelint rule for a line to avoid prettier/linter fights
2018-11-01 17:03:00 -04:00
Albert Juhé Lluveras 33cdba6945 Fix charts redirecting to previous path when changing interval value (https://github.com/woocommerce/woocommerce-admin/pull/731)
* Fix charts redirecting to previous path when changing interval value

* Fix chart being reset when changing interval

* Fix chart being reset when changing filters
2018-11-01 10:13:45 +01:00
Kelly Dwan f62537fc17 Try: Add Lerna to split out utility packages (https://github.com/woocommerce/woocommerce-admin/pull/678)
* Add lerna & GB package-building script

* Move currency library to lerna module

* Update lerna config

* Add publish commands

* Add currency as an faux-external module

* Add separate command to build just core files

* Update dependency path

* Update build script to build all packages into `dist`

* Add packages to the jest test setup

* Move date library to packages

* Update imports to use @woocommerce/date

* Output wcSettings definition before any scripts are output

Fixes issues where wc-dates lib relies on settings object

* Add the build step into travis

* Update jest config to dynamically get package paths

* Update package postcss config to match wc-admin’s main config

* Add combined watch scripts for package+app, add a `clean` command to clean up old build files

* Ignore PHPCS error (leave todo message to fix)

* Concat files with a space, fix issue where all files join in one continuous string and fail the check
2018-10-30 14:57:48 -04:00
Albert Juhé Lluveras e5fe8b1c66 Move tooltip below the chart when there is limited horizontal space (https://github.com/woocommerce/woocommerce-admin/pull/716)
* Show tooltip below the chart on mobile

* Fix tooltips not correctly centered in bar chart
2018-10-30 19:07:34 +01:00
Jonathan Belcher 3446c0814b Stylint autofixes (https://github.com/woocommerce/woocommerce-admin/pull/729) 2018-10-30 09:17:17 -04:00
Albert Juhé Lluveras eda609126e Reverse the order highlighted points are rendered in charts (https://github.com/woocommerce/woocommerce-admin/pull/701) 2018-10-26 16:47:44 +02:00
Robert Elliott fd846b3396 Merge pull request woocommerce/woocommerce-admin#684 from woocommerce/bug/x2-axis-dups
Bug: ensure duplicate parts of date removed from x2 ticks
2018-10-26 10:43:57 +02:00
Robert Elliott 36ef0a9459 updated dotRadius and lineStroke based on viewport size 2018-10-26 10:10:29 +02:00
Robert Elliott 2551696c6a show circles if the width to x-tick ratio is greater than 36px 2018-10-26 09:57:55 +02:00
Robert Elliott a538ef7234 adjust chart height and dots 2018-10-26 09:57:55 +02:00
Robert Elliott e6a609ae7a fix compareStrings issue 2018-10-25 13:47:31 +02:00
Robert Elliott 97a819a44d Merge pull request woocommerce/woocommerce-admin#635 from woocommerce/add/chart-uneven-ticks
Chart: remove last x-axis tick in an uneven series
2018-10-25 11:10:31 +02:00
Robert Elliott 6b2bd1e11d tests and jsdocs 2018-10-24 13:13:17 +02:00
Robert Elliott bc098e58d4 refactor compareStrings 2018-10-24 13:00:29 +02:00
Robert Elliott d152686a65 approach to remove duplicate string characters from prev x-tick 2018-10-24 12:42:43 +02:00
Robert Elliott 133e0a7646 remove 'or last' 2018-10-24 12:39:55 +02:00
Robert Elliott cf3d3eb0f0 remove last tick in an uneven series 2018-10-24 12:39:55 +02:00
Albert Juhé Lluveras 508141b709 IE11: fix tooltip not correctly positioned in charts (https://github.com/woocommerce/woocommerce-admin/pull/602) 2018-10-19 17:39:14 +02:00
Jonathan Belcher 0828ea5258 Fixes number formatting on charts (https://github.com/woocommerce/woocommerce-admin/pull/529) 2018-10-19 09:23:47 -04:00
Albert Juhé Lluveras e545ae4d22 Remove unnecessary opacity values from charts code (https://github.com/woocommerce/woocommerce-admin/pull/569) 2018-10-18 14:56:54 +02:00
Robert Elliott 141179b154 Component - Chart: focus data points on hover with tooltip (https://github.com/woocommerce/woocommerce-admin/pull/468)
* focus data points on hover with tooltip

* Add new proprty to getdateSpaces test
2018-10-17 11:08:34 -07:00
Albert Juhé Lluveras 36c37afe49 Hide day from X axis when the time period is too long (https://github.com/woocommerce/woocommerce-admin/pull/525)
* Refactor getXTicks

* Hide day from X axis when the time period is too long

* Fix X axis labels misaligned in charts

* Align axis ticks to the first day of the month when not displaying the day number

* Store threshold in a variable

* Add missing JSDoc

* Fix charts hanging when the number of days selected was exactly 180

* Improve function naming

* Fix dayTicksThreshold mismatch between date format and chart layout
2018-10-17 15:44:43 +02:00
David Levin b64fc4f0a1 Fix y-axis ticks 2018-10-12 13:39:38 -07:00
David Levin 564e4cfd66 change reverse line chart zindex and remove decinmals from yaxis ticks 2018-10-12 09:08:57 -07:00
David Levin aeac3a2e30 Update chart interval select alignment 2018-09-26 15:15:16 -07:00
Albert Juhé Lluveras 3e3dbad408 Update chart header layout according to design (https://github.com/woocommerce/woocommerce-admin/pull/476)
* Update chart header layout according to design

* Add RTL support
2018-09-26 14:17:45 +02:00
Albert Juhé Lluveras 80449c6c57 Make tooltip position be relative to the hovered elements instead of the mouse (https://github.com/woocommerce/woocommerce-admin/pull/471)
* Make tooltip position be relative to the hovered elements instead of the mouse

* Set tooltip margin to 24px to match CSS 'gap-large'

* When focusing a bar with value 0, set the target node to its parent so the tooltip is displayed next to it

* Make sure 'mouseout' event is not triggered when hover the tooltip box

* Make sure the tooltip is never rendered too much to the left/top of the chart

* Get the size of the tooltip box from the DOM when it's available

* Minor fixes
2018-09-26 14:17:29 +02:00
Albert Juhé Lluveras 5649b6b1e2 Use 'H' component for chart header (https://github.com/woocommerce/woocommerce-admin/pull/480)
* Use 'H' component for chart header

* Set 'Section' component below the 'H'
2018-09-26 09:20:29 +02:00
Albert Juhé Lluveras 0088581fcb Fix: chart legend was not visible at 1340px width (https://github.com/woocommerce/woocommerce-admin/pull/472) 2018-09-25 20:19:32 +02:00
Albert Juhé Lluveras 1900bb0917 Improve charts accessibility (https://github.com/woocommerce/woocommerce-admin/pull/421)
* Add aria roles to chart elements

* Make individual points (in line charts) and individual bar (in bar charts) focusable

* Remove methods which are never used

* Reduce the number of parameters required by functions that display/hide the tooltip

* Use tooltipFormat for accessibility dates

* Rename 'formatVoiceDate' function to 'getTooltipDate'

* Use string literals for aria-label

* Remove table role which was no longer needed

* Add aria-hidden to X-axis in charts

* Remove 'key' from points/bar aria-label in charts

* Set different ARIA properties depending on chart mode (time or item comparison)

* Label should default to an empty string instead of a 0

* Use date format from params instead of hardcoded
2018-09-25 11:42:08 +02:00
Kelly Dwan 62276fb361 Add visual component docs from markdown examples (https://github.com/woocommerce/woocommerce-admin/pull/470)
* Remove content from README, leaving only the example

* Rename edited READMEs

* Add a devdocs page rendering from markdown example files

* Add more components to devdocs

* Add the rest of the component examples

* Add navigation to single components, show generated readme on single component view

* Style devdocs like calypso

* Split devdocs into two columns at “desktop” sizes

* Update segmented selection example

* Update link

* Add header to avoid notices error
2018-09-24 11:36:35 -04:00
Albert Juhé Lluveras 31289e8c82 Transpose and update format of chart tooltip dates (https://github.com/woocommerce/woocommerce-admin/pull/467)
* Fix dates transposed in revenue chart

* Update date format in revenue chart tooltip labels

* Load point label date formats from lib/date

* Pass point label format as a prop to the chart component
2018-09-24 13:11:18 +02:00
Albert Juhé Lluveras ccde0effe2 Remove opacity property from chart tooltip title styles (https://github.com/woocommerce/woocommerce-admin/pull/466) 2018-09-21 17:03:06 +02:00
Albert Juhé Lluveras a18a9cd89a Update tooltip title and labels in standard graphs (https://github.com/woocommerce/woocommerce-admin/pull/458)
* Allow adding a label for each specific point in a chart

* Update test fixtures

* Update README with new data format

* Simplify getPreviousDate function code

* Update tooltip dates format

* Add new prop to charts 'tooltipTitle' to override the date tooltip title

* Fix totals not being calculated in charts legend

* Fix JS error when hiding lines in chart

* Fix a couple of issues with chart README

* Add quotes around prop names

* Remove unused variable

* Remove colon after tooltip label
2018-09-20 16:28:22 +02:00