618cc54a3f
* Add initial rich text editor component * Use fixed toolbar and add base formatters * Add link as formatter option * Fix up references to core/link block * Add quote transform * Add changelog entry * Add text alignment toolbar * Remove references to checkbox list * Update toolbar button organization * Remove unused rtj format types * Create unique instance for editor writing flow * Add registry provider for storybook examples * Update styling for editor * Rebase and fix lock file * Add packages and type dependencies * Move component to experimental * Fix up formatting * Update editor to use default GB toolbar * Prefix names with woocoommerce * Create block on initialization so toolbar is visible * Rely on insertBlock to handle selection * Update text editor to use setting instead of BlockList prop * Fix up lock file after rebase * Handle PR feedback * Move logic for force rerender * Fix up pnpm lock file * Use trunk lock file * Update lock file * Add missing semicolon * Use Pauls lock file and package file |
||
|---|---|---|
| .. | ||
| changelog | ||
| src | ||
| .eslintrc.js | ||
| .gitignore | ||
| .npmrc | ||
| CHANGELOG.md | ||
| PREVIOUS_CHANGELOG.md | ||
| README.md | ||
| babel.config.js | ||
| composer.json | ||
| composer.lock | ||
| jest.config.json | ||
| package.json | ||
| tsconfig-cjs.json | ||
| tsconfig.json | ||
| webpack.config.js | ||
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
pnpm 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.