@commercelayer/react-components 4.4.0-beta.2 → 4.4.0-beta.4

package/lib/cjs/utils/expressPaymentHelper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.expressRedirectUrl=exports.setExpressPlaceOrder=exports.setExpressShippingMethod=exports.getExpressShippingMethods=exports.setExpressFakeAddress=exports.getAvailableExpressPayments=void 0;const tslib_1=require("tslib"),getSdk_1=tslib_1.__importDefault(require("./getSdk")),availablePaymentMethods=["stripe_payments"];function getAvailableExpressPayments(paymentMethods){return paymentMethods.filter(payment=>payment.payment_source_type?availablePaymentMethods.includes(payment.payment_source_type):!1)}exports.getAvailableExpressPayments=getAvailableExpressPayments;function setExpressFakeAddress({orderId,config,address,email}){return tslib_1.__awaiter(this,void 0,void 0,function*(){const params={include:["shipments.available_shipping_methods"]},sdk=(0,getSdk_1.default)(config),fakeAddress=yield sdk.addresses.create(address),resource={id:orderId,billing_address:sdk.addresses.relationship(fakeAddress.id),_shipping_address_same_as_billing:!0};return email!=null&&(resource.customer_email=email),yield sdk.orders.update(resource,params),yield sdk.orders.retrieve(orderId,params)})}exports.setExpressFakeAddress=setExpressFakeAddress;function getExpressShippingMethods(order){var _a,_b;const isSingleShipment=((_a=order?.shipments)===null||_a===void 0?void 0:_a.length)===1,shippingMethods=(_b=order?.shipments)===null||_b===void 0?void 0:_b.map(shipment=>shipment.available_shipping_methods);if(isSingleShipment)return shippingMethods==null?null:shippingMethods.flat().map(method=>{var _a2,_b2,_c;return{id:(_a2=method?.id)!==null&&_a2!==void 0?_a2:"",label:(_b2=method?.name)!==null&&_b2!==void 0?_b2:"",amount:(_c=method?.price_amount_for_shipment_cents)!==null&&_c!==void 0?_c:0,detail:""}});{if(shippingMethods==null)return null;const shippingOptionsAmount=[];return shippingMethods.forEach(methods=>{var _a2;if(methods!=null){const[firstMethod]=methods;firstMethod!=null&&shippingOptionsAmount.push((_a2=firstMethod.price_amount_for_shipment_cents)!==null&&_a2!==void 0?_a2:0)}}),[{id:"shipping",label:"Shipping",amount:shippingOptionsAmount.reduce((a,b)=>a+b,0),detail:""}]}}exports.getExpressShippingMethods=getExpressShippingMethods;function setExpressShippingMethod({config,orderId,selectFirst=!0,selectedShippingMethodId,params}){var _a,_b,_c;return tslib_1.__awaiter(this,void 0,void 0,function*(){const sdk=(0,getSdk_1.default)(config),order=yield sdk.orders.retrieve(orderId,params),shippingMethods=getExpressShippingMethods(order);if(order?.shipments==null)throw new Error("No shipments found");const isSingleShipment=order.shipments.length===1,[shipmentId]=order.shipments.map(shipment=>shipment.id);if(shipmentId==null)throw new Error("No shipment found");if(shippingMethods==null||shippingMethods?.length===0)throw new Error("No shipping methods found");if(isSingleShipment)if(selectFirst){const[firstShippingMethodId]=shippingMethods.map(method=>method.id);firstShippingMethodId!=null&&(yield sdk.shipments.update({id:shipmentId,shipping_method:sdk.shipping_methods.relationship(firstShippingMethodId)}))}else selectedShippingMethodId!=null&&(yield sdk.shipments.update({id:shipmentId,shipping_method:sdk.shipping_methods.relationship(selectedShippingMethodId)}));else for(const shipment of(_a=order?.shipments)!==null&&_a!==void 0?_a:[]){const[firstShippingMethodId]=(_c=(_b=shipment?.available_shipping_methods)===null||_b===void 0?void 0:_b.map(method=>method.id))!==null&&_c!==void 0?_c:[];firstShippingMethodId!=null&&(yield sdk.shipments.update({id:shipment.id,shipping_method:sdk.shipping_methods.relationship(firstShippingMethodId)}))}return yield sdk.orders.retrieve(order.id,params)})}exports.setExpressShippingMethod=setExpressShippingMethod;function setExpressPlaceOrder({config,orderId,paymentResource,paymentSourceId}){return tslib_1.__awaiter(this,void 0,void 0,function*(){const sdk=(0,getSdk_1.default)(config);return yield sdk.orders.retrieve(orderId,{include:["shipments.shipping_method","payment_source","payment_method"]}),yield sdk[paymentResource].update({id:paymentSourceId,order:sdk.orders.relationship(orderId)}),yield sdk.orders.update({id:orderId,payment_source:sdk[paymentResource].relationship(paymentSourceId)}),yield sdk.orders.update({id:orderId,_place:!0})})}exports.setExpressPlaceOrder=setExpressPlaceOrder;function expressRedirectUrl({order,config:{accessToken,endpoint}}){if(accessToken==null)throw new Error("No access token found");if(endpoint==null)throw new Error("No endpoint found");const[slug]=endpoint.split(".commercelayer");if(slug==null)throw new Error("No slug found");const href=order?.checkout_url!=null?order?.checkout_url:`${slug}.commercelayer.app/checkout/${order.id}?accessToken=${accessToken}`;window.location.pathname.includes("/checkout")||window.location.pathname.includes(`/${order.id}`)?window.location.reload():window.location.href=href}exports.expressRedirectUrl=expressRedirectUrl;

package/lib/cjs/utils/getCardDetails.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});function getCardDetails({paymentType,customerPayment}){switch(paymentType){case"checkout_com_payments":{const source=customerPayment.payment_source?.payment_response?.source;if(source)return{brand:source.scheme.toLowerCase(),exp_month:source.expiry_month,exp_year:source.expiry_year,last4:source.last4};break}case"stripe_payments":{const ps=customerPayment.payment_source,source=ps?.options?.card??ps?.payment_method?.card;if(source)return{...source};break}case"braintree_payments":{const source=customerPayment.payment_source?.options?.card;if(source)return{...source};break}case"adyen_payments":{const ps=customerPayment.payment_source,source=ps?.payment_request_data?.payment_method,authorized=ps?.payment_response?.resultCode==="Authorised";if(source&&authorized){const brand=source.type==="scheme"?source.brand??"credit-card":source.type.replace("_account","");return{...source,brand}}break}default:{const source=customerPayment.payment_source?.metadata?.card;if(source)return{...source};break}}return{brand:"",exp_month:"**",exp_year:"**",last4:"****"}}exports.default=getCardDetails;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});function getCardDetails({paymentType,customerPayment}){var _a,_b,_c,_d,_e,_f,_g,_h,_j;switch(paymentType){case"checkout_com_payments":{const ps=customerPayment.payment_source,source=(_a=ps?.payment_response)===null||_a===void 0?void 0:_a.source;if(source)return{brand:source.scheme.toLowerCase(),exp_month:source.expiry_month,exp_year:source.expiry_year,last4:source.last4};break}case"stripe_payments":{const ps=customerPayment.payment_source,source=(_c=(_b=ps?.options)===null||_b===void 0?void 0:_b.card)!==null&&_c!==void 0?_c:(_d=ps?.payment_method)===null||_d===void 0?void 0:_d.card;if(source)return Object.assign({},source);break}case"braintree_payments":{const ps=customerPayment.payment_source,source=(_e=ps?.options)===null||_e===void 0?void 0:_e.card;if(source)return Object.assign({},source);break}case"adyen_payments":{const ps=customerPayment.payment_source,source=(_f=ps?.payment_request_data)===null||_f===void 0?void 0:_f.payment_method,authorized=((_g=ps?.payment_response)===null||_g===void 0?void 0:_g.resultCode)==="Authorised";if(source&&authorized){const brand=source.type==="scheme"?(_h=source.brand)!==null&&_h!==void 0?_h:"credit-card":source.type.replace("_account","");return Object.assign(Object.assign({},source),{brand})}break}default:{const ps=customerPayment.payment_source,source=(_j=ps?.metadata)===null||_j===void 0?void 0:_j.card;if(source)return Object.assign({},source);break}}return{brand:"",exp_month:"**",exp_year:"**",last4:"****"}}exports.default=getCardDetails;

package/lib/cjs/utils/getErrors.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.setErrors=void 0;const tslib_1=require("tslib"),differenceBy_1=tslib_1.__importDefault(require("lodash/differenceBy"));function getErrors({error,resource,field,attributes}){return error?.errors?.map(e=>({...e,resource,...field!=null&&field!==""&&{field},...attributes!=null&&attributes}))}exports.default=getErrors;function setErrors({currentErrors=[],newErrors=[],dispatch,filterBy="code"}){const errorsDifference=(0,differenceBy_1.default)(currentErrors,newErrors,filterBy),mergeErrors=currentErrors?.length===0?newErrors:errorsDifference,errors=[...currentErrors||[],...mergeErrors];return dispatch?.({type:"setErrors",payload:{errors}}),errors}exports.setErrors=setErrors;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.setErrors=void 0;const tslib_1=require("tslib"),differenceBy_1=tslib_1.__importDefault(require("lodash/differenceBy"));function getErrors({error,resource,field,attributes}){var _a;return(_a=error?.errors)===null||_a===void 0?void 0:_a.map(e=>Object.assign(Object.assign(Object.assign(Object.assign({},e),{resource}),field!=null&&field!==""&&{field}),attributes!=null&&attributes))}exports.default=getErrors;function setErrors({currentErrors=[],newErrors=[],dispatch,filterBy="code"}){const errorsDifference=(0,differenceBy_1.default)(currentErrors,newErrors,filterBy),mergeErrors=currentErrors?.length===0?newErrors:errorsDifference,errors=[...currentErrors||[],...mergeErrors];return dispatch?.({type:"setErrors",payload:{errors}}),errors}exports.setErrors=setErrors;

package/lib/cjs/utils/getPrices.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getPricesComponent=exports.getPriceByCode=void 0;const tslib_1=require("tslib"),react_1=require("react"),jsx_runtime_1=require("react/jsx-runtime"),lodash_1=require("lodash"),PriceTemplate_1=tslib_1.__importDefault(require("../components/utils/PriceTemplate"));function getPriceByCode(skuPrices,code=""){return code?(0,lodash_1.first)(skuPrices.filter(p=>p.currency_code===code)):(0,lodash_1.first)(skuPrices)}exports.getPriceByCode=getPriceByCode;function getPricesComponent(skuPrices,props){return(0,lodash_1.isEmpty)(skuPrices)?(0,jsx_runtime_1.jsx)(PriceTemplate_1.default,{...props}):skuPrices.map((p,k)=>{const showCompare=typeof props.showCompare>"u"&&p?.compare_at_amount_cents>p?.amount_cents||props.showCompare;return(0,react_1.createElement)(PriceTemplate_1.default,{...props,key:k,showCompare,formattedAmount:p.formatted_amount,formattedCompare:p.formatted_compare_at_amount,skuCode:p.sku_code})})}exports.getPricesComponent=getPricesComponent;function getPrices(prices){const obj={};return(0,lodash_1.isArray)(prices)&&prices.forEach(p=>{const sku=p.sku_code;(0,lodash_1.has)(obj,sku)?obj[sku].push(p):obj[sku]=[p]}),obj}exports.default=getPrices;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.getPricesComponent=exports.getPriceByCode=void 0;const tslib_1=require("tslib"),react_1=require("react"),jsx_runtime_1=require("react/jsx-runtime"),lodash_1=require("lodash"),PriceTemplate_1=tslib_1.__importDefault(require("../components/utils/PriceTemplate"));function getPriceByCode(skuPrices,code=""){return code?(0,lodash_1.first)(skuPrices.filter(p=>p.currency_code===code)):(0,lodash_1.first)(skuPrices)}exports.getPriceByCode=getPriceByCode;function getPricesComponent(skuPrices,props){return(0,lodash_1.isEmpty)(skuPrices)?(0,jsx_runtime_1.jsx)(PriceTemplate_1.default,Object.assign({},props)):skuPrices.map((p,k)=>{const showCompare=typeof props.showCompare>"u"&&p?.compare_at_amount_cents>p?.amount_cents||props.showCompare;return(0,react_1.createElement)(PriceTemplate_1.default,Object.assign({},props,{key:k,showCompare,formattedAmount:p.formatted_amount,formattedCompare:p.formatted_compare_at_amount,skuCode:p.sku_code}))})}exports.getPricesComponent=getPricesComponent;function getPrices(prices){const obj={};return(0,lodash_1.isArray)(prices)&&prices.forEach(p=>{const sku=p.sku_code;(0,lodash_1.has)(obj,sku)?obj[sku].push(p):obj[sku]=[p]}),obj}exports.default=getPrices;

package/lib/cjs/utils/getSdk.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),organization_1=tslib_1.__importDefault(require("./organization")),sdk_1=tslib_1.__importDefault(require("@commercelayer/sdk"));function getSdk({endpoint,accessToken}){if(accessToken==null||endpoint==null)throw new Error("accessToken and endpoint are required parameters");const org=(0,organization_1.default)(endpoint);return(0,sdk_1.default)({accessToken,...org})}exports.default=getSdk;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),organization_1=tslib_1.__importDefault(require("./organization")),sdk_1=tslib_1.__importDefault(require("@commercelayer/sdk"));function getSdk({endpoint,accessToken}){if(accessToken==null||endpoint==null)throw new Error("accessToken and endpoint are required parameters");const org=(0,organization_1.default)(endpoint);return(0,sdk_1.default)(Object.assign({accessToken},org))}exports.default=getSdk;

package/lib/cjs/utils/icons.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.sortAscIcon=exports.sortDescIcon=void 0;const jsx_runtime_1=require("react/jsx-runtime");exports.sortDescIcon=(0,jsx_runtime_1.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:20,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,jsx_runtime_1.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 4h13M3 8h9m-9 4h9m5-4v12m0 0l-4-4m4 4l4-4"})}),exports.sortAscIcon=(0,jsx_runtime_1.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:20,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor",children:(0,jsx_runtime_1.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 4h13M3 8h9m-9 4h6m4 0l4-4m0 0l4 4m-4-4v12"})});
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.sortAscIcon=exports.sortDescIcon=void 0;const jsx_runtime_1=require("react/jsx-runtime");exports.sortDescIcon=(0,jsx_runtime_1.jsx)("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",width:20,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},{children:(0,jsx_runtime_1.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 4h13M3 8h9m-9 4h9m5-4v12m0 0l-4-4m4 4l4-4"})})),exports.sortAscIcon=(0,jsx_runtime_1.jsx)("svg",Object.assign({xmlns:"http://www.w3.org/2000/svg",width:20,fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},{children:(0,jsx_runtime_1.jsx)("path",{strokeLinecap:"round",strokeLinejoin:"round",strokeWidth:2,d:"M3 4h13M3 8h9m-9 4h6m4 0l4-4m0 0l4 4m-4-4v12"})}));

package/lib/cjs/utils/isEmpty.d.ts

@@ -0,0 +1 @@
+export declare function isEmpty<V>(value: V): boolean;

package/lib/cjs/utils/isEmpty.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.isEmpty=void 0;function isEmpty(value){if(value==null)return!0;if(Array.isArray(value)||typeof value=="string")return value.length===0;if(typeof value=="object")return Object.keys(value).length===0;throw new Error("Invalid value for isEmpty function")}exports.isEmpty=isEmpty;

package/lib/cjs/utils/promisify.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),isFunction_1=tslib_1.__importDefault(require("lodash/isFunction"));async function promisify(cb,params){return await new Promise((resolve,reject)=>{params?cb(params,(err,res)=>{err&&reject(err),resolve(res)}):(0,isFunction_1.default)(cb?.tokenize)?cb?.tokenize((err,payload)=>{err&&reject(err),resolve(payload)}):cb((err,res)=>{err&&reject(err),resolve(res)})})}exports.default=promisify;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),isFunction_1=tslib_1.__importDefault(require("lodash/isFunction"));function promisify(cb,params){return tslib_1.__awaiter(this,void 0,void 0,function*(){return yield new Promise((resolve,reject)=>{params?cb(params,(err,res)=>{err&&reject(err),resolve(res)}):(0,isFunction_1.default)(cb?.tokenize)?cb?.tokenize((err,payload)=>{err&&reject(err),resolve(payload)}):cb((err,res)=>{err&&reject(err),resolve(res)})})})}exports.default=promisify;

package/lib/cjs/utils/shipments.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.isDoNotShip=exports.shipmentsFilled=void 0;const tslib_1=require("tslib"),compact_1=tslib_1.__importDefault(require("lodash/compact")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty"));function shipmentsFilled(shipments){const filled=(0,compact_1.default)(shipments.filter(shipment=>!(0,isEmpty_1.default)(shipment.shipping_method)));return!(0,isEmpty_1.default)(filled)}exports.shipmentsFilled=shipmentsFilled;function isDoNotShip(lineItems){const itemDoNotShip=[],items=lineItems?lineItems.filter(({item_type})=>item_type==="skus").map(lineItem=>(lineItem.item&&lineItem?.item?.do_not_ship&&itemDoNotShip.push(!0),lineItem)):[];return itemDoNotShip.length>0&&itemDoNotShip.length===items.length}exports.isDoNotShip=isDoNotShip;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.isDoNotShip=exports.shipmentsFilled=void 0;const tslib_1=require("tslib"),compact_1=tslib_1.__importDefault(require("lodash/compact")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty"));function shipmentsFilled(shipments){const filled=(0,compact_1.default)(shipments.filter(shipment=>!(0,isEmpty_1.default)(shipment.shipping_method)));return!(0,isEmpty_1.default)(filled)}exports.shipmentsFilled=shipmentsFilled;function isDoNotShip(lineItems){const itemDoNotShip=[],items=lineItems?lineItems.filter(({item_type})=>item_type==="skus").map(lineItem=>{var _a;return lineItem.item&&(!((_a=lineItem?.item)===null||_a===void 0)&&_a.do_not_ship)&&itemDoNotShip.push(!0),lineItem}):[];return itemDoNotShip.length>0&&itemDoNotShip.length===items.length}exports.isDoNotShip=isDoNotShip;

package/lib/cjs/utils/snakeToCamelCase.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.snakeToCamelCase=void 0;function snakeToCamelCase(value){const words=value.toLowerCase().split("_"),first=words[0]??"",firstLetter=words[1]?.[0]?.toUpperCase()??"",second=words[1]?.substring(1)??"";return`${first}${firstLetter}${second}`}exports.snakeToCamelCase=snakeToCamelCase;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.snakeToCamelCase=void 0;function snakeToCamelCase(value){var _a,_b,_c,_d,_e,_f;const words=value.toLowerCase().split("_"),first=(_a=words[0])!==null&&_a!==void 0?_a:"",firstLetter=(_d=(_c=(_b=words[1])===null||_b===void 0?void 0:_b[0])===null||_c===void 0?void 0:_c.toUpperCase())!==null&&_d!==void 0?_d:"",second=(_f=(_e=words[1])===null||_e===void 0?void 0:_e.substring(1))!==null&&_f!==void 0?_f:"";return`${first}${firstLetter}${second}`}exports.snakeToCamelCase=snakeToCamelCase;

package/lib/cjs/utils/validateFormFields.js

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.businessMandatoryField=exports.fieldsExist=exports.validateValue=void 0;const tslib_1=require("tslib"),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),isString_1=tslib_1.__importDefault(require("lodash/isString")),without_1=tslib_1.__importDefault(require("lodash/without")),keys_1=tslib_1.__importDefault(require("lodash/keys")),map_1=tslib_1.__importDefault(require("lodash/map")),AddressReducer_1=require("../reducers/AddressReducer"),EMAIL_PATTERN=/[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$/,validateValue=(val,name,type,resourceType)=>val?type==="email"&&(0,isString_1.default)(val)&&!val.match(EMAIL_PATTERN)?{field:name,code:"VALIDATION_ERROR",message:`${name} - is not valid`,resourceType}:{}:{field:name,code:"VALIDATION_ERROR",message:`${name} - is required`,resourceType};exports.validateValue=validateValue;const validateFormFields=(fields,required,resourceType)=>{const errors=[];let values={metadata:{}};return(0,map_1.default)(fields,v=>{const val="checked"in v||(v.value==="on"?!1:v.value),attrName=v.getAttribute("name");if(attrName&&required.includes(attrName)||v.required){const error=(0,exports.validateValue)(val,v.name,v.type,resourceType);(0,isEmpty_1.default)(error)||errors.push(error),values={...values,[`${v.name}`]:val}}v.getAttribute("name")&&(values=!!v.getAttribute("data-metadata")?{...values,metadata:{...values.metadata,[`${v.name}`]:val}}:{...values,[`${v.name}`]:val})}),{errors,values}},fieldsExist=(address,schema=AddressReducer_1.addressFields)=>{if(address.business){const required=(0,without_1.default)(schema,"first_name","last_name"),validAddress=(0,keys_1.default)(address).filter(k=>required.includes(k));return required.length>validAddress.length}else{const required=(0,without_1.default)(schema,"line_2","company"),validAddress=(0,keys_1.default)(address).filter(k=>required.includes(k));return required.length>validAddress.length}};exports.fieldsExist=fieldsExist;const businessOptionalFields=["billing_address_first_name","billing_address_last_name","shipping_address_first_name","shipping_address_last_name","first_name","last_name"],customerOptionalFields=["billing_address_company","shipping_address_company","company"];function businessMandatoryField(fieldName,isBusiness){return!(isBusiness&&businessOptionalFields.includes(fieldName)||!isBusiness&&customerOptionalFields.includes(fieldName))}exports.businessMandatoryField=businessMandatoryField,exports.default=validateFormFields;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.businessMandatoryField=exports.fieldsExist=exports.validateValue=void 0;const tslib_1=require("tslib"),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),isString_1=tslib_1.__importDefault(require("lodash/isString")),without_1=tslib_1.__importDefault(require("lodash/without")),keys_1=tslib_1.__importDefault(require("lodash/keys")),map_1=tslib_1.__importDefault(require("lodash/map")),AddressReducer_1=require("../reducers/AddressReducer"),EMAIL_PATTERN=/[a-z0-9._%+-]+@[a-z0-9.-]+\.[a-z]{2,3}$/,validateValue=(val,name,type,resourceType)=>val?type==="email"&&(0,isString_1.default)(val)&&!val.match(EMAIL_PATTERN)?{field:name,code:"VALIDATION_ERROR",message:`${name} - is not valid`,resourceType}:{}:{field:name,code:"VALIDATION_ERROR",message:`${name} - is required`,resourceType};exports.validateValue=validateValue;const validateFormFields=(fields,required,resourceType)=>{const errors=[];let values={metadata:{}};return(0,map_1.default)(fields,v=>{const val="checked"in v||(v.value==="on"?!1:v.value),attrName=v.getAttribute("name");if(attrName&&required.includes(attrName)||v.required){const error=(0,exports.validateValue)(val,v.name,v.type,resourceType);(0,isEmpty_1.default)(error)||errors.push(error),values=Object.assign(Object.assign({},values),{[`${v.name}`]:val})}v.getAttribute("name")&&(values=!!v.getAttribute("data-metadata")?Object.assign(Object.assign({},values),{metadata:Object.assign(Object.assign({},values.metadata),{[`${v.name}`]:val})}):Object.assign(Object.assign({},values),{[`${v.name}`]:val}))}),{errors,values}},fieldsExist=(address,schema=AddressReducer_1.addressFields)=>{if(address.business){const required=(0,without_1.default)(schema,"first_name","last_name"),validAddress=(0,keys_1.default)(address).filter(k=>required.includes(k));return required.length>validAddress.length}else{const required=(0,without_1.default)(schema,"line_2","company"),validAddress=(0,keys_1.default)(address).filter(k=>required.includes(k));return required.length>validAddress.length}};exports.fieldsExist=fieldsExist;const businessOptionalFields=["billing_address_first_name","billing_address_last_name","shipping_address_first_name","shipping_address_last_name","first_name","last_name"],customerOptionalFields=["billing_address_company","shipping_address_company","company"];function businessMandatoryField(fieldName,isBusiness){return!(isBusiness&&businessOptionalFields.includes(fieldName)||!isBusiness&&customerOptionalFields.includes(fieldName))}exports.businessMandatoryField=businessMandatoryField,exports.default=validateFormFields;

package/lib/esm/components/customers/CustomerField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import CustomerContext from"../../context/CustomerContext";export function CustomerField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"customers",attribute,tagElement,context:CustomerContext,...p,children})}export default CustomerField;
+import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import CustomerContext from"../../context/CustomerContext";export function CustomerField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"customers",attribute,tagElement,context:CustomerContext,...p,children})}export default CustomerField;

package/lib/esm/components/line_items/LineItemField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import LineItemChildrenContext from"../../context/LineItemChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function LineItemField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"lineItem",attribute,tagElement,context:LineItemChildrenContext,...p,children})}export default LineItemField;
+import{jsx as _jsx}from"react/jsx-runtime";import LineItemChildrenContext from"../../context/LineItemChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function LineItemField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"lineItem",attribute,tagElement,context:LineItemChildrenContext,...p,children})}export default LineItemField;

package/lib/esm/components/parcels/ParcelField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import ParcelChildrenContext from"../../context/ParcelChildrenContext";export function ParcelField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"parcel",attribute,tagElement,context:ParcelChildrenContext,...p,children})}export default ParcelField;
+import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import ParcelChildrenContext from"../../context/ParcelChildrenContext";export function ParcelField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"parcel",attribute,tagElement,context:ParcelChildrenContext,...p,children})}export default ParcelField;

package/lib/esm/components/parcels/ParcelLineItemField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import ParcelLineItemChildrenContext from"../../context/ParcelLineItemChildrenContext";export function ParcelLineItemField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"parcelLineItem",attribute,tagElement,context:ParcelLineItemChildrenContext,...p,children})}export default ParcelLineItemField;
+import{jsx as _jsx}from"react/jsx-runtime";import GenericFieldComponent from"../utils/GenericFieldComponent";import ParcelLineItemChildrenContext from"../../context/ParcelLineItemChildrenContext";export function ParcelLineItemField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"parcelLineItem",attribute,tagElement,context:ParcelLineItemChildrenContext,...p,children})}export default ParcelLineItemField;

package/lib/esm/components/payment_gateways/PaymentGateway.js

@@ -1 +1 @@
-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}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}=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){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config));const setPaymentSources=async()=>{await setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()};(!paymentSource&&order?.payment_method.id&&show||(!paymentSource||paymentSource.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return()=>{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;
+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}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));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;

package/lib/esm/components/payment_gateways/StripeGateway.js

@@ -1 +1 @@
-import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";import StripePayment from"../payment_source/StripePayment";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PaymentSourceContext from"../../context/PaymentSourceContext";import{getPaymentConfig}from"../../reducers/PaymentMethodReducer";import getCardDetails from"../../utils/getCardDetails";import isEmpty from"lodash/isEmpty";import React from"react";import PaymentCardsTemplate from"../utils/PaymentCardsTemplate";export function StripeGateway(props){const{readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,loaderComponent,templateCustomerSaveToWallet,...p}=props,{order}=React.useContext(OrderContext),{payment}=React.useContext(PaymentMethodChildrenContext),{payments,isGuest}=React.useContext(CustomerContext),{currentPaymentMethodId,config,paymentSource}=React.useContext(PaymentMethodContext),paymentResource="stripe_payments",locale=order?.language_code;if(!readonly&&payment?.id!==currentPaymentMethodId)return null;const publishableKey=paymentSource?.publishable_key,clientSecret=paymentSource?.client_secret,paymentSourceId=order?.payment_source?.id||paymentSource?.id,stripeConfig=config?getPaymentConfig(paymentResource,config):{},customerPayments=!isEmpty(payments)&&payments?payments.filter(customerPayment=>customerPayment.payment_source?.type===paymentResource):[];if(readonly||showCard){const card=getCardDetails({customerPayment:{payment_source:paymentSource},paymentType:paymentResource}),value={...card,showCard,handleEditClick,readonly};return isEmpty(card)?null:_jsx(PaymentSourceContext.Provider,{value,children})}return!isGuest&&templateCustomerCards?_jsxs(_Fragment,{children:[isEmpty(customerPayments)?null:_jsx("div",{className:p.className,children:_jsx(PaymentCardsTemplate,{paymentResource,customerPayments,children:templateCustomerCards})}),_jsx(StripePayment,{show,templateCustomerSaveToWallet,publishableKey,clientSecret,locale,...stripeConfig})]}):publishableKey&&!loading&&paymentSourceId?_jsx(StripePayment,{show,publishableKey,clientSecret,locale,...stripeConfig}):loaderComponent}export default StripeGateway;
+import{jsx as _jsx,Fragment as _Fragment,jsxs as _jsxs}from"react/jsx-runtime";import StripePayment from"../payment_source/StripePayment";import CustomerContext from"../../context/CustomerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import PaymentSourceContext from"../../context/PaymentSourceContext";import{getPaymentConfig}from"../../reducers/PaymentMethodReducer";import getCardDetails from"../../utils/getCardDetails";import isEmpty from"lodash/isEmpty";import React from"react";import PaymentCardsTemplate from"../utils/PaymentCardsTemplate";export function StripeGateway(props){const{readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,loaderComponent,templateCustomerSaveToWallet,...p}=props,{order}=React.useContext(OrderContext),{payment,expressPayments}=React.useContext(PaymentMethodChildrenContext),{payments,isGuest}=React.useContext(CustomerContext),{currentPaymentMethodId,config,paymentSource}=React.useContext(PaymentMethodContext),paymentResource="stripe_payments",locale=order?.language_code;if(!readonly&&payment?.id!==currentPaymentMethodId)return null;const publishableKey=paymentSource?.publishable_key,clientSecret=paymentSource?.client_secret,paymentSourceId=order?.payment_source?.id||paymentSource?.id,stripeConfig=config?getPaymentConfig(paymentResource,config):{},customerPayments=!isEmpty(payments)&&payments?payments.filter(customerPayment=>customerPayment.payment_source?.type===paymentResource):[];if(readonly||showCard){const card=getCardDetails({customerPayment:{payment_source:paymentSource},paymentType:paymentResource}),value={...card,showCard,handleEditClick,readonly};return isEmpty(card)?null:_jsx(PaymentSourceContext.Provider,{value,children})}return!isGuest&&templateCustomerCards?_jsxs(_Fragment,{children:[isEmpty(customerPayments)?null:_jsx("div",{className:p.className,children:_jsx(PaymentCardsTemplate,{paymentResource,customerPayments,children:templateCustomerCards})}),_jsx(StripePayment,{show,templateCustomerSaveToWallet,publishableKey,clientSecret,expressPayments,locale,...stripeConfig})]}):publishableKey&&!loading&&paymentSourceId?_jsx(StripePayment,{show,publishableKey,clientSecret,locale,expressPayments,...stripeConfig}):loaderComponent}export default StripeGateway;

package/lib/esm/components/payment_methods/PaymentMethod.d.ts

@@ -12,9 +12,22 @@ type Props = {
      */
     hide?: PaymentResource[] | ((payment: PaymentMethodType) => boolean);
     children: DefaultChildrenType;
+    /**
+     * Set CSS classes when the payment method is selected
+     */
     activeClass?: string;
+    /**
+     * Customize the loader component
+     */
     loader?: LoaderType;
+    /**
+     * Auto select the payment method when there is only one available
+     */
     autoSelectSinglePaymentMethod?: boolean | (() => void);
+    /**
+     * Enable express payment. Other payment methods will be disabled.
+     */
+    expressPayments?: boolean;
 } & Omit<JSX.IntrinsicElements['div'], 'onClick' | 'children'> & ({
     clickableContainer: true;
     onClick?: (params?: TOnClickParams) => void;
@@ -22,5 +35,5 @@ type Props = {
     clickableContainer?: never;
     onClick?: never;
 });
-export declare function PaymentMethod({ children, className, activeClass, loader, clickableContainer, autoSelectSinglePaymentMethod, hide, onClick, ...p }: Props): JSX.Element;
+export declare function PaymentMethod({ children, className, activeClass, loader, clickableContainer, autoSelectSinglePaymentMethod, expressPayments, hide, onClick, ...p }: Props): JSX.Element;
 export default PaymentMethod;

package/lib/esm/components/payment_methods/PaymentMethod.js

@@ -1 +1 @@
-import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";import{useState,useEffect,useContext}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import getLoaderComponent from"../../utils/getLoaderComponent";import useCustomContext from"../../utils/hooks/useCustomContext";import OrderContext from"../../context/OrderContext";import CustomerContext from"../../context/CustomerContext";import{getExternalPaymentAttributes,getPaypalAttributes}from"../../utils/getPaymentAttributes";export function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,hide,onClick,...p}){const[loading,setLoading]=useState(!0),[paymentSelected,setPaymentSelected]=useState(""),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config}=useCustomContext({context:PaymentMethodContext,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext);useEffect(()=>{paymentMethods!=null&&autoSelectSinglePaymentMethod!=null&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),await setPaymentSource({paymentResource,order,attributes})&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order}),setTimeout(()=>{setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{setLoading(!1)},200)})()},[paymentMethods]),useEffect(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{setLoading(!1)},200):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0)}),[paymentMethods,currentPaymentMethodId]);const components=paymentMethods?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}else if(typeof hide=="function")return hide(payment);return!0}).map((payment,k)=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation(),setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const paymentMethodId=payment?.id,{order:order2}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:order2}),setLoadingPlaceOrder({loading:!1})}:void 0;return _jsx("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:onClickable,...p,children:_jsx(PaymentMethodChildrenContext.Provider,{value:paymentMethodProps,children})},k)});return loading?getLoaderComponent(loader):_jsx(_Fragment,{children:components})}export default PaymentMethod;
+import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";import{useState,useEffect,useContext}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import PaymentMethodChildrenContext from"../../context/PaymentMethodChildrenContext";import getLoaderComponent from"../../utils/getLoaderComponent";import useCustomContext from"../../utils/hooks/useCustomContext";import OrderContext from"../../context/OrderContext";import CustomerContext from"../../context/CustomerContext";import{getExternalPaymentAttributes,getPaypalAttributes}from"../../utils/getPaymentAttributes";import{isEmpty}from"../../utils/isEmpty";import{getAvailableExpressPayments}from"../../utils/expressPaymentHelper";export function PaymentMethod({children,className,activeClass,loader="Loading...",clickableContainer,autoSelectSinglePaymentMethod,expressPayments,hide,onClick,...p}){const[loading,setLoading]=useState(!0),[paymentSelected,setPaymentSelected]=useState(""),{paymentMethods,currentPaymentMethodId,setPaymentMethod,setLoading:setLoadingPlaceOrder,paymentSource,setPaymentSource,config}=useCustomContext({context:PaymentMethodContext,contextComponentName:"PaymentMethodsContainer",currentComponentName:"PaymentMethod",key:"paymentMethods"}),{order}=useContext(OrderContext),{getCustomerPaymentSources}=useContext(CustomerContext);useEffect(()=>{if(paymentMethods!=null&&!isEmpty(paymentMethods)&&expressPayments){const[paymentMethod]=getAvailableExpressPayments(paymentMethods);!paymentSource&&paymentMethod!=null&&(async()=>{setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId}),await setPaymentSource({paymentResource,order})&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order}),setTimeout(()=>{setLoading(!1)},200)),setLoadingPlaceOrder({loading:!1})})()}},[!isEmpty(paymentMethods),expressPayments]),useEffect(()=>{paymentMethods!=null&&autoSelectSinglePaymentMethod!=null&&!expressPayments&&(async()=>{if(paymentMethods.length===1){const[paymentMethod]=paymentMethods??[];if(paymentMethod&&!paymentSource){setLoadingPlaceOrder({loading:!0}),setPaymentSelected(paymentMethod.id);const paymentMethodId=paymentMethod?.id,paymentResource=paymentMethod?.payment_source_type;await setPaymentMethod({paymentResource,paymentMethodId});let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=getPaypalAttributes(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=getExternalPaymentAttributes(paymentResource,config)),await setPaymentSource({paymentResource,order,attributes})&&paymentMethod&&onClick!=null&&(onClick({payment:paymentMethod,order}),setTimeout(()=>{setLoading(!1)},200)),getCustomerPaymentSources&&getCustomerPaymentSources(),setLoadingPlaceOrder({loading:!1})}typeof autoSelectSinglePaymentMethod=="function"&&autoSelectSinglePaymentMethod()}else setTimeout(()=>{setLoading(!1)},200)})()},[paymentMethods,expressPayments]),useEffect(()=>(paymentMethods&&(paymentMethods.length===1&&autoSelectSinglePaymentMethod?paymentSource&&setTimeout(()=>{setLoading(!1)},200):setLoading(!1)),currentPaymentMethodId&&setPaymentSelected(currentPaymentMethodId),()=>{setLoading(!0)}),[paymentMethods,currentPaymentMethodId]);const components=paymentMethods?.filter(payment=>{if(Array.isArray(hide)){const source=payment?.payment_source_type;return!hide?.includes(source)}else if(typeof hide=="function")return hide(payment);return!0}).map((payment,k)=>{const isActive=currentPaymentMethodId===payment?.id,paymentMethodProps={payment,clickableContainer,paymentSelected,setPaymentSelected,expressPayments},paymentResource=payment?.payment_source_type,onClickable=clickableContainer?async e=>{e.stopPropagation(),setLoadingPlaceOrder({loading:!0}),setPaymentSelected(payment.id);const paymentMethodId=payment?.id,{order:order2}=await setPaymentMethod({paymentResource,paymentMethodId});onClick&&onClick({payment,order:order2}),setLoadingPlaceOrder({loading:!1})}:void 0;return _jsx("div",{"data-testid":paymentResource,className:`${className??""} ${isActive&&activeClass!=null?activeClass:""}`,onClick:onClickable,...p,children:_jsx(PaymentMethodChildrenContext.Provider,{value:paymentMethodProps,children})},k)});return loading?getLoaderComponent(loader):_jsx(_Fragment,{children:components})}export default PaymentMethod;

package/lib/esm/components/payment_methods/PaymentMethodsContainer.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import PaymentMethodContext,{defaultPaymentMethodContext}from"../../context/PaymentMethodContext";import{useContext,useEffect,useReducer,useMemo}from"react";import paymentMethodReducer,{paymentMethodInitialState,getPaymentMethods,setPaymentMethodConfig,setPaymentRef}from"../../reducers/PaymentMethodReducer";import OrderContext from"../../context/OrderContext";import CommerceLayerContext from"../../context/CommerceLayerContext";import isEmpty from"lodash/isEmpty";import useCustomContext from"../../utils/hooks/useCustomContext";export function PaymentMethodsContainer(props){const{children,config}=props,[state,dispatch]=useReducer(paymentMethodReducer,paymentMethodInitialState),{order,getOrder,setOrderErrors,include,addResourceToInclude,updateOrder,includeLoaded}=useCustomContext({context:OrderContext,contextComponentName:"OrderContainer",currentComponentName:"PaymentMethodsContainer",key:"order"}),credentials=useContext(CommerceLayerContext);async function getPayMethods(){order&&await getPaymentMethods({order,dispatch})}useEffect(()=>{include?.includes("available_payment_methods")?includeLoaded?.available_payment_methods||addResourceToInclude({newResourceLoaded:{available_payment_methods:!0,payment_source:!0,payment_method:!0,"line_items.line_item_options.sku_option":!0,"line_items.item":!0}}):addResourceToInclude({newResource:["available_payment_methods","payment_source","payment_method","line_items.line_item_options.sku_option","line_items.item"]}),config&&isEmpty(state.config)&&setPaymentMethodConfig(config,dispatch),credentials&&order&&!state.paymentMethods&&getPayMethods(),order?.payment_source&&dispatch({type:"setPaymentSource",payload:{paymentSource:order?.payment_source}}),order?.payment_source===null&&dispatch({type:"setPaymentSource",payload:{paymentSource:void 0}})},[order,credentials,include?.length,Object.keys(includeLoaded??[]).length]);const contextValue=useMemo(()=>({...state,setLoading:({loading})=>{defaultPaymentMethodContext.setLoading({loading,dispatch})},setPaymentRef:({ref})=>{setPaymentRef({ref,dispatch})},setPaymentMethodErrors:errors=>{defaultPaymentMethodContext.setPaymentMethodErrors(errors,dispatch)},setPaymentMethod:async args=>await defaultPaymentMethodContext.setPaymentMethod({...args,config:credentials,updateOrder,order,dispatch,setOrderErrors}),setPaymentSource:async args=>await defaultPaymentMethodContext.setPaymentSource({...state,...args,config:credentials,dispatch,getOrder,updateOrder,order}),updatePaymentSource:async args=>{await defaultPaymentMethodContext.updatePaymentSource({...args,config:credentials,dispatch})},destroyPaymentSource:async args=>{await defaultPaymentMethodContext.destroyPaymentSource({...args,dispatch,config:credentials,updateOrder,orderId:order?.id})}}),[state]);return _jsx(PaymentMethodContext.Provider,{value:contextValue,children})}export default PaymentMethodsContainer;
+import{jsx as _jsx}from"react/jsx-runtime";import PaymentMethodContext,{defaultPaymentMethodContext}from"../../context/PaymentMethodContext";import{useContext,useEffect,useReducer,useMemo}from"react";import paymentMethodReducer,{paymentMethodInitialState,getPaymentMethods,setPaymentMethodConfig,setPaymentRef}from"../../reducers/PaymentMethodReducer";import OrderContext from"../../context/OrderContext";import CommerceLayerContext from"../../context/CommerceLayerContext";import useCustomContext from"../../utils/hooks/useCustomContext";import{isEmpty}from"../../utils/isEmpty";export function PaymentMethodsContainer(props){const{children,config}=props,[state,dispatch]=useReducer(paymentMethodReducer,paymentMethodInitialState),{order,getOrder,setOrderErrors,include,addResourceToInclude,updateOrder,includeLoaded}=useCustomContext({context:OrderContext,contextComponentName:"OrderContainer",currentComponentName:"PaymentMethodsContainer",key:"order"}),credentials=useContext(CommerceLayerContext);async function getPayMethods(){order&&await getPaymentMethods({order,dispatch})}useEffect(()=>{include?.includes("available_payment_methods")?includeLoaded?.available_payment_methods||addResourceToInclude({newResourceLoaded:{available_payment_methods:!0,payment_source:!0,payment_method:!0,"line_items.line_item_options.sku_option":!0,"line_items.item":!0}}):addResourceToInclude({newResource:["available_payment_methods","payment_source","payment_method","line_items.line_item_options.sku_option","line_items.item"]}),config&&isEmpty(state.config)&&setPaymentMethodConfig(config,dispatch),credentials&&order&&!state.paymentMethods&&getPayMethods(),order?.payment_source&&dispatch({type:"setPaymentSource",payload:{paymentSource:order?.payment_source}}),order?.payment_source===null&&dispatch({type:"setPaymentSource",payload:{paymentSource:void 0}})},[order,credentials,include?.length,Object.keys(includeLoaded??[]).length]);const contextValue=useMemo(()=>({...state,setLoading:({loading})=>{defaultPaymentMethodContext.setLoading({loading,dispatch})},setPaymentRef:({ref})=>{setPaymentRef({ref,dispatch})},setPaymentMethodErrors:errors=>{defaultPaymentMethodContext.setPaymentMethodErrors(errors,dispatch)},setPaymentMethod:async args=>await defaultPaymentMethodContext.setPaymentMethod({...args,config:credentials,updateOrder,order,dispatch,setOrderErrors}),setPaymentSource:async args=>await defaultPaymentMethodContext.setPaymentSource({...state,...args,config:credentials,dispatch,getOrder,updateOrder,order}),updatePaymentSource:async args=>{await defaultPaymentMethodContext.updatePaymentSource({...args,config:credentials,dispatch})},destroyPaymentSource:async args=>{await defaultPaymentMethodContext.destroyPaymentSource({...args,dispatch,config:credentials,updateOrder,orderId:order?.id})}}),[state]);return _jsx(PaymentMethodContext.Provider,{value:contextValue,children})}export default PaymentMethodsContainer;

package/lib/esm/components/payment_source/PaymentSource.js

@@ -1 +1 @@
-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}=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(!1),()=>{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;
+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;

package/lib/esm/components/payment_source/PaymentSourceBrandName.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import PaymentSourceContext from"../../context/PaymentSourceContext";import capitalize from"lodash/capitalize";import{useContext}from"react";import Parent from"../utils/Parent";import CustomerPaymentSourceContext from"../../context/CustomerPaymentSourceContext";export function PaymentSourceBrandName({children,label,...props}){const{brand}=useContext(PaymentSourceContext),{brand:customerCardBrand}=useContext(CustomerPaymentSourceContext),cardBrand=brand??customerCardBrand,brandName=cardBrand&&capitalize(cardBrand.replaceAll(/_|-/gm," ")),parentProps={brand:brandName,label,...props};return children?_jsx(Parent,{...parentProps,children}):_jsx("span",{...props,children:label||capitalize(brandName)})}export default PaymentSourceBrandName;
+import{jsx as _jsx}from"react/jsx-runtime";import PaymentSourceContext from"../../context/PaymentSourceContext";import capitalize from"lodash/capitalize";import{useContext}from"react";import Parent from"../utils/Parent";import CustomerPaymentSourceContext from"../../context/CustomerPaymentSourceContext";export function PaymentSourceBrandName({children,label,...props}){const{brand}=useContext(PaymentSourceContext),{brand:customerCardBrand}=useContext(CustomerPaymentSourceContext),cardBrand=brand??customerCardBrand,brandName=cardBrand&&capitalize(cardBrand.replace(/_|-/gm," ")),parentProps={brand:brandName,label,...props};return children?_jsx(Parent,{...parentProps,children}):_jsx("span",{...props,children:label||capitalize(brandName)})}export default PaymentSourceBrandName;

package/lib/esm/components/payment_source/StripeExpressPayment.d.ts

@@ -0,0 +1,5 @@
+interface Props {
+    clientSecret: string;
+}
+export declare function StripeExpressPayment({ clientSecret }: Props): JSX.Element | null;
+export {};

package/lib/esm/components/payment_source/StripeExpressPayment.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import CommerceLayerContext from"../../context/CommerceLayerContext";import OrderContext from"../../context/OrderContext";import PaymentMethodContext from"../../context/PaymentMethodContext";import{getAvailableExpressPayments,getExpressShippingMethods,setExpressFakeAddress,setExpressPlaceOrder,setExpressShippingMethod,expressRedirectUrl}from"../../utils/expressPaymentHelper";import{isEmpty}from"../../utils/isEmpty";import{PaymentRequestButtonElement,useStripe}from"@stripe/react-stripe-js";import{useContext,useEffect,useState}from"react";export function StripeExpressPayment({clientSecret}){const stripe=useStripe(),[paymentRequest,setPaymentRequest]=useState(null),{accessToken,endpoint}=useContext(CommerceLayerContext),{order}=useContext(OrderContext),{paymentMethods,paymentSource}=useContext(PaymentMethodContext);return useEffect(()=>{if(stripe==null||order==null)return;const pr=stripe.paymentRequest({country:order.country_code??"",currency:order?.currency_code?.toLowerCase()??"",total:{label:`#${order?.number??""}`,amount:order?.total_amount_with_taxes_cents??0},requestPayerName:!0,requestPayerEmail:!0,requestPayerPhone:!0,requestShipping:!0});pr.canMakePayment().then(result=>{console.log("available payment:",result),result&&setPaymentRequest(pr)}).catch(err=>{console.error("Can make payment:",err)})},[isEmpty(stripe),isEmpty(order)]),paymentRequest!=null&&stripe!=null?(paymentRequest.on("shippingaddresschange",async ev=>{if(order!=null&&accessToken!=null&&endpoint!=null){const requiresBillingInfo=order?.requires_billing_info??!1,orderWithShipments=await setExpressFakeAddress({orderId:order.id,config:{accessToken,endpoint},address:{first_name:"Fake name",last_name:"Fake lastname",country_code:ev.shippingAddress.country??"",line_1:"Fake street 123",city:ev.shippingAddress.city??"Fake city",zip_code:ev.shippingAddress.postalCode??"12345",state_code:ev.shippingAddress.region??"Fake state",phone:"1234567890",billing_info:requiresBillingInfo?"Fake billing info":void 0}}),shippingOptions=getExpressShippingMethods(orderWithShipments);shippingOptions!=null&&!isEmpty(shippingOptions)?ev.updateWith({status:"success",shippingOptions,total:{label:`#${orderWithShipments?.number??""}`,amount:orderWithShipments?.total_amount_with_taxes_cents??0}}):ev.updateWith({status:"invalid_shipping_address"})}else ev.updateWith({status:"fail"})}),paymentRequest.on("shippingoptionchange",async ev=>{if(order!=null&&accessToken!=null&&endpoint!=null){const updatedOrder=await setExpressShippingMethod({orderId:order.id,config:{accessToken,endpoint},selectFirst:!1,selectedShippingMethodId:ev.shippingOption.id,params:{include:["shipments.available_shipping_methods"]}});ev.updateWith({status:"success",total:{label:`#${updatedOrder?.number??""}`,amount:updatedOrder?.total_amount_with_taxes_cents??0}})}else ev.updateWith({status:"fail"})}),paymentRequest.on("paymentmethod",async ev=>{if(console.log("ev",ev),order?.id==null)throw new Error("Order is null");if(paymentMethods==null)throw new Error("Payment methods are null");const[paymentMethod]=getAvailableExpressPayments(paymentMethods);if(paymentMethod==null)throw new Error("Payment method is null");if(paymentSource==null)throw new Error("Payment source is null");const requiresBillingInfo=order?.requires_billing_info??!1,paymentResource=paymentMethod?.payment_source_type;if(accessToken!=null&&endpoint!=null){const[firstName,lastName]=ev.payerName?.split(" ")??[],[line]=ev.shippingAddress?.addressLine??"";await setExpressFakeAddress({orderId:order.id,config:{accessToken,endpoint},address:{first_name:firstName??"Fake name",last_name:lastName??"Fake lastname",country_code:ev?.shippingAddress?.country??"",line_1:line??"Fake street 123",city:ev?.shippingAddress?.city??"Fake city",zip_code:ev?.shippingAddress?.postalCode??"12345",state_code:ev?.shippingAddress?.region??"Fake state",phone:ev?.payerPhone??"1234567890",billing_info:requiresBillingInfo?"Fake billing info":void 0}}),await setExpressShippingMethod({orderId:order.id,config:{accessToken,endpoint},selectFirst:!1,selectedShippingMethodId:ev?.shippingOption?.id,params:{include:["shipments.available_shipping_methods"]}});const{paymentIntent,error:confirmError}=await stripe.confirmCardPayment(clientSecret,{payment_method:ev.paymentMethod.id},{handleActions:!1});if(confirmError)ev.complete("fail"),console.error("Confirm card payment:",confirmError);else if(ev.complete("success"),paymentIntent.status==="requires_action"){const{error}=await stripe.confirmCardPayment(clientSecret);if(error)console.error("Confirm card payment:",error);else{const placeOrderParams={config:{accessToken,endpoint},orderId:order?.id,paymentResource,paymentSourceId:paymentSource?.id};try{const order2=await setExpressPlaceOrder(placeOrderParams);ev.complete("success"),expressRedirectUrl({order:order2,config:{accessToken,endpoint}})}catch(err){console.error("Place order:",err),ev.complete("fail")}}}else{const placeOrderParams={config:{accessToken,endpoint},orderId:order?.id,paymentResource,paymentSourceId:paymentSource?.id};try{const order2=await setExpressPlaceOrder(placeOrderParams);ev.complete("success"),expressRedirectUrl({order:order2,config:{accessToken,endpoint}})}catch(err){console.error("Place order:",err),ev.complete("fail")}}}}),_jsx(PaymentRequestButtonElement,{className:"",options:{paymentRequest}})):null}

package/lib/esm/components/payment_source/StripePayment.d.ts

@@ -14,6 +14,7 @@ type Props = PaymentMethodConfig['stripePayment'] & JSX.IntrinsicElements['div']
     publishableKey: string;
     locale?: StripeElementLocale;
     clientSecret: string;
+    expressPayments?: boolean;
 };
-export declare function StripePayment({ publishableKey, show, options, clientSecret, locale, ...p }: Props): JSX.Element | null;
+export declare function StripePayment({ publishableKey, show, options, clientSecret, locale, expressPayments, ...p }: Props): JSX.Element | null;
 export default StripePayment;

package/lib/esm/components/payment_source/StripePayment.js

@@ -1 +1 @@
-import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import{Elements,PaymentElement,useElements,useStripe}from"@stripe/react-stripe-js";import Parent from"../utils/Parent";import{setCustomerOrderParam}from"../../utils/localStorage";import OrderContext from"../../context/OrderContext";const defaultOptions={layout:{type:"accordion",defaultCollapsed:!1,radios:!0,spacedAccordionItems:!1},fields:{billingDetails:"never"}},defaultAppearance={theme:"stripe",variables:{colorText:"#32325d",fontFamily:'"Helvetica Neue", Helvetica, sans-serif'}};function StripePaymentForm({options=defaultOptions,templateCustomerSaveToWallet}){const ref=useRef(null),{currentPaymentMethodType,setPaymentMethodErrors,setPaymentRef}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),stripe=useStripe(),elements=useElements();useEffect(()=>(ref.current&&stripe&&elements&&(ref.current.onsubmit=async()=>await onSubmit({event:ref.current,stripe,elements}),setPaymentRef({ref})),()=>{setPaymentRef({ref:{current:null}})}),[ref,stripe,elements]);const onSubmit=async({event,stripe:stripe2,elements:elements2})=>{if(!stripe2)return!1;const savePaymentSourceToCustomerWallet=event?.elements?.save_payment_source_to_customer_wallet?.checked;if(savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),elements2!=null){const billingInfo=order?.billing_address,email=order?.customer_email,billingDetails={name:billingInfo?.full_name,email,phone:billingInfo?.phone,address:{city:billingInfo?.city,country:billingInfo?.country_code,line1:billingInfo?.line_1,line2:billingInfo?.line_2,postal_code:billingInfo?.zip_code,state:billingInfo?.state_code}},{error}=await stripe2.confirmPayment({elements:elements2,confirmParams:{return_url:window.location.href,payment_method_data:{billing_details:billingDetails}}});return error?(console.error(error),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error.message}]),!1):!0}return!1};return _jsxs("form",{ref,children:[_jsx(PaymentElement,{id:"payment-element",options:{...defaultOptions,...options}}),templateCustomerSaveToWallet&&_jsx(Parent,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet})]})}export function StripePayment({publishableKey,show,options,clientSecret,locale="auto",...p}){const[isLoaded,setIsLoaded]=useState(!1),[stripe,setStripe]=useState(null),{containerClassName,templateCustomerSaveToWallet,fonts=[],appearance,...divProps}=p;useEffect(()=>(show&&publishableKey&&import("@stripe/stripe-js").then(({loadStripe})=>{(async()=>{const res=await loadStripe(publishableKey,{locale});res!=null&&(setStripe(res),setIsLoaded(!0))})()}),()=>{setIsLoaded(!1)}),[show,publishableKey]);const elementsOptions={clientSecret,appearance:{...defaultAppearance,...appearance},fonts};return isLoaded&&stripe!=null&&clientSecret!=null?_jsx("div",{className:containerClassName,...divProps,children:_jsx(Elements,{stripe,options:elementsOptions,children:_jsx(StripePaymentForm,{options,templateCustomerSaveToWallet})})}):null}export default StripePayment;
+import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import PaymentMethodContext from"../../context/PaymentMethodContext";import{Elements,PaymentElement,useElements,useStripe}from"@stripe/react-stripe-js";import Parent from"../utils/Parent";import{setCustomerOrderParam}from"../../utils/localStorage";import OrderContext from"../../context/OrderContext";import{StripeExpressPayment}from"./StripeExpressPayment";const defaultOptions={layout:{type:"accordion",defaultCollapsed:!1,radios:!0,spacedAccordionItems:!1},fields:{billingDetails:"never"}},defaultAppearance={theme:"stripe",variables:{colorText:"#32325d",fontFamily:'"Helvetica Neue", Helvetica, sans-serif'}};function StripePaymentForm({options=defaultOptions,templateCustomerSaveToWallet}){const ref=useRef(null),{currentPaymentMethodType,setPaymentMethodErrors,setPaymentRef}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),stripe=useStripe(),elements=useElements();useEffect(()=>(ref.current&&stripe&&elements&&(ref.current.onsubmit=async()=>await onSubmit({event:ref.current,stripe,elements}),setPaymentRef({ref})),()=>{setPaymentRef({ref:{current:null}})}),[ref,stripe,elements]);const onSubmit=async({event,stripe:stripe2,elements:elements2})=>{if(!stripe2)return!1;const savePaymentSourceToCustomerWallet=event?.elements?.save_payment_source_to_customer_wallet?.checked;if(savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),elements2!=null){const billingInfo=order?.billing_address,email=order?.customer_email,billingDetails={name:billingInfo?.full_name,email,phone:billingInfo?.phone,address:{city:billingInfo?.city,country:billingInfo?.country_code,line1:billingInfo?.line_1,line2:billingInfo?.line_2,postal_code:billingInfo?.zip_code,state:billingInfo?.state_code}},{error}=await stripe2.confirmPayment({elements:elements2,confirmParams:{return_url:window.location.href,payment_method_data:{billing_details:billingDetails}}});return error?(console.error(error),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error.message}]),!1):!0}return!1};return _jsxs("form",{ref,children:[_jsx(PaymentElement,{id:"payment-element",options:{...defaultOptions,...options}}),templateCustomerSaveToWallet&&_jsx(Parent,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet})]})}export function StripePayment({publishableKey,show,options,clientSecret,locale="auto",expressPayments=!1,...p}){const[isLoaded,setIsLoaded]=useState(!1),[stripe,setStripe]=useState(null),{containerClassName,templateCustomerSaveToWallet,fonts=[],appearance,...divProps}=p;useEffect(()=>(show&&publishableKey&&import("@stripe/stripe-js").then(({loadStripe})=>{(async()=>{const res=await loadStripe(publishableKey,{locale});res!=null&&(setStripe(res),setIsLoaded(!0))})()}),()=>{setIsLoaded(!1)}),[show,publishableKey]);const elementsOptions={clientSecret,appearance:{...defaultAppearance,...appearance},fonts};return isLoaded&&stripe!=null&&clientSecret!=null?_jsx("div",{className:containerClassName,...divProps,children:_jsx(Elements,{stripe,options:elementsOptions,children:expressPayments?_jsx(StripeExpressPayment,{clientSecret}):_jsx(StripePaymentForm,{options,templateCustomerSaveToWallet})})}):null}export default StripePayment;

package/lib/esm/components/skus/SkuField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import SkuChildrenContext from"../../context/SkuChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function SkuField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"sku",attribute,tagElement,context:SkuChildrenContext,...p,children})}export default SkuField;
+import{jsx as _jsx}from"react/jsx-runtime";import SkuChildrenContext from"../../context/SkuChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function SkuField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"sku",attribute,tagElement,context:SkuChildrenContext,...p,children})}export default SkuField;

package/lib/esm/components/stock_transfers/StockTransferField.js

@@ -1 +1 @@
-import{jsx as _jsx}from"react/jsx-runtime";import StockTransferChildrenContext from"../../context/StockTransferChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function StockTransferField(props){const{attribute,tagElement,children,...p}=props;return _jsx(GenericFieldComponent,{resource:"stock_transfers",attribute,tagElement,context:StockTransferChildrenContext,...p,children})}export default StockTransferField;
+import{jsx as _jsx}from"react/jsx-runtime";import StockTransferChildrenContext from"../../context/StockTransferChildrenContext";import GenericFieldComponent from"../utils/GenericFieldComponent";export function StockTransferField(props){const{attribute,tagElement="span",children,...p}=props;return _jsx(GenericFieldComponent,{resource:"stock_transfers",attribute,tagElement,context:StockTransferChildrenContext,...p,children})}export default StockTransferField;

package/lib/esm/context/PaymentMethodChildrenContext.d.ts

@@ -5,6 +5,7 @@ export interface InitialPaymentMethodChildrenContext {
     clickableContainer?: boolean;
     paymentSelected?: string;
     setPaymentSelected?: (paymentId: string) => void;
+    expressPayments?: boolean;
 }
 declare const PaymentMethodChildrenContext: import("react").Context<InitialPaymentMethodChildrenContext>;
 export default PaymentMethodChildrenContext;

package/lib/esm/typings/index.d.ts

@@ -108,9 +108,9 @@ export type ExcludeTag<T extends keyof JSX.IntrinsicElements> = Exclude<keyof JS
 export type ExtractTag<T extends keyof JSX.IntrinsicElements> = Extract<keyof JSX.IntrinsicElements, T>;
 export type ConditionalElement<E> = ({
     attribute: Extract<keyof E, 'image_url'>;
-    tagElement: ExtractTag<'img'>;
+    tagElement?: ExtractTag<'img'>;
 } & JSX.IntrinsicElements['img']) | ({
     attribute: Exclude<keyof E, 'image_url'>;
-    tagElement: ExcludeTag<'img'>;
+    tagElement?: ExcludeTag<'img'>;
 } & Omit<JSX.IntrinsicElements[ExcludeTag<'img'>], 'children'>);
 export {};

package/lib/esm/utils/expressPaymentHelper.d.ts

@@ -0,0 +1,83 @@
+import { type CommerceLayerConfig } from '../context/CommerceLayerContext';
+import { type Order, type PaymentMethod, type QueryParamsRetrieve, type AddressCreate } from '@commercelayer/sdk';
+import { type PaymentRequestShippingOption } from '@stripe/stripe-js';
+import { type PaymentResource } from '../reducers/PaymentMethodReducer';
+export declare function getAvailableExpressPayments(paymentMethods: PaymentMethod[]): PaymentMethod[];
+interface TFakeAddressParams {
+    /**
+     * The order id
+     */
+    orderId: string;
+    /**
+     * The Commerce Layer config
+     */
+    config: Required<CommerceLayerConfig>;
+    /**
+     * The address resource
+     */
+    address: AddressCreate;
+    /**
+     * The customer email
+     */
+    email?: string;
+}
+export declare function setExpressFakeAddress({ orderId, config, address, email }: TFakeAddressParams): Promise<Order>;
+export declare function getExpressShippingMethods(order: Order): PaymentRequestShippingOption[] | null;
+type TSetExpressShippingMethodParams = {
+    /**
+     * The Commerce Layer config
+     */
+    config: CommerceLayerConfig;
+    /**
+     * The order id
+     */
+    orderId: string;
+    /**
+     * The query params
+     */
+    params?: QueryParamsRetrieve;
+} & ({
+    /**
+     * Select the first shipping method
+     */
+    selectFirst: false;
+    /**
+     * The selected shipping method id
+     */
+    selectedShippingMethodId?: string;
+} | {
+    selectFirst?: true;
+    selectedShippingMethodId?: never;
+});
+export declare function setExpressShippingMethod({ config, orderId, selectFirst, selectedShippingMethodId, params }: TSetExpressShippingMethodParams): Promise<Order>;
+export interface TSetExpressPlaceOrderParams {
+    /**
+     * The Commerce Layer config
+     */
+    config: CommerceLayerConfig;
+    /**
+     * The order id
+     */
+    orderId: string;
+    /**
+     * The payment resource
+     */
+    paymentResource: PaymentResource;
+    /**
+     * The payment source id
+     */
+    paymentSourceId: string;
+}
+export declare function setExpressPlaceOrder({ config, orderId, paymentResource, paymentSourceId }: TSetExpressPlaceOrderParams): Promise<Order>;
+interface TExpressRedirectUrlParams {
+    /**
+     * Order resource
+     */
+    order: Order;
+    /**
+     * The Commerce Layer config
+     */
+    config: CommerceLayerConfig;
+}
+export declare function expressRedirectUrl({ order, config: { accessToken, endpoint } }: TExpressRedirectUrlParams): void;
+export {};

package/lib/esm/utils/expressPaymentHelper.js

@@ -0,0 +1 @@
+import getSdk from"./getSdk";const availablePaymentMethods=["stripe_payments"];export function getAvailableExpressPayments(paymentMethods){return paymentMethods.filter(payment=>payment.payment_source_type?availablePaymentMethods.includes(payment.payment_source_type):!1)}export async function setExpressFakeAddress({orderId,config,address,email}){const params={include:["shipments.available_shipping_methods"]},sdk=getSdk(config),fakeAddress=await sdk.addresses.create(address),resource={id:orderId,billing_address:sdk.addresses.relationship(fakeAddress.id),_shipping_address_same_as_billing:!0};return email!=null&&(resource.customer_email=email),await sdk.orders.update(resource,params),await sdk.orders.retrieve(orderId,params)}export function getExpressShippingMethods(order){const isSingleShipment=order?.shipments?.length===1,shippingMethods=order?.shipments?.map(shipment=>shipment.available_shipping_methods);if(isSingleShipment)return shippingMethods==null?null:shippingMethods.flat().map(method=>({id:method?.id??"",label:method?.name??"",amount:method?.price_amount_for_shipment_cents??0,detail:""}));{if(shippingMethods==null)return null;const shippingOptionsAmount=[];return shippingMethods.forEach(methods=>{if(methods!=null){const[firstMethod]=methods;firstMethod!=null&&shippingOptionsAmount.push(firstMethod.price_amount_for_shipment_cents??0)}}),[{id:"shipping",label:"Shipping",amount:shippingOptionsAmount.reduce((a,b)=>a+b,0),detail:""}]}}export async function setExpressShippingMethod({config,orderId,selectFirst=!0,selectedShippingMethodId,params}){const sdk=getSdk(config),order=await sdk.orders.retrieve(orderId,params),shippingMethods=getExpressShippingMethods(order);if(order?.shipments==null)throw new Error("No shipments found");const isSingleShipment=order.shipments.length===1,[shipmentId]=order.shipments.map(shipment=>shipment.id);if(shipmentId==null)throw new Error("No shipment found");if(shippingMethods==null||shippingMethods?.length===0)throw new Error("No shipping methods found");if(isSingleShipment)if(selectFirst){const[firstShippingMethodId]=shippingMethods.map(method=>method.id);firstShippingMethodId!=null&&await sdk.shipments.update({id:shipmentId,shipping_method:sdk.shipping_methods.relationship(firstShippingMethodId)})}else selectedShippingMethodId!=null&&await sdk.shipments.update({id:shipmentId,shipping_method:sdk.shipping_methods.relationship(selectedShippingMethodId)});else for(const shipment of order?.shipments??[]){const[firstShippingMethodId]=shipment?.available_shipping_methods?.map(method=>method.id)??[];firstShippingMethodId!=null&&await sdk.shipments.update({id:shipment.id,shipping_method:sdk.shipping_methods.relationship(firstShippingMethodId)})}return await sdk.orders.retrieve(order.id,params)}export async function setExpressPlaceOrder({config,orderId,paymentResource,paymentSourceId}){const sdk=getSdk(config);return await sdk.orders.retrieve(orderId,{include:["shipments.shipping_method","payment_source","payment_method"]}),await sdk[paymentResource].update({id:paymentSourceId,order:sdk.orders.relationship(orderId)}),await sdk.orders.update({id:orderId,payment_source:sdk[paymentResource].relationship(paymentSourceId)}),await sdk.orders.update({id:orderId,_place:!0})}export function expressRedirectUrl({order,config:{accessToken,endpoint}}){if(accessToken==null)throw new Error("No access token found");if(endpoint==null)throw new Error("No endpoint found");const[slug]=endpoint.split(".commercelayer");if(slug==null)throw new Error("No slug found");const href=order?.checkout_url!=null?order?.checkout_url:`${slug}.commercelayer.app/checkout/${order.id}?accessToken=${accessToken}`;window.location.pathname.includes("/checkout")||window.location.pathname.includes(`/${order.id}`)?window.location.reload():window.location.href=href}

package/lib/esm/utils/isEmpty.d.ts

@@ -0,0 +1 @@
+export declare function isEmpty<V>(value: V): boolean;

package/lib/esm/utils/isEmpty.js

@@ -0,0 +1 @@
+export function isEmpty(value){if(value==null)return!0;if(Array.isArray(value)||typeof value=="string")return value.length===0;if(typeof value=="object")return Object.keys(value).length===0;throw new Error("Invalid value for isEmpty function")}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/react-components",
-  "version": "4.4.0-beta.2",
+  "version": "4.4.0-beta.4",
   "description": "The Official Commerce Layer React Components",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.js",
@@ -160,34 +160,34 @@
   "dependencies": {
     "@ac-dev/countries-service": "^1.2.0",
     "@ac-dev/states-service": "^1.1.1",
-    "@adyen/adyen-web": "^5.38.0",
+    "@adyen/adyen-web": "^5.40.0",
     "@commercelayer/sdk": "^4.27.0",
     "@stripe/react-stripe-js": "^2.1.0",
-    "@stripe/stripe-js": "^1.52.0",
-    "axios": "^1.3.4",
-    "braintree-web": "^3.92.0",
+    "@stripe/stripe-js": "^1.52.1",
+    "axios": "^1.3.6",
+    "braintree-web": "^3.92.1",
     "frames-react": "^1.1.0",
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
     "rapid-form": "^2.1.0",
     "react-table": "^7.8.0",
-    "react-window": "^1.8.7"
+    "react-window": "^1.8.9"
   },
   "devDependencies": {
     "@commercelayer/js-auth": "^2.3.0",
-    "@playwright/test": "^1.32.1",
+    "@playwright/test": "^1.32.3",
     "@testing-library/dom": "^9.2.0",
     "@testing-library/react": "^14.0.0",
     "@types/braintree-web": "^3.75.23",
-    "@types/lodash": "^4.14.192",
-    "@types/node": "^18.15.11",
+    "@types/lodash": "^4.14.194",
+    "@types/node": "^18.15.13",
     "@types/prop-types": "^15.7.5",
-    "@types/react": "^18.0.31",
+    "@types/react": "^18.0.37",
     "@types/react-table": "^7.7.14",
     "@types/react-test-renderer": "^18.0.0",
     "@types/react-window": "^1.8.5",
-    "@vitejs/plugin-react": "^3.1.0",
-    "@vitest/coverage-c8": "^0.29.8",
+    "@vitejs/plugin-react": "^4.0.0",
+    "@vitest/coverage-c8": "^0.30.1",
     "jsdom": "^21.1.1",
     "minimize-js": "^1.3.1",
     "msw": "^1.2.1",
@@ -196,10 +196,10 @@
     "react-test-renderer": "^18.2.0",
     "tsc-alias": "^1.8.5",
     "tslib": "^2.5.0",
-    "typescript": "^5.0.2",
-    "vite": "^4.2.1",
-    "vite-tsconfig-paths": "^4.0.7",
-    "vitest": "^0.29.8"
+    "typescript": "^5.0.4",
+    "vite": "^4.3.1",
+    "vite-tsconfig-paths": "^4.2.0",
+    "vitest": "^0.30.1"
   },
   "peerDependencies": {
     "react": "^18.0.0"