UNPKG

@shopgate/engage

Version:
6 lines 5.9 kB
function _defineProperty(obj,key,value){if(key in obj){Object.defineProperty(obj,key,{value:value,enumerable:true,configurable:true,writable:true});}else{obj[key]=value;}return obj;}function _extends(){_extends=Object.assign||function(target){for(var i=1;i<arguments.length;i++){var source=arguments[i];for(var key in source){if(Object.prototype.hasOwnProperty.call(source,key)){target[key]=source[key];}}}return target;};return _extends.apply(this,arguments);}import React,{useMemo}from'react';import classNames from'classnames';import{Grid,Link,ProductProperties,SurroundPortals,ConditionalWrapper,I18n}from'@shopgate/engage/components';import{CART_ITEM_IMAGE,CART_ITEM_LINK,CART_ITEM_PROPERTIES,CART_ITEM_QUANTITY_PICKER}from'@shopgate/engage/cart';import{showTaxDisclaimer}from'@shopgate/engage/market';import{bin2hex}from'@shopgate/engage/core/helpers';import{useWidgetSettings}from'@shopgate/engage/core/hooks';import{ProductImage,PriceInfo,ITEM_PATH}from'@shopgate/engage/product';import{CartItemProductChangeLocation,CartChangeFulfillmentMethod}from'@shopgate/engage/locations';import{getLineItemActiveStatus}from'@shopgate/engage/orders';import{CartItemQuantityPicker}from"./CartItemQuantityPicker";import{CartItemProductTitle}from"./CartItemProductTitle";import CartItemProductOrderDetails from"./CartItemProductOrderDetails";import CartItemProductPriceList from"./CartItemProductPriceList";import{useCartItem,useCartItemProduct}from"./CartItem.hooks";import styles from"./CartItemProductLayout.style";/** * The Cart Product Layout component. * @returns {JSX.Element} */export function CartItemProductLayout(){// Added with PWA 6 - CCP-2372 var _useWidgetSettings=useWidgetSettings('@shopgate/engage/components/TaxDisclaimer'),show=_useWidgetSettings.show;// use widget setting if set to true/false, otherwise use market logic var showDisclaimer=typeof show==='boolean'?show:showTaxDisclaimer;var _useCartItem=useCartItem(),registerFulfillmentAction=_useCartItem.registerFulfillmentAction,isOrderDetails=_useCartItem.isOrderDetails,isCheckoutConfirmation=_useCartItem.isCheckoutConfirmation;var context=useCartItemProduct();var cartItem=context.cartItem,product=context.product,currency=context.currency,editMode=context.editMode,handleUpdate=context.handleUpdate,handleRemove=context.handleRemove,toggleEditMode=context.toggleEditMode,isEditable=context.isEditable;var portalProps=useMemo(function(){return _extends({context:{type:context.type,cartItemId:context.cartItemId,product:context.product}},context,{isOrderDetails:isOrderDetails,isCheckoutConfirmation:isCheckoutConfirmation,quantity:cartItem.quantity,handleDelete:handleRemove});},[cartItem.quantity,context,handleRemove,isCheckoutConfirmation,isOrderDetails]);var isActive=!isOrderDetails?true:getLineItemActiveStatus(cartItem===null||cartItem===void 0?void 0:cartItem.status,cartItem===null||cartItem===void 0?void 0:cartItem.subStatus);var showLineItemPromotions=useMemo(function(){if(isOrderDetails||isCheckoutConfirmation){return false;}return((cartItem===null||cartItem===void 0?void 0:cartItem.appliedPromotions)||[]).length>0;},[cartItem,isCheckoutConfirmation,isOrderDetails]);return React.createElement(React.Fragment,null,React.createElement(Grid,{className:classNames(styles.item,_defineProperty({},styles.itemInactive,!isActive))},React.createElement(Grid.Item,{className:styles.content,grow:1},React.createElement(SurroundPortals,{portalName:CART_ITEM_LINK,portalProps:portalProps},React.createElement(CartItemProductTitle,{value:product.name,productId:product.id})),React.createElement(Grid,{className:styles.info},React.createElement(Grid.Item,{grow:1,className:styles.properties},React.createElement(SurroundPortals,{portalName:CART_ITEM_PROPERTIES,portalProps:portalProps},React.createElement(ProductProperties,{properties:product.properties,lineClamp:2})),isOrderDetails&&React.createElement(CartItemProductOrderDetails,null)),React.createElement(Grid.Item,{grow:1,className:styles.price},isOrderDetails&&React.createElement(I18n.Text,{string:"cart.subtotal",className:styles.orderDetailsSubtotalLabel}),!showLineItemPromotions&&React.createElement(React.Fragment,null,React.createElement(CartItemProductPriceList,{isSubtotal:true}),React.createElement(PriceInfo,{product:product,currency:currency,className:styles.priceInfo}))),showDisclaimer&&React.createElement(Grid.Item,{className:styles.disclaimerSpacer,grow:0,shrink:0})),showLineItemPromotions&&React.createElement(Grid,{className:classNames(styles.info,styles.promotionLine)},React.createElement(Grid.Item,null),React.createElement(Grid.Item,{className:styles.promotionLineItem},React.createElement(CartItemProductPriceList,{isSubtotal:true,showLabels:true}),React.createElement(PriceInfo,{product:product,currency:currency,className:styles.priceInfo})))),React.createElement(Grid.Item,{className:styles.leftColumn},React.createElement("div",{className:styles.image,"aria-hidden":true},React.createElement(ConditionalWrapper,{condition:isEditable,wrapper:function wrapper(children){return React.createElement(Link,{tagName:"a",href:"".concat(ITEM_PATH,"/").concat(bin2hex(product.id))},children);}},React.createElement(SurroundPortals,{portalName:CART_ITEM_IMAGE,portalProps:portalProps},React.createElement(ProductImage,{src:product.featuredImageBaseUrl||product.featuredImageUrl})))),!isOrderDetails&&React.createElement(SurroundPortals,{portalName:CART_ITEM_QUANTITY_PICKER,portalProps:portalProps},React.createElement(CartItemQuantityPicker,{unit:product.unit,hasCatchWeight:product.hasCatchWeight,quantity:cartItem.quantity,editMode:editMode,onChange:handleUpdate,onToggleEditMode:toggleEditMode,disabled:!isEditable})))),React.createElement(CartItemProductChangeLocation,{cartItem:cartItem,registerAction:registerFulfillmentAction}),React.createElement(CartChangeFulfillmentMethod,{cartItem:cartItem,registerAction:registerFulfillmentAction}));}