@commercelayer/react-components 4.17.0-beta.2 → 4.17.0

package/lib/esm/components/skus/SkuList.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from 'react';
+import { type ReactNode, type JSX } from 'react';
 interface Props {
     children: ReactNode;
     /**

package/lib/esm/components/skus/SkuListsContainer.d.ts

@@ -1,4 +1,4 @@
-import { type ReactNode } from 'react';
+import { type ReactNode, type JSX } from 'react';
 interface Props {
     children: ReactNode;
 }

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

@@ -1,4 +1,4 @@
-import { type ReactNode } from 'react';
+import { type ReactNode, type JSX } from 'react';
 interface Props {
     children: ReactNode;
 }

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

@@ -1,5 +1,5 @@
 import type { QueryParamsList } from '@commercelayer/sdk';
-import { type ReactNode } from 'react';
+import { type ReactNode, type JSX } from 'react';
 interface Props {
     /**
      * An array of skus to display.

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

@@ -1,3 +1,4 @@
+import { type JSX } from 'react';
 import type { DefaultChildrenType } from '../../typings/globals';
 interface Props {
     children: DefaultChildrenType;

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

@@ -1,5 +1,6 @@
 import { type ConditionalElement } from '../../typings/index';
 import { type TGenericChildrenProps, type TResources } from '../utils/GenericFieldComponent';
+import type { JSX } from "react";
 type StockTransferFieldChildrenProps = TGenericChildrenProps<TResources['StockTransfer']>;
 type TCondition = ConditionalElement<Exclude<TResources['StockTransfer'], 'resource'>>;
 type Props = {

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

@@ -1,3 +1,4 @@
+import { type JSX } from 'react';
 import type { Address } from '@commercelayer/sdk';
 import AddressChildrenContext from '../../context/AddressChildrenContext';
 import { type ChildrenFunction } from '../../typings/index';

package/lib/esm/components/utils/BaseField.d.ts

@@ -1,6 +1,6 @@
-import { type FunctionComponent } from 'react';
+import { type FunctionComponent, type JSX } from 'react';
 type BaseFieldChildren = Omit<BaseFieldProps, 'children'>;
-export interface BaseFieldProps extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+export interface BaseFieldProps extends Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'> {
     attribute: 'number' | 'id';
     children?: (props: BaseFieldChildren) => JSX.Element;
 }

package/lib/esm/components/utils/BaseInput.d.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { type JSX } from 'react';
 import { type BaseInputComponentProps } from '../../typings/index';
 export type BaseInputProps = BaseInputComponentProps & Omit<JSX.IntrinsicElements['input'], 'children' | 'pattern'> & Omit<JSX.IntrinsicElements['textarea'], 'children' | 'pattern'>;
 declare const _default: React.ForwardRefExoticComponent<Omit<BaseInputProps, "ref"> & React.RefAttributes<any>>;

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

@@ -1,5 +1,6 @@
+import { type JSX } from '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'>;
+export type BaseOrderPriceProps = PropsType<typeof baseOrderPricePropTypes, unknown> & Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'>;
 export declare function BaseOrderPrice(props: BaseOrderPriceProps): JSX.Element;
 export default BaseOrderPrice;

package/lib/esm/components/utils/ErrorBoundary.d.ts

@@ -1,4 +1,4 @@
-import { Component, type ErrorInfo } from 'react';
+import { Component, type ErrorInfo, type JSX } from 'react';
 interface Props {
     children: JSX.Element;
 }

package/lib/esm/components/utils/GenericFieldComponent.d.ts

@@ -2,7 +2,7 @@ import { type InitialSkuContext } from '../../context/SkuChildrenContext';
 import { type InitialStockTransferContext } from '../../context/StockTransferChildrenContext';
 import type { Customer, LineItem, Sku, Parcel, ParcelLineItem } from '@commercelayer/sdk';
 import { type InitialLineItemChildrenContext } from '../../context/LineItemChildrenContext';
-import { type Context } from 'react';
+import { type Context, type JSX } from 'react';
 import { type InitialCustomerContext } from '../../context/CustomerContext';
 import { type InitialParcelContext } from '../../context/ParcelChildrenContext';
 import { type InitialParcelLineItemContext } from '../../context/ParcelLineItemChildrenContext';

package/lib/esm/components/utils/Parent.d.ts

@@ -1,4 +1,4 @@
-import { type Component, type ForwardedRef } from 'react';
+import { type Component, type ForwardedRef, type JSX } from 'react';
 export interface ParentProps {
     parentRef?: ForwardedRef<any>;
     children?: typeof Component | ((P: any) => JSX.Element | null);

package/lib/esm/components/utils/PaymentCardsTemplate.d.ts

@@ -1,3 +1,4 @@
+import { type JSX } from 'react';
 import { type PaymentResource } from '../../reducers/PaymentMethodReducer';
 import PaymentSourceContext, { type IconBrand } from '../../context/PaymentSourceContext';
 import { type ChildrenFunction } from '../../typings/index';

package/lib/esm/components/utils/PriceTemplate.d.ts

@@ -1,4 +1,5 @@
 import { type PriceProps } from '../prices/Price';
+import type { JSX } from "react";
 export type PTemplateProps = {
     formattedAmount?: string | null;
     formattedCompare?: string | null;

package/lib/esm/components/utils/getAllErrors.d.ts

@@ -1,11 +1,12 @@
 import { type LineItem } from '@commercelayer/sdk';
 import { type BaseError } from '../../typings/errors';
 import { type TResourceError } from '../errors/Errors';
+import type { JSX } from "react";
 export interface AllErrorsParams {
     allErrors: BaseError[];
     messages: BaseError[];
     field?: string;
-    props: JSX.IntrinsicElements['span'];
+    props: Omit<JSX.IntrinsicElements['span'], 'ref'>;
     lineItem?: LineItem | null;
     resource?: TResourceError;
     returnHtml?: boolean;

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

@@ -1,5 +1,6 @@
 import type { Order, OrderSubscription } from '@commercelayer/sdk';
 import { type Row } from '@tanstack/react-table';
+import { type JSX } from 'react';
 export type TOrderList = 'orders' | 'subscriptions';
 export type TableAccessor<T extends TOrderList> = T extends 'orders' ? keyof Order : keyof OrderSubscription;
 export type OrderListContent<T extends TOrderList> = T extends 'orders' ? Order : OrderSubscription;

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

@@ -4,7 +4,7 @@ type DefaultContext = {
     setPlaceOrderErrors?: typeof setPlaceOrderErrors;
     setPlaceOrder?: typeof setPlaceOrder;
     placeOrderPermitted?: () => void;
-    setButtonRef?: (ref: RefObject<HTMLButtonElement>) => void;
+    setButtonRef?: (ref: RefObject<HTMLButtonElement | null>) => void;
     setPlaceOrderStatus?: typeof setPlaceOrderStatus;
 } & PlaceOrderState;
 export declare const defaultPlaceOrderContext: DefaultContext;

package/lib/esm/reducers/OrderReducer.js

@@ -1,2 +1,2 @@
 "use client";
-import{setCustomerOrderParam}from"../utils/localStorage";import baseReducer from"../utils/baseReducer";import isEmpty from"lodash/isEmpty";import getSdk from"../utils/getSdk";import getErrors,{setErrors}from"../utils/getErrors";import{getOrganizationConfig}from"../utils/organization";import{publish}from"../utils/events";import{getDomain}from"../utils/getDomain";import{getApplicationLink}from"../utils/getApplicationLink";const actionType=["setLoading","setOrderId","setOrder","setSingleQuantity","setCurrentSkuCodes","setCurrentSkuPrices","setErrors","setCurrentItem","setSaveAddressToCustomerAddressBook","setIncludesResource"];export async function createOrder(params){if(params){const{persistKey,state,dispatch,config,orderMetadata:metadata,orderAttributes={},setLocalOrder}=params;if(state?.orderId)return state.orderId;const sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return"";const o=await sdk?.orders.create({metadata,...orderAttributes});return dispatch&&dispatch({type:"setOrderId",payload:{orderId:o?.id}}),persistKey&&setLocalOrder&&setLocalOrder(persistKey,o.id),o.id}catch(error){const errors=getErrors({error,resource:"orders"});console.error("Create order",errors),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors,dispatch})}}return""}export const getApiOrder=async params=>{const{id,dispatch,config,clearWhenPlaced,persistKey,deleteLocalOrder,state}=params,sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return;const options={};state?.include&&state.include.length>0&&(options.include=state.include);const order=await sdk.orders.retrieve(id??"",options);return clearWhenPlaced&&order.editable===!1?(persistKey&&deleteLocalOrder&&deleteLocalOrder(persistKey),dispatch&&dispatch({type:"setOrder",payload:{order:void 0,orderId:""}})):dispatch&&dispatch({type:"setOrder",payload:{order,orderId:order.id}}),order}catch(error){const errors=getErrors({error,resource:"orders"});console.error("Retrieve order",errors),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors,dispatch});return}};export async function updateOrder({id,attributes,dispatch,config,include,state}){const sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return{success:!1};const resource={...attributes,id};await sdk.orders.update(resource,{include});const order=await getApiOrder({id,config,dispatch,state});return dispatch&&order&&dispatch({type:"setOrder",payload:{order}}),{success:!0,order}}catch(error){const errors=getErrors({error,resource:"orders"});return dispatch&&(setOrderErrors({errors,dispatch}),dispatch({type:"setErrors",payload:{errors}})),{success:!1,error}}}export const setOrder=(order,dispatch)=>{dispatch&&dispatch({type:"setOrder",payload:{order}})};export function addResourceToInclude({resourcesIncluded=[],dispatch,newResource,newResourceLoaded,resourceIncludedLoaded}){const payload={include:void 0,includeLoaded:void 0};if(newResource){const resources=typeof newResource=="string"?[newResource]:newResource;payload.include=[...new Set([...resourcesIncluded,...resources])],resources.forEach(resource=>{const includeLoaded={...payload.includeLoaded,[resource]:!0};payload.includeLoaded=includeLoaded})}else delete payload.include;const payloadIncludeLoaded={...resourceIncludedLoaded,...newResourceLoaded,...payload.includeLoaded&&payload.includeLoaded};payload.includeLoaded=payloadIncludeLoaded,dispatch&&dispatch({type:"setIncludesResource",payload:{...payload,withoutIncludes:!1}})}export async function addToCart(params){const{skuCode,bundleCode,quantity,config,dispatch,lineItem,state,errors=[],buyNowMode,checkoutUrl,lineItemOption,openMiniCart=!0}=params;try{if(config){const sdk=getSdk(config),id=await createOrder(params);if(id){const order=sdk.orders.relationship(id),name=lineItem?.name,imageUrl=lineItem?.imageUrl,metadata=lineItem?.metadata,frequency=lineItem?.frequency,externalPrice=lineItem?.externalPrice;if(buyNowMode)if(state?.order?.line_items)await Promise.all(state?.order?.line_items.map(async lineItem2=>{await sdk.line_items.delete(lineItem2.id)}));else{const{line_items:lineItems}=await sdk.orders.retrieve(id,{fields:["line_items"],include:["line_items"]});lineItems&&lineItems?.length>0&&await Promise.all(lineItems.map(async lineItem2=>{await sdk.line_items.delete(lineItem2.id)}))}const attrs={order,sku_code:skuCode,name,image_url:imageUrl,quantity:quantity??1,_update_quantity:lineItem?._update_quantity??!0,bundle_code:bundleCode,metadata,frequency};externalPrice===!0&&(attrs._external_price=externalPrice);const newLineItem=await sdk.line_items.create(attrs);if(lineItemOption!=null){const{skuOptionId,options,quantity:quantity2}=lineItemOption,skuOption=sdk.sku_options.relationship(skuOptionId),lineItemRel=sdk.line_items.relationship(newLineItem.id),lineItemOptionsAttributes={quantity:quantity2??1,options,sku_option:skuOption,line_item:lineItemRel};await sdk.line_item_options.create(lineItemOptionsAttributes),await getApiOrder({id,...params})}else await getApiOrder({id,...params,state});if(!isEmpty(errors)&&dispatch&&dispatch({type:"setErrors",payload:{errors:[]}}),buyNowMode&&id&&config?.accessToken!=null&&config?.endpoint!=null){const params2=`${id}?accessToken=${config.accessToken??""}`,{domain,slug}=getDomain(config.endpoint),href=getApplicationLink({slug,orderId:id,accessToken:config.accessToken,applicationType:"checkout",domain}),organizationConfig=await getOrganizationConfig({accessToken:config.accessToken,endpoint:config.endpoint,params:{accessToken:config.accessToken,orderId:order?.id}}),redirectUrl=checkoutUrl?`${checkoutUrl}/${params2}`:organizationConfig?.links?.checkout??href;location.href=redirectUrl}else openMiniCart&&publish("open-cart");return{success:!0,orderId:id}}}return{success:!1}}catch(error){const errors2=getErrors({error,resource:"orders"});return console.error("Add to cart",errors2),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors2,dispatch}),{success:!1}}}export const unsetOrderState=dispatch=>{dispatch({type:"setOrderId",payload:{orderId:""}}),dispatch({type:"setOrder",payload:{order:void 0}})};export function setOrderErrors({dispatch,errors=[]}){return dispatch&&dispatch({type:"setErrors",payload:{errors}}),{success:!1}}export const saveAddressToCustomerAddressBook=({type,value,dispatch})=>{const k=`_save_${type}_to_customer_address_book`,v=`${value.toString()}`;setCustomerOrderParam(k,v),dispatch&&dispatch({type:"setSaveAddressToCustomerAddressBook",payload:{[k]:v}})};export async function setGiftCardOrCouponCode({code,codeType,dispatch,config,order,include,state}){try{if(config&&order&&code&&dispatch){const attributes={[codeType]:code},{success,order:currentOrder,error}=await updateOrder({id:order.id,attributes,config,include,dispatch,state});if(!success)throw error;return dispatch({type:"setErrors",payload:{errors:[]}}),{success,order:currentOrder}}return{success:!1}}catch(error){const errors=getErrors({error,resource:"orders",field:codeType});return dispatch&&setOrderErrors({errors,dispatch}),{success:!1}}}export async function removeGiftCardOrCouponCode({codeType,dispatch,config,order,include,state}){try{if(config&&order&&dispatch){const attributes={[codeType]:""},orderUpdated=await updateOrder({id:order.id,attributes,config,include,dispatch,state});return dispatch({type:"setErrors",payload:{errors:[]}}),{success:!0,order:orderUpdated?.order}}return{success:!1}}catch(error){const errors=getErrors({error,resource:"orders",field:codeType});return console.error("Remove gift card o coupon code",errors),dispatch&&setOrderErrors({errors,dispatch}),{success:!1}}}export const orderInitialState={loading:!0,orderId:"",order:void 0,errors:[],include:void 0,withoutIncludes:!0};const orderReducer=(state,reducer)=>baseReducer(state,reducer,actionType);export default orderReducer;
+import{setCustomerOrderParam}from"../utils/localStorage";import baseReducer from"../utils/baseReducer";import isEmpty from"lodash/isEmpty";import getSdk from"../utils/getSdk";import getErrors,{setErrors}from"../utils/getErrors";import{getOrganizationConfig}from"../utils/organization";import{publish}from"../utils/events";import{getDomain}from"../utils/getDomain";import{getApplicationLink}from"../utils/getApplicationLink";const actionType=["setLoading","setOrderId","setOrder","setSingleQuantity","setCurrentSkuCodes","setCurrentSkuPrices","setErrors","setCurrentItem","setSaveAddressToCustomerAddressBook","setIncludesResource"];export async function createOrder(params){if(params){const{persistKey,state,dispatch,config,orderMetadata:metadata,orderAttributes={},setLocalOrder}=params;if(state?.orderId)return state.orderId;const sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return"";const o=await sdk?.orders.create({metadata,...orderAttributes});return dispatch&&dispatch({type:"setOrderId",payload:{orderId:o?.id}}),persistKey&&setLocalOrder&&setLocalOrder(persistKey,o.id),o.id}catch(error){const errors=getErrors({error,resource:"orders"});console.error("Create order",errors),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors,dispatch})}}return""}export const getApiOrder=async params=>{const{id,dispatch,config,clearWhenPlaced,persistKey,deleteLocalOrder,state}=params,sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return;const options={};state?.include&&state.include.length>0&&(options.include=state.include);const order=await sdk.orders.retrieve(id??"",options);return clearWhenPlaced&&order.editable===!1?(persistKey&&deleteLocalOrder&&deleteLocalOrder(persistKey),dispatch&&dispatch({type:"setOrder",payload:{order:void 0,orderId:""}})):dispatch&&dispatch({type:"setOrder",payload:{order,orderId:order.id}}),order}catch(error){const errors=getErrors({error,resource:"orders"});console.error("Retrieve order",errors),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors,dispatch});return}};export async function updateOrder({id,attributes,dispatch,config,include,state}){const sdk=config!=null?getSdk(config):void 0;try{if(sdk==null)return{success:!1};const resource={...attributes,id};await sdk.orders.update(resource,{include});const order=await getApiOrder({id,config,dispatch,state});return dispatch&&order&&dispatch({type:"setOrder",payload:{order}}),{success:!0,order}}catch(error){const errors=getErrors({error,resource:"orders"});return dispatch&&(setOrderErrors({errors,dispatch}),dispatch({type:"setErrors",payload:{errors}})),{success:!1,error}}}export const setOrder=(order,dispatch)=>{dispatch&&dispatch({type:"setOrder",payload:{order}})};export function addResourceToInclude({resourcesIncluded=[],dispatch,newResource,newResourceLoaded,resourceIncludedLoaded}){const payload={include:void 0,includeLoaded:void 0};if(newResource){const resources=typeof newResource=="string"?[newResource]:newResource;payload.include=[...new Set([...resourcesIncluded,...resources])],resources.forEach(resource=>{const includeLoaded={...payload.includeLoaded,[resource]:!0};payload.includeLoaded=includeLoaded})}else delete payload.include;const payloadIncludeLoaded={...resourceIncludedLoaded,...newResourceLoaded,...payload.includeLoaded&&payload.includeLoaded};payload.includeLoaded=payloadIncludeLoaded,dispatch&&dispatch({type:"setIncludesResource",payload:{...payload,withoutIncludes:!1}})}export async function addToCart(params){const{skuCode,bundleCode,quantity,config,dispatch,lineItem,state,errors=[],buyNowMode,checkoutUrl,lineItemOption,openMiniCart=!0}=params;try{if(config){const sdk=getSdk(config),id=await createOrder(params);if(id){const order=sdk.orders.relationship(id),name=lineItem?.name,imageUrl=lineItem?.imageUrl,metadata=lineItem?.metadata,frequency=lineItem?.frequency,externalPrice=lineItem?.externalPrice;if(buyNowMode)if(state?.order?.line_items)await Promise.all(state?.order?.line_items.map(async lineItem2=>{await sdk.line_items.delete(lineItem2.id)}));else{const{line_items:lineItems}=await sdk.orders.retrieve(id,{fields:["line_items"],include:["line_items"]});lineItems&&lineItems?.length>0&&await Promise.all(lineItems.map(async lineItem2=>{await sdk.line_items.delete(lineItem2.id)}))}const attrs={order,sku_code:skuCode,name,image_url:imageUrl,quantity:quantity??1,_update_quantity:lineItem?._update_quantity??!0,bundle_code:bundleCode,metadata,frequency};externalPrice===!0&&(attrs._external_price=externalPrice);const newLineItem=await sdk.line_items.create(attrs);if(lineItemOption!=null){const{skuOptionId,options,quantity:quantity2}=lineItemOption,skuOption=sdk.sku_options.relationship(skuOptionId),lineItemRel=sdk.line_items.relationship(newLineItem.id),lineItemOptionsAttributes={quantity:quantity2??1,options,sku_option:skuOption,line_item:lineItemRel};await sdk.line_item_options.create(lineItemOptionsAttributes),await getApiOrder({id,...params})}else await getApiOrder({id,...params,state});if(!isEmpty(errors)&&dispatch&&dispatch({type:"setErrors",payload:{errors:[]}}),buyNowMode&&id&&config?.accessToken!=null&&config?.endpoint!=null){const params2=`${id}?accessToken=${config.accessToken??""}`,{domain,slug}=getDomain(config.endpoint),href=getApplicationLink({slug,orderId:id,accessToken:config.accessToken,applicationType:"checkout",domain}),organizationConfig=await getOrganizationConfig({accessToken:config.accessToken,endpoint:config.endpoint,params:{accessToken:config.accessToken,orderId:order?.id,slug}}),redirectUrl=checkoutUrl?`${checkoutUrl}/${params2}`:organizationConfig?.links?.checkout??href;location.href=redirectUrl}else openMiniCart&&publish("open-cart");return{success:!0,orderId:id}}}return{success:!1}}catch(error){const errors2=getErrors({error,resource:"orders"});return console.error("Add to cart",errors2),dispatch&&setErrors({currentErrors:state?.errors,newErrors:errors2,dispatch}),{success:!1}}}export const unsetOrderState=dispatch=>{dispatch({type:"setOrderId",payload:{orderId:""}}),dispatch({type:"setOrder",payload:{order:void 0}})};export function setOrderErrors({dispatch,errors=[]}){return dispatch&&dispatch({type:"setErrors",payload:{errors}}),{success:!1}}export const saveAddressToCustomerAddressBook=({type,value,dispatch})=>{const k=`_save_${type}_to_customer_address_book`,v=`${value.toString()}`;setCustomerOrderParam(k,v),dispatch&&dispatch({type:"setSaveAddressToCustomerAddressBook",payload:{[k]:v}})};export async function setGiftCardOrCouponCode({code,codeType,dispatch,config,order,include,state}){try{if(config&&order&&code&&dispatch){const attributes={[codeType]:code},{success,order:currentOrder,error}=await updateOrder({id:order.id,attributes,config,include,dispatch,state});if(!success)throw error;return dispatch({type:"setErrors",payload:{errors:[]}}),{success,order:currentOrder}}return{success:!1}}catch(error){const errors=getErrors({error,resource:"orders",field:codeType});return dispatch&&setOrderErrors({errors,dispatch}),{success:!1}}}export async function removeGiftCardOrCouponCode({codeType,dispatch,config,order,include,state}){try{if(config&&order&&dispatch){const attributes={[codeType]:""},orderUpdated=await updateOrder({id:order.id,attributes,config,include,dispatch,state});return dispatch({type:"setErrors",payload:{errors:[]}}),{success:!0,order:orderUpdated?.order}}return{success:!1}}catch(error){const errors=getErrors({error,resource:"orders",field:codeType});return console.error("Remove gift card o coupon code",errors),dispatch&&setOrderErrors({errors,dispatch}),{success:!1}}}export const orderInitialState={loading:!0,orderId:"",order:void 0,errors:[],include:void 0,withoutIncludes:!0};const orderReducer=(state,reducer)=>baseReducer(state,reducer,actionType);export default orderReducer;

package/lib/esm/reducers/PlaceOrderReducer.d.ts

@@ -31,10 +31,10 @@ export interface PlaceOrderActionPayload {
     paymentId: string;
     paymentSource: PaymentSourceType;
     options?: PlaceOrderOptions;
-    placeOrderButtonRef?: RefObject<HTMLButtonElement>;
+    placeOrderButtonRef?: RefObject<HTMLButtonElement | null>;
     status: 'placing' | 'standby';
 }
-export declare function setButtonRef(ref: RefObject<HTMLButtonElement>, dispatch: Dispatch<PlaceOrderAction>): void;
+export declare function setButtonRef(ref: RefObject<HTMLButtonElement | null>, dispatch: Dispatch<PlaceOrderAction>): void;
 export type PlaceOrderState = Partial<PlaceOrderActionPayload>;
 export interface PlaceOrderAction {
     type: PlaceOrderActionType;

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

@@ -1,3 +1,4 @@
+import type { JSX } from "react";
 export type DefaultChildrenType = JSX.Element[] | JSX.Element | null;
 type Enumerate<N extends number, Acc extends number[] = []> = Acc['length'] extends N ? Acc[number] : Enumerate<N, [...Acc, Acc['length']]>;
 export type TRange<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>>;

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

@@ -1,4 +1,4 @@
-import { type Dispatch, type ForwardedRef, type Ref } from 'react';
+import { type Dispatch, type ForwardedRef, type Ref, type JSX } from 'react';
 import PropTypes, { type InferProps } from 'prop-types';
 import { type BaseError } from './errors';
 export declare const BC: {
@@ -96,7 +96,7 @@ export declare const baseOrderComponentPricePropTypes: {
 export type BasePriceType = 'total' | 'option' | 'unit';
 export type BaseSelectorType = 'select' | 'radio';
 export type BaseAmountComponentChildren = Omit<BaseAmountComponent, 'children'>;
-export interface BaseAmountComponent extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+export interface BaseAmountComponent extends Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'> {
     children?: ChildrenFunction<BaseAmountComponentChildren>;
     format?: BaseFormatPrice;
     price?: string;

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

@@ -1,4 +1,5 @@
 import { type DefaultChildrenType } from '../typings/globals';
+import type { JSX } from "react";
 interface Props<T> {
     children: DefaultChildrenType;
     filterBy: T[];

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

@@ -1,2 +1,3 @@
 import { type LoaderType } from '../typings/index';
+import type { JSX } from "react";
 export default function getLoaderComponent(loader: LoaderType): JSX.Element;

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

@@ -1,5 +1,6 @@
 import { type Price } from '@commercelayer/sdk';
 import { type PTemplateProps } from '../components/utils/PriceTemplate';
+import type { JSX } from "react";
 export declare function getPriceByCode(skuPrices: Price[], code?: string): Price | undefined;
 export declare function getPricesComponent(skuPrices: Price[], props: PTemplateProps): JSX.Element[] | JSX.Element;
 export default function getPrices<P extends Price>(prices: P[]): Record<string, P[]>;

package/lib/esm/utils/organization.js

@@ -1,2 +1,2 @@
 "use client";
-import{useState,useEffect}from"react";import{getDomain}from"./getDomain";import getSdk from"./getSdk";import{getConfig}from"@commercelayer/organization-config";import{jwt}from"./jwt";export function getOrganizationSlug(endpoint){const org={organization:"",domain:"commercelayer.io"},{domain,slug}=getDomain(endpoint);return{organization:slug,domain:domain||org.domain}}export async function getOrganizationConfig(config){const{market}=jwt(config.accessToken),organization=await getSdk(config).organization.retrieve({fields:{organization:["id","config"]}});return getConfig({jsonConfig:organization.config??{},market:`market:id:${market.id.join(",")}`,params:config.params})}export function useOrganizationConfig({accessToken,endpoint,params}){const[organizationConfig,setOrganizationConfig]=useState(null);return useEffect(()=>{accessToken==null||endpoint==null||getOrganizationConfig({accessToken,endpoint,params}).then(config=>{setOrganizationConfig(config)})},[accessToken,endpoint]),organizationConfig}
+import{useState,useEffect}from"react";import{getDomain}from"./getDomain";import getSdk from"./getSdk";import{getConfig}from"@commercelayer/organization-config";import{jwt}from"./jwt";export function getOrganizationSlug(endpoint){const org={organization:"",domain:"commercelayer.io"},{domain,slug}=getDomain(endpoint);return{organization:slug,domain:domain||org.domain}}export async function getOrganizationConfig(config){const{market}=jwt(config.accessToken),organization=await getSdk(config).organization.retrieve({fields:{organizations:["id","config"]}});return getConfig({jsonConfig:organization.config??{},market:`market:id:${market.id.join(",")}`,params:config.params})}export function useOrganizationConfig({accessToken,endpoint,params}){const[organizationConfig,setOrganizationConfig]=useState(null);return useEffect(()=>{accessToken==null||endpoint==null||getOrganizationConfig({accessToken,endpoint,params}).then(config=>{setOrganizationConfig(config)})},[accessToken,endpoint]),organizationConfig}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/react-components",
-  "version": "4.17.0-beta.2",
+  "version": "4.17.0",
   "description": "The Official Commerce Layer React Components",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.js",
@@ -166,47 +166,47 @@
   "homepage": "https://github.com/commercelayer/commercelayer-react-components#readme",
   "dependencies": {
     "@adyen/adyen-web": "^5.71.1",
-    "@commercelayer/organization-config": "^1.4.8",
-    "@commercelayer/sdk": "^6.25.0",
-    "@stripe/react-stripe-js": "^2.9.0",
-    "@stripe/stripe-js": "^4.10.0",
+    "@commercelayer/organization-config": "^1.4.12",
+    "@commercelayer/sdk": "^6.26.0",
+    "@stripe/react-stripe-js": "^3.0.0",
+    "@stripe/stripe-js": "^5.2.0",
     "@tanstack/react-table": "^8.17.3",
     "@types/iframe-resizer": "^3.5.13",
-    "braintree-web": "^3.112.0",
-    "frames-react": "^1.1.2",
+    "braintree-web": "^3.112.1",
+    "frames-react": "^1.2.2",
     "iframe-resizer": "^4.4.5",
     "jwt-decode": "^4.0.0",
     "lodash": "^4.17.21",
-    "rapid-form": "^2.1.0"
+    "rapid-form": "2.1.0"
   },
   "devDependencies": {
     "@commercelayer/js-auth": "^6.7.0",
-    "@faker-js/faker": "^9.2.0",
-    "@playwright/test": "^1.48.2",
+    "@faker-js/faker": "^9.3.0",
+    "@playwright/test": "^1.49.1",
     "@testing-library/dom": "^10.4.0",
-    "@testing-library/react": "^16.0.0",
-    "@types/braintree-web": "^3.96.12",
+    "@testing-library/react": "^16.1.0",
+    "@types/braintree-web": "^3.96.16",
     "@types/lodash": "^4.17.13",
-    "@types/node": "^22.9.0",
-    "@types/prop-types": "^15.7.12",
-    "@types/react": "^18.3.4",
-    "@types/react-test-renderer": "^18.0.7",
+    "@types/node": "^22.10.2",
+    "@types/prop-types": "^15.7.14",
+    "@types/react": "^18.3.1",
+    "@types/react-test-renderer": "^18.3.1",
     "@types/react-window": "^1.8.8",
-    "@vitejs/plugin-react": "^4.3.1",
-    "@vitest/coverage-v8": "^2.1.4",
-    "eslint": "~9.14.0",
+    "@vitejs/plugin-react": "^4.3.4",
+    "@vitest/coverage-v8": "^2.1.8",
+    "eslint": "~9.16.0",
     "jsdom": "^25.0.1",
     "minimize-js": "^1.4.0",
-    "msw": "^2.6.4",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-test-renderer": "^18.2.0",
+    "msw": "^2.6.8",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "react-test-renderer": "^18.3.1",
     "tsc-alias": "^1.8.8",
     "tslib": "^2.6.3",
-    "typescript": "^5.5.4",
-    "vite": "^5.4.11",
-    "vite-tsconfig-paths": "^5.1.2",
-    "vitest": "^2.1.4"
+    "typescript": "^5.7.2",
+    "vite": "^6.0.3",
+    "vite-tsconfig-paths": "^5.1.4",
+    "vitest": "^2.1.8"
   },
   "peerDependencies": {
     "react": ">=18.0.0"