woocommerce/plugins/woocommerce-blocks/assets/js/blocks/product-query/constants.ts

149 lines
3.3 KiB
TypeScript
Raw Normal View History

/**
* External dependencies
*/
import { getSetting, getSettingWithCoercion } from '@woocommerce/settings';
import { objectOmit } from '@woocommerce/utils';
import type { InnerBlockTemplate } from '@wordpress/blocks';
import { isBoolean } from '@woocommerce/types';
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
/**
* Internal dependencies
*/
import { QueryBlockAttributes } from './types';
import { VARIATION_NAME as PRODUCT_TITLE_ID } from './variations/elements/product-title';
import { VARIATION_NAME as PRODUCT_TEMPLATE_ID } from './variations/elements/product-template';
Product Image: Displays with different size on the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/8926) * Add block minimal structure * Add Single Product block icon * Add usesContext to block.json * Add Save function to Single Product Block registration settings * Add InnerBlocks template to Editor for Single Product Block * Add Product selector to Single Product block * Add withProduct HOC to the block editor * Add save function to the Single Product block * Add renderOnServerSide attribute to Product image This attribute is used to determine if the product image should be rendered on the server side or not. This is needed because the product image is not rendered on the server side by default, but we want to render it on the server side when it is inside the Single Product block. * Add renderOnServerSide attribute to Product Category List block * Add renderOnServerSide attribute to Product Price block * Add renderOnServerSide attribute to Product Rating block * Add renderOnServerSide attribute to Product Stock Indicator block * Add renderOnServerSide attribute to Product Summary block * Add renderOnServerSide attribute to Product Tag List block * Add renderOnServerSide attribute to Product Title block * Add renderOnServerSide attribute to Product Add to Cart, Sales Badge and Sku block * Reuse editor code for Single Product block * Add Props interface to Single Product Server Side Editor * Add render_block_context hook to SingleProductServerSide block * Fix Single Product Server Side block that was not appearing in the block inserter * Fix bug where the correct product was not being displayed on the frontend * Remove Single Product Block * Add Product title and product summary variations * Add Add To Cart Form and Product Meta blocks to the Single Product Block * remove more files that belong the Single Product block * fix php linter error * wrap up Single Product Block * Fix issue preventing the block from working on the Single Product Template * Fix update context function for Single Product block * Replace Single Product block title * Replace global $post only for Single Product inner blocks * Remove unnecessary var_dump statement * Improve documentation for the Single Product block * fix registration: add-to-cart-form and product-meta blocks * Improve documentation for Single Product block * Fix lint error related to imports * Remove query monitor debug code * Remove unnecessary `renderOnServerSide` attribute from product elements * Fix return type for the Save function of the Product Elements blocks * Fix return type for the Save function of the Product Title block * Add scss file for Single Product block * Fix PHP coding standards * Fix php coding standards * Remove internal dependencies section duplication * Replace .wc-block with .wc-block-editor- styles According to the naming convention for this project (https://github.com/woocommerce/woocommerce-blocks/blob/trunk/docs/contributors/contributing/coding-guidelines.md#naming) we should be using the `.wc-block-editor-` prefix for styles that are only used in the editor. * Solve style for the Edit card component in the Single Product block * Fix error preventing Block Control from being displayed * Make the Product title to be a link by default * Fix PHP Coding Standards * Fix PHP Code Standards * Fix php cs issues * Fix issue with php cs * Remove unnecessary comment * Remove unused Icon import * Remove unnecessary dot from the className attributes in the Single Product Block * Replace metadata.name with metadata.title in the Editor file * Ignore phpcs rule * Add new attributes to the Attributes interface of the Price block * Fix typescript errors on the Product Meta block * Fix ts errors on Single Product editor * Fix ts errors on layout-editor.tsx * Fix ts errors in Single Product index file * Fix ts errors on add to cart form index file * Fix unsupported block error when using inner blocks outside the Single Product template * Fix unsupported block error for the Single Product block when editing Posts/Pages * Remove unnecessary JSDoc types * Remove unnecessary APIError component * Replace global $post only when rendering a `core/post-excerpt` block * Fix php cs errors * Put the Single Product block behind an experimental flag * Fix error occurring when trying to access ancestor of an undefined block settings * Fix Product Image appearing with different size on the Frontend * Fix PHP Code Standards errors * Remove JS Doc from shared-product-control.tsx * Fix single-product-frontend.js 404 error * Fix error 'Block names must be string' when adding Single Product block * Add todo comment to state the temporary solution used in the Single Product block * Set imageSizing attribute on Product Query and Single Product blocks * Rename values for image size options in the product image block The previous allowed values were 'cropped' and 'full-size'. The new values are 'thumbnail' and 'single' which are similar to the values used in WooCoomerce. WooCommerce uses 'woocommerce_thumbnail', 'woocommerce_gallery_thumbnail' and 'woocommerce_single' for images sizes. The 'woocommerce_single' size is used for the Single Product page and the 'woocommerce_thumbnail' size is used for the product grid. * Fix Related Products image to show as a thumbnail instead of the full size * Fix PHP CS error --------- Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-11 14:41:34 +00:00
import { ImageSizing } from '../../atomic/blocks/product-elements/image/types';
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
export const AUTO_REPLACE_PRODUCTS_WITH_PRODUCT_COLLECTION = false;
export const MANUAL_REPLACE_PRODUCTS_WITH_PRODUCT_COLLECTION = false;
Automatic migration path from Products to Product Collection - step 1 - automatic migration (https://github.com/woocommerce/woocommerce-blocks/pull/10115) * Foundation of the Products block replacement with Product Collection * Provide logic to replace Products with Product Collection * Make sure the blocks can be replaced * Add types and refactor replacement a bit * Fix the query attributes transform * Add upgrade Notice to the Product Collection block * Force upgrade notice to be displayed at the top of the Inspector Controls * Externalise migration code so it can be reused in both ways * Add util to get block IDs byt its name * Add a way to revert the Product Collection blocks to Products * Move the subscription to another place where it's triggered only once * Add default values * Remove attributes from Products block if they're not used to avoid incorrect query * WIP logic of unseen/seen/reverted notice * Change the state reading * Revert changes regarding notice displaying logic * Change the logc of firing replacement and bail early if there's no core/query blocks * Add todos * Implement inner blocks migration * Implement the revert transformation of inner blocks * Refactor types * Add layout transformation from Products to Product Collection * Add layout migration from Product Collection to Products * Disable migration by default * Simplify some parts of code * Remove additional keyword from Product Collection to move it to another PR * Adjust the logic to introduce the first step: conversion from Products to Product Collection * Disable automatic migration
2023-07-12 08:01:36 +00:00
export const PRODUCT_QUERY_VARIATION_NAME = 'woocommerce/product-query';
Improve Products block Attributes Filter Inspector Controls (https://github.com/woocommerce/woocommerce-blocks/pull/8583) 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`
2023-03-08 16:22:51 +00:00
export const EDIT_ATTRIBUTES_URL =
'/wp-admin/edit.php?post_type=product&page=product_attributes';
export const QUERY_LOOP_ID = 'core/query';
export const DEFAULT_CORE_ALLOWED_CONTROLS = [ 'taxQuery', 'search' ];
export const ALL_PRODUCT_QUERY_CONTROLS = [
'attributes',
'presets',
'productSelector',
'onSale',
'stockStatus',
'wooInherit',
];
export const DEFAULT_ALLOWED_CONTROLS = [
...DEFAULT_CORE_ALLOWED_CONTROLS,
...ALL_PRODUCT_QUERY_CONTROLS,
];
export const STOCK_STATUS_OPTIONS = getSetting< Record< string, string > >(
'stockStatusOptions',
[]
);
const GLOBAL_HIDE_OUT_OF_STOCK = getSetting< boolean >(
'hideOutOfStockItems',
false
);
export const QUERY_DEFAULT_ATTRIBUTES: QueryBlockAttributes = {
allowedControls: DEFAULT_ALLOWED_CONTROLS,
displayLayout: {
type: 'flex',
columns: 3,
},
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
query: {
perPage: 9,
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
pages: 0,
offset: 0,
postType: 'product',
order: 'asc',
orderBy: 'title',
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
author: '',
search: '',
exclude: [],
sticky: '',
inherit: false,
__woocommerceAttributes: [],
__woocommerceStockStatus: GLOBAL_HIDE_OUT_OF_STOCK
? Object.keys( objectOmit( STOCK_STATUS_OPTIONS, 'outofstock' ) )
: Object.keys( STOCK_STATUS_OPTIONS ),
Product Query Block POC (Phase 1) (https://github.com/woocommerce/woocommerce-blocks/pull/6812) * Move `EditorBlock` to general `type-defs` `EditorBlock` was scoped under the `featured-items` directory at the time of its creation. It is, however, a useful type that should be shared repo-wide. For this reason, I am moving it into the `blocks` type-defs and updating all the references. * Define types for the Product Query block Also defines a more generic `WooCommerceBlockVariation` type which should be also useful in the future to implement a similar pattern. * Add Product Query utils Add two utility functions: 1. `isWooQueryBlockVariation`: is used to check whether a given block is a variation of the core Query Loop block, and also one of the allowed variations within our repo. See: `QueryVariation` enum type. 2. `setCustomQueryAttribute`: is a shorthand to set an attribute within the variation query attribute. * Refactor and cleanup the JS demo code Specifically: 1. Creates a `constant.ts` file to store all shared constants. Currently, the default variation attributes. 2. Move the variations to their own directory. One file per variation. 3. Move the inspector controls into own file and create a conditional logic to allow showing only certain settings. * Update webpack config * Add ProductQuery class * Fix `QueryVariation` enum We had changed the Products on Sale variation slug to something else, but we had forgotten to update the proper enum. * Remove unused params from `update_query` The filter we added to Gutenberg will pass the block and the page, as we might need them in the future and we want to minimize the amount of changes we'll have to do upstream. However, we currently do not use those, so I removed them from our own inner function. Co-authored-by: Lucio Giannotta <lucio.giannotta@a8c.com>
2022-08-18 08:02:21 +00:00
},
};
// This is necessary to fix https://github.com/woocommerce/woocommerce-blocks/issues/9884.
const postTemplateHasSupportForGridView = getSettingWithCoercion(
'postTemplateHasSupportForGridView',
false,
isBoolean
);
export const INNER_BLOCKS_TEMPLATE: InnerBlockTemplate[] = [
[
'core/post-template',
Products block: Using nested selector to add margin between Product elements (https://github.com/woocommerce/woocommerce-blocks/pull/8993) * Using nested selector to style Product elements in Products Block This commit simplifies the INNER_BLOCKS_TEMPLATE array in the product-query constants.ts file by removing the style properties from the individual elements. Instead, the default styles are now managed in the style.scss file, providing a more consistent and centralized approach to styling. In the style.scss file, a new section for default styling has been added to handle product elements inside the Products Block, adhering to the Gutenberg styling hierarchy. This ensures the lowest precedence in the hierarchy, allowing for easier overrides when needed. * Decrease specificity of styles for product elements in Products Block The commit changes the default styles for product elements inside the 'Products Block'. It changes the way the margin-bottom and margin-top properties are set by using the :where() selector instead of using the .products-block-post-template class selector. This is done to decrease the specificity of the CSS selector, ensuring that the styles have the lowest precedence in the hierarchy. It also removes the display: inline-block property from the a selector, and moves the styles to the .editor-styles-wrapper class selector. * Decrease specificity of CSS selectors In these changes, the product elements inside the Products Block have been restyled. The specificity of the CSS selector has been decreased using the :where() selector, to ensure that these styles have the lowest precedence in the hierarchy. In constants.ts, a new class name, products-block-post-template, has been added to the inner block template for the post. This class is used to add default styles for inner blocks. In style.scss, the CSS selector for the inner blocks has been updated to include the new class name. The :where() selector has also been used to ensure that these styles have the lowest precedence in the hierarchy. * Update default margins and remove redundant entries This commit updates the default margin values for the Product Title in the Products block, moving them from the style.scss file to the constants.ts file. It also removes unnecessary empty arrays in the INNER_BLOCKS_TEMPLATE and background-color property from the style.scss file.
2023-04-28 07:43:47 +00:00
{
__woocommerceNamespace: PRODUCT_TEMPLATE_ID,
/**
* This class is used to add default styles for inner blocks.
*/
className: 'products-block-post-template',
...( postTemplateHasSupportForGridView && {
layout: { type: 'grid', columnCount: 3 },
} ),
Products block: Using nested selector to add margin between Product elements (https://github.com/woocommerce/woocommerce-blocks/pull/8993) * Using nested selector to style Product elements in Products Block This commit simplifies the INNER_BLOCKS_TEMPLATE array in the product-query constants.ts file by removing the style properties from the individual elements. Instead, the default styles are now managed in the style.scss file, providing a more consistent and centralized approach to styling. In the style.scss file, a new section for default styling has been added to handle product elements inside the Products Block, adhering to the Gutenberg styling hierarchy. This ensures the lowest precedence in the hierarchy, allowing for easier overrides when needed. * Decrease specificity of styles for product elements in Products Block The commit changes the default styles for product elements inside the 'Products Block'. It changes the way the margin-bottom and margin-top properties are set by using the :where() selector instead of using the .products-block-post-template class selector. This is done to decrease the specificity of the CSS selector, ensuring that the styles have the lowest precedence in the hierarchy. It also removes the display: inline-block property from the a selector, and moves the styles to the .editor-styles-wrapper class selector. * Decrease specificity of CSS selectors In these changes, the product elements inside the Products Block have been restyled. The specificity of the CSS selector has been decreased using the :where() selector, to ensure that these styles have the lowest precedence in the hierarchy. In constants.ts, a new class name, products-block-post-template, has been added to the inner block template for the post. This class is used to add default styles for inner blocks. In style.scss, the CSS selector for the inner blocks has been updated to include the new class name. The :where() selector has also been used to ensure that these styles have the lowest precedence in the hierarchy. * Update default margins and remove redundant entries This commit updates the default margin values for the Product Title in the Products block, moving them from the style.scss file to the constants.ts file. It also removes unnecessary empty arrays in the INNER_BLOCKS_TEMPLATE and background-color property from the style.scss file.
2023-04-28 07:43:47 +00:00
},
[
[
'woocommerce/product-image',
{
Product Image: Displays with different size on the frontend (https://github.com/woocommerce/woocommerce-blocks/pull/8926) * Add block minimal structure * Add Single Product block icon * Add usesContext to block.json * Add Save function to Single Product Block registration settings * Add InnerBlocks template to Editor for Single Product Block * Add Product selector to Single Product block * Add withProduct HOC to the block editor * Add save function to the Single Product block * Add renderOnServerSide attribute to Product image This attribute is used to determine if the product image should be rendered on the server side or not. This is needed because the product image is not rendered on the server side by default, but we want to render it on the server side when it is inside the Single Product block. * Add renderOnServerSide attribute to Product Category List block * Add renderOnServerSide attribute to Product Price block * Add renderOnServerSide attribute to Product Rating block * Add renderOnServerSide attribute to Product Stock Indicator block * Add renderOnServerSide attribute to Product Summary block * Add renderOnServerSide attribute to Product Tag List block * Add renderOnServerSide attribute to Product Title block * Add renderOnServerSide attribute to Product Add to Cart, Sales Badge and Sku block * Reuse editor code for Single Product block * Add Props interface to Single Product Server Side Editor * Add render_block_context hook to SingleProductServerSide block * Fix Single Product Server Side block that was not appearing in the block inserter * Fix bug where the correct product was not being displayed on the frontend * Remove Single Product Block * Add Product title and product summary variations * Add Add To Cart Form and Product Meta blocks to the Single Product Block * remove more files that belong the Single Product block * fix php linter error * wrap up Single Product Block * Fix issue preventing the block from working on the Single Product Template * Fix update context function for Single Product block * Replace Single Product block title * Replace global $post only for Single Product inner blocks * Remove unnecessary var_dump statement * Improve documentation for the Single Product block * fix registration: add-to-cart-form and product-meta blocks * Improve documentation for Single Product block * Fix lint error related to imports * Remove query monitor debug code * Remove unnecessary `renderOnServerSide` attribute from product elements * Fix return type for the Save function of the Product Elements blocks * Fix return type for the Save function of the Product Title block * Add scss file for Single Product block * Fix PHP coding standards * Fix php coding standards * Remove internal dependencies section duplication * Replace .wc-block with .wc-block-editor- styles According to the naming convention for this project (https://github.com/woocommerce/woocommerce-blocks/blob/trunk/docs/contributors/contributing/coding-guidelines.md#naming) we should be using the `.wc-block-editor-` prefix for styles that are only used in the editor. * Solve style for the Edit card component in the Single Product block * Fix error preventing Block Control from being displayed * Make the Product title to be a link by default * Fix PHP Coding Standards * Fix PHP Code Standards * Fix php cs issues * Fix issue with php cs * Remove unnecessary comment * Remove unused Icon import * Remove unnecessary dot from the className attributes in the Single Product Block * Replace metadata.name with metadata.title in the Editor file * Ignore phpcs rule * Add new attributes to the Attributes interface of the Price block * Fix typescript errors on the Product Meta block * Fix ts errors on Single Product editor * Fix ts errors on layout-editor.tsx * Fix ts errors in Single Product index file * Fix ts errors on add to cart form index file * Fix unsupported block error when using inner blocks outside the Single Product template * Fix unsupported block error for the Single Product block when editing Posts/Pages * Remove unnecessary JSDoc types * Remove unnecessary APIError component * Replace global $post only when rendering a `core/post-excerpt` block * Fix php cs errors * Put the Single Product block behind an experimental flag * Fix error occurring when trying to access ancestor of an undefined block settings * Fix Product Image appearing with different size on the Frontend * Fix PHP Code Standards errors * Remove JS Doc from shared-product-control.tsx * Fix single-product-frontend.js 404 error * Fix error 'Block names must be string' when adding Single Product block * Add todo comment to state the temporary solution used in the Single Product block * Set imageSizing attribute on Product Query and Single Product blocks * Rename values for image size options in the product image block The previous allowed values were 'cropped' and 'full-size'. The new values are 'thumbnail' and 'single' which are similar to the values used in WooCoomerce. WooCommerce uses 'woocommerce_thumbnail', 'woocommerce_gallery_thumbnail' and 'woocommerce_single' for images sizes. The 'woocommerce_single' size is used for the Single Product page and the 'woocommerce_thumbnail' size is used for the product grid. * Fix Related Products image to show as a thumbnail instead of the full size * Fix PHP CS error --------- Co-authored-by: Luigi <gigitux@gmail.com>
2023-04-11 14:41:34 +00:00
imageSizing: ImageSizing.THUMBNAIL,
},
],
[
'core/post-title',
{
textAlign: 'center',
level: 3,
fontSize: 'medium',
style: {
spacing: {
margin: {
bottom: '0.75rem',
top: '0',
},
},
},
isLink: true,
__woocommerceNamespace: PRODUCT_TITLE_ID,
},
],
[
'woocommerce/product-price',
{
textAlign: 'center',
fontSize: 'small',
},
],
[
'woocommerce/product-button',
{
textAlign: 'center',
fontSize: 'small',
},
],
],
],
[
'core/query-pagination',
{
layout: {
type: 'flex',
justifyContent: 'center',
},
},
],
[ 'core/query-no-results' ],
];