@commercelayer/react-components 4.7.6 → 4.7.7-beta.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/cjs/components/line_items/LineItemQuantity.d.ts +5 -0
- package/lib/cjs/components/line_items/LineItemQuantity.js +1 -1
- package/lib/cjs/components/line_items/LineItemsContainer.js +1 -1
- package/lib/cjs/components/orders/HostedCart.js +1 -1
- package/lib/cjs/components/payment_gateways/PaymentGateway.js +1 -1
- package/lib/cjs/components/payment_source/PaymentSource.js +1 -1
- package/lib/cjs/reducers/LineItemReducer.d.ts +2 -1
- package/lib/cjs/reducers/LineItemReducer.js +1 -1
- package/lib/esm/components/line_items/LineItemQuantity.d.ts +5 -0
- package/lib/esm/components/line_items/LineItemQuantity.js +1 -1
- package/lib/esm/components/line_items/LineItemsContainer.js +1 -1
- package/lib/esm/components/orders/HostedCart.js +1 -1
- package/lib/esm/components/payment_gateways/PaymentGateway.js +1 -1
- package/lib/esm/components/payment_source/PaymentSource.js +1 -1
- package/lib/esm/reducers/LineItemReducer.d.ts +2 -1
- package/lib/esm/reducers/LineItemReducer.js +1 -1
- package/package.json +1 -1
|
@@ -11,6 +11,11 @@ type Props = {
|
|
|
11
11
|
max?: number;
|
|
12
12
|
disabled?: boolean;
|
|
13
13
|
readonly?: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* force the update of the line item price using `_external_price: true` attribute
|
|
16
|
+
* @link https://docs.commercelayer.io/core/external-resources/external-prices
|
|
17
|
+
*/
|
|
18
|
+
hasExternalPrice?: boolean;
|
|
14
19
|
} & (Omit<JSX.IntrinsicElements['select'], 'children'> & Omit<JSX.IntrinsicElements['span'], 'children'>);
|
|
15
20
|
export declare function LineItemQuantity(props: Props): JSX.Element;
|
|
16
21
|
export default LineItemQuantity;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LineItemQuantity=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),LineItemChildrenContext_1=tslib_1.__importDefault(require("../../context/LineItemChildrenContext")),LineItemContext_1=tslib_1.__importDefault(require("../../context/LineItemContext")),Parent_1=tslib_1.__importDefault(require("../utils/Parent"));function LineItemQuantity(props){var _a;const{max=50,readonly=!1}=props,p=tslib_1.__rest(props,["max","readonly"]),{lineItem}=(0,react_1.useContext)(LineItemChildrenContext_1.default),{updateLineItem}=(0,react_1.useContext)(LineItemContext_1.default),options=[];for(let i=1;i<=max;i++)options.push((0,jsx_runtime_1.jsx)("option",{value:`${i}`,children:i},i));const handleChange=e=>{const quantity2=Number(e.target.value);updateLineItem&&lineItem&&updateLineItem(lineItem.id,quantity2)},quantity=lineItem?.quantity,parentProps=Object.assign({handleChange,quantity,lineItem},props);return props.children?(0,jsx_runtime_1.jsx)(Parent_1.default,Object.assign({},parentProps,{children:props.children})):readonly?(0,jsx_runtime_1.jsx)("span",Object.assign({},p,{children:quantity})):(0,jsx_runtime_1.jsx)("select",Object.assign({"data-testid":lineItem?.sku_code,title:(_a=lineItem?.name)!==null&&_a!==void 0?_a:"",value:quantity,onChange:handleChange},p,{children:options}))}exports.LineItemQuantity=LineItemQuantity,exports.default=LineItemQuantity;
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LineItemQuantity=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),LineItemChildrenContext_1=tslib_1.__importDefault(require("../../context/LineItemChildrenContext")),LineItemContext_1=tslib_1.__importDefault(require("../../context/LineItemContext")),Parent_1=tslib_1.__importDefault(require("../utils/Parent"));function LineItemQuantity(props){var _a;const{max=50,readonly=!1,hasExternalPrice}=props,p=tslib_1.__rest(props,["max","readonly","hasExternalPrice"]),{lineItem}=(0,react_1.useContext)(LineItemChildrenContext_1.default),{updateLineItem}=(0,react_1.useContext)(LineItemContext_1.default),options=[];for(let i=1;i<=max;i++)options.push((0,jsx_runtime_1.jsx)("option",{value:`${i}`,children:i},i));const handleChange=e=>{const quantity2=Number(e.target.value);updateLineItem&&lineItem&&updateLineItem(lineItem.id,quantity2,hasExternalPrice)},quantity=lineItem?.quantity,parentProps=Object.assign({handleChange,quantity,lineItem},props);return props.children?(0,jsx_runtime_1.jsx)(Parent_1.default,Object.assign({},parentProps,{children:props.children})):readonly?(0,jsx_runtime_1.jsx)("span",Object.assign({},p,{children:quantity})):(0,jsx_runtime_1.jsx)("select",Object.assign({"data-testid":lineItem?.sku_code,title:(_a=lineItem?.name)!==null&&_a!==void 0?_a:"",value:quantity,onChange:handleChange},p,{children:options}))}exports.LineItemQuantity=LineItemQuantity,exports.default=LineItemQuantity;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LineItemsContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),LineItemReducer_1=tslib_1.__importStar(require("../../reducers/LineItemReducer")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),LineItemContext_1=tslib_1.__importDefault(require("../../context/LineItemContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext"));function LineItemsContainer(props){const{children,loader="Loading..."}=props,{order,addResourceToInclude,include,orderId,getOrder,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),config=(0,react_1.useContext)(CommerceLayerContext_1.default),[state,dispatch]=(0,react_1.useReducer)(LineItemReducer_1.default,LineItemReducer_1.lineItemInitialState);(0,react_1.useEffect)(()=>{include?.includes("line_items.line_item_options.sku_option")?includeLoaded?.["line_items.line_item_options.sku_option"]||addResourceToInclude({newResourceLoaded:{"line_items.line_item_options.sku_option":!0}}):addResourceToInclude({newResource:["line_items.line_item_options.sku_option"]}),include?.includes("line_items.item")?includeLoaded?.["line_items.item"]||addResourceToInclude({newResourceLoaded:{"line_items.item":!0}}):addResourceToInclude({newResource:["line_items.item"]})},[include,includeLoaded]),(0,react_1.useEffect)(()=>{order?.line_items&&dispatch({type:"setLineItems",payload:{lineItems:order.line_items}})},[order?.line_items]);const lineItemValue=Object.assign(Object.assign({},state),{loader,updateLineItem:(lineItemId,quantity=1)=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield(0,LineItemReducer_1.updateLineItem)({lineItemId,quantity,dispatch,config,getOrder,orderId,errors:state.errors})}),deleteLineItem:lineItemId=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield(0,LineItemReducer_1.deleteLineItem)({lineItemId,dispatch,config,getOrder,orderId,errors:state.errors})})});return(0,jsx_runtime_1.jsx)(LineItemContext_1.default.Provider,{value:lineItemValue,children:state.loading?loader:children})}exports.LineItemsContainer=LineItemsContainer,exports.default=LineItemsContainer;
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.LineItemsContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),LineItemReducer_1=tslib_1.__importStar(require("../../reducers/LineItemReducer")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),LineItemContext_1=tslib_1.__importDefault(require("../../context/LineItemContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext"));function LineItemsContainer(props){const{children,loader="Loading..."}=props,{order,addResourceToInclude,include,orderId,getOrder,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),config=(0,react_1.useContext)(CommerceLayerContext_1.default),[state,dispatch]=(0,react_1.useReducer)(LineItemReducer_1.default,LineItemReducer_1.lineItemInitialState);(0,react_1.useEffect)(()=>{include?.includes("line_items.line_item_options.sku_option")?includeLoaded?.["line_items.line_item_options.sku_option"]||addResourceToInclude({newResourceLoaded:{"line_items.line_item_options.sku_option":!0}}):addResourceToInclude({newResource:["line_items.line_item_options.sku_option"]}),include?.includes("line_items.item")?includeLoaded?.["line_items.item"]||addResourceToInclude({newResourceLoaded:{"line_items.item":!0}}):addResourceToInclude({newResource:["line_items.item"]})},[include,includeLoaded]),(0,react_1.useEffect)(()=>{order?.line_items&&dispatch({type:"setLineItems",payload:{lineItems:order.line_items}})},[order?.line_items]);const lineItemValue=Object.assign(Object.assign({},state),{loader,updateLineItem:(lineItemId,quantity=1,hasExternalPrice)=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield(0,LineItemReducer_1.updateLineItem)({lineItemId,quantity,hasExternalPrice,dispatch,config,getOrder,orderId,errors:state.errors})}),deleteLineItem:lineItemId=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield(0,LineItemReducer_1.deleteLineItem)({lineItemId,dispatch,config,getOrder,orderId,errors:state.errors})})});return(0,jsx_runtime_1.jsx)(LineItemContext_1.default.Provider,{value:lineItemValue,children:state.loading?loader:children})}exports.LineItemsContainer=LineItemsContainer,exports.default=LineItemsContainer;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HostedCart=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),OrderStorageContext_1=tslib_1.__importDefault(require("../../context/OrderStorageContext")),getApplicationLink_1=require("../../utils/getApplicationLink"),getDomain_1=require("../../utils/getDomain"),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext")),react_1=require("react"),iframe_resizer_1=require("iframe-resizer"),events_1=require("../../utils/events"),defaultIframeStyle={width:"1px",minWidth:"100%",minHeight:"100%",border:"none"},defaultContainerStyle={position:"fixed",top:"0",right:"-25rem",height:"100%",width:"23rem",transition:"right 0.5s ease-in-out",
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.HostedCart=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),OrderStorageContext_1=tslib_1.__importDefault(require("../../context/OrderStorageContext")),getApplicationLink_1=require("../../utils/getApplicationLink"),getDomain_1=require("../../utils/getDomain"),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext")),react_1=require("react"),iframe_resizer_1=require("iframe-resizer"),events_1=require("../../utils/events"),defaultIframeStyle={width:"1px",minWidth:"100%",minHeight:"100%",border:"none"},defaultContainerStyle={position:"fixed",top:"0",right:"-25rem",height:"100%",width:"23rem",transition:"right 0.5s ease-in-out",pointerEvents:"none",overflow:"auto"},defaultBackgroundStyle={opacity:"0",position:"fixed",top:"0",left:"0",height:"100%",width:"100vw",transition:"opacity 0.5s ease-in-out",pointerEvents:"none",backgroundColor:"black"},defaultIconStyle={width:"1.25rem",height:"1.25rem"},defaultIconContainer={textAlign:"left",paddingLeft:"20px",paddingTop:"20px",background:"#ffffff",color:"#686E6E"},defaultStyle={cart:defaultIframeStyle,container:defaultContainerStyle,background:defaultBackgroundStyle,icon:defaultIconStyle,iconContainer:defaultIconContainer};function HostedCart(_a){var _b,_c,_d,_e,{type,openAdd=!1,style,open=!1,handleOpen,customDomain}=_a,props=tslib_1.__rest(_a,["type","openAdd","style","open","handleOpen","customDomain"]);const[isOpen,setOpen]=(0,react_1.useState)(!1),ref=(0,react_1.useRef)(null),{accessToken,endpoint}=(0,useCustomContext_1.default)({context:CommerceLayerContext_1.default,contextComponentName:"CommerceLayer",currentComponentName:"HostedCart",key:"accessToken"}),[src,setSrc]=(0,react_1.useState)();if(accessToken==null||endpoint==null)return null;const{order,createOrder,getOrder}=(0,react_1.useContext)(OrderContext_1.default),{persistKey}=(0,react_1.useContext)(OrderStorageContext_1.default),{domain,slug}=(0,getDomain_1.getDomain)(endpoint);function setOrder(openCart){var _a2;return tslib_1.__awaiter(this,void 0,void 0,function*(){const orderId=(_a2=localStorage.getItem(persistKey))!==null&&_a2!==void 0?_a2:yield createOrder({});orderId!=null&&accessToken&&(setSrc((0,getApplicationLink_1.getApplicationLink)({slug,orderId,accessToken,domain,applicationType:"cart",customDomain})),openCart&&setTimeout(()=>{handleOpen!=null?handleOpen():setOpen(!0)},300))})}function onMessage(data){var _a2;switch(data.message.type){case"update":data.message.payload!=null&&getOrder(data.message.payload.id);break;case"close":type==="mini"&&(handleOpen!=null?handleOpen():setOpen(!1));break;case"blur":type==="mini"&&isOpen&&((_a2=ref.current)===null||_a2===void 0||_a2.focus());break}}(0,react_1.useEffect)(()=>{var _a2;const orderId=localStorage.getItem(persistKey);let ignore=!1;return open!=null&&open!==isOpen&&setOpen(open),openAdd&&type==="mini"&&(0,events_1.subscribe)("open-cart",()=>{window.document.body.style.overflow="hidden",src==null&&order?.id==null&&orderId==null?setOrder(!0):(src!=null&&ref.current!=null&&(ref.current.src=src),setTimeout(()=>{handleOpen!=null?handleOpen():setOpen(!0)},300))}),src==null&&order?.id==null&&orderId==null&&accessToken!=null&&!ignore&&isOpen?setOrder():src==null&&(order?.id!=null||orderId!=null)&&accessToken&&setSrc((0,getApplicationLink_1.getApplicationLink)({slug,orderId:(_a2=order?.id)!==null&&_a2!==void 0?_a2:orderId,accessToken,domain,applicationType:"cart"})),src!=null&&ref.current!=null&&(ref.current.src=src),()=>{ignore=!0,openAdd&&type==="mini"&&(0,events_1.unsubscribe)("open-cart",()=>{})}},[src,open,order?.id,accessToken]),(0,react_1.useEffect)(()=>{ref.current!=null&&(0,iframe_resizer_1.iframeResizer)({checkOrigin:!1,bodyPadding:"20px",onMessage},ref.current)},[ref.current!=null]);function onCloseCart(){window.document.body.style.removeProperty("overflow"),handleOpen!=null?handleOpen():setOpen(!1)}return src==null?null:type==="mini"?(0,jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment,{children:[(0,jsx_runtime_1.jsx)("div",{"aria-hidden":"true",style:Object.assign(Object.assign(Object.assign({},defaultStyle.background),style?.background),{opacity:isOpen?"0.5":(_b=defaultStyle.background)===null||_b===void 0?void 0:_b.opacity,pointerEvents:isOpen?"initial":(_c=defaultStyle.background)===null||_c===void 0?void 0:_c.pointerEvents}),onClick:onCloseCart}),(0,jsx_runtime_1.jsxs)("div",Object.assign({style:Object.assign(Object.assign(Object.assign({},defaultStyle.container),style?.container),{right:isOpen?"0":(_d=defaultStyle.container)===null||_d===void 0?void 0:_d.right,pointerEvents:isOpen?"initial":(_e=defaultStyle.container)===null||_e===void 0?void 0:_e.pointerEvents})},props,{children:[(0,jsx_runtime_1.jsx)("div",{style:Object.assign(Object.assign({},defaultStyle.iconContainer),style?.iconContainer),children:(0,jsx_runtime_1.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",style:Object.assign(Object.assign({},defaultStyle.icon),style?.icon),onClick:onCloseCart,children:(0,jsx_runtime_1.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M6 18L18 6M6 6l12 12"})})}),(0,jsx_runtime_1.jsx)("iframe",{title:"Cart",ref,style:Object.assign(Object.assign({},defaultStyle.cart),style?.cart),src,width:"100%",height:"100%"})]}))]}):(0,jsx_runtime_1.jsx)("iframe",{title:"Cart",ref,style:Object.assign(Object.assign({},defaultStyle.cart),style?.cart),src,width:"100%",height:"100%"})}exports.HostedCart=HostedCart;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway"));function PaymentGateway(_a){var _b,{readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading..."}=_a,p=tslib_1.__rest(_a,["readonly","showCard","handleEditClick","children","templateCustomerCards","templateCustomerSaveToWallet","onClickCustomerCards","show","loader"]);const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{var _a2;if(payment?.id===currentPaymentMethodId&&paymentResource&&((_a2=order?.payment_method)===null||_a2===void 0?void 0:_a2.payment_source_type)===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()});(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&setLoading(!1),()=>{setLoading(!0)}},[(_b=order?.payment_method)===null||_b===void 0?void 0:_b.id,show,paymentSource]);const gatewayConfig=Object.assign({readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet},p);switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,Object.assign({},gatewayConfig,{children}));case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,Object.assign({},gatewayConfig,{children}));case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,Object.assign({},gatewayConfig,{children}));case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,Object.assign({},gatewayConfig,{children}));case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,Object.assign({},gatewayConfig,{children}));case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,Object.assign({},gatewayConfig,{children}));default:return null}}exports.PaymentGateway=PaymentGateway,exports.default=PaymentGateway;
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway"));function PaymentGateway(_a){var _b,{readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading..."}=_a,p=tslib_1.__rest(_a,["readonly","showCard","handleEditClick","children","templateCustomerCards","templateCustomerSaveToWallet","onClickCustomerCards","show","loader"]);const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{var _a2;if(payment?.id===currentPaymentMethodId&&paymentResource&&((_a2=order?.payment_method)===null||_a2===void 0?void 0:_a2.payment_source_type)===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()});(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&show&&setLoading(!1),()=>{setLoading(!0)}},[(_b=order?.payment_method)===null||_b===void 0?void 0:_b.id,show,paymentSource]);const gatewayConfig=Object.assign({readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet},p);switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,Object.assign({},gatewayConfig,{children}));case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,Object.assign({},gatewayConfig,{children}));case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,Object.assign({},gatewayConfig,{children}));case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,Object.assign({},gatewayConfig,{children}));case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,Object.assign({},gatewayConfig,{children}));case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,Object.assign({},gatewayConfig,{children}));default:return null}}exports.PaymentGateway=PaymentGateway,exports.default=PaymentGateway;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSource=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),PaymentGateway_1=tslib_1.__importDefault(require("../payment_gateways/PaymentGateway")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext"));function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{payments}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,paymentSource,destroyPaymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),[show,setShow]=(0,react_1.useState)(!1),[showCard,setShowCard]=(0,react_1.useState)(!1);(0,react_1.useEffect)(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId?(setShow(!0),(0,getCardDetails_1.default)({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!expressPayments),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order]);const handleEditClick=e=>tslib_1.__awaiter(this,void 0,void 0,function*(){if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;yield destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)}),gatewayProps=Object.assign(Object.assign({},props),{show,showCard,handleEditClick,readonly});return(0,jsx_runtime_1.jsx)(PaymentGateway_1.default,Object.assign({},gatewayProps))}exports.PaymentSource=PaymentSource,exports.default=PaymentSource;
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSource=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),PaymentGateway_1=tslib_1.__importDefault(require("../payment_gateways/PaymentGateway")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext"));function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{payments}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,paymentSource,destroyPaymentSource,currentPaymentMethodType}=(0,react_1.useContext)(PaymentMethodContext_1.default),[show,setShow]=(0,react_1.useState)(!1),[showCard,setShowCard]=(0,react_1.useState)(!1);(0,react_1.useEffect)(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId&&!expressPayments?(setShow(!0),(0,getCardDetails_1.default)({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!(expressPayments&¤tPaymentMethodType==="stripe_payments")),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order,expressPayments]);const handleEditClick=e=>tslib_1.__awaiter(this,void 0,void 0,function*(){if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;yield destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)}),gatewayProps=Object.assign(Object.assign({},props),{show,showCard,handleEditClick,readonly});return(0,jsx_runtime_1.jsx)(PaymentGateway_1.default,Object.assign({},gatewayProps))}exports.PaymentSource=PaymentSource,exports.default=PaymentSource;
|
|
@@ -7,6 +7,7 @@ import { type Order, type LineItem } from '@commercelayer/sdk';
|
|
|
7
7
|
export interface UpdateLineItemParams {
|
|
8
8
|
lineItemId: string;
|
|
9
9
|
quantity?: number;
|
|
10
|
+
hasExternalPrice?: boolean;
|
|
10
11
|
dispatch: Dispatch<LineItemAction>;
|
|
11
12
|
config: CommerceLayerConfig;
|
|
12
13
|
getOrder: getOrderContext | undefined;
|
|
@@ -30,7 +31,7 @@ export interface LineItemPayload {
|
|
|
30
31
|
errors?: BaseError[];
|
|
31
32
|
}
|
|
32
33
|
export interface LineItemState extends LineItemPayload {
|
|
33
|
-
updateLineItem?: (lineItemId: string, quantity?: number) => Promise<void>;
|
|
34
|
+
updateLineItem?: (lineItemId: string, quantity?: number, hasExternalPrice?: boolean) => Promise<void>;
|
|
34
35
|
deleteLineItem?: (lineItemId: string) => Promise<void>;
|
|
35
36
|
}
|
|
36
37
|
export interface LineItemAction {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lineItemInitialState=exports.deleteLineItem=exports.updateLineItem=exports.getLineItems=void 0;const tslib_1=require("tslib"),baseReducer_1=tslib_1.__importDefault(require("../utils/baseReducer")),getSdk_1=tslib_1.__importDefault(require("../utils/getSdk")),getErrors_1=tslib_1.__importDefault(require("../utils/getErrors")),getLineItems=params=>{const{order,dispatch,config}=params,sdk=(0,getSdk_1.default)(config);let allLineItems=[];order&&sdk.orders.retrieve(order?.id,{include:["line_items","line_items.line_item_options.sku_option"],fields:{orders:["line_items"]}}).then(response=>{dispatch({type:"setLoading",payload:{loading:!1}});const items=response.line_items||[];allLineItems=[...allLineItems,...items],dispatch({type:"setLineItems",payload:{lineItems:allLineItems}})}).catch(error=>{const errors=(0,getErrors_1.default)({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})})};exports.getLineItems=getLineItems;function updateLineItem(params){return tslib_1.__awaiter(this,void 0,void 0,function*(){const{config,lineItemId,quantity,getOrder,orderId,dispatch}=params,sdk=(0,getSdk_1.default)(config);try{yield sdk.line_items.update({id:lineItemId,quantity}),getOrder&&(yield getOrder(orderId)),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=(0,getErrors_1.default)({error,resource:"line_items",attributes:{id:lineItemId}});dispatch({type:"setErrors",payload:{errors}})}})}exports.updateLineItem=updateLineItem;const deleteLineItem=params=>tslib_1.__awaiter(void 0,void 0,void 0,function*(){const{config,lineItemId,getOrder,orderId,dispatch}=params,sdk=(0,getSdk_1.default)(config);try{yield sdk.line_items.delete(lineItemId),getOrder&&(yield getOrder(orderId)),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=(0,getErrors_1.default)({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})}});exports.deleteLineItem=deleteLineItem,exports.lineItemInitialState={loading:!1,errors:[]};const actionType=["setLineItems","setErrors","setLoading"],lineItemReducer=(state,reducer)=>(0,baseReducer_1.default)(state,reducer,actionType);exports.default=lineItemReducer;
|
|
2
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lineItemInitialState=exports.deleteLineItem=exports.updateLineItem=exports.getLineItems=void 0;const tslib_1=require("tslib"),baseReducer_1=tslib_1.__importDefault(require("../utils/baseReducer")),getSdk_1=tslib_1.__importDefault(require("../utils/getSdk")),getErrors_1=tslib_1.__importDefault(require("../utils/getErrors")),getLineItems=params=>{const{order,dispatch,config}=params,sdk=(0,getSdk_1.default)(config);let allLineItems=[];order&&sdk.orders.retrieve(order?.id,{include:["line_items","line_items.line_item_options.sku_option"],fields:{orders:["line_items"]}}).then(response=>{dispatch({type:"setLoading",payload:{loading:!1}});const items=response.line_items||[];allLineItems=[...allLineItems,...items],dispatch({type:"setLineItems",payload:{lineItems:allLineItems}})}).catch(error=>{const errors=(0,getErrors_1.default)({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})})};exports.getLineItems=getLineItems;function updateLineItem(params){return tslib_1.__awaiter(this,void 0,void 0,function*(){const{config,lineItemId,quantity,hasExternalPrice,getOrder,orderId,dispatch}=params,sdk=(0,getSdk_1.default)(config);try{yield sdk.line_items.update({id:lineItemId,quantity,_external_price:hasExternalPrice}),getOrder&&(yield getOrder(orderId)),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=(0,getErrors_1.default)({error,resource:"line_items",attributes:{id:lineItemId}});dispatch({type:"setErrors",payload:{errors}})}})}exports.updateLineItem=updateLineItem;const deleteLineItem=params=>tslib_1.__awaiter(void 0,void 0,void 0,function*(){const{config,lineItemId,getOrder,orderId,dispatch}=params,sdk=(0,getSdk_1.default)(config);try{yield sdk.line_items.delete(lineItemId),getOrder&&(yield getOrder(orderId)),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=(0,getErrors_1.default)({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})}});exports.deleteLineItem=deleteLineItem,exports.lineItemInitialState={loading:!1,errors:[]};const actionType=["setLineItems","setErrors","setLoading"],lineItemReducer=(state,reducer)=>(0,baseReducer_1.default)(state,reducer,actionType);exports.default=lineItemReducer;
|
|
@@ -11,6 +11,11 @@ type Props = {
|
|
|
11
11
|
max?: number;
|
|
12
12
|
disabled?: boolean;
|
|
13
13
|
readonly?: boolean;
|
|
14
|
+
/**
|
|
15
|
+
* force the update of the line item price using `_external_price: true` attribute
|
|
16
|
+
* @link https://docs.commercelayer.io/core/external-resources/external-prices
|
|
17
|
+
*/
|
|
18
|
+
hasExternalPrice?: boolean;
|
|
14
19
|
} & (Omit<JSX.IntrinsicElements['select'], 'children'> & Omit<JSX.IntrinsicElements['span'], 'children'>);
|
|
15
20
|
export declare function LineItemQuantity(props: Props): JSX.Element;
|
|
16
21
|
export default LineItemQuantity;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import LineItemChildrenContext from"../../context/LineItemChildrenContext";import LineItemContext from"../../context/LineItemContext";import Parent from"../utils/Parent";export function LineItemQuantity(props){const{max=50,readonly=!1,...p}=props,{lineItem}=useContext(LineItemChildrenContext),{updateLineItem}=useContext(LineItemContext),options=[];for(let i=1;i<=max;i++)options.push(_jsx("option",{value:`${i}`,children:i},i));const handleChange=e=>{const quantity2=Number(e.target.value);updateLineItem&&lineItem&&updateLineItem(lineItem.id,quantity2)},quantity=lineItem?.quantity,parentProps={handleChange,quantity,lineItem,...props};return props.children?_jsx(Parent,{...parentProps,children:props.children}):readonly?_jsx("span",{...p,children:quantity}):_jsx("select",{"data-testid":lineItem?.sku_code,title:lineItem?.name??"",value:quantity,onChange:handleChange,...p,children:options})}export default LineItemQuantity;
|
|
2
|
+
import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import LineItemChildrenContext from"../../context/LineItemChildrenContext";import LineItemContext from"../../context/LineItemContext";import Parent from"../utils/Parent";export function LineItemQuantity(props){const{max=50,readonly=!1,hasExternalPrice,...p}=props,{lineItem}=useContext(LineItemChildrenContext),{updateLineItem}=useContext(LineItemContext),options=[];for(let i=1;i<=max;i++)options.push(_jsx("option",{value:`${i}`,children:i},i));const handleChange=e=>{const quantity2=Number(e.target.value);updateLineItem&&lineItem&&updateLineItem(lineItem.id,quantity2,hasExternalPrice)},quantity=lineItem?.quantity,parentProps={handleChange,quantity,lineItem,...props};return props.children?_jsx(Parent,{...parentProps,children:props.children}):readonly?_jsx("span",{...p,children:quantity}):_jsx("select",{"data-testid":lineItem?.sku_code,title:lineItem?.name??"",value:quantity,onChange:handleChange,...p,children:options})}export default LineItemQuantity;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as _jsx}from"react/jsx-runtime";import{useEffect,useReducer,useContext}from"react";import lineItemReducer,{lineItemInitialState,updateLineItem,deleteLineItem}from"../../reducers/LineItemReducer";import OrderContext from"../../context/OrderContext";import LineItemContext from"../../context/LineItemContext";import CommerceLayerContext from"../../context/CommerceLayerContext";export function LineItemsContainer(props){const{children,loader="Loading..."}=props,{order,addResourceToInclude,include,orderId,getOrder,includeLoaded}=useContext(OrderContext),config=useContext(CommerceLayerContext),[state,dispatch]=useReducer(lineItemReducer,lineItemInitialState);useEffect(()=>{include?.includes("line_items.line_item_options.sku_option")?includeLoaded?.["line_items.line_item_options.sku_option"]||addResourceToInclude({newResourceLoaded:{"line_items.line_item_options.sku_option":!0}}):addResourceToInclude({newResource:["line_items.line_item_options.sku_option"]}),include?.includes("line_items.item")?includeLoaded?.["line_items.item"]||addResourceToInclude({newResourceLoaded:{"line_items.item":!0}}):addResourceToInclude({newResource:["line_items.item"]})},[include,includeLoaded]),useEffect(()=>{order?.line_items&&dispatch({type:"setLineItems",payload:{lineItems:order.line_items}})},[order?.line_items]);const lineItemValue={...state,loader,updateLineItem:async(lineItemId,quantity=1)=>{await updateLineItem({lineItemId,quantity,dispatch,config,getOrder,orderId,errors:state.errors})},deleteLineItem:async lineItemId=>{await deleteLineItem({lineItemId,dispatch,config,getOrder,orderId,errors:state.errors})}};return _jsx(LineItemContext.Provider,{value:lineItemValue,children:state.loading?loader:children})}export default LineItemsContainer;
|
|
2
|
+
import{jsx as _jsx}from"react/jsx-runtime";import{useEffect,useReducer,useContext}from"react";import lineItemReducer,{lineItemInitialState,updateLineItem,deleteLineItem}from"../../reducers/LineItemReducer";import OrderContext from"../../context/OrderContext";import LineItemContext from"../../context/LineItemContext";import CommerceLayerContext from"../../context/CommerceLayerContext";export function LineItemsContainer(props){const{children,loader="Loading..."}=props,{order,addResourceToInclude,include,orderId,getOrder,includeLoaded}=useContext(OrderContext),config=useContext(CommerceLayerContext),[state,dispatch]=useReducer(lineItemReducer,lineItemInitialState);useEffect(()=>{include?.includes("line_items.line_item_options.sku_option")?includeLoaded?.["line_items.line_item_options.sku_option"]||addResourceToInclude({newResourceLoaded:{"line_items.line_item_options.sku_option":!0}}):addResourceToInclude({newResource:["line_items.line_item_options.sku_option"]}),include?.includes("line_items.item")?includeLoaded?.["line_items.item"]||addResourceToInclude({newResourceLoaded:{"line_items.item":!0}}):addResourceToInclude({newResource:["line_items.item"]})},[include,includeLoaded]),useEffect(()=>{order?.line_items&&dispatch({type:"setLineItems",payload:{lineItems:order.line_items}})},[order?.line_items]);const lineItemValue={...state,loader,updateLineItem:async(lineItemId,quantity=1,hasExternalPrice)=>{await updateLineItem({lineItemId,quantity,hasExternalPrice,dispatch,config,getOrder,orderId,errors:state.errors})},deleteLineItem:async lineItemId=>{await deleteLineItem({lineItemId,dispatch,config,getOrder,orderId,errors:state.errors})}};return _jsx(LineItemContext.Provider,{value:lineItemValue,children:state.loading?loader:children})}export default LineItemsContainer;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";import CommerceLayerContext from"../../context/CommerceLayerContext";import OrderContext from"../../context/OrderContext";import OrderStorageContext from"../../context/OrderStorageContext";import{getApplicationLink}from"../../utils/getApplicationLink";import{getDomain}from"../../utils/getDomain";import useCustomContext from"../../utils/hooks/useCustomContext";import{useContext,useEffect,useState,useRef}from"react";import{iframeResizer}from"iframe-resizer";import{subscribe,unsubscribe}from"../../utils/events";const defaultIframeStyle={width:"1px",minWidth:"100%",minHeight:"100%",border:"none"},defaultContainerStyle={position:"fixed",top:"0",right:"-25rem",height:"100%",width:"23rem",transition:"right 0.5s ease-in-out",
|
|
2
|
+
import{jsx as _jsx,jsxs as _jsxs,Fragment as _Fragment}from"react/jsx-runtime";import CommerceLayerContext from"../../context/CommerceLayerContext";import OrderContext from"../../context/OrderContext";import OrderStorageContext from"../../context/OrderStorageContext";import{getApplicationLink}from"../../utils/getApplicationLink";import{getDomain}from"../../utils/getDomain";import useCustomContext from"../../utils/hooks/useCustomContext";import{useContext,useEffect,useState,useRef}from"react";import{iframeResizer}from"iframe-resizer";import{subscribe,unsubscribe}from"../../utils/events";const defaultIframeStyle={width:"1px",minWidth:"100%",minHeight:"100%",border:"none"},defaultContainerStyle={position:"fixed",top:"0",right:"-25rem",height:"100%",width:"23rem",transition:"right 0.5s ease-in-out",pointerEvents:"none",overflow:"auto"},defaultBackgroundStyle={opacity:"0",position:"fixed",top:"0",left:"0",height:"100%",width:"100vw",transition:"opacity 0.5s ease-in-out",pointerEvents:"none",backgroundColor:"black"},defaultIconStyle={width:"1.25rem",height:"1.25rem"},defaultIconContainer={textAlign:"left",paddingLeft:"20px",paddingTop:"20px",background:"#ffffff",color:"#686E6E"},defaultStyle={cart:defaultIframeStyle,container:defaultContainerStyle,background:defaultBackgroundStyle,icon:defaultIconStyle,iconContainer:defaultIconContainer};export function HostedCart({type,openAdd=!1,style,open=!1,handleOpen,customDomain,...props}){const[isOpen,setOpen]=useState(!1),ref=useRef(null),{accessToken,endpoint}=useCustomContext({context:CommerceLayerContext,contextComponentName:"CommerceLayer",currentComponentName:"HostedCart",key:"accessToken"}),[src,setSrc]=useState();if(accessToken==null||endpoint==null)return null;const{order,createOrder,getOrder}=useContext(OrderContext),{persistKey}=useContext(OrderStorageContext),{domain,slug}=getDomain(endpoint);async function setOrder(openCart){const orderId=localStorage.getItem(persistKey)??await createOrder({});orderId!=null&&accessToken&&(setSrc(getApplicationLink({slug,orderId,accessToken,domain,applicationType:"cart",customDomain})),openCart&&setTimeout(()=>{handleOpen!=null?handleOpen():setOpen(!0)},300))}function onMessage(data){switch(data.message.type){case"update":data.message.payload!=null&&getOrder(data.message.payload.id);break;case"close":type==="mini"&&(handleOpen!=null?handleOpen():setOpen(!1));break;case"blur":type==="mini"&&isOpen&&ref.current?.focus();break}}useEffect(()=>{const orderId=localStorage.getItem(persistKey);let ignore=!1;return open!=null&&open!==isOpen&&setOpen(open),openAdd&&type==="mini"&&subscribe("open-cart",()=>{window.document.body.style.overflow="hidden",src==null&&order?.id==null&&orderId==null?setOrder(!0):(src!=null&&ref.current!=null&&(ref.current.src=src),setTimeout(()=>{handleOpen!=null?handleOpen():setOpen(!0)},300))}),src==null&&order?.id==null&&orderId==null&&accessToken!=null&&!ignore&&isOpen?setOrder():src==null&&(order?.id!=null||orderId!=null)&&accessToken&&setSrc(getApplicationLink({slug,orderId:order?.id??orderId,accessToken,domain,applicationType:"cart"})),src!=null&&ref.current!=null&&(ref.current.src=src),()=>{ignore=!0,openAdd&&type==="mini"&&unsubscribe("open-cart",()=>{})}},[src,open,order?.id,accessToken]),useEffect(()=>{ref.current!=null&&iframeResizer({checkOrigin:!1,bodyPadding:"20px",onMessage},ref.current)},[ref.current!=null]);function onCloseCart(){window.document.body.style.removeProperty("overflow"),handleOpen!=null?handleOpen():setOpen(!1)}return src==null?null:type==="mini"?_jsxs(_Fragment,{children:[_jsx("div",{"aria-hidden":"true",style:{...defaultStyle.background,...style?.background,opacity:isOpen?"0.5":defaultStyle.background?.opacity,pointerEvents:isOpen?"initial":defaultStyle.background?.pointerEvents},onClick:onCloseCart}),_jsxs("div",{style:{...defaultStyle.container,...style?.container,right:isOpen?"0":defaultStyle.container?.right,pointerEvents:isOpen?"initial":defaultStyle.container?.pointerEvents},...props,children:[_jsx("div",{style:{...defaultStyle.iconContainer,...style?.iconContainer},children:_jsx("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24",strokeWidth:1.5,stroke:"currentColor",style:{...defaultStyle.icon,...style?.icon},onClick:onCloseCart,children:_jsx("path",{strokeLinecap:"round",strokeLinejoin:"round",d:"M6 18L18 6M6 6l12 12"})})}),_jsx("iframe",{title:"Cart",ref,style:{...defaultStyle.cart,...style?.cart},src,width:"100%",height:"100%"})]})]}):_jsx("iframe",{title:"Cart",ref,style:{...defaultStyle.cart,...style?.cart},src,width:"100%",height:"100%"})}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as _jsx}from"react/jsx-runtime";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import{useContext,useEffect,useState}from"react";import getLoaderComponent from"../../utils/getLoaderComponent";import AdyenGateway from"./AdyenGateway";import StripeGateway from"./StripeGateway";import BraintreeGateway from"./BraintreeGateway";import PaypalGateway from"./PaypalGateway";import WireTransferGateway from"./WireTransferGateway";import CustomerContext from"../../context/CustomerContext";import CheckoutComGateway from"./CheckoutComGateway";import KlarnaGateway from"./KlarnaGateway";import{getExternalPaymentAttributes,getPaypalAttributes,getStripeAttributes}from"../../utils/getPaymentAttributes";import ExternalGateway from"./ExternalGateway";export function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=getLoaderComponent(loader),[loading,setLoading]=useState(!0),{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=useContext(PaymentMethodContext),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;useEffect(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=getStripeAttributes(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=async()=>{await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&setLoading(!1),()=>{setLoading(!0)}},[order?.payment_method?.id,show,paymentSource]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};switch(paymentResource){case"adyen_payments":return _jsx(AdyenGateway,{...gatewayConfig,children});case"braintree_payments":return _jsx(BraintreeGateway,{...gatewayConfig,children});case"checkout_com_payments":return _jsx(CheckoutComGateway,{...gatewayConfig,children});case"external_payments":return _jsx(ExternalGateway,{...gatewayConfig,children});case"klarna_payments":return _jsx(KlarnaGateway,{...gatewayConfig,children});case"stripe_payments":return _jsx(StripeGateway,{...gatewayConfig,children});case"wire_transfers":return _jsx(WireTransferGateway,{...gatewayConfig,children});case"paypal_payments":return _jsx(PaypalGateway,{...gatewayConfig,children});default:return null}}export default PaymentGateway;
|
|
2
|
+
import{jsx as _jsx}from"react/jsx-runtime";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import{useContext,useEffect,useState}from"react";import getLoaderComponent from"../../utils/getLoaderComponent";import AdyenGateway from"./AdyenGateway";import StripeGateway from"./StripeGateway";import BraintreeGateway from"./BraintreeGateway";import PaypalGateway from"./PaypalGateway";import WireTransferGateway from"./WireTransferGateway";import CustomerContext from"../../context/CustomerContext";import CheckoutComGateway from"./CheckoutComGateway";import KlarnaGateway from"./KlarnaGateway";import{getExternalPaymentAttributes,getPaypalAttributes,getStripeAttributes}from"../../utils/getPaymentAttributes";import ExternalGateway from"./ExternalGateway";export function PaymentGateway({readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading...",...p}){const loaderComponent=getLoaderComponent(loader),[loading,setLoading]=useState(!0),{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=useContext(PaymentMethodContext),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;useEffect(()=>{if(payment?.id===currentPaymentMethodId&&paymentResource&&order?.payment_method?.payment_source_type===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=getStripeAttributes(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=async()=>{await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&show&&setLoading(!1),()=>{setLoading(!0)}},[order?.payment_method?.id,show,paymentSource]);const gatewayConfig={readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet,...p};switch(paymentResource){case"adyen_payments":return _jsx(AdyenGateway,{...gatewayConfig,children});case"braintree_payments":return _jsx(BraintreeGateway,{...gatewayConfig,children});case"checkout_com_payments":return _jsx(CheckoutComGateway,{...gatewayConfig,children});case"external_payments":return _jsx(ExternalGateway,{...gatewayConfig,children});case"klarna_payments":return _jsx(KlarnaGateway,{...gatewayConfig,children});case"stripe_payments":return _jsx(StripeGateway,{...gatewayConfig,children});case"wire_transfers":return _jsx(WireTransferGateway,{...gatewayConfig,children});case"paypal_payments":return _jsx(PaypalGateway,{...gatewayConfig,children});default:return null}}export default PaymentGateway;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useState,useEffect}from"react";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import CustomerContext from"../../context/CustomerContext";import PaymentGateway from"../payment_gateways/PaymentGateway";import getCardDetails from"../../utils/getCardDetails";import OrderContext from"../../context/OrderContext";export function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{payments}=useContext(CustomerContext),{currentPaymentMethodId,paymentSource,destroyPaymentSource}=useContext(PaymentMethodContext),[show,setShow]=useState(!1),[showCard,setShowCard]=useState(!1);useEffect(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId?(setShow(!0),getCardDetails({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!expressPayments),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order]);const gatewayProps={...props,show,showCard,handleEditClick:async e=>{if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;await destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)},readonly};return _jsx(PaymentGateway,{...gatewayProps})}export default PaymentSource;
|
|
2
|
+
import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useState,useEffect}from"react";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import CustomerContext from"../../context/CustomerContext";import PaymentGateway from"../payment_gateways/PaymentGateway";import getCardDetails from"../../utils/getCardDetails";import OrderContext from"../../context/OrderContext";export function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=useContext(PaymentMethodChildrenContext),{order}=useContext(OrderContext),{payments}=useContext(CustomerContext),{currentPaymentMethodId,paymentSource,destroyPaymentSource,currentPaymentMethodType}=useContext(PaymentMethodContext),[show,setShow]=useState(!1),[showCard,setShowCard]=useState(!1);useEffect(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId&&!expressPayments?(setShow(!0),getCardDetails({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!(expressPayments&¤tPaymentMethodType==="stripe_payments")),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order,expressPayments]);const gatewayProps={...props,show,showCard,handleEditClick:async e=>{if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;await destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)},readonly};return _jsx(PaymentGateway,{...gatewayProps})}export default PaymentSource;
|
|
@@ -7,6 +7,7 @@ import { type Order, type LineItem } from '@commercelayer/sdk';
|
|
|
7
7
|
export interface UpdateLineItemParams {
|
|
8
8
|
lineItemId: string;
|
|
9
9
|
quantity?: number;
|
|
10
|
+
hasExternalPrice?: boolean;
|
|
10
11
|
dispatch: Dispatch<LineItemAction>;
|
|
11
12
|
config: CommerceLayerConfig;
|
|
12
13
|
getOrder: getOrderContext | undefined;
|
|
@@ -30,7 +31,7 @@ export interface LineItemPayload {
|
|
|
30
31
|
errors?: BaseError[];
|
|
31
32
|
}
|
|
32
33
|
export interface LineItemState extends LineItemPayload {
|
|
33
|
-
updateLineItem?: (lineItemId: string, quantity?: number) => Promise<void>;
|
|
34
|
+
updateLineItem?: (lineItemId: string, quantity?: number, hasExternalPrice?: boolean) => Promise<void>;
|
|
34
35
|
deleteLineItem?: (lineItemId: string) => Promise<void>;
|
|
35
36
|
}
|
|
36
37
|
export interface LineItemAction {
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import baseReducer from"../utils/baseReducer";import getSdk from"../utils/getSdk";import getErrors from"../utils/getErrors";export const getLineItems=params=>{const{order,dispatch,config}=params,sdk=getSdk(config);let allLineItems=[];order&&sdk.orders.retrieve(order?.id,{include:["line_items","line_items.line_item_options.sku_option"],fields:{orders:["line_items"]}}).then(response=>{dispatch({type:"setLoading",payload:{loading:!1}});const items=response.line_items||[];allLineItems=[...allLineItems,...items],dispatch({type:"setLineItems",payload:{lineItems:allLineItems}})}).catch(error=>{const errors=getErrors({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})})};export async function updateLineItem(params){const{config,lineItemId,quantity,getOrder,orderId,dispatch}=params,sdk=getSdk(config);try{await sdk.line_items.update({id:lineItemId,quantity}),getOrder&&await getOrder(orderId),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=getErrors({error,resource:"line_items",attributes:{id:lineItemId}});dispatch({type:"setErrors",payload:{errors}})}}export const deleteLineItem=async params=>{const{config,lineItemId,getOrder,orderId,dispatch}=params,sdk=getSdk(config);try{await sdk.line_items.delete(lineItemId),getOrder&&await getOrder(orderId),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=getErrors({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})}},lineItemInitialState={loading:!1,errors:[]};const actionType=["setLineItems","setErrors","setLoading"],lineItemReducer=(state,reducer)=>baseReducer(state,reducer,actionType);export default lineItemReducer;
|
|
2
|
+
import baseReducer from"../utils/baseReducer";import getSdk from"../utils/getSdk";import getErrors from"../utils/getErrors";export const getLineItems=params=>{const{order,dispatch,config}=params,sdk=getSdk(config);let allLineItems=[];order&&sdk.orders.retrieve(order?.id,{include:["line_items","line_items.line_item_options.sku_option"],fields:{orders:["line_items"]}}).then(response=>{dispatch({type:"setLoading",payload:{loading:!1}});const items=response.line_items||[];allLineItems=[...allLineItems,...items],dispatch({type:"setLineItems",payload:{lineItems:allLineItems}})}).catch(error=>{const errors=getErrors({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})})};export async function updateLineItem(params){const{config,lineItemId,quantity,hasExternalPrice,getOrder,orderId,dispatch}=params,sdk=getSdk(config);try{await sdk.line_items.update({id:lineItemId,quantity,_external_price:hasExternalPrice}),getOrder&&await getOrder(orderId),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=getErrors({error,resource:"line_items",attributes:{id:lineItemId}});dispatch({type:"setErrors",payload:{errors}})}}export const deleteLineItem=async params=>{const{config,lineItemId,getOrder,orderId,dispatch}=params,sdk=getSdk(config);try{await sdk.line_items.delete(lineItemId),getOrder&&await getOrder(orderId),dispatch({type:"setErrors",payload:{errors:[]}})}catch(error){const errors=getErrors({error,resource:"line_items"});dispatch({type:"setErrors",payload:{errors}})}},lineItemInitialState={loading:!1,errors:[]};const actionType=["setLineItems","setErrors","setLoading"],lineItemReducer=(state,reducer)=>baseReducer(state,reducer,actionType);export default lineItemReducer;
|