dec97d178e
* 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 |
||
|---|---|---|
| .. | ||
| animation-slider | ||
| calendar | ||
| card | ||
| chart | ||
| count | ||
| dropdown-button | ||
| ellipsis-menu | ||
| filters | ||
| flag | ||
| gravatar | ||
| higher-order/use-filters | ||
| link | ||
| order-status | ||
| pagination | ||
| product-image | ||
| rating | ||
| segmented-selection | ||
| split-button | ||
| summary | ||
| table | ||
| README.md | ||
| index.js | ||
README.md
Components
This folder contains the WooCommerce-created components. These are exported onto a global, wc.components, for general use.
How to use:
For any files not imported into components/index.js (analytics/*, layout/*, dashboard/*, etc), we can use import { Card, etc … } from @woocommerce/components.
For any component/* files, we should import from component-specific paths, not from component/index.js, to prevent circular dependencies. See components/card/index.js for an example.
import { Card, Link } from '@woocommerce/components';
render: function() {
return (
<Card title="Card demo">
Card content with an <Link href="/">example link.</Link>
</Card>
);
}
For external development
External developers will need to enqueue the components library, wc-components, and then can access them from the global.
const { Card, Link } = wc.components;
render: function() {
return (
<Card title="Card demo">
Card content with an <Link href="/">example link.</Link>
</Card>
);
}