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

package/lib/cjs/components/orders/OrderListPaginationInfo.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 type TAsComponent = keyof Pick<JSX.IntrinsicElements, 'p' | 'span' | 'div'>;
 type ChildrenProps<A extends TAsComponent> = Omit<Props<A>, 'children'> & {

package/lib/cjs/components/orders/OrderListRow.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type TOrderList, type OrderListContent, type TableAccessor } from '../../context/OrderListChildrenContext';
 import { type Row } from '@tanstack/react-table';
 interface ChildrenProps extends Omit<Props, 'children'> {

package/lib/cjs/components/orders/OrderNumber.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseFieldProps } from '../utils/BaseField';
 type Props = Omit<BaseFieldProps, 'attribute'>;
 export declare function OrderNumber(props: Props): JSX.Element;

package/lib/cjs/components/orders/OrderStorage.d.ts

@@ -1,8 +1,31 @@
 import { type ReactNode } from 'react';
 interface Props {
     children: ReactNode;
+    /**
+     * The key used to persist the order id in the browser local storage.
+     */
     persistKey: string;
+    /**
+     * Removes the saved order id from the local storage when order is placed.
+     * @default true
+     */
     clearWhenPlaced?: boolean;
 }
+/**
+ * This component handle the persistence of the order id in the browser local storage.
+ * When adding a product into the cart and the order does not exist yet, in will be created by the `OrderContainer` and
+ * the order id will then be automatically saved in the local storage using `OrderStorage` context.
+ * In this way on page refresh or components remounting, the `OrderContainer` will be able to load the order getting the id from this context.
+ *
+ * By default, the localStorage key will be deleted once the order has been placed, but you can disable this behavior via `clearWhenPlaced` prop.
+ *
+ * <span title="Requirement" type="warning">
+ * Must be a child of the `<CommerceLayer>` component. <br />
+ * </span>
+ *
+ * <span title="Children" type="info">
+ * `<OrderContainer>`,
+ * </span>
+ */
 export declare function OrderStorage(props: Props): JSX.Element;
 export default OrderStorage;

package/lib/cjs/components/orders/PaymentMethodAmount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 export declare function PaymentMethodAmount(props: BaseAmountComponent): JSX.Element;
 export default PaymentMethodAmount;

package/lib/cjs/components/orders/PrivacyAndTermsCheckbox.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseInputProps } from '../utils/BaseInput';
 export declare function PrivacyAndTermsCheckbox(props: Partial<BaseInputProps>): JSX.Element;
 export default PrivacyAndTermsCheckbox;

package/lib/cjs/components/orders/ShippingAmount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 export declare function ShippingAmount(props: BaseAmountComponent): JSX.Element;
 export default ShippingAmount;

package/lib/cjs/components/orders/SubTotalAmount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 export declare function SubTotalAmount(props: BaseAmountComponent): JSX.Element;
 export default SubTotalAmount;

package/lib/cjs/components/orders/TaxesAmount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 export declare function TaxesAmount(props: BaseAmountComponent): JSX.Element;
 export default TaxesAmount;

package/lib/cjs/components/orders/TotalAmount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 export declare function TotalAmount(props: BaseAmountComponent): JSX.Element;
 export default TotalAmount;

package/lib/cjs/components/parcels/ParcelField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ConditionalElement } from '../../typings/index';
 import { type TGenericChildrenProps, type TResources } from '../utils/GenericFieldComponent';
 type ParcelFieldChildrenProps = TGenericChildrenProps<TResources['Parcel']>;

package/lib/cjs/components/parcels/ParcelLineItem.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { DefaultChildrenType } from '../../typings/globals';
 interface Props {
     children: DefaultChildrenType;

package/lib/cjs/components/parcels/ParcelLineItemField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ConditionalElement } from '../../typings/index';
 import { type TGenericChildrenProps, type TResources } from '../utils/GenericFieldComponent';
 type ParcelLineItemFieldChildrenProps = TGenericChildrenProps<TResources['ParcelLineItem']>;

package/lib/cjs/components/parcels/ParcelLineItemsCount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 import type { Parcel } from '@commercelayer/sdk';
 interface ChildrenProps extends Omit<Props, 'children'> {

package/lib/cjs/components/parcels/Parcels.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     children: JSX.Element | JSX.Element[];
     filterBy?: string[];

package/lib/cjs/components/parcels/ParcelsCount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 import type { Parcel } from '@commercelayer/sdk';
 interface ChildrenProps extends Omit<Props, 'children'> {

package/lib/cjs/components/payment_gateways/AdyenGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function AdyenGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/BraintreeGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function BraintreeGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/CheckoutComGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function CheckoutComGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/ExternalGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function ExternalGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/KlarnaGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function KlarnaGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/PaymentGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type LoaderType } from '../../typings/index';
 import { type PaymentSourceProps } from '../payment_source/PaymentSource';
 export type GatewayBaseType = Props & {

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

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway"));function PaymentGateway(_a){var _b,{readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading..."}=_a,p=tslib_1.__rest(_a,["readonly","showCard","handleEditClick","children","templateCustomerCards","templateCustomerSaveToWallet","onClickCustomerCards","show","loader"]);const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{var _a2;if(payment?.id===currentPaymentMethodId&&paymentResource&&((_a2=order?.payment_method)===null||_a2===void 0?void 0:_a2.payment_source_type)===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()});(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&setLoading(!1),()=>{setLoading(!0)}},[(_b=order?.payment_method)===null||_b===void 0?void 0:_b.id,show,paymentSource]);const gatewayConfig=Object.assign({readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet},p);switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,Object.assign({},gatewayConfig,{children}));case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,Object.assign({},gatewayConfig,{children}));case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,Object.assign({},gatewayConfig,{children}));case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,Object.assign({},gatewayConfig,{children}));case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,Object.assign({},gatewayConfig,{children}));case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,Object.assign({},gatewayConfig,{children}));default:return null}}exports.PaymentGateway=PaymentGateway,exports.default=PaymentGateway;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentGateway=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react"),getLoaderComponent_1=tslib_1.__importDefault(require("../../utils/getLoaderComponent")),AdyenGateway_1=tslib_1.__importDefault(require("./AdyenGateway")),StripeGateway_1=tslib_1.__importDefault(require("./StripeGateway")),BraintreeGateway_1=tslib_1.__importDefault(require("./BraintreeGateway")),PaypalGateway_1=tslib_1.__importDefault(require("./PaypalGateway")),WireTransferGateway_1=tslib_1.__importDefault(require("./WireTransferGateway")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),CheckoutComGateway_1=tslib_1.__importDefault(require("./CheckoutComGateway")),KlarnaGateway_1=tslib_1.__importDefault(require("./KlarnaGateway")),getPaymentAttributes_1=require("../../utils/getPaymentAttributes"),ExternalGateway_1=tslib_1.__importDefault(require("./ExternalGateway"));function PaymentGateway(_a){var _b,{readonly,showCard,handleEditClick,children,templateCustomerCards,templateCustomerSaveToWallet,onClickCustomerCards,show,loader="Loading..."}=_a,p=tslib_1.__rest(_a,["readonly","showCard","handleEditClick","children","templateCustomerCards","templateCustomerSaveToWallet","onClickCustomerCards","show","loader"]);const loaderComponent=(0,getLoaderComponent_1.default)(loader),[loading,setLoading]=(0,react_1.useState)(!0),{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{getCustomerPaymentSources}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,config,currentPaymentMethodType,setPaymentSource,paymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),paymentResource=readonly?currentPaymentMethodType:payment?.payment_source_type;(0,react_1.useEffect)(()=>{var _a2;if(payment?.id===currentPaymentMethodId&&paymentResource&&((_a2=order?.payment_method)===null||_a2===void 0?void 0:_a2.payment_source_type)===paymentResource&&!expressPayments){let attributes={};config!=null&&paymentResource==="paypal_payments"&&(attributes=(0,getPaymentAttributes_1.getPaypalAttributes)(paymentResource,config)),config!=null&&paymentResource==="external_payments"&&(attributes=(0,getPaymentAttributes_1.getExternalPaymentAttributes)(paymentResource,config)),config!=null&&paymentResource==="stripe_payments"&&(attributes=(0,getPaymentAttributes_1.getStripeAttributes)(paymentResource,config),attributes!=null&&attributes.return_url==null&&(attributes.return_url=window.location.href));const setPaymentSources=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){yield setPaymentSource({paymentResource,order,attributes}),getCustomerPaymentSources&&getCustomerPaymentSources()});(!paymentSource&&order?.payment_method.id&&show&&!expressPayments||(!paymentSource&&!expressPayments||paymentSource?.type!==paymentResource)&&show)&&setPaymentSources(),paymentSource?.mismatched_amounts&&show&&setPaymentSources(),setLoading(!1)}return expressPayments&&show&&setLoading(!1),()=>{setLoading(!0)}},[(_b=order?.payment_method)===null||_b===void 0?void 0:_b.id,show,paymentSource]);const gatewayConfig=Object.assign({readonly,showCard,handleEditClick,children,templateCustomerCards,show,loading,onClickCustomerCards,loaderComponent,templateCustomerSaveToWallet},p);switch(paymentResource){case"adyen_payments":return(0,jsx_runtime_1.jsx)(AdyenGateway_1.default,Object.assign({},gatewayConfig,{children}));case"braintree_payments":return(0,jsx_runtime_1.jsx)(BraintreeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"checkout_com_payments":return(0,jsx_runtime_1.jsx)(CheckoutComGateway_1.default,Object.assign({},gatewayConfig,{children}));case"external_payments":return(0,jsx_runtime_1.jsx)(ExternalGateway_1.default,Object.assign({},gatewayConfig,{children}));case"klarna_payments":return(0,jsx_runtime_1.jsx)(KlarnaGateway_1.default,Object.assign({},gatewayConfig,{children}));case"stripe_payments":return(0,jsx_runtime_1.jsx)(StripeGateway_1.default,Object.assign({},gatewayConfig,{children}));case"wire_transfers":return(0,jsx_runtime_1.jsx)(WireTransferGateway_1.default,Object.assign({},gatewayConfig,{children}));case"paypal_payments":return(0,jsx_runtime_1.jsx)(PaypalGateway_1.default,Object.assign({},gatewayConfig,{children}));default:return null}}exports.PaymentGateway=PaymentGateway,exports.default=PaymentGateway;

package/lib/cjs/components/payment_gateways/PaypalGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = Partial<GatewayBaseType>;
 export declare function PaypalGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/StripeGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function StripeGateway(props: Props): JSX.Element | null;

package/lib/cjs/components/payment_gateways/WireTransferGateway.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type GatewayBaseType } from '../payment_gateways/PaymentGateway';
 type Props = GatewayBaseType;
 export declare function WireTransferGateway(props: Props): JSX.Element | null;

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { LoaderType } from '../../typings/index';
 import type { Order, PaymentMethod as PaymentMethodType } from '@commercelayer/sdk';
 import type { PaymentResource } from '../../reducers/PaymentMethodReducer';

package/lib/cjs/components/payment_methods/PaymentMethodName.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 interface ChildrenProps extends Omit<Props, 'children'> {
     labelName: string;

package/lib/cjs/components/payment_methods/PaymentMethodPrice.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 interface Props extends BaseAmountComponent {
     type?: 'amount';

package/lib/cjs/components/payment_source/BraintreePayment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type PaymentSourceProps } from './PaymentSource';
 import { type HostedFieldFieldOptions } from 'braintree-web';
 type BraintreeHostedFields<Type> = {

package/lib/cjs/components/payment_source/CheckoutComPayment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type PaymentMethodConfig } from '../../reducers/PaymentMethodReducer';
 import { type PaymentSourceProps } from './PaymentSource';
 import { type FramesStyle } from 'frames-react';

package/lib/cjs/components/payment_source/ExternalPayment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 import type { StripeElementLocale } from '@stripe/stripe-js';
 import { type PaymentSourceProps } from './PaymentSource';

package/lib/cjs/components/payment_source/ExternalPayment.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ExternalPayment=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react");function ExternalPayment(props){const{setPaymentRef}=(0,react_1.useContext)(PaymentMethodContext_1.default),ref=(0,react_1.useRef)(null);return(0,react_1.useEffect)(()=>{ref!==null&&(ref.current.onsubmit=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){return!0}),setPaymentRef({ref}))},[ref]),props?.customComponent!=null&&props.show?(0,jsx_runtime_1.jsxs)("form",{ref,children:[(0,jsx_runtime_1.jsx)(Parent_1.default,{children:props.customComponent}),props?.templateCustomerSaveToWallet!=null&&(0,jsx_runtime_1.jsx)(Parent_1.default,{name:"save_payment_source_to_customer_wallet",children:props.templateCustomerSaveToWallet})]}):null}exports.ExternalPayment=ExternalPayment,exports.default=ExternalPayment;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ExternalPayment=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),Parent_1=tslib_1.__importDefault(require("../utils/Parent")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),react_1=require("react"),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext"));function ExternalPayment(props){const{setPaymentRef}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order,updateOrder}=(0,react_1.useContext)(OrderContext_1.default),ref=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{ref?.current!=null&&(ref.current.onsubmit=()=>tslib_1.__awaiter(this,void 0,void 0,function*(){return!0}),setPaymentRef({ref}))},[ref]);const parentProps=Object.assign(Object.assign({},props),{order,updateOrder});return props?.customComponent!=null&&props.show?(0,jsx_runtime_1.jsxs)("form",{ref,children:[(0,jsx_runtime_1.jsx)(Parent_1.default,Object.assign({},parentProps,{children:props.customComponent})),props?.templateCustomerSaveToWallet!=null&&(0,jsx_runtime_1.jsx)(Parent_1.default,{name:"save_payment_source_to_customer_wallet",children:props.templateCustomerSaveToWallet})]}):null}exports.ExternalPayment=ExternalPayment,exports.default=ExternalPayment;

package/lib/cjs/components/payment_source/KlarnaPayment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type PaymentMethodConfig } from '../../reducers/PaymentMethodReducer';
 import { type PaymentSourceProps } from './PaymentSource';
 type KlarnaPaymentProps = PaymentMethodConfig['klarnaPayment'] & JSX.IntrinsicElements['div'] & Partial<PaymentSourceProps['templateCustomerSaveToWallet']> & {

package/lib/cjs/components/payment_source/KlarnaPayment.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),useExternalScript_1=tslib_1.__importDefault(require("../../utils/hooks/useExternalScript"));function typeOfLine(lineItemType){switch(lineItemType){case"percentage_discount_promotions":return"discount";case"shipments":return"shipping_fee";case"skus":return"physical";case"payment_methods":default:return null}}function klarnaOrderLines(lineItems){return lineItems?lineItems?.map(item=>{const type=item.item_type?typeOfLine(item.item_type):null;return{quantity:item.quantity,total_amount:item.total_amount_cents,unit_price:item.unit_amount_cents,type}}):[]}function KlarnaPayment(_a){var{clientToken,placeOrderCallback,locale="EN"}=_a,p=tslib_1.__rest(_a,["clientToken","placeOrderCallback","locale"]);const ref=(0,react_1.useRef)(null),{paymentSource,currentPaymentMethodType,setPaymentRef,setPaymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),loaded=(0,useExternalScript_1.default)("https://x.klarnacdn.net/kp/lib/v1/api.js"),[klarna,setKlarna]=(0,react_1.useState)(),{containerClassName}=p,divProps=tslib_1.__rest(p,["containerClassName"]);(0,react_1.useEffect)(()=>{loaded&&window?.Klarna!==void 0&&setKlarna(window.Klarna)},[loaded,window.Klarna]),(0,react_1.useEffect)(()=>(ref.current&&paymentSource&&currentPaymentMethodType&&loaded&&klarna&&(ref.current.onsubmit=props=>tslib_1.__awaiter(this,void 0,void 0,function*(){handleClick(klarna,props)}),setPaymentRef({ref})),()=>{setPaymentRef({ref:{current:null}})}),[ref,paymentSource,currentPaymentMethodType,loaded,klarna]);const handleClick=(kl,props)=>{var _a2,_b,_c,_d,_e,_f,_g,_h,_j,_k,_l,_m,_o,_p,_q,_r;console.log("props",props);const[first]=paymentSource?.payment_methods||void 0,paymentMethodCategories=first?.identifier,billingAddress={given_name:(_a2=order?.billing_address)===null||_a2===void 0?void 0:_a2.first_name,family_name:(_b=order?.billing_address)===null||_b===void 0?void 0:_b.last_name,email:order?.customer_email,street_address:(_c=order?.billing_address)===null||_c===void 0?void 0:_c.line_1,street_address2:null,organization_name:null,postal_code:(_d=order?.billing_address)===null||_d===void 0?void 0:_d.zip_code,city:(_e=order?.billing_address)===null||_e===void 0?void 0:_e.city,region:(_f=order?.billing_address)===null||_f===void 0?void 0:_f.state_code,phone:(_g=order?.billing_address)===null||_g===void 0?void 0:_g.phone,country:(_h=order?.billing_address)===null||_h===void 0?void 0:_h.country_code},shippingAddress={given_name:(_j=order?.shipping_address)===null||_j===void 0?void 0:_j.first_name,family_name:(_k=order?.shipping_address)===null||_k===void 0?void 0:_k.last_name,email:order?.customer_email,street_address:(_l=order?.shipping_address)===null||_l===void 0?void 0:_l.line_1,street_address2:null,postal_code:(_m=order?.shipping_address)===null||_m===void 0?void 0:_m.zip_code,organization_name:null,city:(_o=order?.shipping_address)===null||_o===void 0?void 0:_o.city,region:(_p=order?.shipping_address)===null||_p===void 0?void 0:_p.state_code,phone:(_q=order?.shipping_address)===null||_q===void 0?void 0:_q.phone,country:(_r=order?.shipping_address)===null||_r===void 0?void 0:_r.country_code},klarnaData={merchant_data:order?.id,purchase_country:order?.country_code,purchase_currency:order?.currency_code,locale,shipping_address:shippingAddress,billing_address:billingAddress,order_amount:order?.total_amount_cents,order_lines:klarnaOrderLines(order?.line_items),order_tax_amount:order?.total_tax_amount_cents};kl.Payments.authorize(Object.assign({payment_method_category:paymentMethodCategories},klarnaData),function(res){return tslib_1.__awaiter(this,void 0,void 0,function*(){if(console.log("res",res),res.approved&&paymentSource&&currentPaymentMethodType){const ps=yield setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:currentPaymentMethodType,attributes:{auth_token:res.authorization_token}});if(props.setPlaceOrder!=null){const placed=yield props.setPlaceOrder({paymentSource:ps});placed&&props.onclickCallback!=null&&props.onclickCallback(placed)}}})})};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})}return(0,jsx_runtime_1.jsx)("form",{ref,children:(0,jsx_runtime_1.jsx)("div",Object.assign({className:containerClassName},divProps,{children:(0,jsx_runtime_1.jsx)("div",{id:"klarna-payments-container"})}))})}exports.default=KlarnaPayment;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),useExternalScript_1=tslib_1.__importDefault(require("../../utils/hooks/useExternalScript"));function typeOfLine(lineItemType){switch(lineItemType){case"percentage_discount_promotions":return"discount";case"shipments":return"shipping_fee";case"skus":return"physical";case"payment_methods":default:return null}}function klarnaOrderLines(lineItems){return lineItems?lineItems?.map(item=>{const type=item.item_type?typeOfLine(item.item_type):null;return{quantity:item.quantity,total_amount:item.total_amount_cents,unit_price:item.unit_amount_cents,type}}):[]}function KlarnaPayment(_a){var{clientToken,placeOrderCallback,locale="EN"}=_a,p=tslib_1.__rest(_a,["clientToken","placeOrderCallback","locale"]);const ref=(0,react_1.useRef)(null),{paymentSource,currentPaymentMethodType,setPaymentRef,setPaymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),loaded=(0,useExternalScript_1.default)("https://x.klarnacdn.net/kp/lib/v1/api.js"),[klarna,setKlarna]=(0,react_1.useState)(),{containerClassName}=p,divProps=tslib_1.__rest(p,["containerClassName"]);(0,react_1.useEffect)(()=>{loaded&&window?.Klarna!==void 0&&setKlarna(window.Klarna)},[loaded,window.Klarna]),(0,react_1.useEffect)(()=>(ref.current&&paymentSource&&currentPaymentMethodType&&loaded&&klarna&&(ref.current.onsubmit=props=>tslib_1.__awaiter(this,void 0,void 0,function*(){handleClick(klarna,props)}),setPaymentRef({ref})),()=>{setPaymentRef({ref:{current:null}})}),[ref,paymentSource,currentPaymentMethodType,loaded,klarna]);const handleClick=(kl,props)=>{var _a2,_b,_c,_d,_e,_f,_g,_h,_j,_k,_l,_m,_o,_p,_q,_r;const[first]=paymentSource?.payment_methods||void 0,paymentMethodCategories=first?.identifier,billingAddress={given_name:(_a2=order?.billing_address)===null||_a2===void 0?void 0:_a2.first_name,family_name:(_b=order?.billing_address)===null||_b===void 0?void 0:_b.last_name,email:order?.customer_email,street_address:(_c=order?.billing_address)===null||_c===void 0?void 0:_c.line_1,street_address2:null,organization_name:null,postal_code:(_d=order?.billing_address)===null||_d===void 0?void 0:_d.zip_code,city:(_e=order?.billing_address)===null||_e===void 0?void 0:_e.city,region:(_f=order?.billing_address)===null||_f===void 0?void 0:_f.state_code,phone:(_g=order?.billing_address)===null||_g===void 0?void 0:_g.phone,country:(_h=order?.billing_address)===null||_h===void 0?void 0:_h.country_code},shippingAddress={given_name:(_j=order?.shipping_address)===null||_j===void 0?void 0:_j.first_name,family_name:(_k=order?.shipping_address)===null||_k===void 0?void 0:_k.last_name,email:order?.customer_email,street_address:(_l=order?.shipping_address)===null||_l===void 0?void 0:_l.line_1,street_address2:null,postal_code:(_m=order?.shipping_address)===null||_m===void 0?void 0:_m.zip_code,organization_name:null,city:(_o=order?.shipping_address)===null||_o===void 0?void 0:_o.city,region:(_p=order?.shipping_address)===null||_p===void 0?void 0:_p.state_code,phone:(_q=order?.shipping_address)===null||_q===void 0?void 0:_q.phone,country:(_r=order?.shipping_address)===null||_r===void 0?void 0:_r.country_code},klarnaData={merchant_data:order?.id,purchase_country:order?.country_code,purchase_currency:order?.currency_code,locale,shipping_address:shippingAddress,billing_address:billingAddress,order_amount:order?.total_amount_cents,order_lines:klarnaOrderLines(order?.line_items),order_tax_amount:order?.total_tax_amount_cents};kl.Payments.authorize(Object.assign({payment_method_category:paymentMethodCategories},klarnaData),function(res){return tslib_1.__awaiter(this,void 0,void 0,function*(){if(res.approved&&paymentSource&&currentPaymentMethodType){const ps=yield setPaymentSource({paymentSourceId:paymentSource.id,paymentResource:currentPaymentMethodType,attributes:{auth_token:res.authorization_token}});if(props.setPlaceOrder!=null){const placed=yield props.setPlaceOrder({paymentSource:ps});placed&&props.onclickCallback!=null&&props.onclickCallback(placed)}}})})};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})}return(0,jsx_runtime_1.jsx)("form",{ref,children:(0,jsx_runtime_1.jsx)("div",Object.assign({className:containerClassName},divProps,{children:(0,jsx_runtime_1.jsx)("div",{id:"klarna-payments-container"})}))})}exports.default=KlarnaPayment;

package/lib/cjs/components/payment_source/PaymentSource.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type LoaderType } from '../../typings/index';
 import { type CustomerCardsTemplateChildren } from '../utils/PaymentCardsTemplate';
 export interface CustomerCardsProps {

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

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSource=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),PaymentGateway_1=tslib_1.__importDefault(require("../payment_gateways/PaymentGateway")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext"));function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{payments}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,paymentSource,destroyPaymentSource}=(0,react_1.useContext)(PaymentMethodContext_1.default),[show,setShow]=(0,react_1.useState)(!1),[showCard,setShowCard]=(0,react_1.useState)(!1);(0,react_1.useEffect)(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId?(setShow(!0),(0,getCardDetails_1.default)({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!expressPayments),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order]);const handleEditClick=e=>tslib_1.__awaiter(this,void 0,void 0,function*(){if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;yield destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)}),gatewayProps=Object.assign(Object.assign({},props),{show,showCard,handleEditClick,readonly});return(0,jsx_runtime_1.jsx)(PaymentGateway_1.default,Object.assign({},gatewayProps))}exports.PaymentSource=PaymentSource,exports.default=PaymentSource;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.PaymentSource=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),PaymentMethodChildrenContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodChildrenContext")),PaymentMethodContext_1=tslib_1.__importDefault(require("../../context/PaymentMethodContext")),CustomerContext_1=tslib_1.__importDefault(require("../../context/CustomerContext")),PaymentGateway_1=tslib_1.__importDefault(require("../payment_gateways/PaymentGateway")),getCardDetails_1=tslib_1.__importDefault(require("../../utils/getCardDetails")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext"));function PaymentSource(props){const{readonly}=props,{payment,expressPayments}=(0,react_1.useContext)(PaymentMethodChildrenContext_1.default),{order}=(0,react_1.useContext)(OrderContext_1.default),{payments}=(0,react_1.useContext)(CustomerContext_1.default),{currentPaymentMethodId,paymentSource,destroyPaymentSource,currentPaymentMethodType}=(0,react_1.useContext)(PaymentMethodContext_1.default),[show,setShow]=(0,react_1.useState)(!1),[showCard,setShowCard]=(0,react_1.useState)(!1);(0,react_1.useEffect)(()=>(readonly?(setShow(!0),setShowCard(!0)):payment?.id===currentPaymentMethodId&&!expressPayments?(setShow(!0),(0,getCardDetails_1.default)({paymentType:payment?.payment_source_type,customerPayment:{payment_source:paymentSource}}).brand&&setShowCard(!0)):setShow(!!(expressPayments&&currentPaymentMethodType==="stripe_payments")),()=>{setShow(!1),setShowCard(!1)}),[currentPaymentMethodId,paymentSource,payments,payment,readonly,order,expressPayments]);const handleEditClick=e=>tslib_1.__awaiter(this,void 0,void 0,function*(){if(e.stopPropagation(),paymentSource){const paymentSourceId=paymentSource?.id;yield destroyPaymentSource({paymentSourceId,paymentResource:payment?.payment_source_type})}setShowCard(!showCard),setShow(!0)}),gatewayProps=Object.assign(Object.assign({},props),{show,showCard,handleEditClick,readonly});return(0,jsx_runtime_1.jsx)(PaymentGateway_1.default,Object.assign({},gatewayProps))}exports.PaymentSource=PaymentSource,exports.default=PaymentSource;

package/lib/cjs/components/payment_source/PaymentSourceBrandIcon.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type IconBrand } from '../../context/PaymentSourceContext';
 import { type ChildrenFunction } from '../../typings/index';
 interface ChildrenProps extends Omit<Props, 'children'> {

package/lib/cjs/components/payment_source/PaymentSourceBrandName.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type IconBrand } from '../../context/PaymentSourceContext';
 import { type ChildrenFunction } from '../../typings/index';
 interface CustomComponent extends Omit<Props, 'children'> {

package/lib/cjs/components/payment_source/PaymentSourceDetail.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { ChildrenFunction } from '../../typings/index';
 export type PaymentSourceDetailType = 'last4' | 'exp_year' | 'exp_month';
 interface ChildrenProps extends Omit<Props, 'children'> {

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface Props {
     clientSecret: string;
 }

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

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type StripeElementLocale, type StripeElementsOptions, type StripePaymentElementOptions } from '@stripe/stripe-js';
 import { type PaymentMethodConfig } from '../../reducers/PaymentMethodReducer';
 import { type PaymentSourceProps } from './PaymentSource';

package/lib/cjs/components/payment_source/WireTransferPayment.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export interface WireTransferConfig {
     infoMessage?: {
         text?: string | JSX.Element[];

package/lib/cjs/components/prices/Price.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type Price as PriceType } from '@commercelayer/sdk';
 import { type ChildrenFunction, type LoaderType } from '../../typings/index';
 interface PriceChildrenProps extends Omit<PriceProps, 'children'> {

package/lib/cjs/components/prices/PricesContainer.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type LoaderType } from '../../typings/index';
 interface Props {
     /**

package/lib/cjs/components/shipments/ShipmentField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type Shipment } from '@commercelayer/sdk';
 type ShipmentFieldChildrenProps = Omit<Props, 'children'> & {
     shipment: Shipment;

package/lib/cjs/components/shipments/ShipmentsCount.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ChildrenFunction } from '../../typings/index';
 import type { Shipment } from '@commercelayer/sdk';
 interface ChildrenProps extends Omit<Props, 'children'> {

package/lib/cjs/components/shipping_methods/ShippingMethodName.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ShippingMethod } from '@commercelayer/sdk';
 type ChildrenProps = Omit<Props, 'children'> & {
     label: string;

package/lib/cjs/components/shipping_methods/ShippingMethodPrice.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type BaseAmountComponent } from '../../typings/index';
 type Props = BaseAmountComponent & {
     /**

package/lib/cjs/components/shipping_methods/ShippingMethodRadioButton.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { Order, ShippingMethod } from '@commercelayer/sdk';
 interface ShippingMethodRadioButtonType extends Omit<Props, 'children'> {
     shippingMethod: ShippingMethod;

package/lib/cjs/components/skus/AvailabilityContainer.d.ts

@@ -1,8 +1,34 @@
 import { type ReactNode } from 'react';
 interface Props {
+    /**
+     * The children component
+     */
     children: ReactNode;
+    /**
+     * The sku code
+     */
     skuCode?: string;
+    /**
+     * The sku id. If you use this prop, the skuCode will be ignored and the sku will be fetched by id improving the performance
+     */
+    skuId?: string;
+    /**
+     * Callback called when the quantity is updated
+     */
     getQuantity?: (quantity: number) => void;
 }
-export declare function AvailabilityContainer({ children, skuCode, getQuantity }: Props): JSX.Element;
+/**
+ * Main container for the Availability components.
+ * It stores - in its context - the sku quantity returned from the `inventory_model` and the `delivery_lead_time` for the first shipping method found in the inventory model.
+ *
+ * It can be used to fetch the quantities for a specific `sku_code` passed as prop.
+ * <span title='Requirements' type='warning'>
+ * Must be a child of the `<CommerceLayer>` component. <br/>
+ * Can be a child of the `<SkusContainer>` component and receive the `sku_code` from its context.
+ * </span>
+ * <span title='Children' type='info'>
+ * `<AvailabilityTemplate>`
+ * </span>
+ */
+export declare function AvailabilityContainer({ children, skuCode, skuId, getQuantity }: Props): JSX.Element;
 export default AvailabilityContainer;

package/lib/cjs/components/skus/AvailabilityContainer.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AvailabilityContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),AvailabilityReducer_1=tslib_1.__importStar(require("../../reducers/AvailabilityReducer")),AvailabilityContext_1=tslib_1.__importDefault(require("../../context/AvailabilityContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext")),LineItemChildrenContext_1=tslib_1.__importDefault(require("../../context/LineItemChildrenContext")),SkuChildrenContext_1=tslib_1.__importDefault(require("../../context/SkuChildrenContext")),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext"));function AvailabilityContainer({children,skuCode,getQuantity}){const{lineItem}=(0,react_1.useContext)(LineItemChildrenContext_1.default),{sku}=(0,react_1.useContext)(SkuChildrenContext_1.default),{accessToken,endpoint}=(0,useCustomContext_1.default)({context:CommerceLayerContext_1.default,contextComponentName:"CommerceLayer",currentComponentName:"AvailabilityContainer",key:"accessToken"}),[state,dispatch]=(0,react_1.useReducer)(AvailabilityReducer_1.default,AvailabilityReducer_1.availabilityInitialState),sCode=skuCode||lineItem?.sku_code||sku?.code;(0,react_1.useEffect)(()=>{if(accessToken!=null&&accessToken!==""){const config={accessToken,endpoint};sCode&&(0,AvailabilityReducer_1.getAvailability)({skuCode:sCode,config,dispatch})}return()=>{dispatch({type:"setAvailability",payload:{}})}},[accessToken,sCode]),(0,react_1.useEffect)(()=>{getQuantity!=null&&state?.quantity!=null&&getQuantity(state?.quantity)},[state.quantity]);const memoized=(0,react_1.useMemo)(()=>Object.assign(Object.assign({},state),{parent:!0}),[state]);return(0,jsx_runtime_1.jsx)(AvailabilityContext_1.default.Provider,{value:memoized,children})}exports.AvailabilityContainer=AvailabilityContainer,exports.default=AvailabilityContainer;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AvailabilityContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),AvailabilityReducer_1=tslib_1.__importStar(require("../../reducers/AvailabilityReducer")),AvailabilityContext_1=tslib_1.__importDefault(require("../../context/AvailabilityContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext")),LineItemChildrenContext_1=tslib_1.__importDefault(require("../../context/LineItemChildrenContext")),SkuChildrenContext_1=tslib_1.__importDefault(require("../../context/SkuChildrenContext")),useCustomContext_1=tslib_1.__importDefault(require("../../utils/hooks/useCustomContext"));function AvailabilityContainer({children,skuCode,skuId,getQuantity}){const{lineItem}=(0,react_1.useContext)(LineItemChildrenContext_1.default),{sku}=(0,react_1.useContext)(SkuChildrenContext_1.default),{accessToken,endpoint}=(0,useCustomContext_1.default)({context:CommerceLayerContext_1.default,contextComponentName:"CommerceLayer",currentComponentName:"AvailabilityContainer",key:"accessToken"}),[state,dispatch]=(0,react_1.useReducer)(AvailabilityReducer_1.default,AvailabilityReducer_1.availabilityInitialState),sCode=skuCode||lineItem?.sku_code||sku?.code;(0,react_1.useEffect)(()=>{if(accessToken!=null&&accessToken!==""){const config={accessToken,endpoint};(sCode!=null||skuId!=null)&&(0,AvailabilityReducer_1.getAvailability)({skuCode:sCode,skuId,config,dispatch})}return()=>{dispatch({type:"setAvailability",payload:{}})}},[accessToken,sCode,skuId]),(0,react_1.useEffect)(()=>{getQuantity!=null&&state?.quantity!=null&&getQuantity(state?.quantity)},[state.quantity]);const memoized=(0,react_1.useMemo)(()=>Object.assign(Object.assign({},state),{parent:!0}),[state]);return(0,jsx_runtime_1.jsx)(AvailabilityContext_1.default.Provider,{value:memoized,children})}exports.AvailabilityContainer=AvailabilityContainer,exports.default=AvailabilityContainer;

package/lib/cjs/components/skus/AvailabilityTemplate.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type TimeFormat, type ChildrenFunction } from '../../typings/index';
 import { type DeliveryLeadTime } from '../../reducers/AvailabilityReducer';
 interface AvailabilityTemplateChildrenProps extends Omit<Props, 'children'>, DeliveryLeadTime {
@@ -6,15 +7,16 @@ interface AvailabilityTemplateChildrenProps extends Omit<Props, 'children'>, Del
 }
 type FormatRules = {
     /**
-     * Set time format for shipping method
+     * Set time format for shipping method. When not set, ``delivery_lead_times`` will not be displayed.
+     * When set, `delivery_lead_times` for the first shipping method found in the inventory model, will be displayed in the format specified.
      */
     timeFormat?: TimeFormat;
     /**
-     * Show shipping method name
+     * Show shipping method name. Requires `timeFormat` to be set.
      */
     showShippingMethodName?: false;
     /**
-     * Show shipping method price
+     * Show shipping method price. Requires `timeFormat` to be set.
      */
     showShippingMethodPrice?: false;
 } | {
@@ -34,5 +36,17 @@ type Props = {
         negativeStock?: string;
     };
 } & Omit<JSX.IntrinsicElements['span'], 'children'> & FormatRules;
+/**
+ * The AvailabilityTemplate component displays the availability of the SKU specified
+ * in the parent `<AvailabilityContainer>` component.
+ *
+ * It is possible to customize the text displayed in case of `available`, `outOfStock` or `negativeStock.
+ * It is also possible to show delivery lead time and either shipping method name and/or price.
+ * This information will be retrieve from the first shipping method found in the inventory model.
+ *
+ * <span type="Requirement" type="info">
+ * It must to be used inside the `<AvailabilityContainer>` component.
+ * </span>
+ */
 export declare function AvailabilityTemplate(props: Props): JSX.Element;
 export default AvailabilityTemplate;

package/lib/cjs/components/skus/DeliveryLeadTime.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 export type DeliveryLeadTimeField = 'min_hours' | 'max_hours' | 'min_days' | 'max_days';
 export type DeliveryLeadTimeComponentChildren = Omit<Props, 'children'>;
 type Props = Partial<JSX.IntrinsicElements['span']> & {

package/lib/cjs/components/skus/SkuField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ConditionalElement } from '../../typings/index';
 import { type TGenericChildrenProps, type TResources } from '../utils/GenericFieldComponent';
 type SkuFieldChildrenProps = TGenericChildrenProps<TResources['Sku']>;
@@ -6,8 +7,19 @@ type Props = {
     children?: (props: SkuFieldChildrenProps) => JSX.Element;
 } & TCondition;
 /**
- * @param props {@link Props}
- * @returns
+ * The SkuField component displays any attribute of the `sku` specified in the parent `<SkusContainer>` component.
+ *
+ * It also accepts a `tagElement` props to enable specific tag-related props.
+ * For examples, when `tagElement` is set to `img` it will also accept props related to `<img>` tag such as `height` and `width`.
+ *
+ * <span title="Requirement" type="warning">
+ * It must to be used inside the `<SkusContainer>` component.
+ * </span>
+ *
+ * <span title="Fields" type="info">
+ * Check the `skus` resource from our [Core API documentation](https://docs.commercelayer.io/core/v/api-reference/skus/object)
+ * for more details about the available attributes to render.
+ * </span>
  */
 export declare function SkuField<P extends Props>(props: P): JSX.Element;
 export default SkuField;

package/lib/cjs/components/skus/Skus.d.ts

@@ -2,5 +2,17 @@ import { type ReactNode } from 'react';
 interface Props {
     children: ReactNode;
 }
+/**
+ * The `Skus` components loop through the list of `skus` found in `SkusContainer` context and render the children filled with the proper sku value.
+ * This means that the children will be rendered as many times as the number of skus found in the `skus` prop array
+ * and there is no need to manually loop through them from your consumer app.
+ *
+ * <span title='Requirements' type='warning'>
+ * Must be a child of the `<SkusContainer>` component.
+ * </span>
+ * <span title='Children' type='info'>
+ * `<SkuField>`, `<AvailabilityContainer>`
+ * </span>
+ */
 export declare function Skus<P extends Props>({ children }: P): JSX.Element;
 export default Skus;

package/lib/cjs/components/skus/SkusContainer.d.ts

@@ -6,7 +6,7 @@ interface Props {
      */
     skus: string[];
     /**
-     * Accept a React node, [Skus](./Skus.d.ts), and [ItemContainer](../ItemContainer.d.ts)  as children to display above the skus.
+     * Accept a React node and [Skus](./Skus.d.ts) component as children to display above the skus.
      */
     children: ReactNode;
     /**
@@ -14,5 +14,18 @@ interface Props {
      */
     queryParams?: QueryParamsList;
 }
+/**
+ * Main container for the SKUs components.
+ * It stores - in its context - the details for each `sku` defined in the `skus` prop array.
+ *
+ * It also accept a `queryParams` prop to refine pagination, sorting, filtering and includes for the fetch request.
+ *
+ * <span title='Requirements' type='warning'>
+ * Must be a child of the `<CommerceLayer>` component.
+ * </span>
+ * <span title='Children' type='info'>
+ * `<Skus>`
+ * </span>
+ */
 export declare function SkusContainer<P extends Props>(props: P): JSX.Element;
 export default SkusContainer;

package/lib/cjs/components/stock_transfers/StockTransfer.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { DefaultChildrenType } from '../../typings/globals';
 interface Props {
     children: DefaultChildrenType;

package/lib/cjs/components/stock_transfers/StockTransferField.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type ConditionalElement } from '../../typings/index';
 import { type TGenericChildrenProps, type TResources } from '../utils/GenericFieldComponent';
 type StockTransferFieldChildrenProps = TGenericChildrenProps<TResources['StockTransfer']>;

package/lib/cjs/components/utils/AddressCardsTemplate.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { Address } from '@commercelayer/sdk';
 import AddressChildrenContext from '../../context/AddressChildrenContext';
 import { type ChildrenFunction } from '../../typings/index';

package/lib/cjs/components/utils/BaseOrderPrice.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import { type PropsType } from '../../utils/PropsType';
 import { type baseOrderPricePropTypes } from '../../typings/index';
 export type BaseOrderPriceProps = PropsType<typeof baseOrderPricePropTypes, unknown> & Omit<JSX.IntrinsicElements['span'], 'children'>;