woocommerce/plugins/woocommerce-blocks/assets/js/blocks/cart/inner-blocks/register-components.ts

176 lines
3.8 KiB
TypeScript
Raw Normal View History

WIP: Add Inner blocks to order summary (https://github.com/woocommerce/woocommerce-blocks/pull/6065) * Sub/Total/Fee inner blocks * Row blocks within the inner block * Update icons * Resolve stying issues * Remove old block * Pin totals row * Locking logic update * Heading inner block * Refactor where inner blocks are defined * Add todos * Todo for Consider deprecating OrderMetaSlotFill and DiscountSlotFill in favour of inner block areas. * Improve frontend registration of components using new entrypoint * Experiment- external block context * Revert "Experiment- external block context" This reverts commit 4b75668ec7eb62f065c6a488cd942a666e26204f. * Duplicate inner blocks to avoid conflicts with context * Remove todo * Rename block dir * Some test fixes * Fix import * fix import * linting * Remove unused attributes * Optional classname * fix coupons import * fix shipping mocks * Styling * Fix selectors in e2e tests * Add back the wc-block-components-totals-wrapper class that was used for each segment in the totals Order summary Because, removing them was: - a breaking change for the old structure - was making it harder to target the inner blocks. Before the class was used to target each segment - it was making the wc-block-components-totals-item behave as a child or parent depending on the inner block, inconsitency * Reuse the TotalsWrapper component for C& C blocks inner blocks This component was removed in this PR, but we wrap components in the Cart and Checkout sidebar in a TotalsWrapper. This will ensure consistent spacing and borders are applied to items in the sidebar. Co-authored-by: Nadir Seghir <nadir.seghir@gmail.com> Co-authored-by: Raluca Stan <ralucastn@gmail.com>
2022-04-01 13:45:18 +00:00
/**
* External dependencies
*/
import { lazy } from '@wordpress/element';
import { WC_BLOCKS_BUILD_URL } from '@woocommerce/block-settings';
import { registerCheckoutBlock } from '@woocommerce/blocks-checkout';
/**
* Internal dependencies
*/
import metadata from './component-metadata';
// Modify webpack publicPath at runtime based on location of WordPress Plugin.
// eslint-disable-next-line no-undef,camelcase
__webpack_public_path__ = WC_BLOCKS_BUILD_URL;
registerCheckoutBlock( {
metadata: metadata.FILLED_CART,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/filled-cart" */
'./filled-cart-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.EMPTY_CART,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/empty-cart" */
'./empty-cart-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ITEMS,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-items" */
'./cart-items-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_LINE_ITEMS,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-line-items" */
'./cart-line-items-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_TOTALS,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-totals" */
'./cart-totals-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_EXPRESS_PAYMENT,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-express-payment" */
'./cart-express-payment-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.PROCEED_TO_CHECKOUT,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/proceed-to-checkout" */
'./proceed-to-checkout-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ACCEPTED_PAYMENT_METHODS,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-accepted-payment-methods" */
'./cart-accepted-payment-methods-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/cart-order-summary" */
'./cart-order-summary-block/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_SUBTOTAL,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-subtotal" */
'./cart-order-summary-subtotal/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_FEE,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-fee" */
'./cart-order-summary-fee/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_DISCOUNT,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-discount" */
'./cart-order-summary-discount/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_SHIPPING,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-shipping" */
'./cart-order-summary-shipping/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_COUPON_FORM,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-coupon-form" */
'./cart-order-summary-coupon-form/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_TAXES,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-taxes" */
'./cart-order-summary-taxes/frontend'
)
),
} );
registerCheckoutBlock( {
metadata: metadata.CART_ORDER_SUMMARY_HEADING,
component: lazy( () =>
import(
/* webpackChunkName: "cart-blocks/order-summary-heading" */
'./cart-order-summary-heading/frontend'
)
),
} );