Cart

The cart module is a fully encapsulated cart component, with all cart interactions such as changing quantity or removing an item.

Usage

import React, { FC } from 'react';
import { LiquidCart } from '@liquidcloud/modules-react';

const Component: FC = () => {
  return (
    <LiquidCart
      mode="standard"
      header={true}
      footer={true}
      onClickContinueShopping={() => {
        // handle continue shopping button click
      }}
      onCheckout={() => {
        // navigate to checkout page
      }}
    />
  );
};

export default Component;

Properties

property	type	default	description
mode	'standard' | 'dialog'	dialog	Indicates if the cart should be shown as a dialog or a plain div.
header	boolean	true	Indicates if the cart header should be shown.
footer	boolean	true	Indicates if the cart footer should be shown.
onClickContinueShopping	func	-	Callback fired when cart is empty and continue shopping button is clicked.
onCheckout	func	-	Callback fired when the checkout button is clicked.