woocommerce/plugins/woocommerce-blocks/docs/third-party-developers/extensibility/README.md

76 lines
5.9 KiB
Markdown
Raw Normal View History

# Extensibility in WooCommerce Blocks <!-- omit in toc -->
## Table of Contents <!-- omit in toc -->
- [Imports and dependency extration](#imports-and-dependency-extration)
- [Hooks (actions and filters)](#hooks-actions-and-filters)
- [REST API](#rest-api)
- [Checkout Payment Methods](#checkout-payment-methods)
- [Checkout Block](#checkout-block)
These documents are all dealing with extensibility in the various WooCommerce Blocks.
## Imports and dependency extration
The documentation in this section will use window globals in code examples, for example:
```js
const { registerCheckoutFilters } = window.wc.blocksCheckout;
```
However, if you're using `@woocommerce/dependency-extraction-webpack-plugin` for enhanced dependency management you can instead use ES module syntax:
```js
import { registerCheckoutFilters } from '@woocommerce/blocks-checkout';
```
See <https://www.npmjs.com/package/@woocommerce/dependency-extraction-webpack-plugin> for more information.
## Hooks (actions and filters)
| Document | Description |
| ----------------------------- | ------------------------------------------------------- |
2022-07-04 10:39:17 +00:00
| [Actions](./hooks/actions.md) | Documentation covering action hooks on the server side. |
| [Filters](./hooks/filters.md) | Documentation covering filter hooks on the server side. |
## REST API
| Document | Description |
| ---------------------------------------------------------------------------------------------- | ------------------------------------------------------------------- |
| [Exposing your data in the Store API.](./rest-api/extend-rest-api-add-data.md) | Explains how you can add additional data to Store API endpoints. |
| [Available endpoints to extend with ExtendSchema](./rest-api/available-endpoints-to-extend.md) | A list of all available endpoints to extend. |
| [Available Formatters](./rest-api/extend-rest-api-formatters.md) | Available `Formatters` to format data for use in the Store API. |
| [Updating the cart with the Store API](./rest-api/extend-rest-api-update-cart.md) | Update the server-side cart following an action from the front-end. |
## Checkout Payment Methods
| Document | Description |
| -------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------------------------- |
2022-07-04 10:39:17 +00:00
| [Checkout Flow and Events](./checkout-payment-methods/checkout-flow-and-events.md) | All about the checkout flow in the checkout block and the various emitted events that can be subscribed to. |
| [Payment Method Integration](./checkout-payment-methods/payment-method-integration.md) | Information about implementing payment methods. |
| [Filtering Payment Methods](./checkout-payment-methods/filtering-payment-methods.md) | Information about filtering the payment methods available in the Checkout Block. |
## Checkout Block
In addition to the reference material below, [please see the `block-checkout` package documentation](../../../packages/checkout/README.md) which is used to extend checkout with Filters, Slot Fills, and Inner Blocks.
| Document | Description |
| ------------------------------------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------------------------- |
Add Cart/Checkout/Order-Received Templates (https://github.com/woocommerce/woocommerce-blocks/pull/9301) * WIP: dirty attempt to dry run Cart & Checkout templates * Added Cart and Checkout to the template hierarchies * Merge branch 'trunk' into poc/cart_and_checkout_fse_templates * Updated cart & Checkout templates * Order Received FSE template (https://github.com/woocommerce/woocommerce-blocks/pull/8937) * Order Received template bootstrap * typo * WIP: new block * add logic here * Order received classic template * reverted constants.ts * Added the post title (buggy) * Corrected page title * Updated constants.ts * Fixed template typo * removed placeholder for order received block * add order-received template description * updated placeholder description * Formatting fixes * Template description. * replaced hardcoded string with OrderReceivedTemplate::SLUG --------- Co-authored-by: Luigi <gigitux@gmail.com> * Code formatting (https://github.com/woocommerce/woocommerce-blocks/pull/8350) * Code formatting * page_template_hierarchy priority to 1 (https://github.com/woocommerce/woocommerce-blocks/pull/9323) Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Migrate Cart and Checkout Pages to the Template Editor when using a FSE theme (https://github.com/woocommerce/woocommerce-blocks/pull/9339) * Introduce woocommerce_blocks_template_content hook * Migrate cart and checkout page content to the template editor * Add redirection from edit page to edit template --------- Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Removed header and footer from checkout template. (https://github.com/woocommerce/woocommerce-blocks/pull/9378) * Removed header and footer from checkout template. * Removed header and footer from checkout template migration * Permalink solution for the checkout endpoint/template (https://github.com/woocommerce/woocommerce-blocks/pull/9406) * Checkout endpoint work * Move setting field to util * Include link to edit the template * Remove todo * Refactor checkout templates to share logic (https://github.com/woocommerce/woocommerce-blocks/pull/9411) * Sync endpoints with pages (https://github.com/woocommerce/woocommerce-blocks/pull/9426) * Switch to page syncing * Update settings descriptions --------- Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Migrate pages to templates once (https://github.com/woocommerce/woocommerce-blocks/pull/9488) * Migrate content on init, once * Skip migration if page does not exist * Put back HTML for header and footer parts * Fix page redirect due to wrong ID * fix loading template part * Removed unnecessary var * update cart and checkout html templates --------- Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Include a notice to redirect user to template editor (https://github.com/woocommerce/woocommerce-blocks/pull/9508) * Template Placeholder Design for the Order Received Template (https://github.com/woocommerce/woocommerce-blocks/pull/9602) * Load frontend styles in editor iframe * Update placeholder to include skeleton and updated icons * Update classic template configs * 1px border for .wp-block-woocommerce-classic-template__placeholder-copy * Show copy on focus * Sample data --------- Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Add simplified header on checkout template (https://github.com/woocommerce/woocommerce-blocks/pull/9607) * Added simplified header on checkout template * Moved simplified header to template part * updated constants.ts * added template part to checkout.html * Add missing translation * frontpage_template_hierarchy no longer needed * Allow plugin based template parts (https://github.com/woocommerce/woocommerce-blocks/pull/9667) * Merge branch 'trunk' into add/9288_cart-checkout-order-received_fse_templates * Synced templates on blockified folder * Add blockified order-received.html * removed WooCommerce prefix * Refactor/rebrand order received template to order confirmation (https://github.com/woocommerce/woocommerce-blocks/pull/9734) * rebrand order received to order confirmation * updated descriptions for templates * updated descriptions for order confirmation placeholder * Resolve merge conflict * Resolve merge conflicts * Resolve more merge conflicts after rebase * Fix formatting * Use patterns for localisation (https://github.com/woocommerce/woocommerce-blocks/pull/9883) * e2e tests for cart and checkout templates (https://github.com/woocommerce/woocommerce-blocks/pull/9939) * Merge branch 'trunk' into poc/cart_and_checkout_fse_templates * Merge branch 'trunk' into add/9288_cart-checkout-order-received_fse_templates * Resolve merge conflicts * Add e2e for permalink settings * Test that templates exist * Add test to check that templates can be edited * Add tests to confirm templates can be edited * Ensure cart has contents before running tests on frontend views * Commend out problem test * Make sure search has multiple results * Remove useThrottle - bad rebase * Revert changes to docs after rebase * Revert function call for noReviewsPlaceholder * Bad rebase * Reverts * Remove revertTemplate * Spacing * Wait for networkidle after navigation * Always wait for network * Use button roles in site editor * More specific button locator * Update option comparison * Fix template content * Disable failing tests * Disable failing classic template tests * Use enterEditMode * More enterEditMode usage * enterEditMode * Use test.skip * More robust selectors * Alt iframe selector --------- Co-authored-by: Paulo Arromba <17236129+wavvves@users.noreply.github.com> * Skip flakey test --------- Co-authored-by: Luigi <gigitux@gmail.com> Co-authored-by: Mike Jolley <mike.jolley@me.com>
2023-06-29 13:41:22 +00:00
| [How the Checkout Block processes an order](./checkout-block/how-checkout-processes-an-order.md) | The detailed inner workings of the Checkout Flow. |
| [IntegrationInterface](./checkout-block/integration-interface.md) | The `IntegrationInterface` class and how to use it to register scripts, styles, and data with WooCommerce Blocks. |
| [Available Filters](./checkout-block/available-filters.md) | All about the filters that you may use to change values of certain elements of WooCommerce Blocks. |
| [Slots and Fills](./checkout-block/slot-fills.md) | Explains Slot Fills and how to use them to render your own components in Cart and Checkout. |
| [Available Slot Fills](./checkout-block/available-slot-fills.md) | Available Slots that you can use and their positions in Cart and Checkout. |
| [DOM Events](./checkout-block/dom-events.md) | A list of DOM Events used by some blocks to communicate between them and with other parts of WooCommerce. |
| [Filter Registry](../../../packages/checkout/filter-registry/README.md) | The filter registry allows callbacks to be registered to manipulate certain values. |
<!-- FEEDBACK -->
---
[We're hiring!](https://woocommerce.com/careers/) Come work with us!
🐞 Found a mistake, or have a suggestion? [Leave feedback about this document here.](https://github.com/woocommerce/woocommerce-blocks/issues/new?assignees=&labels=type%3A+documentation&template=--doc-feedback.md&title=Feedback%20on%20./docs/third-party-developers/extensibility/README.md)
<!-- /FEEDBACK -->