woocommerce/plugins/woocommerce-admin/packages/components/README.md

35 lines
1.1 KiB
Markdown

# 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
```bash
npm install @woocommerce/components --save
```
View [the full Component documentation](https://woocommerce.github.io/woocommerce-admin/#/components/) for usage information.
## Usage
```jsx
/**
* 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](https://developer.wordpress.org/reference/functions/wp_enqueue_style/#parameters) 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`.