afd6693718
* Add `hidden` legendPosition to `Chart`. Sometimes, for example, when there is a single data set, there is no need for rendering the legend. It may even introduce more confusion than value. It seems interactive, but there is nothing you can do with it. Fixes: https://github.com/woocommerce/google-listings-and-ads/issues/618 * Add `@storybook/addon-knobs` to devDependencies. It was used but not explicitely stated. * Add a changelog entry. * Add tests for legendPosition in Chart component Co-authored-by: Lourens Schep <lourensschep@gmail.com> |
||
|---|---|---|
| .. | ||
| src | ||
| .npmrc | ||
| CHANGELOG.md | ||
| README.md | ||
| jest.config.json | ||
| package.json | ||
| tsconfig-cjs.json | ||
| tsconfig.json | ||
README.md
Components
This packages includes a library of components that can be used to create pages in the WooCommerce dashboard and reports pages.
Installation
Install the module
npm install @woocommerce/components --save
View the full Component documentation for usage information.
Usage
/**
* Woocommerce dependencies
*/
import { Card } from '@woocommerce/components';
export default function MyCard() {
return (
<Card title="Store Performance" description="Key performance metrics">
<p>Your stuff in a Card.</p>
</Card>
);
}
Many components include CSS to add style, you will need to add in order to appear correctly. Within WooCommerce, add the wc-components stylesheet as a dependency of your plugin's stylesheet. See wp_enqueue_style documentation for how to specify dependencies.
In non-WordPress projects, link to the build-style/card/style.css file directly, it is located at node_modules/@woocommerce/components/build-style/<component_name>/style.css.