diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/index.js b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/index.js index 1dc806a58f1..74fffaae9cf 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/index.js +++ b/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/index.js @@ -2,7 +2,6 @@ export { default as AddressForm } from './address-form'; export { default as Button } from './button'; export { default as CheckoutForm } from './form'; export { default as FormStep } from './form-step'; -export { default as NoShipping } from './no-shipping'; export { default as PlaceOrderButton } from './place-order-button'; export { default as Policies } from './policies'; export { default as ProductImage } from './product-image'; diff --git a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/index.js b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/index.js index bc5c16c72eb..b4b867c0561 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/index.js +++ b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/index.js @@ -34,9 +34,9 @@ const NoPaymentMethodsPlaceholder = () => { } label={ __( 'Payment methods', 'woo-gutenberg-products-block' ) } - className="wc-block-checkout__no-payment-methods" + className="wc-block-checkout__no-payment-methods-placeholder" > - + { __( 'Your store does not have any payment methods configured that support the checkout block. Once you have configured a compatible payment method (e.g. Stripe) it will be shown here.', 'woo-gutenberg-products-block' diff --git a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/style.scss b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/style.scss index 244f706d8f1..71713e6648d 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/style.scss +++ b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/no-payment-methods/style.scss @@ -1,6 +1,10 @@ -.components-placeholder.wc-block-checkout__no-payment-methods { +.components-placeholder.wc-block-checkout__no-payment-methods-placeholder { margin-bottom: $gap; + * { + pointer-events: all; // Overrides parent disabled component in editor context + } + .components-placeholder__fieldset { display: block; @@ -9,7 +13,7 @@ color: $white; } - .wc-block-checkout__no-payment-methods-description { + .wc-block-checkout__no-payment-methods-placeholder-description { display: block; margin: 0.25em 0 1em 0; font-size: 13px; diff --git a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/style.scss b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/style.scss index 0501ceb6881..ad22fe83163 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/style.scss +++ b/plugins/woocommerce-blocks/assets/js/base/components/payment-methods/style.scss @@ -151,3 +151,7 @@ .wc-blocks-credit-card-images { padding-top: $gap-small; } + +.wc-block-components-checkout-payment-methods * { + pointer-events: all; // Overrides parent disabled component in editor context +} diff --git a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/block.js b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/block.js index 28354dd1650..f3f62598e2b 100644 --- a/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/block.js +++ b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/block.js @@ -8,7 +8,6 @@ import { AddressForm, FormStep, CheckoutForm, - NoShipping, PlaceOrderButton, Policies, ReturnToCartButton, @@ -42,8 +41,9 @@ import withScrollToTop from '@woocommerce/base-hocs/with-scroll-to-top'; /** * Internal dependencies */ -import CheckoutSidebar from './sidebar/index.js'; -import CheckoutOrderError from './checkout-order-error/index.js'; +import CheckoutSidebar from './sidebar'; +import CheckoutOrderError from './checkout-order-error'; +import NoShippingPlaceholder from './no-shipping-placeholder'; import './style.scss'; const Block = ( props ) => ( @@ -294,7 +294,7 @@ const Checkout = ( { ) } > { shippingRates.length === 0 && isEditor ? ( - + ) : ( { 'woo-gutenberg-products-block' ) } > - + + + diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/index.js b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/index.js similarity index 81% rename from plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/index.js rename to plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/index.js index dd1adc2fca9..a38b7bcbf49 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/index.js +++ b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/index.js @@ -11,14 +11,14 @@ import { ADMIN_URL } from '@woocommerce/settings'; */ import './style.scss'; -const NoShipping = () => { +const NoShippingPlaceholder = () => { return ( } label={ __( 'Shipping options', 'woo-gutenberg-products-block' ) } - className="wc-block-checkout__no-shipping" + className="wc-block-checkout__no-shipping-placeholder" > - + { __( 'Your store does not have any Shipping Options configured. Once you have added your Shipping Options they will appear here.', 'woo-gutenberg-products-block' @@ -39,4 +39,4 @@ const NoShipping = () => { ); }; -export default NoShipping; +export default NoShippingPlaceholder; diff --git a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/style.scss b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/style.scss similarity index 51% rename from plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/style.scss rename to plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/style.scss index 0c6d13fb8d0..4e96852a889 100644 --- a/plugins/woocommerce-blocks/assets/js/base/components/cart-checkout/no-shipping/style.scss +++ b/plugins/woocommerce-blocks/assets/js/blocks/cart-checkout/checkout/no-shipping-placeholder/style.scss @@ -1,6 +1,10 @@ -.components-placeholder.wc-block-checkout__no-shipping { +.components-placeholder.wc-block-checkout__no-shipping-placeholder { margin-bottom: $gap; + * { + pointer-events: all; // Overrides parent disabled component in editor context + } + .components-placeholder__fieldset { display: block; @@ -9,7 +13,7 @@ color: $white; } - .wc-block-checkout__no-shipping-description { + .wc-block-checkout__no-shipping-placeholder-description { display: block; margin: 0.25em 0 1em 0; font-size: 13px;