61eeeb3c68
This PR is meant to improve the UI and UX behind the Attributes filter within the Inspector Controls of the “Products (Beta)“ block. Also included: * Refactor `useProductAttributes` hook * Move it into the shared hooks. * Fetch both terms AND attributes via the API (previously, we got the attributes from the settings, but we'd get partial objects compared to the API? Maybe a follow-up to this could be to check why the attributes stored in the settings are incomplete?) * Make sure the return values match the ones expected from search items. * Remove attribute-related types from PQ directory * Improve functionality of `SearchListControl` * Allow the search input to be a Token based input. * Allow for search input to search even collapsed properties. * Use core `CheckboxControl` instead of radio buttons for items having children (includes undeterminated state). * Enable removal of tokens from the input * Improve styles: * Refactor classnames for `SearchItem`. * Add more semantic classes. * Align count label and caret to the right. * Make caret switch direction on expanded. * `cursor: pointer` on collapsible items. * Indent children of collapsible items. * Correctly pass through class names to search item * Enable keyboard navigation for collapsible items * Add link to manage attributes * Change label inside the inspector controls * Make search list attached when token type * Implement more sophisticated behavior of parent checkbox * If indeterminate or unchecked, it will check all children. * If checked, it will uncheck all children. * Remove hardcoded `isSingle` from `expandableSearchListItem` |
||
---|---|---|
.. | ||
block-title | ||
default-notice | ||
edit-product-link | ||
error-placeholder | ||
expandable-search-list-item | ||
external-link-card | ||
feedback-prompt | ||
grid-content-control | ||
grid-layout-control | ||
heading-toolbar | ||
incompatible-payment-gateways-notice | ||
page-selector | ||
product-attribute-term-control | ||
product-category-control | ||
product-control | ||
product-orderby-control | ||
product-stock-control | ||
product-tag-control | ||
products-control | ||
search-list-control | ||
sidebar-compatibility-notice | ||
tag | ||
text-toolbar-button | ||
utils | ||
README.md |
README.md
Editor Components
These are shared components used in WooCommerce blocks for the editor (Gutenberg) UI.
Many of our blocks need rich, smart components to provide an interface for selecting or configuring blocks with WooCommerce data. Often there are multiple blocks that need such components. Components in this collection are used in multiple blocks, and may include logic for working with Woo data specifically (e.g. products, shipping methods, product categories).
See Storybook & Components doc for more information.
We're hiring! Come work with us!
🐞 Found a mistake, or have a suggestion? Leave feedback about this document here.