* Wrap Checkout Edit in SlotFillProvider
Required to render Slot/Fills in the editor
* Remove editor check when rendering ExperimentalOrderShippingPackages
We want to render it in the editor and on the front end, so checking is no longer necessary
* Wrap Cart in SlotFillProvider when in editor
This is so Slot/Fills can be rendered in the preview
* Filter Rating Block > Prevent reload on select.
* Filter by Stock Block > Prevent reload on select.
* Disable debounce for the editor.
* Filter by Price Block > Prevent reload on select.
* Filter by Attribute Block > Prevent reload on select.
* Make the isEditor and isSelected params optional.
* Make isSelected optional.
* Address CR
* update to use isObject
* Set up incompatiblePaymentMethods in data store
* Save incompatible payment methods in data store
* Create the IncompatibilityPaymentGatewaysNotice
* Fix hidden notice bug
* Rename "paymentAdminLink" to GlobalPaymentMethod and move to types dir
* Add all registered methods to incompatiblePaymentMethods state
* Rename selector to getIncompatiblePaymentMethods
* Remove incompatible methods when adding available ones
* Remove unused reducer cases
* Stop adding incompatible methods now that we add them in default state
* Display incompatible methods in the notice from the data store
* Refactor incompatible payment gateways notice
* Update the incompatible extensions notice's design
* Hide Make as default notice
We hide this notice while the notification for incompatible payment
gateways is visible
* Hide the sidebar compatibility notice
Hide this notice while the notification for incompatible payment
gateways is visible. And show it otherwise.
* Capitalize the label for the button on the page settings notice
* Fix missing 'globalPaymentMethods' bug on frontend
* Highlight incompatible payments in sidebar
Highlight incompatible payment gateways within the Payment Options Block
* Rename the incompatible gateways notice's component
* Support plural and singular forms for the notice
* Update incompatible extensions notice's design
* Use the simplified types import
Co-authored-by: Niels Lange <info@nielslange.de>
* Add translation support to notice message
* Fix failing unit tests
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
Co-authored-by: Niels Lange <info@nielslange.de>
* Display Add Review link in the All Products if there's no product rating in All Products and Products
* Apply the font-size mixin to the Add Review link
* Make Add review link NOT clickable in editor
* Improve styles of Rating component so they support alignment in product grids
* Render the block in the frontend
* Add icon style selector to Display settings
This adds an icon style selector in which users can choose the customer account link icon.
* Display on the frontend depending on the icon style
* Rename attributes
* Refactor block rendering
* Improve styling
* Add link to account settings
* Split css file
* Switch to SSR
* Add customer account block to header patterns
* Add customer account block to footer patterns
* Adapt minimal header to designs
* Adapt large header to designs
* Adapt header patterns to new designs and format code
* Adapt footer patterns to the designs
* Change display style for the essential header
* Increase alt icon size
* Make the icon resize with the label
* Adjust icon size on headers
* Add padding and move second row to the right
* Remove unused enum
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
* Add empty 'Customer Account' block
* Add edit to render the block on the editor
* Add Customer Account icon to @woocommerce/icons library
This icon is used in the Customer Account block.
* Use customerAccount icon in the Customer Account block
* Add Block Settings to Customer Account block
Add Typography and Color settings to the Customer Account block that can be used during Edit mode.
* Add Customer Account style icons
This adds the customer account style icons to be used by the customer account block.
* Render the block in the frontend
* Add Display setting to the Customer Account block
This setting allow users to choose if they want to include an icon with the customer account link.
* Add icon style selector to Display settings
This adds an icon style selector in which users can choose the customer account link icon.
* Display on the frontend depending on the icon style
* Rename attributes
* Refactor block rendering
* Improve styling
* Make the account link dynamic
* Add alignment menu
* Get dashboardUrl with getSettings and add fallback
* Add link to account settings
* Add tests
* Fix test
* Change display title
* Split css file
* Switch to SSR
* Add styles to the front end
* Address latest feedback
* Remove experimental flag
Co-authored-by: Alexandre Lara <allexandrelara@gmail.com>
* Mini Cart block - added notice support woocommerce/woocommerce-blocks#6941
Mini Cart block - added notice support
* set isDismissible to true
* address feedback
* improve layout
* fix style and update close button label
* fix UI when the admin bar is visible
* Split out dismissible notices
* fix css
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Add cart view switcher
* Attribute based switched POC
* Tidy up view handling
* Mini cart
* Not sure who clint is. Typo - rename to clientId
* Avoid string casting in TS
* Add margin to title
* Set custom source to prevent currentView saving to post content.
Note this also removes `save` which does not exist in Gutenberg.
* Remove higher order component from withViewSwitcher
* Import view switcher in main file
* Add to side effects
* Move view switcher import
Co-authored-by: Thomas Roberts <thomas.roberts@automattic.com>
* Add Mini Cart button styles to Button component
* Add wp-element-button class to Button component
* Don't load opinionated button styles in TT3 and Zaino
* Remove bold styles from Mini Cart buttons
* Refactor Store Notices
Move snackbar hiding filter before notice creation
Implements showApplyCouponNotice
Refactor context providers
Use STORE_NOTICE_CONTEXTS
use refs to track notice containers
Refactor ref usage
Use existing noticeContexts
* Move new notice code to checkout package
* Combine store and snackbars
* Update noticeContexts imports
* Remove context provider
* Update data store
* Fix 502
* Add new error contexts
* Force types
* Unnecessary reorder of imports
* Fix global handling
* Document forceType
* Optional props are undefined
* Remove function name
* Missing condition
* Remove context prop
* Define ACTION_TYPES
* Remove controls
* Update assets/js/base/context/event-emit/utils.ts
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* CONTACT_INFORMATION
* Remove ref from registerContainer
* Abstract container locating methods
* pass context correctly when displaying notices
* Remove debugging buttons
* Update filter usage - remove useMemo so filter can work inline
* Refactor existing error notices from the API (https://github.com/woocommerce/woocommerce-blocks/pull/7728)
* Update API type defs
* Move create notice utils
* Replace useCheckoutNotices with new contexts
* processCheckoutResponseHeaders should check headers are defined
* Scroll to error notices only if we're not editing a field
* Error handling utils
* processErrorResponse when pushing changes
* processErrorResponse when processing checkout
* remove formatStoreApiErrorMessage
* Add todo for cart errors
* Remove unused deps
* unused imports
* Fix linting warnings
* Unused dep
* Update assets/js/types/type-defs/api-response.ts
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Add todo
* Use generic
* remove const
* Update array types
* Phone should be in address blocks
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update store name to wc/store/store-notices
* Fix assertResponseIsValid
* Funnel woocommerce_rest_invalid_email_address to the correct place
* woocommerce_rest_missing_email_address
* Move comments around
* Move data back into const
* Spacing
* Remove spacing
* Remove forced snack bar and styling
* Move notices within wrapper
* Remove type
* hasStoreNoticesContainer rename
* Group by status/context
* Remove global context
* Remove white space
* remove changes to simplify diff
* white space
* Move comment to typescript
* List style
* showApplyCouponNotice docs
* See if scrollIntoView exists
* fix notice tests
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Respect core settings for showing the Checkout block
* Add account creation option from core to checkout context provider
* Fix TS errors
* Adjust display logic of <LoginPrompt />
* Update assets/js/blocks/checkout/block.tsx
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Rename <LoginPrompt> to <MustLoginPrompt>
* Show space between login text and login link
* Fix TS error
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Add receiveCart thunk
* Add mapCartResponseToCart helper
* Add getItemsPendingQuantityUpdate selector
* Update cart resolvers to be thunks
* Remove RECEIVE_CART action and replace with SET_CART_DATA
receiveCart will turn into a thunk.
* Add notifyQuantityChanges functions
* Remove receiveCart from action type definition, replace with setCartData
* Move apiFetchWithHeaders out of controls
This will just be a normal function since we'll be updating actions to thunks which will use this instead of a control.
* Include thunks in actions file
* Update receiveCart action to setCartData
* Update applyCoupon action to a thunk
* Update useStoreCartCoupons to get action from correct place
* Update StoreCartCoupon types
* Add types for Thunk and ThunkReturnType in mapped-types
* Change applyCoupon to a thunk
* Get applyCoupon, removeCoupon, receiveApplyingCoupon from useDispatch
This is to separate the concerns of actions vs. selectors. Previously the actions were fetched during useSelect which is not a pattern we use anywhere else in the codebase. Since we updated the MapToDispatch type, we can now get correctly typed thunks from the data store.
* Improve apiFetchWithHeaders typings
* Convert removeCoupon from generator to thunk
* Add applyCoupon and removeCoupon to CartAction type
* Remove unused old-style type-def
* Add receiveApplyingCoupon & receiveRemovingCoupon to StoreCartCoupon
* Correct issues with StoreCartCoupon type
These were not intended to reflect the actions in data store, rather the functions offered by the useStoreCartCoupons hook.
* Update applyExtensionCartUpdate to a thunk
* Update addItemToCart to thunk
* Add ResolveSelectFromMap type that works with thunks
* Add CartDispatchFromMap and CartResolveSelectFromMap types
We can add this to all data stores to get them working with thunks properly.
* Add docs and update generic name in ResolveSelectFromMap
* Add correct types for thunk resolvers in cart data store
* Update removeItemFromCart to thunk
* Update apiFetchWithHeaders to use generic
* Update selectShippingRate to thunk
* Update resolver tests to test correct thunk functionality
* Update updateCustomerData to thunk
* Update reducer test to reflect new action name
* Update comments on CartDispatchFromMap and CartResolveSelectFromMap
* Add quantity_limits to preview cart
* Make notices speak when shown
* Remove copilot comment
* Add isWithinQuantityLimits function
This is because we shouldn't show a notice if the quantity limits change, but the item's quantity is still OK.
* Add tests for notifyQuantityChanges
* Show notice when multiple_of is updated
* Update test to test for multiple_of changes
* Remove empty export
* Remove controls from cart data store
Not needed anymore since the exported value from the shared-controls file was empty.
* Export a control and async function for apiFetchWithHeaders
This is required because async functions cannot be called from sync generators.
* Use control version of apiFetchWithHeaders in the collections store
* Improve comments and remove incorrect TypeScript
* Update assets/js/data/cart/actions.ts
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Update ResolveSelectFromMap to include selectors too
* Update TS in actions
* Use finally to remove duplicate code
* remove item pending delete/qty update after action runs in all cases
This will also reset the state when the request to remove it/change quantity errors
* Remove unnecessary type from param.
Not needed because we have TS now. The description can stay though, it is useful.
* Update snackbar wording to use active voice
* Remove old WP version check
* Set max quantity to high number instead of null
This would only happen in a niche case, and would require several TS changes to fix, so it's better to set it as a number here. 9999 should be high enough, and is the default quantity limit set below in get_product_quantity_limit
* Set code on woocommerce_rest_cart_invalid_key to 409
This is so the cart is returned in the response, so the client can update.
* Fix typo in comment and add CartSelectFromMap
* Remove unnecessary docblock
* Add getItemsPendingDelete selector
This is needed so we can show a notice for items that are unexpectedly removed from the cart. We need to know which ones are pending delete so we can skip showing the notice for them.
* Add type for notifyQuantityChanges args and change args to object
* Add notifyIfRemoved function
This will check items that have been removed and show a notice for them.
* Fix TS in receiveCart & pass itemsPendingDelete to notifyQuantiyChanges
* Update wording on removal notice
* Update types for notifyQuantityChanges args
* Update tests to reflect new wording and args being an object
* Check item is truth before running comparison of keys
* Update tests for unexpectedly and expectedly removed items
* Ignore print_r to satisfy phpcs
* Update PHP tests to reflect correct response code when deleting items
* Remove unnecessary controls and dispatch events directly from thunk
Co-authored-by: Mike Jolley <mike.jolley@me.com>
* Convert cart-checkout/totals/shipping component to TypeScript.
* Change hasRates tyep to boolean and fix renderOption type
* fix type for renderOption in ShippingRatesControlProps
* WIP: Make place order editable
* Remove obsolete undefined
* Wrap <ReturnToCartButton> within <Noninteractive>
* Rename const from submitButtonText to paymentMethodButtonLabel
* Simplify defaultValue logic
* Add type for lock attribute in isBlockLocked
* Add getMissingBlocks function
* Add findBlockPosition function
* Refactor useForcedLayout to use registry batch & insert multiple blocks
* Improve comment on getMissingBlocks function
* Fix the incorrect layout of Rating and Price in Classic Template
There were styles required in Rating Filter that were added globally and influenced the layout of Rating in Products block as well as Classic template. The styles were moved to the Rating Filter block
* Extend Filter by Stock Editor options with dropdown and single/multiple choice
* Add dropdown implementation for Filter by Stock Status
* Adjust font-sizes to the rest of the filters
* Add tests to Filter by Stock: dropdown and list variants
* Change test file extension from .js to .tsx, so it handles types as well
* Add E2E test to Filter by Stock checking if display style can be toggled
* When typing in Filter by Stock dropdown, handle the space so it highlights the suggestions
* Change the name of the filter blocks in the test files
* Remove unnecessary waiting step in E2E test for Filter by Stock
toMatchElement waits for an element for 30s by itself, hence waitForSelector usage was removed
* Improve the STOCK_STATUS_OPTIONS type handling
* Extract onDropdownChange function instead of inline arrow function
* Fix overlaping dropdown content with the wrapper when Filter by Stock was set to single
* Make Cart and Checkout buttons editable
* Make shopping button editable
* Remove obsolete dot from the “Empty Mini Cart view” title
* Ensure to keep the existing styles
* Improve name of start shopping button label
* Prevent potential TS error
* Edit Proceed to Checkout button
* Don't allow empty button and remove console log
* extract default button label into a variable
* Feedback from Nadir & Niels
Co-authored-by: Niels Lange <info@nielslange.de>
* Product Query: First attempt at adding patterns
* Product Query: Update patterns and the default block template
* Product Query: And new and update existing patterns
* Product Query: Adjust layout of the Minimal Product Row pattern
* Product Query: Update pattern names
* Product Query: Polish spaces between blocks inside the patterns
* Product Query patterns: Link product titles and improve spacing between product elements
* Product Query patterns: Button font-size update
* Product Query patterns: Center the pagination
* Product Query patterns: Center the pagination for the default pattern
* Product Query patterns: Remove an empty column
* Product Query patterns: Remove an empty column from the product list with 1:1 images pattern
* Rename the setting section to match Filter by Attribute
* Add Display Style toggle to the block settings
* Set list as a default value of displayStyle for Filter by Rating
* Add dropdown variant of Filter by Rating
* Extend the Editor settings with selectType: single or multiple
* Adjust the styles of a FormTokenField to other dropdown
* Align Editor settings order and wording between Filter by Attribute and Rating
* Fix the issue with cut off corners of dropdown borders
* Provide translated screen reader messages and placeholder
* Revert the label property, which is necessary to display checkbox list
* Make classname for Rating component optional and remove styling in Filter by Rating
* Cover the case when filter with zero products needs string methods for comparison
* Handle Typescript errors and add ts-ignore annotations when necessary
* Remove explicit key prop assignment in Rating component
* Remove leftover property in type definition
* Refactor JSX element extension with custom properties to more robust way with object copy
* Filter by rating tests (https://github.com/woocommerce/woocommerce-blocks/pull/7845)
* Filter by Rating tests:
- List single
- List multiple
- Dropdown single
- Dropdown multiple
* Adjust the font-size of Filter by Rating dropdown to the rest of the filters
* Fix E2E tests after the Editor settings label has been changed
* Improve sorting in Filter by Rating dropdown
With this change the order of options is always descending: in the chips, suggestions, active filters and URL
* Change the name of the filter blocks in the test files
* Prevent single dropdown input to overflow the wrapper
The issue is fixed in three filters, hence a new shared styles file is created at the path assets/js/blocks/shared/styles/style.css
* Remove the unused styles of active options in Filter by Rating
Chosen options in Filter by Rating list have been bolded. That was the only filter that was doing it. Class was removed, but not the styles themselves which became obsolete. Removing the leftover styles then
* Change the approach of shared styles to fix the dropdown issue in filters
Instead of using direct classes, rewrite it to mixin and include in the filters
* Fix the Filter by Rating with Products block
The problem was with the Products block, that there was incorrect initial value of product ratings query
* Align the logic of getting the filters from URL for Filter by Rating with Filter by Stock
Co-authored-by: Luigi Teschio <gigitux@gmail.com>
* A notice is now displayed in the editor whenever the Filter by Rating block is used in a store that has no products with ratings. Additionally, users can now preview/update the content, settings, and color for the filter even when the store doesn't have any ratings yet.
* Update hex color val to currentColor.
* Remove fill attributes on SVG
Having the fill attributes explicitly defined on the SVG was setting the
icon to purple in unexpected cases.
This also reverts the quick attempt to adjust CSS selector for a fix, as
it was the incorrect approach.
* Allows custom validation rules to be applied to fields - in this case, email address
* Add local state to only push valid changes
* Do not need required
* unused isString
* Move to push level
* Update packages/checkout/components/text-input/validated-text-input.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update packages/checkout/components/text-input/validated-text-input.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update packages/checkout/components/text-input/validated-text-input.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Update packages/checkout/components/text-input/validated-text-input.tsx
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Validate when the data store changes
Co-authored-by: Niels Lange <info@nielslange.de>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Creates a new block variation based on the core “Post Excerpt” called “Product Summary”.
* Brands it as our old “Product Summary” atomic element.
* Creates a utility function to allow easy creation of such variations.
As much as we can, we should use core blocks when the functionality is mostly overlapping. In the case of the Post Title block, we don't need to add and maintain our own block most likely, so we should just brand the Post Title block instead.
This PR does the following:
* Creates a new block variation based on the core “Post Title” called “Product Title”.
* Brands it as our old “Product Title” atomic element.
* Use this variation as the default within the Product Query template.
* Also removes some old code used for variations before the namespace attribute was available on the core Query Loop and repurposes it to create this variation.
* Product Query: add Feedback Prompt in inspector
The prompt doesn't appear at the very bottom as there isn't
currently any straightforward way to do this in the block variation.
More investigation is required.
* Product Query: Change icon, description and name
* Product Query: switch to Feature plugin flag
* Add all currently available atomic blocks to the default Product Query template
* Update feature flags doc
* Change SKU and Stock Indicator feature flags
* Change feature flags docs
* Add title prop to the `FeedbackPrompt` and add a title to the Product Query one
* Hacky solution to display the feedback block at the bottom
The order of the inspector controls is set in Gutenberg.
We can hack our way down by hooking to the “color” group and
display our feedback there.
Other panels would be displayed below that if added, such as borders
and margin.
* Reduce Product Query default template
* Fix e2e tests after Product Query block name change (https://github.com/woocommerce/woocommerce-blocks/pull/7840)
* Product Query: Add a better default pattern (https://github.com/woocommerce/woocommerce-blocks/pull/7833)
* Product Query: Add a better default pattern
* Product Price: Add bottom margin
Co-authored-by: Albert Juhé Lluveras <contact@albertjuhe.com>
Co-authored-by: Daniel Dudzic <daniel.dudzic@automattic.com>
* Add product query support for Product Summary block
On the client side, when the Product Summary block is used within the product query block, the markup will be rendered on the server side - No javascript related to Product Summary block will be rendered.
* Update variable names for clarity & readability
* Escape all values in output string
* Fix custom style not working
More info: https://github.com/woocommerce/woocommerce-blocks/pull/7774#discussion_r1035909243
* Align the font-size of checkbox-control component to the price slider amount
* Align the font-size of Price Slider Button to the price slider amount
* Align the font-size of Filter Reset Button to the price slider amount
* Align the font-size of Clear All Button to the price slider amount
* Align the font-size of Apply button in Editor to the price slider amount
* Align the font-size of Apply button in Frontend to the price slider amount
* Align the font-size of Price Slider Amount to the standard size
* Align the font-size of Active Filter chips to the price slider amount
* Align the font-size of Filter by Price (text) to the price slider amount
* Align the font-size of Filter by Attribute (dropdown) to the price slider amount
* Align the font-size of placeholder of Filter by Attribute (dropdown) to the price slider amount
* Change font-size for text in filters from font-size(smaller) to font-size(smaller)
As a result of discussion in PR it was agreed to check the styles with bigger font size hence the change
* Align the font-size of input text of Filter by Attribute (dropdown) to the price slider amount
* Change margin-right of checkbox-control to relative value so it better adapts to the fonts
* Product Query: Fix pagination issue
* Product Query - Add support for the Filter By Price Block woocommerce/woocommerce-blocks#6790
Product Query - Add support for the Filter By Price Block
* fix query relation
* fix on sale query
* Product Query - Add support for the Filter By Attributes block woocommerce/woocommerce-blocks#6790
Product Query - Add support for the Filter By Attributes block
* fix bugged pagination and on-sale filter after refactor
* address feedback
* Product Query - Add support for the Filter By Stock Block woocommerce/woocommerce-blocks#6790
Product Query - Add support for the Filter By Stock Block
* Fix filter blocks: the data (e.g: max price or stock-status) match the variation woocommerce/woocommerce-blocks#7245
fix filter blocks: the data (e.g: max price or stock-status) match the variation
* rename allowControls to allowedControls
* add support to the global query
* fix eslint error
* bot: update checkstyle.xml
* Update src/BlockTypes/ProductQuery.php
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
* fix global query generation
* bot: update checkstyle.xml
* try: refactor merge_queries
* remove debug code
* fix: unpack assoc array php 7.4
* try: refactor merge_queries to take any form of input without unpacking
and preparing the input arrays
* add missing query vars
* add feature flag
* updates comment
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Tung Du <dinhtungdu@gmail.com>
* Adds product query support for Category list block
On the client side, when the Category list block is used within the
product query bloc, the markup will be rendered on the server side -
No javascript related to Category list block will be rendered.
* bot: update checkstyle.xml
* Fix extra space after the category link
I used the solution from following link: https://css-tricks.com/fighting-the-space-between-inline-block-elements/#aa-remove-the-spaces
Here is the content from the above link:
The reason you get the spaces is because, well, you have spaces between the elements (a line break and a few tabs counts as a space, just to be clear). Minimized HTML will solve this problem, or one of these tricks:
```CSS
<ul>
<li>
one</li><li>
two</li><li>
three</li>
</ul>
```
or
```CSS
<ul>
<li>one</li
><li>two</li
><li>three</li>
</ul>
```
or with comments…
```CSS
<ul>
<li>one</li><!--
--><li>two</li><!--
--><li>three</li>
</ul>
```
They’re all pretty funky, but it does the trick.
* Fix custom style doesn't work on the frontend side
For more info, check this comment on the PR:
https://github.com/woocommerce/woocommerce-blocks/pull/7675#pullrequestreview-1179267957
In summary, user can set the custom styles like text color, link color, font size, font weight, line height using the editor sidebar.
These styles weren't showing on the frontend side.
* Add support for additional CSS class(es)
* Fix "custom style -> link color" not working
To understand the issue in more details please check following comment:
https://github.com/woocommerce/woocommerce-blocks/pull/7675#issuecomment-1319822535
* Fix classname undefined issue
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Rename Active Product Filters block to Active Filters
* Rename wc-block-active-product-filters__placeholder to wc-block-active-filters__placeholder
* Rename active filters fixture
* Add product query support for Sale badge block
On the client side, when the Sale badge block is used within the product query block, the markup will be rendered on the server side - No javascript related to Sale badge block will be rendered.
* Add support for additional CSS class(es)
ADDITIONAL CSS CLASS(ES)(available in advanced toggle in sidebar) should be added to the container div
* Convert preset to css variable for padding
We are getting padding value in preset format like this:
"var:preset|spacing|50"
Therefore I added a function to convert it to CSS variable like this:
"var(--wp--preset--spacing--50)"
i.e. "var:preset|spacing|50" -> "var(--wp--preset--spacing--50)"
* Add reference for preset to css variable conversion logic
* Add support for “Popular Presets” for PQ block
This commits achieves the following:
* Adds a section in the inspector control called “Popular Presets”,
which contains a dropdown with popular presets.
* Adds support for the first preset: “Best selling products”.
By selecting this, users can sort products by total sales.
* Switches the order of the custom inspector controls and the default
Query Loop inspector controls: our controls will be now on top
as per the latest design spec (see pdnLyh-2By-p2).
* Restricts the allowed Query parameters to the sort orders we want to
allow according to the latest design spec (disabling title and date).
* Removes the core “Order By” dropdown.
* Refactor `setCustomQueryAttribute` to `setQueryAttribute` because
since a few iterations, our custom query attributes are not deeply nested
anymore, and this function can be used for the normal query too.
* Add back-end support for sorting by Best Selling via the Product Query block
* Adds the `popularity` value as an allowed value for `orderby` on
`product` REST API calls.
* Handles the query differently if the `orderby` value is one among the
custom ones.
* Add clearValidationErrors to validation data store actions
* Add reducer case for CLEAR_VALIDATION_ERRORS
* Add tests for CLEAR_VALIDATION_ERRORS
* Add documentation for clearValidationErrors
* Deprecate clearAllValidationErrors in actions.ts
* Remove CLEAR_VALIDATION_ERRORS action and reducer case
* Update reducer test for clearAllValidationErrors
* Make error message in test describe the test better
* Update reducer to handle CLEAR_VALIDATION_ERRORS with no error passed
* Update documentation for validation data store
* Remove unnecessary linebreaks in documentation
* Moved all payment utils functions in a utils folder
* Delete as it's not being used
* bot: update checkstyle.xml
* bot: update checkstyle.xml
* Fix TS error
* bot: update checkstyle.xml
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Fix typo in HTML markup of ProductImage block placeholder
Typo caused rendering of incorrect HTML attributes: width and height of Product Image placeholder that were anyway ignored by the browser
* Remove inline styles (width and height) from ImagePlaceholder in ProductElements > Image block
Inline height took precedence over the inherited styles which made the placeholder image skewed (in loading and loaded state). Removal of those styles allows the ImagePlaceholder to adapt the height to the available space keeping the ratio or inherit the styles from the parent
* Remove inline styles (width and height) from placeholder image in ProductImage.php block
Inline styles applied to the placeholder image of ProductImage block were overriden by other styles with higher specificity, which made them redundant. Additionally, corresponding styles were removed from the placeholder image from Editor code as they caused UI glitches. Additional proof that it's safe to remove them is in the first commit in this branch, the purpose of which was to fix those styles as there was a typo which corrupted them and eventually inline width and height were ignored by the browser and not applied to the element
* Add test to check placeholder image renders without width and height inline attributes
This is to prevent adding inline width and height attributes so the sizing of the placeholder image is controlled by the inherited styles or element styles, in the same way as a regular product image
* Fix TypeScript errors in the block test file of Product Image
* Add generic alt text to placeholder image
Alt text added in this commit is a generic text, not description of the actual image. That's because the image itself is set externally through the settings and may change over time
* Revert adding placeholder image alt text and add comments to make the empty alt explicit
After a Github discussion: https://github.com/woocommerce/woocommerce-blocks/pull/7651\#discussion_r1019560494 it was decided the placeholder should NOT have alt text as it serves the purpose of decorative image. According to the guidelines decorative images should not have alt text: https://www.w3.org/WAI/tutorials/images/decorative/. Comments were added also to other places where it happens
* bot: update checkstyle.xml
Co-authored-by: Karol Manijak <karolm@Karols-MacBook-Pro.local>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Make loading placeholder colors match the current font color
Currently, the loading placeholder effect has a default gray color. However, since users can modify their themes with the Site Editor and choose a different set of colors for their websites, it would be interesting to make those placeholders match the color palette.
In this commit, the idea was to modify the `placeholder` mixin to replace the transparent font color with the current color and also modify the background-color and the linear-gradient to match the current font color. Furthermore, transparency was added to the middle color of the linear-gradient so we can keep the loading animation close to what it currently is.
* Add opacity to placeholder mixin
Before our changes, when the font color was dark, we had a lighter placeholder background color. After the changes the color is currently darker than before so the idea for this commit is to change the opacity of the placeholder in a way that the current color blends with the background color set for the theme.
* Change placeholder mixin opacity
After testing different combinations of colors, we decided to change the opacity to 0.15 so when the font color is darker the placeholder will have a lighter background color.
* bot: update checkstyle.xml
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Add actions and selectors for new paymemt status
* Remove set_complete from reducer
* Replace all usages of getCurrentStatus with specific sepectors
* Replace all `setCurrentStatus` with individual actions
* Update docs
* Removed currentStatus
* bot: update checkstyle.xml
* Update docs/third-party-developers/extensibility/data-store/payment.md
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Address Thomas feedback
* Add link to deprecated message
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: Thomas Roberts <5656702+opr@users.noreply.github.com>
* Remove the experimental flag that's used to include thunks in wp.data
* bot: update checkstyle.xml
* Fix ts error from previous PR
* bot: update checkstyle.xml
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Add attributes, settings, and editor PQ settings.
- Adds isDescendentOfQueryLoop attribute and sets up usage in editor.
- Connects Context (via useContext) in editor.
- Sets up necessary hierarchy in block index file settings.
* Update parent inner blocks config.
Reassign parent array to ancestor array which allows for blocks to be
included with more flexibility - i.e., added within groups that are
children of the ancestor block.
* Add dynamic render function for PQ support.
* Update to use correct classnames on PHP side.
SSR markup was accidentally using rating classname instead of sku so it
was not applying the proper text transform seen in the editor.
* Rename BlockAttributes type to Attributes
This keeps things consistent with the type naming on the other blocks.
* Remove redundant spread of sharedConfig object.
We don't need to spread the `sharedConfig` object into the `blockConfig`
object when defining `blockConfig` since we spread/merge these two
objects when registering the block via `registerExperimentalBlockType`.
* bot: update checkstyle.xml
* bot: update checkstyle.xml
* Empty commit to trigger checks.
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
* Remove isExpressPaymentMethodActive and paymentStatus.isDoingExpressPayment from the payment store
* Remove uneccessary paymentStatuses key from the payments store
Thomas Roberts
Lucio Giannotta
Paulo Arromba
Tarun Vijwani
Daniel Dudzic
Tung Du
Patricia Hillebrandt
kmanijak
Saad Tarhi
Seghir Nadir
Niels Lange
Alba Rincón
Mike Jolley
Luigi Teschio
Albert Juhé Lluveras
Alex Florisca
Daniel W. Robert
Manish Menaria
Alexandre Lara
dependabot[bot]