b448ff60b7
Fixes woocommerce/woocommerce-admin#4732 This updates `@wordpress/base-styles`, and because `@wordpress/components` depends on variables from it, that must be updated as well. There are 3 major changes required as part of updating: 1. The $theme-color variable is no longer exposed by base-styles. Instead there are 3 css vars exposed. These are made available by use of a provided mixin. Situations where $theme-color was darkened using scss have been mapped as best as possible to the 2 other darkened shades of the css var that are available such as `--wp-admin-theme-color-darker-20` and `--wp-admin-theme-color-darker-10`. In some cases this means the colors are not exactly the same as before. 2. The post css `theme()` call is no longer available. All uses of this have been consolidated to use of the main theme css var `--wp-admin-theme-color`. This means that calls like `theme(secondary)` or `theme(outline)` etc have all been consolidated to the one color. 3. Many of the variables used for different shades of gray have been deprecated. These have been mapped across to the new gray variables. (Mapped according to the list described in woocommerce/woocommerce-admin#4732) |
||
|---|---|---|
| .. | ||
| categories | ||
| coupons | ||
| customers | ||
| downloads | ||
| orders | ||
| products | ||
| revenue | ||
| stock | ||
| taxes | ||
| README.md | ||
| get-reports.js | ||
| index.js | ||
| style.scss | ||
README.md
Reports
The core reports offered by WooCommerce live in this folder. The Header is added automatically by the parent Report component, each individual component should contain just the report contents.
Extending Reports
New reports can be added by third-parties without altering woocommerce-admin, by hooking into the reports filter, woocommerce_admin_reports_list. For example:
addFilter( 'woocommerce_admin_reports_list', 'analytics/my-report', pages => {
return [
...pages,
{
report: 'example',
title: 'My Example Extension',
component: Report,
},
];
} );
Each report is defined by an object containing report, title, component.
report(string): The path used to show the report, ex:/analytics/exampletitle(string): The title shown in the breadcrumbs & document title.component(react component): The component containing the report content- everything on the page under the breadcrumbs header.
The component will get the following props:
query(object): The query string for the current view, can be used to paginate reports, or sort/filter report data.path(string): The exact path for this view.pathMatch(string): The route matched for this view, should always be/analytics/:report.params(object): This will contain thereportfrom the path, which should matchreportin the page object.
Note: Adding your page to woocommerce_admin_reports_list does not add the item to the admin menu, you'll need to do that in PHP with the woocommerce_admin_report_menu_items filter.