@shopgate/engage
Version:
Shopgate's ENGAGE library.
62 lines (61 loc) • 1.94 kB
JavaScript
import React from 'react';
import PropTypes from 'prop-types';
import { SurroundPortals } from '@shopgate/engage/components';
import { CART_PAYMENT_BAR_TOTALS_TAX, getTaxLine } from '@shopgate/pwa-common-commerce/cart';
import CartTotalLine from '@shopgate/pwa-ui-shared/CartTotalLine';
import { CartContext } from "../../cart.context";
import { spacer } from "./PaymentBarContent.style";
import connect from "./PaymentBarTax.connector";
/**
* The Tax component.
* @param {Object} props The component props.
* @param {Object} [props.taxData] The tax data.
* @param {boolean} [props.showSeparator=true] Whether to show a separator.
* @param {string|null} [props.className=null] The class name for styling.
* @returns {JSX.Element|null} The rendered component or null.
*/
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
const PaymentBarTax = ({
taxData,
showSeparator,
className
}) => {
const {
currency,
isLoading,
config,
hasPromotionCoupons
} = React.useContext(CartContext);
if (!taxData) {
return null;
}
const taxLine = getTaxLine(config, taxData);
if (!taxLine) {
return null;
}
return /*#__PURE__*/_jsx(SurroundPortals, {
portalName: CART_PAYMENT_BAR_TOTALS_TAX,
children: /*#__PURE__*/_jsxs(CartTotalLine, {
isDisabled: isLoading,
type: "tax",
className: className,
children: [/*#__PURE__*/_jsx(CartTotalLine.Label, {
label: taxLine.label,
showSeparator: showSeparator
}), /*#__PURE__*/_jsx(CartTotalLine.Amount, {
amount: taxLine.amount,
currency: currency
}), /*#__PURE__*/_jsx(CartTotalLine.Hint, {
hint: taxLine.hint
}), hasPromotionCoupons && /*#__PURE__*/_jsx(CartTotalLine.Spacer, {
className: spacer
})]
})
});
};
PaymentBarTax.defaultProps = {
taxData: null,
className: null,
showSeparator: true
};
export default connect(PaymentBarTax);