@commercelayer/react-components 3.14.1-beta.2 → 4.0.0-alpha.1

package/lib/esm/components/BraintreePayment.d.ts

@@ -0,0 +1,30 @@
+/// <reference types="react" />
+import { HostedFieldFieldOptions } from 'braintree-web/modules/hosted-fields';
+import { PaymentSourceProps } from './PaymentSource';
+declare type BraintreeHostedFields<Type> = {
+    [Property in keyof Type]: {
+        label?: string;
+    } & Type[Property];
+};
+export declare type BraintreeConfig = {
+    containerClassName?: string;
+    cardContainerClassName?: string;
+    expDateContainerClassName?: string;
+    fieldsContainerClassName?: string;
+    cvvContainerClassName?: string;
+    cardDetailsContainerClassName?: string;
+    fieldLabelClassName?: string;
+    inputWrapperClassName?: string;
+    fields?: BraintreeHostedFields<HostedFieldFieldOptions>;
+    styles?: {
+        [key: string]: Record<string, string>;
+    };
+};
+declare type Props = {
+    authorization: string;
+    config?: BraintreeConfig;
+    templateCustomerSaveToWallet?: PaymentSourceProps['templateCustomerSaveToWallet'];
+    locale?: string;
+};
+export declare function BraintreePayment({ authorization, config, templateCustomerSaveToWallet, }: Props): JSX.Element | null;
+export default BraintreePayment;

package/lib/esm/components/BraintreePayment.js

@@ -0,0 +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 isEmpty from"lodash/isEmpty";import OrderContext from"../context/OrderContext";import Parent from"./utils/Parent";import{setCustomerOrderParam}from"../utils/localStorage";import promisify from"../utils/promisify";const defaultConfig={styles:{input:{"font-size":"16px",color:"#3A3A3A"},".number":{"font-family":"monospace"},":focus":{color:"blue"},".valid":{color:"green"},".invalid":{color:"red"},"@media screen and (max-width: 700px)":{input:{"font-size":"14px"}}},fields:{number:{label:"Card Number",selector:"#card-number",placeholder:"4111 1111 1111 1111"},cvv:{label:"CVV",selector:"#cvv",placeholder:"123"},expirationDate:{label:"Expiration Date",selector:"#expiration-date",placeholder:"10/2022"}},submitLabel:"Set payment method"};export function BraintreePayment({authorization,config,templateCustomerSaveToWallet}){const{fields,styles,containerClassName,cardContainerClassName,fieldsContainerClassName,expDateContainerClassName,fieldLabelClassName,cvvContainerClassName,inputWrapperClassName,cardDetailsContainerClassName}={...defaultConfig,...config},[loadBraintree,setLoadBraintree]=useState(!1),{setPaymentSource,paymentSource,setPaymentMethodErrors,currentPaymentMethodType,setPaymentRef}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),ref=useRef(null),handleSubmitForm=async({event,hostedFieldsInstance,threeDSInstance})=>{const savePaymentSourceToCustomerWallet=event?.elements?.save_payment_source_to_customer_wallet?.checked;if(savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),hostedFieldsInstance)try{const payload=await promisify(hostedFieldsInstance).then(payload2=>payload2),billingAddress=order?.billing_address,verifyCardOptions={nonce:payload.nonce,bin:payload.details.bin,amount:order?.total_amount_with_taxes_float,email:order?.customer_email,billingAddress:{givenName:billingAddress?.first_name,surname:billingAddress?.last_name,phoneNumber:billingAddress?.phone,streetAddress:billingAddress?.line_1,countryCodeAlpha2:billingAddress?.country_code,postalCode:billingAddress?.zip_code,region:billingAddress?.state_code,locality:billingAddress?.city},onLookupComplete:(_data,next)=>{next()}},response=await threeDSInstance.verifyCard(verifyCardOptions);return response.rawCardinalSDKVerificationData.Validated&&paymentSource?(paymentSource&&await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:"braintree_payments",attributes:{payment_method_nonce:response.nonce,options:{id:response.nonce,card:{last4:response.details.lastFour,exp_year:response.details.expirationYear,exp_month:response.details.expirationMonth,brand:response.details.cardType.toLowerCase()}}}}),!0):!1}catch(error){return console.error(error),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error.message}]),!1}return!1};return useEffect(()=>{if(!ref&&authorization&&setCustomerOrderParam("_save_payment_source_to_customer_wallet","false"),authorization&&!loadBraintree&&!isEmpty(window)){const braintreeClient=require("braintree-web/client"),hostedFields=require("braintree-web/hosted-fields"),threeDSecure=require("braintree-web/three-d-secure");braintreeClient.create({authorization},(clientErr,clientInstance)=>{if(clientErr){console.error(clientErr);return}hostedFields.create({client:clientInstance,fields,styles},(hostedFieldsErr,hostedFieldsInstance)=>{if(hostedFieldsErr){console.error(hostedFieldsErr);return}setLoadBraintree(!0),threeDSecure.create({authorization,version:2},(threeDSecureErr,threeDSInstance)=>{threeDSecureErr&&(console.error("3DSecure error",threeDSecureErr),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:threeDSecureErr.message}])),ref.current&&(ref.current.onsubmit=paymentSource2=>handleSubmitForm({event:ref.current,hostedFieldsInstance,threeDSInstance,paymentSource:paymentSource2}),setPaymentRef({ref}))})})})}return()=>{setPaymentRef({ref:{current:null}}),setLoadBraintree(!1)}},[authorization,ref]),!authorization&&!loadBraintree?null:_jsx("div",{className:containerClassName,children:_jsxs("form",{ref,id:"braintree-form",onSubmit:handleSubmitForm,className:containerClassName,children:[_jsxs("div",{className:fieldsContainerClassName,children:[_jsxs("div",{className:cardContainerClassName,children:[_jsx("label",{className:fieldLabelClassName,htmlFor:"card-number",children:fields?.number?.label}),_jsx("div",{className:inputWrapperClassName,id:"card-number"})]}),_jsxs("div",{className:cardDetailsContainerClassName,children:[_jsxs("div",{className:expDateContainerClassName,children:[_jsx("label",{className:fieldLabelClassName,htmlFor:"expiration-date",children:fields?.expirationDate?.label}),_jsx("div",{className:inputWrapperClassName,id:"expiration-date"})]}),_jsxs("div",{className:cvvContainerClassName,children:[_jsx("label",{className:fieldLabelClassName,htmlFor:"cvv",children:fields?.cvv?.label}),_jsx("div",{className:inputWrapperClassName,id:"cvv"})]})]})]}),_jsx("div",{className:fieldsContainerClassName,children:templateCustomerSaveToWallet&&_jsx(Parent,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet})})]})})}export default BraintreePayment;

package/lib/esm/components/CartLink.d.ts

@@ -0,0 +1,12 @@
+import { MouseEvent, ReactNode } from 'react';
+import { FunctionChildren } from '../typings/index';
+declare type TChildren = FunctionChildren<Omit<Props, 'children'> & {
+    href: string;
+    handleClick?: (e: MouseEvent<HTMLAnchorElement>) => Promise<void>;
+}>;
+declare type Props = {
+    children?: TChildren;
+    label?: string | ReactNode;
+} & JSX.IntrinsicElements['a'];
+export default function CartLink(props: Props): JSX.Element | null;
+export {};

package/lib/esm/components/CartLink.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import OrderContext from"../context/OrderContext";import Parent from"./utils/Parent";import CommerceLayerContext from"../context/CommerceLayerContext";import getCartLink from"../utils/getCartLink";export default function CartLink(props){const{label,children,...p}=props,{order,createOrder}=useContext(OrderContext),{accessToken,endpoint}=useContext(CommerceLayerContext),[slug]=endpoint.split(".commercelayer"),href=slug&&order?.id?getCartLink({slug,orderId:order?.id,accessToken}):"",handleClick=async event=>{if(event.preventDefault(),order?.id)location.href=href;else{const orderId=await createOrder();slug&&(location.href=getCartLink({slug,orderId,accessToken}))}},parentProps={handleClick,label,href,...p};return accessToken?children?_jsx(Parent,{...parentProps,children}):_jsx("a",{href,...p,onClick:handleClick,children:typeof label=="function"?label():label}):null}

package/lib/esm/components/CheckoutComPayment.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { PaymentMethodConfig } from '../reducers/PaymentMethodReducer';
+import { PaymentSourceProps } from './PaymentSource';
+import { FramesStyle } from 'frames-react';
+export declare type CheckoutComConfig = {
+    containerClassName?: string;
+    hintLabel?: string;
+    name?: string;
+    success_url?: string;
+    failure_url?: string;
+    options?: {
+        style: FramesStyle;
+    };
+    [key: string]: unknown;
+};
+declare type Props = PaymentMethodConfig['checkoutComPayment'] & JSX.IntrinsicElements['div'] & {
+    show?: boolean;
+    publicKey: string;
+    locale?: string;
+    templateCustomerSaveToWallet?: PaymentSourceProps['templateCustomerSaveToWallet'];
+};
+export declare function CheckoutComPayment({ publicKey, options, locale, ...p }: Props): JSX.Element | null;
+export default CheckoutComPayment;

package/lib/esm/components/CheckoutComPayment.js

@@ -0,0 +1 @@
+import{jsx as _jsx,jsxs as _jsxs}from"react/jsx-runtime";import{useContext,useRef}from"react";import useExternalScript from"../utils/hooks/useExternalScript";import PaymentMethodContext from"../context/PaymentMethodContext";import{Frames,CardNumber,ExpiryDate,Cvv}from"frames-react";import OrderContext from"../context/OrderContext";import Parent from"./utils/Parent";import{setCustomerOrderParam}from"../utils/localStorage";const scriptUrl="https://cdn.checkout.com/js/framesv2.min.js",systemLanguages=["DE-DE","EN-GB","ES-ES","FR-FR","IT-IT","KR-KR","NL-NL"],defaultOptions={style:{base:{color:"black",fontSize:"18px"},autofill:{backgroundColor:"yellow"},hover:{color:"blue"},focus:{color:"blue"},valid:{color:"green"},invalid:{color:"red"},placeholder:{base:{color:"gray"},focus:{border:"solid 1px blue"}}}};export function CheckoutComPayment({publicKey,options=defaultOptions,locale="EN-GB",...p}){const ref=useRef(null),loaded=useExternalScript(scriptUrl),{setPaymentRef,currentPaymentMethodType,paymentSource,setPaymentSource,setPaymentMethodErrors}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),{containerClassName,templateCustomerSaveToWallet,success_url=window.location.href,failure_url=window.location.href,show,...divProps}=p,handleSubmit=async()=>{const savePaymentSourceToCustomerWallet=ref?.current?.elements?.save_payment_source_to_customer_wallet?.checked;if(savePaymentSourceToCustomerWallet&&setCustomerOrderParam("_save_payment_source_to_customer_wallet",savePaymentSourceToCustomerWallet),window.Frames){window.Frames.cardholder={name:order?.billing_address?.full_name,billingAddress:{addressLine1:order?.billing_address?.line_1,addressLine2:order?.billing_address?.line_2,zip:order?.billing_address?.zip_code,city:order?.billing_address?.city,state:order?.billing_address?.state_code,country:order?.billing_address?.country_code},phone:order?.billing_address?.phone};try{const data=await window.Frames.submitCard();if(data.token&&paymentSource&&currentPaymentMethodType){const ps=await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:currentPaymentMethodType,attributes:{token:data.token,payment_type:"token",success_url,failure_url,_authorize:!0}});ps&&ps.redirect_uri&&(window.location.href=ps.redirect_uri)}}catch(error){console.error(error),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:error?.message}])}}return!1},lang=`${locale.toUpperCase()}-${locale.toUpperCase()}`,localization=systemLanguages.includes(lang)?lang:"EN-GB";return loaded&&show?_jsxs("form",{ref,children:[_jsx("div",{className:containerClassName,...divProps,children:_jsxs(Frames,{config:{debug:!0,publicKey,localization,...options},cardValidationChanged:e=>{e.isValid&&ref.current&&(ref.current.onsubmit=()=>handleSubmit(),setPaymentRef({ref}))},cardTokenized:data=>data,children:[_jsx(CardNumber,{}),_jsx(ExpiryDate,{}),_jsx(Cvv,{})]})}),templateCustomerSaveToWallet&&_jsx(Parent,{name:"save_payment_source_to_customer_wallet",children:templateCustomerSaveToWallet})]}):null}export default CheckoutComPayment;

package/lib/esm/components/CheckoutLink.d.ts

@@ -0,0 +1,23 @@
+/// <reference types="react" />
+import { FunctionChildren } from '../typings/index';
+declare type CheckoutLinkChildrenProps = FunctionChildren<Omit<Props, 'children'> & {
+    checkoutUrl: string;
+    href: string;
+}>;
+declare type Props = {
+    children?: CheckoutLinkChildrenProps;
+    label?: string;
+    hostedCheckout?: boolean;
+} & JSX.IntrinsicElements['a'];
+export declare function CheckoutLink(props: Props): JSX.Element;
+export declare namespace CheckoutLink {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        label: import("prop-types").Requireable<string>;
+    };
+    var defaultProps: {
+        label: string;
+    };
+    var displayName: string;
+}
+export default CheckoutLink;

package/lib/esm/components/CheckoutLink.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import OrderContext from"../context/OrderContext";import components from"../config/components";import Parent from"./utils/Parent";import CommerceLayerContext from"../context/CommerceLayerContext";const propTypes=components.CheckoutLink.propTypes,defaultProps=components.CheckoutLink.defaultProps,displayName=components.CheckoutLink.displayName;export function CheckoutLink(props){const{label,hostedCheckout=!0,children,...p}=props,{order}=useContext(OrderContext),{accessToken,endpoint}=useContext(CommerceLayerContext),[slug]=endpoint.split(".commercelayer"),href=hostedCheckout?`${slug}.checkout.commercelayer.app/${order?.id}?accessToken=${accessToken}`:order?.checkout_url,parentProps={checkoutUrl:order?.checkout_url,hostedCheckout,label,href,...p};return children?_jsx(Parent,{...parentProps,children}):_jsx("a",{href,...p,children:label})}CheckoutLink.propTypes=propTypes,CheckoutLink.defaultProps=defaultProps,CheckoutLink.displayName=displayName;export default CheckoutLink;

package/lib/esm/components/DeliveryLeadTime.d.ts

@@ -0,0 +1,17 @@
+import { ReactNode } from 'react';
+export declare type DeliveryLeadTimeField = 'min_hours' | 'max_hours' | 'min_days' | 'max_days';
+export declare type DeliveryLeadTimeComponentChildren = Omit<Props, 'children'>;
+declare type Props = Partial<JSX.IntrinsicElements['span']> & {
+    children?: (props: DeliveryLeadTimeComponentChildren) => ReactNode;
+    type: DeliveryLeadTimeField;
+    text?: string;
+};
+export declare function DeliveryLeadTime(props: Props): JSX.Element;
+export declare namespace DeliveryLeadTime {
+    var propTypes: {
+        type: import("prop-types").Validator<DeliveryLeadTimeField>;
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    var displayName: string;
+}
+export default DeliveryLeadTime;

package/lib/esm/components/DeliveryLeadTime.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useState,useEffect}from"react";import ShippingMethodChildrenContext from"../context/ShippingMethodChildrenContext";import Parent from"./utils/Parent";import components from"../config/components";const propTypes=components.DeliveryLeadTime.propTypes,displayName=components.DeliveryLeadTime.displayName;export function DeliveryLeadTime(props){const{type,...p}=props,[text,setText]=useState(),{deliveryLeadTimeForShipment}=useContext(ShippingMethodChildrenContext);useEffect(()=>(deliveryLeadTimeForShipment&&deliveryLeadTimeForShipment[type]&&setText(deliveryLeadTimeForShipment[type]),()=>{setText("")}),[deliveryLeadTimeForShipment]);const parentProps={text,...p};return props.children?_jsx(Parent,{...parentProps,children:props.children}):_jsx("span",{...p,children:text})}DeliveryLeadTime.propTypes=propTypes,DeliveryLeadTime.displayName=displayName;export default DeliveryLeadTime;

package/lib/esm/components/DiscountAmount.d.ts

@@ -0,0 +1,18 @@
+/// <reference types="react" />
+import { BaseAmountComponent } from '../typings/index';
+export declare function DiscountAmount(props: BaseAmountComponent): JSX.Element;
+export declare namespace DiscountAmount {
+    var propTypes: {
+        id: import("prop-types").Requireable<string>;
+        className: import("prop-types").Requireable<string>;
+        style: import("prop-types").Requireable<object>;
+        name: import("prop-types").Requireable<string>;
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        format: import("prop-types").Requireable<import("../typings/index").BaseFormatPrice>;
+    };
+    var defaultProps: {
+        format: import("../typings/index").BaseFormatPrice;
+    };
+    var displayName: string;
+}
+export default DiscountAmount;

package/lib/esm/components/DiscountAmount.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import BaseOrderPrice from"./utils/BaseOrderPrice";import components from"../config/components";const propTypes=components.DiscountAmount.propTypes,defaultProps=components.DiscountAmount.defaultProps,displayName=components.DiscountAmount.displayName;export function DiscountAmount(props){return _jsx(BaseOrderPrice,{base:"amount",type:"discount",...props})}DiscountAmount.propTypes=propTypes,DiscountAmount.defaultProps=defaultProps,DiscountAmount.displayName=displayName;export default DiscountAmount;

package/lib/esm/components/Errors.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import type { ErrorComponentProps } from '../typings/errors';
+declare type Props = ErrorComponentProps & JSX.IntrinsicElements['span'];
+export declare function Errors(props: Props): JSX.Element;
+export default Errors;

package/lib/esm/components/Errors.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext,Fragment,useMemo}from"react";import Parent from"./utils/Parent";import GiftCardContext from"../context/GiftCardContext";import OrderContext from"../context/OrderContext";import AddressContext from"../context/AddressContext";import getAllErrors from"./utils/getAllErrors";import LineItemContext from"../context/LineItemContext";import LineItemChildrenContext from"../context/LineItemChildrenContext";import CustomerContext from"../context/CustomerContext";import PaymentMethodContext from"../context/PaymentMethodContext";import PaymentMethodChildrenContext from"../context/PaymentMethodChildrenContext";import ShipmentContext from"../context/ShipmentContext";export function Errors(props){const{children,messages=[],resource,field,...p}=props,{payment}=useContext(PaymentMethodChildrenContext),{errors:orderErrors}=useContext(OrderContext),{errors:giftCardErrors}=useContext(GiftCardContext),{errors:lineItemErrors}=useContext(LineItemContext),{errors:addressErrors}=useContext(AddressContext),{errors:customerErrors}=useContext(CustomerContext),{errors:shipmentErrors}=useContext(ShipmentContext),{errors:paymentMethodErrors,currentPaymentMethodType,currentPaymentMethodId}=useContext(PaymentMethodContext),{lineItem}=useContext(LineItemChildrenContext),allErrors=useMemo(()=>[...giftCardErrors||[],...orderErrors||[],...lineItemErrors||[],...addressErrors||[],...customerErrors||[],...shipmentErrors||[],...paymentMethodErrors?.filter(v=>v.field===currentPaymentMethodType&&payment?.id===currentPaymentMethodId)||[]],[giftCardErrors,orderErrors,lineItemErrors,addressErrors,customerErrors,shipmentErrors,paymentMethodErrors]).filter((v,k,a)=>v?.code!==a[k-1]?.code),msgErrors=getAllErrors({allErrors,field,messages,props:p,lineItem,resource,returnHtml:!children});console.log("Errors",msgErrors);const parentProps={messages,resource,field,errors:msgErrors,...p};return children?_jsx(Parent,{...parentProps,children}):_jsx(Fragment,{children:msgErrors})}export default Errors;

package/lib/esm/components/ExternalFunction.d.ts

@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+declare type Props = {
+    children: ReactNode;
+    url: string;
+};
+export declare function ExternalFunction({ children, url }: Props): JSX.Element;
+export declare namespace ExternalFunction {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+        url: import("prop-types").Validator<string>;
+    };
+    var displayName: string;
+}
+export default ExternalFunction;

package/lib/esm/components/ExternalFunction.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import ExternalFunctionContext,{callExternalFunction}from"../context/ExternalFunctionContext";import components from"../config/components";const propTypes=components.ExternalFunction.propTypes,displayName=components.ExternalFunction.displayName;export function ExternalFunction({children,url}){return _jsx(ExternalFunctionContext.Provider,{value:{url,callExternalFunction},children})}ExternalFunction.propTypes=propTypes,ExternalFunction.displayName=displayName;export default ExternalFunction;

package/lib/esm/components/GiftCard.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { BaseState } from '../typings/index';
+declare type Props = {
+    children: ReactNode;
+    onSubmit?: (values: BaseState) => void;
+} & JSX.IntrinsicElements['form'];
+export declare function GiftCard(props: Props): JSX.Element;
+export declare namespace GiftCard {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+        onSubmit: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    var defaultProps: {
+        onSubmit: undefined;
+    };
+    var displayName: string;
+}
+export default GiftCard;

package/lib/esm/components/GiftCard.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{Fragment,useRef,useContext}from"react";import validateFormFields from"../utils/validateFormFields";import{isEmpty}from"lodash";import GiftCardContext from"../context/GiftCardContext";import components from"../config/components";const propTypes=components.GiftCard.propTypes,defaultProps=components.GiftCard.defaultProps,displayName=components.GiftCard.displayName;export function GiftCard(props){const{children,onSubmit}=props,name="giftCardForm",ref=useRef(null),{addGiftCard,addGiftCardError}=useContext(GiftCardContext);return _jsx(Fragment,{children:_jsx("form",{name,ref,onSubmit:e=>{e.preventDefault();const currentForm=ref.current,elements=currentForm?.elements,{errors,values}=validateFormFields(elements,["currencyCode","balanceCents"],"gift_cards");isEmpty(errors)?(addGiftCard(values),currentForm?.reset(),onSubmit&&onSubmit(values)):addGiftCardError(errors)},children},name)})}GiftCard.propTypes=propTypes,GiftCard.defaultProps=defaultProps,GiftCard.displayName=displayName;export default GiftCard;

package/lib/esm/components/GiftCardContainer.d.ts

@@ -0,0 +1,12 @@
+import { ReactNode } from 'react';
+export declare type Props = {
+    children: ReactNode;
+};
+export declare function GiftCardContainer(props: Props): JSX.Element;
+export declare namespace GiftCardContainer {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+    };
+    var displayName: string;
+}
+export default GiftCardContainer;

package/lib/esm/components/GiftCardContainer.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useReducer,useContext}from"react";import GiftCardContext from"../context/GiftCardContext";import CommerceLayerContext from"../context/CommerceLayerContext";import giftCardReducer,{giftCardInitialState,addGiftCardRecipient,addGiftCard,addGiftCardError,addGiftCardLoading}from"../reducers/GiftCardReducer";import OrderContext from"../context/OrderContext";import components from"../config/components";const propTypes=components.GiftCardContainer.propTypes,displayName=components.GiftCardContainer.displayName;export function GiftCardContainer(props){const{children}=props,[state,dispatch]=useReducer(giftCardReducer,giftCardInitialState),config=useContext(CommerceLayerContext),{getOrder,createOrder,order}=useContext(OrderContext),giftCardValue={...state,addGiftCardRecipient:values=>addGiftCardRecipient(values,config,dispatch),addGiftCard:values=>addGiftCard({...values},{config,dispatch,getOrder,createOrder,order}),addGiftCardError:errors=>addGiftCardError(errors,dispatch),addGiftCardLoading:loading=>addGiftCardLoading(loading,dispatch)};return _jsx(GiftCardContext.Provider,{value:giftCardValue,children})}GiftCardContainer.propTypes=propTypes,GiftCardContainer.displayName=displayName;export default GiftCardContainer;

package/lib/esm/components/GiftCardCurrencySelector.d.ts

@@ -0,0 +1,22 @@
+/// <reference types="react" />
+import { BaseSelectComponentProps } from '../typings/index';
+declare type Props = Omit<BaseSelectComponentProps, 'options' | 'name'> & {
+    required?: boolean;
+} & Pick<JSX.IntrinsicElements['select'], 'className' | 'id' | 'style'>;
+export declare function GiftCardCurrencySelector(props: Props): JSX.Element;
+export declare namespace GiftCardCurrencySelector {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        placeholder: import("prop-types").Requireable<import("prop-types").InferProps<{
+            value: import("prop-types").Validator<string | number>;
+            label: import("prop-types").Validator<string>;
+        }>>;
+        value: import("prop-types").Requireable<string>;
+        required: import("prop-types").Requireable<boolean>;
+    };
+    var defaultProps: {
+        required: boolean;
+    };
+    var displayName: string;
+}
+export default GiftCardCurrencySelector;

package/lib/esm/components/GiftCardCurrencySelector.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import BaseSelect from"./utils/BaseSelect";import currencyOptions from"../config/currency";import components from"../config/components";const propTypes=components.GiftCardCurrencySelector.propTypes,defaultProps=components.GiftCardCurrencySelector.defaultProps,displayName=components.GiftCardCurrencySelector.displayName;export function GiftCardCurrencySelector(props){return _jsx(BaseSelect,{options:currencyOptions,name:"currencyCode",...props})}GiftCardCurrencySelector.propTypes=propTypes,GiftCardCurrencySelector.defaultProps=defaultProps,GiftCardCurrencySelector.displayName=displayName;export default GiftCardCurrencySelector;

package/lib/esm/components/GiftCardInput.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { BaseInputComponentProps, GiftCardInputName } from '../typings/index';
+declare type Props = {
+    name: GiftCardInputName;
+} & Omit<BaseInputComponentProps, 'name'> & JSX.IntrinsicElements['input'] & JSX.IntrinsicElements['textarea'];
+export declare function GiftCardInput(props: Props): JSX.Element;
+export declare namespace GiftCardInput {
+    var propTypes: {
+        type: import("prop-types").Validator<import("../typings/index").BaseInputType>;
+        name: import("prop-types").Validator<GiftCardInputName>;
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        placeholder: import("prop-types").Requireable<string>;
+    };
+    var displayName: string;
+}
+export default GiftCardInput;

package/lib/esm/components/GiftCardInput.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import BaseInput from"./utils/BaseInput";import components from"../config/components";const propTypes=components.GiftCardInput.propTypes,displayName=components.GiftCardInput.displayName;export function GiftCardInput(props){const{placeholder="",...p}=props;return _jsx(BaseInput,{placeholder,...p})}GiftCardInput.propTypes=propTypes,GiftCardInput.displayName=displayName;export default GiftCardInput;

package/lib/esm/components/GiftCardOrCouponCode.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import { FunctionChildren } from '../typings/index';
+import type { CodeType } from '../reducers/OrderReducer';
+declare type ChildrenProps = Omit<Props, 'children'> & {
+    code?: string;
+    hide?: boolean;
+    discountAmountCents?: string;
+    discountAmountFloat?: string;
+    formattedDiscountAmount?: string;
+};
+declare type GiftCardOrCouponCodeChildrenProps = FunctionChildren<ChildrenProps>;
+declare type Props = {
+    type?: CodeType;
+    children?: GiftCardOrCouponCodeChildrenProps;
+} & JSX.IntrinsicElements['span'];
+export declare function GiftCardOrCouponCode({ children, type, ...props }: Props): JSX.Element | null;
+export declare namespace GiftCardOrCouponCode {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        type: import("prop-types").Requireable<CodeType>;
+    };
+    var displayName: string;
+}
+export default GiftCardOrCouponCode;

package/lib/esm/components/GiftCardOrCouponCode.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import components from"../config/components";import Parent from"./utils/Parent";import OrderContext from"../context/OrderContext";import has from"lodash/has";import isEmpty from"lodash/isEmpty";const propTypes=components.GiftCardOrCouponCode.propTypes,displayName=components.GiftCardOrCouponCode.displayName;export function GiftCardOrCouponCode({children,type,...props}){const{order}=useContext(OrderContext);let codeType=type&&`${type}_code`;!type&&order&&has(order,"coupon_code")&&!isEmpty(order.coupon_code)?codeType="coupon_code":type||(codeType="gift_card_code");const code=order&&codeType?order[codeType]:"",hide=!(order&&code),parentProps={...props,code,hide,discountAmountCents:order?.discount_amount_cents,discountAmountFloat:order?.discount_amount_float,formattedDiscountAmount:order?.formatted_discount_amount};return children?_jsx(Parent,{...parentProps,children}):hide?null:_jsx("span",{...props,children:code})}GiftCardOrCouponCode.propTypes=propTypes,GiftCardOrCouponCode.displayName=displayName;export default GiftCardOrCouponCode;

package/lib/esm/components/GiftCardOrCouponForm.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+declare type Props = {
+    children: ReactNode;
+    onSubmit?: (response: {
+        success: boolean;
+        value: string;
+    }) => void;
+} & Omit<JSX.IntrinsicElements['form'], 'onSubmit'>;
+export declare function GiftCardOrCouponForm(props: Props): JSX.Element | null;
+export declare namespace GiftCardOrCouponForm {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+    };
+}
+export default GiftCardOrCouponForm;

package/lib/esm/components/GiftCardOrCouponForm.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useRapidForm}from"rapid-form";import{useContext,useEffect,useRef,useState}from"react";import CouponAndGiftCardFormContext from"../context/CouponAndGiftCardFormContext";import OrderContext from"../context/OrderContext";import isEmpty from"lodash/isEmpty";import components from"../config/components";import camelCase from"lodash/camelCase";import dropWhile from"lodash/dropWhile";import has from"lodash/has";import{findIndex}from"lodash";const propTypes=components.GiftCardOrCouponForm.propTypes;export function GiftCardOrCouponForm(props){const{children,autoComplete="on",onSubmit,...p}=props,{validation,values,reset}=useRapidForm(),[codeType,setCodeType]=useState("gift_card_or_coupon_code"),{setGiftCardOrCouponCode,order,errors,setOrderErrors}=useContext(OrderContext),ref=useRef(null),inputName="gift_card_or_coupon_code";useEffect(()=>{if(values[inputName]?.value===""&&findIndex(errors,{field:camelCase(inputName)})!==-1){const err=dropWhile(errors,i=>i.field===camelCase(inputName));setOrderErrors(err),onSubmit&&onSubmit({value:values[inputName]?.value,success:!1})}values[inputName]?.value===""&&(setOrderErrors([]),onSubmit&&onSubmit({value:values[inputName]?.value,success:!1}))},[values]),useEffect(()=>{order?.gift_card_code&&!order?.coupon_code&&setCodeType("coupon_code"),!order?.gift_card_code&&order?.coupon_code&&setCodeType("gift_card_code"),!order?.gift_card_code&&!order?.coupon_code&&setCodeType("gift_card_or_coupon_code")},[order]);const handleSubmit=async e=>{e.preventDefault();const code=has(values,inputName)?values[inputName].value:void 0;if(code){const{success}=await setGiftCardOrCouponCode({code,codeType}),value=values[inputName]?.value;onSubmit&&onSubmit({success,value}),success&&reset(e)}};return order?.gift_card_code&&order?.coupon_code||isEmpty(order)?null:_jsx(CouponAndGiftCardFormContext.Provider,{value:{validation,codeType},children:_jsx("form",{ref,autoComplete,onSubmit:handleSubmit,...p,children})})}GiftCardOrCouponForm.propTypes=propTypes;export default GiftCardOrCouponForm;

package/lib/esm/components/GiftCardOrCouponInput.d.ts

@@ -0,0 +1,19 @@
+/// <reference types="react" />
+import { BaseInputComponentProps } from '../typings/index';
+import { OrderCodeType } from '../reducers/OrderReducer';
+declare type Props = {
+    name?: 'gift_card_or_coupon_code';
+    type?: 'text';
+    placeholderTranslation?: (codeType: OrderCodeType) => string;
+} & Omit<BaseInputComponentProps, 'name' | 'type'> & JSX.IntrinsicElements['input'] & JSX.IntrinsicElements['textarea'];
+export declare function GiftCardOrCouponInput(props: Props): JSX.Element;
+export declare namespace GiftCardOrCouponInput {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        placeholder: import("prop-types").Requireable<string>;
+        disabled: import("prop-types").Requireable<boolean>;
+        required: import("prop-types").Requireable<boolean>;
+    };
+    var displayName: string;
+}
+export default GiftCardOrCouponInput;

package/lib/esm/components/GiftCardOrCouponInput.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import components from"../config/components";import BaseInput from"./utils/BaseInput";import CouponAndGiftCardFormContext from"../context/CouponAndGiftCardFormContext";const propTypes=components.GiftCardOrCouponInput.propTypes,displayName=components.GiftCardOrCouponInput.displayName;export function GiftCardOrCouponInput(props){const{placeholder="",required,value,placeholderTranslation,...p}=props,{validation,codeType}=useContext(CouponAndGiftCardFormContext);let placeholderLabel=placeholder;return placeholderTranslation&&codeType&&(placeholderLabel=placeholderTranslation(codeType)),_jsx(BaseInput,{type:"text",name:"gift_card_or_coupon_code",ref:validation,required:required!==void 0?required:!0,placeholder:placeholderLabel,defaultValue:value,...p})}GiftCardOrCouponInput.propTypes=propTypes,GiftCardOrCouponInput.displayName=displayName;export default GiftCardOrCouponInput;

package/lib/esm/components/GiftCardOrCouponRemoveButton.d.ts

@@ -0,0 +1,26 @@
+import { ReactNode } from 'react';
+import { FunctionChildren } from '../typings/index';
+import { CodeType, OrderCodeType } from '../reducers/OrderReducer';
+declare type GiftCardOrCouponRemoveButtonChildrenProps = FunctionChildren<Omit<Props, 'children'> & {
+    codeType?: OrderCodeType;
+    hide?: boolean;
+    handleClick?: () => void;
+}>;
+declare type Props = {
+    type?: CodeType;
+    children?: GiftCardOrCouponRemoveButtonChildrenProps;
+    label?: string | ReactNode;
+    onClick?: (response: {
+        success: boolean;
+    }) => void;
+} & Omit<JSX.IntrinsicElements['button'], 'type'>;
+export declare function GiftCardOrCouponRemoveButton(props: Props): JSX.Element | null;
+export declare namespace GiftCardOrCouponRemoveButton {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        type: import("prop-types").Requireable<CodeType>;
+        label: import("prop-types").Requireable<string | object>;
+    };
+    var displayName: string;
+}
+export default GiftCardOrCouponRemoveButton;

package/lib/esm/components/GiftCardOrCouponRemoveButton.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import Parent from"./utils/Parent";import components from"../config/components";import OrderContext from"../context/OrderContext";import{has,isEmpty}from"lodash";const propTypes=components.GiftCardOrCouponRemoveButton.propTypes,displayName=components.GiftCardOrCouponRemoveButton.displayName;export function GiftCardOrCouponRemoveButton(props){const{children,label="Remove",onClick,type,...p}=props,{order,removeGiftCardOrCouponCode}=useContext(OrderContext);let codeType=`${type}_code`;!type&&order&&has(order,"coupon_code")&&!isEmpty(order.coupon_code)?codeType="coupon_code":type||(codeType="gift_card_code");const code=order&&codeType?order[codeType]:"",hide=!(order&&code),handleClick=async()=>{const response=removeGiftCardOrCouponCode&&await removeGiftCardOrCouponCode({codeType});onClick&&onClick(response)},parentProps={...p,label,handleClick,codeType};return children?_jsx(Parent,{...parentProps,children}):hide?null:_jsx("button",{type:"button",onClick:handleClick,...p,children:label})}GiftCardOrCouponRemoveButton.propTypes=propTypes,GiftCardOrCouponRemoveButton.displayName=displayName;export default GiftCardOrCouponRemoveButton;

package/lib/esm/components/GiftCardOrCouponSubmit.d.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+import { FunctionChildren } from '../typings/index';
+declare type GiftCardOrCouponSubmitChildrenProps = FunctionChildren<Omit<Props, 'children'>>;
+declare type Props = {
+    children?: GiftCardOrCouponSubmitChildrenProps;
+    label?: string | ReactNode;
+} & JSX.IntrinsicElements['button'];
+export declare function GiftCardOrCouponSubmit(props: Props): JSX.Element;
+export declare namespace GiftCardOrCouponSubmit {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        label: import("prop-types").Requireable<string | object>;
+    };
+    var displayName: string;
+}
+export default GiftCardOrCouponSubmit;

package/lib/esm/components/GiftCardOrCouponSubmit.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import Parent from"./utils/Parent";import components from"../config/components";const propTypes=components.GiftCardOrCouponSubmit.propTypes,displayName=components.GiftCardOrCouponSubmit.displayName;export function GiftCardOrCouponSubmit(props){const{children,label="Submit",...p}=props,parentProps={...p,label};return children?_jsx(Parent,{...parentProps,children}):_jsx("button",{type:"submit",...p,children:label})}GiftCardOrCouponSubmit.propTypes=propTypes,GiftCardOrCouponSubmit.displayName=displayName;export default GiftCardOrCouponSubmit;

package/lib/esm/components/GiftCardRecipient.js

@@ -0,0 +1 @@
+"use strict";

package/lib/esm/components/GiftCardRecipientInput.js

@@ -0,0 +1 @@
+"use strict";

package/lib/esm/components/ItemContainer.d.ts

@@ -0,0 +1,22 @@
+import { ReactNode } from 'react';
+declare type Props = {
+    children: ReactNode;
+    skuCode?: string | null;
+    lineItem?: {
+        name: string;
+        imageUrl?: string | null;
+    } | null;
+};
+export declare function ItemContainer(props: Props): JSX.Element;
+export declare namespace ItemContainer {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+        skuCode: import("prop-types").Requireable<string>;
+        lineItem: import("prop-types").Requireable<import("prop-types").InferProps<{
+            name: import("prop-types").Validator<string>;
+            imageUrl: import("prop-types").Requireable<string>;
+        }>>;
+    };
+    var displayName: string;
+}
+export default ItemContainer;

package/lib/esm/components/ItemContainer.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useReducer,useEffect}from"react";import ItemContext,{initialItemContext}from"../context/ItemContext";import itemReducer,{itemInitialState,setItemState}from"../reducers/ItemReducer";import components from"../config/components";const propTypes=components.ItemContainer.propTypes,displayName=components.ItemContainer.displayName;export function ItemContainer(props){const{children,skuCode,lineItem}=props,[state,dispatch]=useReducer(itemReducer,itemInitialState);useEffect(()=>{const code=skuCode;code&&setItemState(code,{type:"setSkuCode",key:"skuCode"},dispatch),lineItem&&setItemState(lineItem,{type:"setCustomLineItem",key:"lineItem"},dispatch)},[]);const itemValue={...initialItemContext,...state,setItems:items=>setItemState(items,{type:"setItems",key:"items"},dispatch),setItem:item=>setItemState(item,{type:"setItem",key:"item"},dispatch),setQuantity:item=>setItemState(item,{type:"setQuantity",key:"quantity"},dispatch),setOption:item=>setItemState(item,{type:"setOption",key:"option"},dispatch),setPrices:item=>setItemState(item,{type:"setPrices",key:"prices"},dispatch),setCustomLineItems:item=>setItemState(item,{type:"setCustomLineItems",key:"lineItems"},dispatch),setSkuCode:code=>setItemState(code,{type:"setSkuCode",key:"skuCode"},dispatch)};return _jsx(ItemContext.Provider,{value:itemValue,children})}ItemContainer.propTypes=propTypes,ItemContainer.displayName=displayName;export default ItemContainer;

package/lib/esm/components/KlarnaPayment.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { PaymentMethodConfig } from '../reducers/PaymentMethodReducer';
+import { PaymentSourceProps } from './PaymentSource';
+declare type KlarnaPaymentProps = PaymentMethodConfig['klarnaPayment'] & JSX.IntrinsicElements['div'] & Partial<PaymentSourceProps['templateCustomerSaveToWallet']> & {
+    show?: boolean;
+    clientToken: string;
+    locale?: string;
+};
+export default function KlarnaPayment({ clientToken, placeOrderCallback, locale, ...p }: KlarnaPaymentProps): JSX.Element;
+export {};

package/lib/esm/components/KlarnaPayment.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useRef,useState}from"react";import PaymentMethodContext from"../context/PaymentMethodContext";import OrderContext from"../context/OrderContext";import useExternalScript from"../utils/hooks/useExternalScript";import PlaceOrderContext from"../context/PlaceOrderContext";function typeOfLine(lineItemType){switch(lineItemType){case"payment_methods":default:return null;case"percentage_discount_promotions":return"discount";case"shipments":return"shipping_fee";case"skus":return"physical"}}function klarnaOrderLines(lineItems){return lineItems?lineItems.map(item=>{const type=item.item_type?typeOfLine(item.item_type):null;return{name:item.name,quantity:item.quantity,total_amount:item.total_amount_cents,unit_price:item.unit_amount_cents,type}}):[]}export default function KlarnaPayment({clientToken,placeOrderCallback,locale="EN",...p}){const ref=useRef(null),{paymentSource,currentPaymentMethodType,setPaymentRef,setPaymentSource,setPaymentMethodErrors}=useContext(PaymentMethodContext),{order}=useContext(OrderContext),{setPlaceOrder}=useContext(PlaceOrderContext),loaded=useExternalScript("https://x.klarnacdn.net/kp/lib/v1/api.js"),[klarna,setKlarna]=useState(),{containerClassName,...divProps}=p;useEffect(()=>{loaded&&window?.Klarna!==void 0&&setKlarna(window.Klarna)},[loaded,window.Klarna]),useEffect(()=>(ref.current&&paymentSource&&currentPaymentMethodType&&loaded&&klarna&&(ref.current.onsubmit=()=>handleClick(klarna),setPaymentRef({ref})),()=>{setPaymentRef({ref:{current:null}})}),[ref,paymentSource,currentPaymentMethodType,loaded,klarna]);const handleClick=async kl=>{const[first]=paymentSource?.payment_methods||void 0,payment_method_category=first?.identifier,billing_address={given_name:order?.billing_address?.first_name,family_name:order?.billing_address?.last_name,email:order?.customer_email,street_address:order?.billing_address?.line_1,street_address2:null,organization_name:null,postal_code:order?.billing_address?.zip_code,city:order?.billing_address?.city,region:order?.billing_address?.state_code,phone:order?.billing_address?.phone,country:order?.billing_address?.country_code},shipping_address={given_name:order?.shipping_address?.first_name,family_name:order?.shipping_address?.last_name,email:order?.customer_email,street_address:order?.shipping_address?.line_1,street_address2:null,postal_code:order?.shipping_address?.zip_code,organization_name:null,city:order?.shipping_address?.city,region:order?.shipping_address?.state_code,phone:order?.shipping_address?.phone,country:order?.shipping_address?.country_code},klarnaData={merchant_data:order?.id,purchase_country:order?.country_code,purchase_currency:order?.currency_code,locale,shipping_address,billing_address,order_amount:order?.total_amount_cents,order_lines:klarnaOrderLines(order?.line_items)};try{kl.Payments.load({container:"#klarna-payments-container",payment_method_category},{billing_address,shipping_address},async function({show_form}){if(show_form)try{await kl.Payments.authorize({payment_method_category},klarnaData,async function(res){if(res.approved&&paymentSource&&currentPaymentMethodType){const ps=await setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:currentPaymentMethodType,attributes:{auth_token:res.authorization_token}}),{placed}=setPlaceOrder&&ps&&await setPlaceOrder({paymentSource:ps})||{placed:!1};placed&&placeOrderCallback&&placeOrderCallback({placed})}})}catch(e){console.error("e",e),setPaymentMethodErrors([{code:"PAYMENT_INTENT_AUTHENTICATION_FAILURE",resource:"payment_methods",field:currentPaymentMethodType,message:"Authorization error"}])}})}catch(e){console.error("Load Klarna libray",e)}};if(klarna&&clientToken){const[first]=paymentSource?.payment_methods||void 0;klarna.Payments.init({client_token:clientToken}),klarna.Payments.load({container:"#klarna-payments-container",payment_method_category:first?.identifier},{billing_address:{given_name:order?.billing_address?.first_name,family_name:order?.billing_address?.last_name,email:order?.customer_email,street_address:order?.billing_address?.line_1,street_address2:order?.billing_address?.line_2,postal_code:order?.billing_address?.zip_code,city:order?.billing_address?.city,region:order?.billing_address?.state_code,phone:order?.billing_address?.phone,country:order?.billing_address?.country_code},shipping_address:{given_name:order?.shipping_address?.first_name,family_name:order?.shipping_address?.last_name,street_address:order?.shipping_address?.line_1,street_address2:order?.shipping_address?.line_2,postal_code:order?.shipping_address?.zip_code,city:order?.shipping_address?.city,region:order?.shipping_address?.state_code,phone:order?.shipping_address?.phone,country:order?.shipping_address?.country_code}})}return _jsx("form",{ref,children:_jsx("div",{className:containerClassName,...divProps,children:_jsx("div",{id:"klarna-payments-container"})})})}

package/lib/esm/components/LineItem.d.ts

@@ -0,0 +1,15 @@
+import { ReactNode } from 'react';
+import { LineItemType } from '../typings/index';
+declare type Props = {
+    children: ReactNode;
+    type?: LineItemType;
+};
+export declare function LineItem(props: Props): JSX.Element;
+export declare namespace LineItem {
+    var propTypes: {
+        children: import("prop-types").Validator<boolean | import("react").ReactChild | import("react").ReactFragment | import("react").ReactPortal | (() => ReactNode)>;
+        type: import("prop-types").Requireable<LineItemType>;
+    };
+    var displayName: string;
+}
+export default LineItem;

package/lib/esm/components/LineItem.js

@@ -0,0 +1 @@
+import{jsx as _jsx,Fragment as _Fragment}from"react/jsx-runtime";import{useContext}from"react";import LineItemContext from"../context/LineItemContext";import LineItemChildrenContext from"../context/LineItemChildrenContext";import components from"../config/components";import ShipmentChildrenContext from"../context/ShipmentChildrenContext";const propTypes=components.LineItem.propTypes,displayName=components.LineItem.displayName;export function LineItem(props){const{type="skus",children}=props,{lineItems}=useContext(LineItemContext),{lineItems:shipmentLineItems}=useContext(ShipmentChildrenContext),items=shipmentLineItems&&shipmentLineItems?.length>0?shipmentLineItems:lineItems,components2=items&&items.filter(l=>l.item_type===type).map((lineItem,k,check)=>{if(lineItem.item_type==="bundles"&&k>0&&check[k-1]?.bundle_code===lineItem.bundle_code||lineItem.item_type==="gift_cards"&&lineItem?.total_amount_cents&&lineItem?.total_amount_cents<=0)return null;const lineProps={lineItem};return _jsx(LineItemChildrenContext.Provider,{value:lineProps,children},k)});return _jsx(_Fragment,{children:components2})}LineItem.propTypes=propTypes,LineItem.displayName=displayName;export default LineItem;

package/lib/esm/components/LineItemAmount.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { BaseAmountComponent, BasePriceType } from '../typings/index';
+declare type Props = BaseAmountComponent & {
+    type?: BasePriceType;
+};
+export declare function LineItemAmount(props: Props): JSX.Element;
+export declare namespace LineItemAmount {
+    var propTypes: {
+        type: import("prop-types").Requireable<BasePriceType>;
+        id: import("prop-types").Requireable<string>;
+        className: import("prop-types").Requireable<string>;
+        style: import("prop-types").Requireable<object>;
+        name: import("prop-types").Requireable<string>;
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+        format: import("prop-types").Requireable<import("../typings/index").BaseFormatPrice>;
+    };
+    var defaultProps: Props;
+    var displayName: string;
+}
+export default LineItemAmount;

package/lib/esm/components/LineItemAmount.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useState,useEffect,useContext}from"react";import getAmount from"../utils/getAmount";import LineItemChildrenContext from"../context/LineItemChildrenContext";import Parent from"./utils/Parent";import components from"../config/components";const propTypes=components.LineItemAmount.propTypes,defaultProps=components.LineItemAmount.defaultProps,displayName=components.LineItemAmount.displayName;export function LineItemAmount(props){const{format="formatted",type="total",...p}=props,{lineItem}=useContext(LineItemChildrenContext),[price,setPrice]=useState("");useEffect(()=>{if(lineItem){const p2=getAmount({base:"amount",type,format,obj:lineItem});setPrice(p2)}return()=>{setPrice("")}},[lineItem]);const parentProps={price,...p};return props.children?_jsx(Parent,{...parentProps,children:props.children}):_jsx("span",{...p,children:price})}LineItemAmount.propTypes=propTypes,LineItemAmount.defaultProps=defaultProps,LineItemAmount.displayName=displayName;export default LineItemAmount;

package/lib/esm/components/LineItemCode.d.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+import { LineItem } from '@commercelayer/sdk';
+export declare type LineItemCodeType = Omit<Props, 'children'> & {
+    lineItem: LineItem;
+    skuCode: string;
+};
+declare type Props = {
+    children?: (props: LineItemCodeType) => ReactNode;
+    type?: 'sku_code' | 'bundle_code';
+} & JSX.IntrinsicElements['p'];
+export declare function LineItemCode({ type, children, ...p }: Props): JSX.Element;
+export declare namespace LineItemCode {
+    var propTypes: {
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    var displayName: string;
+}
+export default LineItemCode;

package/lib/esm/components/LineItemCode.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import LineItemChildrenContext from"../context/LineItemChildrenContext";import Parent from"./utils/Parent";import components from"../config/components";const propTypes=components.LineItemCode.propTypes,displayName=components.LineItemCode.displayName;export function LineItemCode({type="sku_code",children,...p}){const{lineItem}=useContext(LineItemChildrenContext),labelName=lineItem?.[type],parentProps={lineItem,skuCode:labelName,...p};return children?_jsx(Parent,{...parentProps,children}):_jsx("p",{...p,children:labelName})}LineItemCode.propTypes=propTypes,LineItemCode.displayName=displayName;export default LineItemCode;

package/lib/esm/components/LineItemImage.d.ts

@@ -0,0 +1,23 @@
+import { ReactNode } from 'react';
+import { LineItem } from '@commercelayer/sdk';
+import { LineItemType } from '../typings/index';
+export declare type LineItemImageType = Omit<Props, 'children'> & {
+    src: string;
+    lineItem: LineItem;
+};
+declare type Props = {
+    children?: (props: LineItemImageType) => ReactNode;
+    width?: number;
+    placeholder?: {
+        [K in LineItemType]?: string;
+    };
+} & Omit<JSX.IntrinsicElements['img'], 'src' | 'srcSet' | 'placeholder'>;
+export declare function LineItemImage(props: Props): JSX.Element | null;
+export declare namespace LineItemImage {
+    var propTypes: {
+        width: import("prop-types").Requireable<number>;
+        children: import("prop-types").Requireable<(...args: any[]) => any>;
+    };
+    var displayName: string;
+}
+export default LineItemImage;

package/lib/esm/components/LineItemImage.js

@@ -0,0 +1 @@
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext}from"react";import Parent from"./utils/Parent";import LineItemChildrenContext from"../context/LineItemChildrenContext";import components from"../config/components";import{defaultGiftCardImgUrl,defaultImgUrl}from"../utils/placeholderImages";const propTypes=components.LineItemImage.propTypes,displayName=components.LineItemImage.displayName;export function LineItemImage(props){const{placeholder,children,...p}=props,{lineItem}=useContext(LineItemChildrenContext),itemType=lineItem?.item_type;let src=lineItem?.image_url;src||(placeholder?.[itemType]?src=placeholder?.[itemType]:src=itemType==="gift_cards"?defaultGiftCardImgUrl:defaultImgUrl);const parenProps={lineItem,src,placeholder,...p};return children?_jsx(Parent,{...parenProps,children}):src?_jsx("img",{alt:"",src,...p}):null}LineItemImage.propTypes=propTypes,LineItemImage.displayName=displayName;export default LineItemImage;