Commit Graph

19 Commits

Author SHA1 Message Date
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
Kelly Dwan 6d2eec1c12 Update `layout/*` file structure (https://github.com/woocommerce/woocommerce-admin/pull/463)
* Move section, header, and activity panel out of layout folder

* Update file soures

* Move documentation into component, and update generation script to handle the duplicated exports
2018-09-21 11:19:05 -04:00
Kelly Dwan f2e0165d5f Component – Table: Add compare checkboxes (https://github.com/woocommerce/woocommerce-admin/pull/389)
* Switch to withInstanceId higher order component

* Add checkboxes to the rows in a TableCard, if a compareBy prop is set

* Add Compare button to update query param

* Populate the selected rows from the query parameter

* Update compare filter display & selected table rows when the query changes

* Skip displaying tags if the label is null/undefined

* Style table header with compare button, search placeholder

* Prevent setting just an ID list as the state, as this will wipe out already-fetched tag labels

* Update docs

* Shortcut out of fetching tag labels if the query is empty
2018-09-18 10:12:13 -04:00
Albert Juhé Lluveras 069fcb7fe6 IE11: fix Card layout broken because it was using CSS grid (https://github.com/woocommerce/woocommerce-admin/pull/370) 2018-09-07 17:52:51 +02:00
Kelly Dwan d36511479e Docs Project: Add documentation parser + inline documentation (https://github.com/woocommerce/woocommerce-admin/pull/336)
* Switch all components to default exports

This ensures we can read all components for documentation generation (plus, standardizing is good)

* Add documentation to component file

* Fix table exports

* Move readme docs into inline docs

Includes updating new props, adding prop shapes

* Add doc-generation scripts to pull exported component docs into folder

* Remove key propType, causing react special-keys warning

* Fix proptype

* Update incorrect comment

* Remove template import, we can just use string concat

* Fix typo, update docs
2018-08-31 13:27:21 -04:00
Kelly Dwan 7711da472a Docs Project: Component cleanup (https://github.com/woocommerce/woocommerce-admin/pull/334)
* Validate component with helper function

Fixes compat issue with react-docgen

* Switch all components to default exports

This ensures we can read all components for documentation generation (plus, standardizing is good)

* inValidDays -> invalidDays

Invalid is a single word, so by capitalization rules the V should be lowercase

* Export child-components of Chart

* Fix table exports
2018-08-31 13:19:13 -04:00
David Levin ea672cdedb update mobile card styles 2018-08-30 16:02:12 -07:00
Kelly Dwan dec97d178e Components: Export reusable components to a separate file + global (https://github.com/woocommerce/woocommerce-admin/pull/297)
* Importing all components from a root components file

* Update Ratings component to avoid circular dependencies, fix tests

* Export components on `wc.components`, use this for importing

* Move react-dates initialize to the components file

* Push query changes to history

Fixes an issues where native a links do not update the query in `history`

* Update test config for new @woocommerce/components path

* Update chart components import

* Merge simple/complex & alphabetize by first exported name

* Add a readme with info about how to call these components
2018-08-20 17:18:13 -04:00
Kelly Dwan 9d19bc66c0 Layout: Fix spacing on Card component (https://github.com/woocommerce/woocommerce-admin/pull/283) 2018-08-13 11:24:48 -04:00
Paul Sealock b427249aa1 Advanced Filters: add card and config 2018-08-09 12:16:46 +12:00
Kelly Dwan 727654ff3b SummaryNumber Component: Update to latest hifi design (https://github.com/woocommerce/woocommerce-admin/pull/237)
* Add first pass + demo of updated SummaryNumber

* Add new larger screen breakpoint

* Remove the max-width from the content wrapper

* Update previous label text

* Fix the border colors/sizing

* Create a mixin to generate the grid template pattern

* Add green/red colors based on trend, with prop to reverse

In some cases, a downward trend is good (ex, refunds), so we want to be able to color those green

* Move selected number containers up to avoid the double-border

* Document className logic, and apply 10-item layout to all cases of 10+ items

* Remove layout notes

* Update component docs, clean up optional displays

* Update style of SummaryNumbers inside cards

* Filter out any `false` or otherwise unrenderable children

* Fix card borders

* Update dashboard component to use new props

* Check that prevValue is defined

a prevValue of 0 was incorrectly outputting `0` for both label and value

* Update no-change datapoint style

* Update default data values

Rather than hiding the prevValue/label or delta section if these are not passed through, use default N/A placeholders

* Change SummaryList & SummaryNumber to a list of links

Add active, hover, and focus styles

* Add a short help text for screen reader users

* Add href to README

* Add the href prop to the readme example

* Fix border colors

The `nth-of-type` rules need to be on the `li` containers

* Fix font-weights on value & delta

* Wrap the previous label/value when the percentage wraps
2018-07-30 11:14:09 -04:00
Timmy Crawford f2518dcd34 make with and without elipsis the same height 2018-06-27 15:10:50 -07:00
Timmy Crawford 2145b8ebce Update Card header styles. 2018-06-27 14:58:37 -07:00
Kelly Dwan 99ac7728cd Try a context-aware heading component (https://github.com/woocommerce/woocommerce-admin/pull/121)
* Add H and Section components for context-aware headings

* Switch to using the new context-aware heading and section components

* Style header by class name, not heading level

* Add our client dir to the modules list for Jest

We already have this setting in webpack, but Jest doesn’t pick up on that
2018-06-20 11:10:06 -04:00
Kelly Dwan b0bcce86d8 Add CSS naming conventions following Gutenberg’s standards (https://github.com/woocommerce/woocommerce-admin/pull/99)
* Add CSS naming conventions following Gutenberg’s standards

* Update `woo-dashboard` to `woocommerce-layout`

* Update admin notice container to new classname standard
2018-06-01 10:35:18 -04:00
Kelly Dwan 3554c4ef7d Tests: Add Jest with Gutenberg as a npm dependency (https://github.com/woocommerce/woocommerce-admin/pull/43)
* Add Jest testing with Gutenberg as a dependency

* Add test using Enzyme

* Update for “element” moving

Something also must have moved api-request, so we mock that import now
2018-05-16 10:59:03 -04:00
Kelly Dwan 146547cb1d Components: Add EllipsisMenu component (https://github.com/woocommerce/woocommerce-admin/pull/40)
* Add EllipsisMenu & MenuItem

* Add styles for menu items

* Don’t disable all keyboard interactions

Was breaking tab

* Move EllipsisMenu to client folder

* Clean up unused props & focus state

* Add an unfocusable MenuTitle component

* Update EllipsisMenu exports so that all menu-related components can be pulled from EllipsisMenu

* Make strings translatable

Even demo content should use translation functions :)

* Add README

* Fix arrow position

* Add box-sizing back to global reset
2018-05-14 11:47:42 -04:00
Justin Shreve d7df8ed76e Adds SCSS color variables and breakpoints (https://github.com/woocommerce/woocommerce-admin/pull/39)
* Adds SCSS color variables and breakpoint mixins

* Use webpack to pull in shared CSS

* Move notices reset rule to wpadmin-reset

* Prefix breakpoints, colors, and wpadmin reset
2018-05-14 09:41:30 -04:00
Justin Shreve d380fd7569 Rename js/src to client (https://github.com/woocommerce/woocommerce-admin/pull/38)
* Rename js/src to client/

* Update the prettier format to only look in client/
2018-05-11 12:13:57 -04:00