9e9f0341e2
* Sync Interactivity API code with Gutenberg * New store() API * Store raw actions * Update wc-interactivity-store implementation * Replace `wc_store` with `wc_initial_state` * Parse and populate initial state * Allow store parts in `store()` * Accept namespaces in directive paths * Add $$namespace to directives' object values * Make namespace parsing more robust * Use DeepPartial type for store parts * Do not pass `rawStore` to `afterLoad` callbacks * Simplify `store()` a bit * Implement `privateStore()` * Sync context directive with Gutenberg * Refactor scope and extract getters per scope * Add namespace to getters and actions * Remove current privateStore implementation * Remove `afterLoad` option from `store` * Use same proxy handlers for ns, getters and actions * Set scope inside `evaluate` * Refactor proxy handlers * Improve types a bit * Catch errors in async actions * Implement stacks for scopes and namespaces * Implement `getElement` * Change directives object structure * Remove unnecessary import * Implement private stores * Return value from sync actions * Minor optimizations and improved comments * Don't use async inside `data-wp-watch` * Use a single Provider in context directive * Remove DeepPartial type * Do not check if element exists * Add the `current` prop of state inside the scope * Move getters outside scope * Fix wc-key assignment * Fix missing `navigate` in directives * Fix namespace not being picked in the same element * Deep merge raw stores instead of proxied ones * Fix namespace assignment * Allow forward slashes in namespaces * Migration of Product Collection and Product Button blocks to the new `store()` API (https://github.com/woocommerce/woocommerce-blocks/pull/11558) * Refactor Product Button with new store() API * Use `wc_initial_state` in Product Button * Fix namespace * Remove unnecessary state * Test namespaces in directive paths * Add test context with namespace * Simplify woo-test context * Move addToCart and animations to a file * Do not pass `rawStore` to `afterLoad` callbacks * Move callbacks and actions back to the main file Because the animation was broken. * Remove selectors in favor of state * Use default ns in `getContext` for state and actions * Remove `afterLoad` callback * Remove unnecessary ns * Fix getContext in add-to-cart * Replace namespace and delete unnecessary store * Pass context types only once * Use an alternative for requestIdleCallback * Add previous react code for notices * Add namespace to Product Collection block * Replace getTextButton with getButtonText * Add block name to the ProductCollection namespace * fix style HTML code * Remove circular deps error on the Interactivity API * Product Gallery block: Migrate to new Interactivity API store (https://github.com/woocommerce/woocommerce-blocks/pull/11721) * Migrate Product Gallery block to new Interactivity API store * Fix some references * Add missing data-wc-interactive * Fix an additional namespace * Remove unnecessary click handler * Dialog working * Refactor action names * Reindex PHP array There was some missing indexes, which turned the array into an object in JS. * Remove unused event handlers * Move next/previous logic to external function * Move StorePart util to the types folder * Rename namespace to `woocommerce/product-gallery` * Undo product collection namespace renaming * Remove unnecessary namespace * Don't hide the large image on page load * Minor refactorings * Fix eslint error * Fix php cs errors with spacing and double arrows alignment * Disable no-use-before-define rule for eslint * Disable @typescript-eslint/ban-types rule for eslint * Fix parsed context error in e2e tests * Fix context parser for Thumbnail image * Move store to the top of the frontend file * Add interactivity api utils to the @woocommerce/utils alias * Replace deprecated event attribute --------- Co-authored-by: Luis Herranz <luisherranz@gmail.com> Co-authored-by: David Arenas <david.arenas@automattic.com> Co-authored-by: roykho <roykho77@gmail.com> --------- Co-authored-by: David Arenas <david.arenas@automattic.com> Co-authored-by: Luigi Teschio <gigitux@gmail.com> Co-authored-by: Alexandre Lara <allexandrelara@gmail.com> Co-authored-by: roykho <roykho77@gmail.com> * Fix error when closing product gallery dialog with keyboard escape key * use wc_initial_state instead of wc_store --------- Co-authored-by: Luis Herranz <luisherranz@gmail.com> Co-authored-by: Luigi Teschio <gigitux@gmail.com> Co-authored-by: Alexandre Lara <allexandrelara@gmail.com> Co-authored-by: roykho <roykho77@gmail.com> |
||
|---|---|---|
| .. | ||
| .github | ||
| .husky | ||
| .sources | ||
| .vscode | ||
| .wordpress-org | ||
| assets | ||
| bin | ||
| docs | ||
| images | ||
| packages | ||
| patches | ||
| patterns | ||
| src | ||
| storybook | ||
| templates | ||
| tests | ||
| .distignore | ||
| .editorconfig | ||
| .env | ||
| .eslintignore | ||
| .eslintrc.js | ||
| .gitattributes | ||
| .gitignore | ||
| .markdownlint.json | ||
| .markdownlintignore | ||
| .nvmrc | ||
| .prettierignore | ||
| .prettierrc.js | ||
| .stylelintrc.json | ||
| .wp-env.json | ||
| LICENSE | ||
| README.md | ||
| babel.config.js | ||
| checkstyle.xml | ||
| composer.json | ||
| composer.lock | ||
| docker-compose.yml | ||
| global.d.ts | ||
| package-lock.json | ||
| package.json | ||
| phpcs.xml | ||
| phpunit.xml.dist | ||
| postcss.config.js | ||
| readme.txt | ||
| tsconfig.base.json | ||
| tsconfig.json | ||
| webpack.config.js | ||
| woocommerce-gutenberg-products-block.php | ||
| wp-cli.yml | ||
README.md
WooCommerce Blocks
This is the feature plugin for WooCommerce + the Gutenberg. This plugin serves as a space to iterate and explore new Blocks and updates to existing blocks for WooCommerce, and how WooCommerce might work with the block editor.
Use this plugin if you want access to the bleeding edge of available blocks for WooCommerce. However, stable blocks are bundled into WooCommerce, and can be added from the "WooCommerce" section in the block inserter.
Table of Contents
- Documentation
- Installing the plugin version
- Installing the development version
- Getting started with block development
- Long-term vision
Documentation
To find out more about the blocks and how to use them, check out the documentation on WooCommerce.com.
If you want to see what we're working on for future versions, or want to help out, read on.
Code Documentation
- Blocks - Documentation for specific Blocks.
- Editor Components - Shared components used in WooCommerce blocks for the editor (Gutenberg) UI.
- WooCommerce Blocks Handbook - Documentation for designers and developers on how to extend or contribute to blocks, and how internal developers should handle new releases.
- WooCommerce Blocks Storybook - Contains a list and demo of components used in the plugin.
Installing the plugin version
We release a new version of WooCommerce Blocks onto WordPress.org every few weeks, which can be used as an easier way to preview the features.
Note: The plugin follows a policy of supporting the "L0" strategy for version support. What this means is that the plugin will require the most recent version of WordPress. It will also require the most recent version of WooCommerce core at the time of a release. You can read more about this policy here.
1.Ensure you have the latest available versions of WordPress and WooCommerce installed on your site. 2. The plugin version is available on WordPress.org. Download the plugin version here. 3. Activate the plugin.
Installing the development version
- Ensure you have the latest versions of WordPress and WooCommerce installed on your site.
- Get a copy of this plugin using the green "Clone or download" button on the right.
- Make sure you're using Node.js v16.15. If you use a Node version management tool such as
nvmorn, you can do so by runningnvm useorn auto, respectively. npm installto install the dependencies.composer installto install core dependencies.- To compile the code, run any of the following commands
npm run build(production build).npm run dev(development build).npm start(development build + watching for changes).
- Activate the plugin.
The source code is in the assets/ folder, and the compiled code is stored into build/.
Getting started with block development
Run through the "Writing Your First Block Type" tutorial for a quick course in block-building.
For deeper dive, try looking at the core blocks code, or see what components are available.
To begin contributing to the WooCommerce Blocks plugin, see our getting started guide and developer handbook.
Other useful docs to explore:
Long-term vision
WooCommerce Blocks are the easiest, most flexible way to build your store's user interface and showcase your products.