@commercelayer/react-components 4.8.5 → 4.8.6-beta.0

package/README.md

@@ -8,29 +8,28 @@ A collection of reusable React components that makes it super fast and simple to
 
 # Getting started
 
-To get started with Commerce Layer React Components you need to install them and then get the credentials that will allow you to perform the API calls they wrap.
-
-- [Installation](#installation)
-- [Authentication](#authentication)
-- [Import](#import)
+For a constantly updated list of the available and soon-to-come micro frontends provided by Commerce Layer's react componente, please refer to [this interactive documentation](https://commercelayer.github.io/commercelayer-react-components/?path=/docs/getting-started-introdution--docs) that will provide you with all the necessary information about the involved web components and help you get started in a snap.
 
 ## Installation
 
 Commerce Layer React Components are available as an [npm package](https://www.npmjs.com/package/@commercelayer/react-components):
 
-```
+```bash
 // npm
 npm install @commercelayer/react-components
 
 // yarn
 yarn add @commercelayer/react-components
+
+// pnpm
+pnpm add @commercelayer/react-components
 ```
 
 ## Authentication
 
 All requests to Commerce Layer API must be authenticated with an [OAuth2](https://oauth.net/2/) bearer token. Hence, to use these components, you need to get a valid access token. Once you got it, you can pass it as prop — together with the endpoint of your Commerce Layer organization — to the `CommerceLayer` component, as follow:
 
-```
+```tsx
 <CommerceLayer
   accessToken="your-access-token"
   endpoint="https://yourdomain.commercelayer.io">
@@ -46,256 +45,12 @@ This token will be used to authorize the API calls of all its child components.
 
 You can check [our documentation](https://docs.commercelayer.io/api/authentication) for more information about the available authorization flows and leverage [Commerce Layer JS Auth](https://github.com/commercelayer/commercelayer-js-auth) to easily interact with our authentication API.
 
-## Import
-
-You can use ES6 named import with every single component you plan to use (in addition to `CommerceLayer` one), as follow:
-
-```
-import { CommerceLayer, ...otherComponents } from '@commercelayer/react-components'
-```
-
-Check [this summary table](#list-of-components) for the complete (and constantly updated) list of available components.
-
-# Usage
-
-The code snippets below show how to put into action Commerce Layer React Components in some common use cases. Check the [`pages`](/pages) folder of this repository for more detailed examples.
-
-- [Prices](#prices)
-- [Add to cart](#add-to-cart)
-- [Shopping cart](#shopping-cart)
-- [Cart summary](#cart-summary)
-
-Under the hood, our React components are built on top of [Commerce Layer JS SDK](https://github.com/commercelayer/commercelayer-sdk) — feel free to use it if you want to develop your custom ones.
-
-## Prices
-
-This example shows how to use Commerce Layer React Components to display the prices of some SKUs, identified by their SKU codes:
-
-```
-import {
-  CommerceLayer,
-  PricesContainer,
-  Price
-} from '@commercelayer/react-components'
-
-// your code [...]
-
-<CommerceLayer accessToken="your-access-token" endpoint="https://yourdomain.commercelayer.io">
-  <PricesContainer>
-    <Price
-      skuCode="BABYONBU000000E63E7412MX"
-      className="your-custom-class"
-      compareClassName="your-custom-class"
-    />
-    <Price
-      skuCode="CANVASAU000000FFFFFF1824"
-      className="your-custom-class"
-      compareClassName="your-custom-class"
-    />
-    <Price
-      skuCode="LSLEEVMM000000E63E74LXXX"
-      className="your-custom-class"
-      compareClassName="your-custom-class"
-    />
-  </PricesContainer>
-</CommerceLayer>
-
-// your code [...]
-```
-
-You can style the selling price and the full price as you like by passing the `className` and `compareClassName` props to the `Price` component. You can choose not to show the full price by passing `showCompare={false}` (default is `true`).
-
-If you need to paginate the list of prices, pass the `perPage` prop to the `PricesContainer` component (default is `10`) — to learn how pagination works, check our [documentation](https://docs.commercelayer.io/api/pagination).
-
-## Add to cart
-
-This example shows how to use Commerce Layer React Components to implement the "add to cart" functionality on your page, showing the price of the chosen SKU, the possibility to select a variant and its quantity, the information about its availability, and the related button to perform the action:
-
-```
-import {
-  CommerceLayer,
-  OrderContainer,
-  OrderStorage,
-  PricesContainer,
-  Price,
-  AddToCartButton,
-  AvailabilityContainer,
-  AvailabilityTemplate
-} from '@commercelayer/react-components'
-
-// your code [...]
-
-<CommerceLayer accessToken="your-access-token" endpoint="https://yourdomain.commercelayer.io">
-  <OrderStorage persistKey="your-persist-key">
-    <OrderContainer
-      attributes={{
-        cart_url: 'https://yourdomain.com/cart',
-        return_url: 'https://yourdomain.com/return',
-        privacy_url: 'https://yourdomain.com/privacy'
-      }}>
-        <PricesContainer>
-          <Price skuCode="BABYONBU000000E63E746MXX" />
-        </PricesContainer>
-        <AddToCartButton quantity={1} skuCode="BABYONBU000000E63E746MXX" />
-        <AvailabilityContainer skuCode="BABYONBU000000E63E746MXX">
-          <AvailabilityTemplate />
-        </AvailabilityContainer>
-      </ItemContainer>
-    </OrderContainer>
-  </OrderStorage>
-</CommerceLayer>
-
-// your code [...]
-```
-
-For each variant you can define the custom name (i.e. its translation based on location) and image that will be shown on the corresponding line item, by passing the `lineItem` prop to the `AddToCartButton` component and properly setting the `lineItem` key — all these content data are usually taken from your CMS, since Commerce Layer doesn't manage any kind of content.
-
-When you add a product to your shopping cart:
-
-- if there is an order stored in the Local Storage identified by a key that matches the `persistKey` property, a line item is created and it is associated with that order;
-- if no order in the Local Storage matches the `persistKey` property, a new order is created and stored.
-
-> A common best practice — especially for multi-country ecommerce — is to use as `persistKey` a key containing the country code, so that you have a different shopping cart for each country.
-
-If you need to set some of the [order object](https://docs.commercelayer.io/developers/v/api-reference/orders/object) attributes at the moment of the order creation, pass to the optional prop `attributes` to the `OrderContainer` component.
-
-## Shopping cart
-
-This example shows how to use Commerce Layer React Components to build a shopping cart UI, containing the items that are going to be purchased with all their information (image, name, quantity, price) and the option to possibly remove some of them:
-
-```
-import {
-  CommerceLayer,
-  OrderContainer,
-  OrderStorage,
-  LineItemsContainer,
-  LineItemsCount,
-  LineItem,
-  LineItemImage,
-  LineItemName,
-  LineItemQuantity,
-  LineItemAmount,
-  LineItemRemoveLink,
-  Errors
-} from '@commercelayer/react-components'
-
-// your code [...]
-
-<CommerceLayer accessToken="your-access-token" endpoint="https://yourdomain.commercelayer.io">
-  <OrderStorage persistKey="your-persist-key">
-      <OrderContainer>
-        <LineItemsContainer>
-          <p className="your-custom-class">
-            Your shopping cart contains <LineItemsCount /> items
-          </p>
-          <LineItem>
-            <LineItemImage width={50} />
-            <LineItemName />
-            <LineItemQuantity max={10} />
-            <Errors resource="lineItem" field="quantity" />
-            <LineItemAmount />
-            <LineItemRemoveLink />
-          </LineItem>
-        </LineItemsContainer>
-      </OrderContainer>
-  </OrderStorage>
-</CommerceLayer>
-
-// your code [...]
-```
-
-The `Errors` component lets you show the error (if present) returned by our API on a single attribute of a specific resource. You can customize the error message as you like by passing the `messages` prop to the component.
-
-## Cart summary
-
-This example shows how to use Commerce Layer React Components to show a sample order summary with all the order line items (including discounts, shipping costs, taxes, and gift cards — if present) and totals:
-
-```
-import {
-  CommerceLayer,
-  OrderContainer,
-  OrderStorage,
-  SubTotalAmount,
-  DiscountAmount,
-  ShippingAmount,
-  TaxesAmount,
-  GiftCardAmount,
-  TotalAmount,
-  CheckoutLink
-} from '@commercelayer/react-components'
-
-// your code [...]
-
-<CommerceLayer accessToken="your-access-token" endpoint="https://yourdomain.commercelayer.io">
-  <OrderStorage persistKey="your-persist-key">
-    <OrderContainer>
-      <SubTotalAmount />
-      <DiscountAmount />
-      <ShippingAmount />
-      <TaxesAmount />
-      <GiftCardAmount />
-      <TotalAmount />
-      <CheckoutLink />
-    </OrderContainer>
-  </OrderStorage>
-</CommerceLayer>
-
-// your code [...]
-```
-
-You can change the amount format of each line of the summary by passing the `format` prop to the desired component (default is `formatted`).
-
-The `CheckoutLink` component lets you proceed to checkout and links to the checkout URL configured on Commerce Layer (_Settings → Markets_).
-
-# List of components
-
-These are the currently available Commerce Layer React Components.
-
-> Please note that not every Commerce Layer React component can be nested into any other one.
-
-For each component, the table below shows its props and the list of the permitted children (if any):
-
->
-
-| Name                       | Props                                                                            | Children                                                                                                                                                                                                             |
-| -------------------------- | -------------------------------------------------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `AddToCartButton`          | `disabled`<br />`label`<br />`skuCode`<br />`lineItem`<br/>`lineItemOption`<br/>`quantity`                           |
-| `AvailabilityContainer`    | `skuCode`                                                                        | `AvailabilityTemplate`                                                                                                                                                                                               |
-| `AvailabilityTemplate`     | `showShippingMethodName`<br />`timeFormat`                                       |
-| `CheckoutLink`             | `label`                                                                          |
-| `CommerceLayer`            | `accessToken`<br />`endpoint`                                                    | `GiftCardContainer`<br />`OrderContainer`<br />`PricesContainer`                                                                                                                                                     |
-| `DiscountAmount`           | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-| `Errors`                   | `field`<br />`messages`<br />`resource`                                          |
-| `ExternalFunction`         | `url`                                                                            | `AddToCartButton`                                                                                                                                                                                                    |
-| `GiftCard`                 | `onSubmit`                                                                       | `Errors`<br />`GiftCardCurrencySelector`<br />`GiftCardInput`<br />`MetadataInput`<br />`SubmitButton`                                                                                                               |
-| `GiftCardAmount`           | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-| `GiftCardContainer`        |                                                                                  | `GiftCard`<br/>`Errors`                                                                                                                                                                                              |
-| `GiftCardCurrencySelector` | `placeholder`<br />`required`<br />`value`                                       |
-| `GiftCardInput`            | `name`<br />`placeholder`<br />`type`                                            |
- `LineItem`                 | `type`                                                                           | `Errors`<br />`LineItemAmount`<br />`LineItemImage`<br />`LineItemName`<br />`LineItemOptions`<br />`LineItemQuantity`<br />`LineItemRemoveLink`                                                                     |
-| `LineItemAmount`           | `className`<br />`format`<br />`id`<br />`name`<br />`style`<br />`type`         |
-| `LineItemImage`            | `width`                                                                          |
-| `LineItemName`             |                                                                                  |
-| `LineItemOption`           | `keyClassName`<br />`keyId`<br />`keyStyle`<br />`name`<br />`valueClassName`    |
-| `LineItemOptions`          | `title`<br /> `showName`<br />`skuOptionId`                                      | `LineItemOption`                                                                                                                                                                                                     |
-| `LineItemQuantity`         | `disabled`<br />`max`                                                            |
-| `LineItemRemoveLink`       | `label`                                                                          |
-| `LineItemsContainer`       | `filters`<br />`loader`                                                          | `LineItem`<br />`LineItemsCount`                                                                                                                                                                                     |
-| `LineItemsCount`           | `className`<br />`id`<br />`name`<br />`style`                                   |
-| `MetadataInput`            | `name`<br />`onChange`<br />`placeholder`<br />`type`                            |
-| `OrderContainer`           | `attributes`<br />`metadata`<br />`orderId`                                      | `CheckoutLink`<br />`DiscountAmount`<br />`GiftCardAmount`<br />`GiftCardContainer`<br />`ItemContainer`<br />`LineItemsContainer`<br />`ShippingAmount`<br />`SubTotalAmount`<br />`TaxesAmount`<br />`TotalAmount` |
-| `OrderStorage`             | `clearWhenPlaced`<br />`persistKey`                                              | `OrderContainer`                                                                                                                                                                                                     |
-| `Price`                    | `compareClassName`<br />`showCompare`<br />`skuCode`                             |
-| `PricesContainer`          | `filters`<br />`loader`<br />`perPage`<br />`skuCode`                            | `Price`                                                                                                                                                                                                              |
- `ShippingAmount`           | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-| `SubmitButton`             | `label`                                                                          |
-| `SubTotalAmount`           | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-| `TaxesAmount`              | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-| `TotalAmount`              | `className`<br />`format`<br />`id`<br />`name`<br />`style`                     |
-
-For more detailed information on each components (i.e. prop types and default values, required props, etc.), have a look at the components folder [`packages/react-components/src/components`](/packages/react-components/src/components).
+## Need help?
 
----
+- Join [Commerce Layer's Slack community](https://slack.commercelayer.app).
+- Open a new [Q&A discussion](https://github.com/commercelayer/commercelayer-react-components/discussions/categories/q-a)
+- Ping us [on Twitter](https://twitter.com/commercelayer).
+- Is there a bug? Create an [issue](https://github.com/commercelayer/commercelayer-react-components/issues) on this repository.
 
 ### License
 

package/lib/cjs/components/addresses/AddressStateSelector.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AddressStateSelector=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),BaseSelect_1=tslib_1.__importDefault(require("../utils/BaseSelect")),BillingAddressFormContext_1=tslib_1.__importDefault(require("../../context/BillingAddressFormContext")),ShippingAddressFormContext_1=tslib_1.__importDefault(require("../../context/ShippingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),countryStateCity_1=require("../../utils/countryStateCity"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),BaseInput_1=tslib_1.__importDefault(require("../utils/BaseInput")),CustomerAddressFormContext_1=tslib_1.__importDefault(require("../../context/CustomerAddressFormContext"));function AddressStateSelector(props){var _a;const{required=!0,value,name,className="",inputClassName="",selectClassName="",states}=props,p=tslib_1.__rest(props,["required","value","name","className","inputClassName","selectClassName","states"]),billingAddress=(0,react_1.useContext)(BillingAddressFormContext_1.default),shippingAddress=(0,react_1.useContext)(ShippingAddressFormContext_1.default),customerAddress=(0,react_1.useContext)(CustomerAddressFormContext_1.default),{errors:addressErrors}=(0,react_1.useContext)(AddressContext_1.default),[hasError,setHasError]=(0,react_1.useState)(!1),[countryCode,setCountryCode]=(0,react_1.useState)(""),[val,setVal]=(0,react_1.useState)(value||""),stateOptions=(0,react_1.useMemo)(()=>(0,isEmpty_1.default)(countryCode)?[]:(0,countryStateCity_1.getStateOfCountry)({countryCode,states}),[states,countryCode]),isEmptyStates=(0,react_1.useMemo)(()=>()=>(0,isEmpty_1.default)(stateOptions),[stateOptions]);(0,react_1.useEffect)(()=>{var _a2,_b,_c,_d,_e,_f,_g,_h,_j,_k,_l,_m,_o,_p;const billingCountryCode=typeof((_a2=billingAddress?.values)===null||_a2===void 0?void 0:_a2.billing_address_country_code)=="string"?(_b=billingAddress?.values)===null||_b===void 0?void 0:_b.billing_address_country_code:(_d=(_c=billingAddress?.values)===null||_c===void 0?void 0:_c.billing_address_country_code)===null||_d===void 0?void 0:_d.value;billingCountryCode&&billingCountryCode!==countryCode&&setCountryCode(billingCountryCode);const shippingCountryCode=typeof((_e=shippingAddress?.values)===null||_e===void 0?void 0:_e.shipping_address_country_code)=="string"?(_f=shippingAddress?.values)===null||_f===void 0?void 0:_f.shipping_address_country_code:(_h=(_g=shippingAddress?.values)===null||_g===void 0?void 0:_g.shipping_address_country_code)===null||_h===void 0?void 0:_h.value;if(shippingCountryCode&&shippingCountryCode!==countryCode&&setCountryCode(shippingCountryCode),[Object.keys(billingAddress).length>0,billingCountryCode,countryCode!==billingCountryCode].every(Boolean)&&billingCountryCode&&!(0,countryStateCity_1.isValidState)({stateCode:val,countryCode:billingCountryCode,states})&&!isEmptyStates()&&(billingAddress.resetField&&billingAddress?.resetField(name),setVal("")),[!(0,isEmpty_1.default)(shippingAddress),shippingCountryCode,countryCode!==shippingCountryCode].every(Boolean)&&shippingCountryCode&&!(0,countryStateCity_1.isValidState)({stateCode:val,countryCode:shippingCountryCode,states})&&!isEmptyStates()&&(shippingAddress.resetField&&shippingAddress?.resetField(name),setVal("")),!(0,isEmpty_1.default)(billingAddress)){const fieldError=(_k=(_j=billingAddress?.errors)===null||_j===void 0?void 0:_j[name])===null||_k===void 0?void 0:_k.error;setHasError(!!fieldError)}if(!(0,isEmpty_1.default)(customerAddress)){const fieldError=(_m=(_l=customerAddress?.errors)===null||_l===void 0?void 0:_l[name])===null||_m===void 0?void 0:_m.error;setHasError(!!fieldError)}if(!(0,isEmpty_1.default)(shippingAddress)){const fieldError=(_p=(_o=shippingAddress?.errors)===null||_o===void 0?void 0:_o[name])===null||_p===void 0?void 0:_p.error;setHasError(!!fieldError)}return()=>{setHasError(!1)}},[value,billingAddress,shippingAddress,addressErrors,customerAddress]);const errorClassName=billingAddress?.errorClassName||shippingAddress?.errorClassName||customerAddress?.errorClassName||"",classNameComputed=isEmptyStates()?`${className} ${inputClassName} ${hasError?errorClassName:""}`:`${className} ${selectClassName} ${hasError?errorClassName:""}`;return isEmptyStates()?(0,jsx_runtime_1.jsx)(BaseInput_1.default,Object.assign({},p,{name,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,className:classNameComputed,required,placeholder:((_a=p.placeholder)===null||_a===void 0?void 0:_a.label)||"",defaultValue:val,type:"text"})):(0,jsx_runtime_1.jsx)(BaseSelect_1.default,Object.assign({},p,{className:classNameComputed,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,required,options:stateOptions,name,value:val}))}exports.AddressStateSelector=AddressStateSelector,exports.default=AddressStateSelector;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AddressStateSelector=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),react_1=require("react"),BaseSelect_1=tslib_1.__importDefault(require("../utils/BaseSelect")),BillingAddressFormContext_1=tslib_1.__importDefault(require("../../context/BillingAddressFormContext")),ShippingAddressFormContext_1=tslib_1.__importDefault(require("../../context/ShippingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),countryStateCity_1=require("../../utils/countryStateCity"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),BaseInput_1=tslib_1.__importDefault(require("../utils/BaseInput")),CustomerAddressFormContext_1=tslib_1.__importDefault(require("../../context/CustomerAddressFormContext"));function AddressStateSelector(props){var _a,_b,_c;const{required=!0,value,name,className="",inputClassName="",selectClassName="",states}=props,p=tslib_1.__rest(props,["required","value","name","className","inputClassName","selectClassName","states"]),billingAddress=(0,react_1.useContext)(BillingAddressFormContext_1.default),shippingAddress=(0,react_1.useContext)(ShippingAddressFormContext_1.default),customerAddress=(0,react_1.useContext)(CustomerAddressFormContext_1.default),{errors:addressErrors,billing_address:bAddress}=(0,react_1.useContext)(AddressContext_1.default),[hasError,setHasError]=(0,react_1.useState)(!1),[countryCode,setCountryCode]=(0,react_1.useState)(""),[val,setVal]=(0,react_1.useState)(value||""),stateOptions=(0,react_1.useMemo)(()=>(0,isEmpty_1.default)(countryCode)?[]:(0,countryStateCity_1.getStateOfCountry)({countryCode,states}),[states,countryCode]),isEmptyStates=(0,react_1.useMemo)(()=>()=>(0,isEmpty_1.default)(stateOptions),[stateOptions]);(0,react_1.useEffect)(()=>{var _a2,_b2,_c2,_d,_e,_f,_g,_h,_j,_k,_l,_m,_o,_p,_q;const billingCountryCode=typeof((_a2=billingAddress?.values)===null||_a2===void 0?void 0:_a2.billing_address_country_code)=="string"?(_b2=billingAddress?.values)===null||_b2===void 0?void 0:_b2.billing_address_country_code:(_e=(_d=(_c2=billingAddress?.values)===null||_c2===void 0?void 0:_c2.billing_address_country_code)===null||_d===void 0?void 0:_d.value)!==null&&_e!==void 0?_e:bAddress?.country_code;billingCountryCode&&billingCountryCode!==countryCode&&setCountryCode(billingCountryCode);const shippingCountryCode=typeof((_f=shippingAddress?.values)===null||_f===void 0?void 0:_f.shipping_address_country_code)=="string"?(_g=shippingAddress?.values)===null||_g===void 0?void 0:_g.shipping_address_country_code:(_j=(_h=shippingAddress?.values)===null||_h===void 0?void 0:_h.shipping_address_country_code)===null||_j===void 0?void 0:_j.value;shippingCountryCode&&shippingCountryCode!==countryCode&&setCountryCode(shippingCountryCode);const changeBillingCountry=[Object.keys(billingAddress).length>0,billingCountryCode,countryCode!==billingCountryCode].every(Boolean);!changeBillingCountry&&value!=null&&value!==val&&(billingAddress.setValue!=null&&billingAddress?.setValue(name,value),setVal(value)),changeBillingCountry&&billingCountryCode&&!(0,countryStateCity_1.isValidState)({stateCode:val,countryCode:billingCountryCode,states})&&!isEmptyStates()&&(billingAddress.resetField&&billingAddress?.resetField(name),setVal(""));const changeShippingCountry=[!(0,isEmpty_1.default)(shippingAddress),shippingCountryCode,countryCode!==shippingCountryCode].every(Boolean);if(!changeShippingCountry&&value!=null&&value!==val&&(shippingAddress.setValue!=null&&shippingAddress?.setValue(name,value),setVal(value)),changeShippingCountry&&shippingCountryCode&&!(0,countryStateCity_1.isValidState)({stateCode:val,countryCode:shippingCountryCode,states})&&!isEmptyStates()&&(shippingAddress.resetField&&shippingAddress?.resetField(name),setVal("")),!(0,isEmpty_1.default)(billingAddress)){const fieldError=(_l=(_k=billingAddress?.errors)===null||_k===void 0?void 0:_k[name])===null||_l===void 0?void 0:_l.error;setHasError(!!fieldError)}if(!(0,isEmpty_1.default)(customerAddress)){const fieldError=(_o=(_m=customerAddress?.errors)===null||_m===void 0?void 0:_m[name])===null||_o===void 0?void 0:_o.error;setHasError(!!fieldError)}if(!(0,isEmpty_1.default)(shippingAddress)){const fieldError=(_q=(_p=shippingAddress?.errors)===null||_p===void 0?void 0:_p[name])===null||_q===void 0?void 0:_q.error;setHasError(!!fieldError)}return()=>{setHasError(!1)}},[value,(_a=billingAddress?.values)===null||_a===void 0?void 0:_a.billing_address_country_code,(_b=shippingAddress?.values)===null||_b===void 0?void 0:_b.shipping_address_country_code,bAddress?.country_code,addressErrors,customerAddress]);const errorClassName=billingAddress?.errorClassName||shippingAddress?.errorClassName||customerAddress?.errorClassName||"",classNameComputed=isEmptyStates()?`${className} ${inputClassName} ${hasError?errorClassName:""}`:`${className} ${selectClassName} ${hasError?errorClassName:""}`;return isEmptyStates()?(0,jsx_runtime_1.jsx)(BaseInput_1.default,Object.assign({},p,{name,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,className:classNameComputed,required,placeholder:((_c=p.placeholder)===null||_c===void 0?void 0:_c.label)||"",defaultValue:val,type:"text"})):(0,jsx_runtime_1.jsx)(BaseSelect_1.default,Object.assign({},p,{className:classNameComputed,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,required,options:stateOptions,name,value:val}))}exports.AddressStateSelector=AddressStateSelector,exports.default=AddressStateSelector;

package/lib/cjs/components/addresses/AddressesContainer.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AddressesContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importStar(require("../../context/AddressContext")),react_1=require("react"),AddressReducer_1=tslib_1.__importStar(require("../../reducers/AddressReducer")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext"));function AddressesContainer(props){const{children,shipToDifferentAddress=!1,isBusiness,invertAddresses=!1}=props,[state,dispatch]=(0,react_1.useReducer)(AddressReducer_1.default,AddressReducer_1.addressInitialState),{order,orderId,updateOrder}=(0,react_1.useContext)(OrderContext_1.default),config=(0,react_1.useContext)(CommerceLayerContext_1.default);(0,react_1.useEffect)(()=>(dispatch({type:"setShipToDifferentAddress",payload:{shipToDifferentAddress,isBusiness,invertAddresses}}),()=>{dispatch({type:"cleanup",payload:{}})}),[shipToDifferentAddress,isBusiness,invertAddresses]);const contextValue=Object.assign(Object.assign({},state),{setAddressErrors:(errors,resource)=>{(0,AddressReducer_1.setAddressErrors)({errors,resource,dispatch,currentErrors:state.errors})},setAddress:params=>{AddressContext_1.defaultAddressContext.setAddress(Object.assign(Object.assign({},params),{dispatch}))},saveAddresses:customerEmail=>tslib_1.__awaiter(this,void 0,void 0,function*(){return yield(0,AddressReducer_1.saveAddresses)({config,dispatch,updateOrder,order,orderId,state,customerEmail})}),setCloneAddress:(id,resource)=>{(0,AddressReducer_1.setCloneAddress)(id,resource,dispatch)}});return(0,jsx_runtime_1.jsx)(AddressContext_1.default.Provider,{value:contextValue,children})}exports.AddressesContainer=AddressesContainer,exports.default=AddressesContainer;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.AddressesContainer=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importStar(require("../../context/AddressContext")),react_1=require("react"),AddressReducer_1=tslib_1.__importStar(require("../../reducers/AddressReducer")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),CommerceLayerContext_1=tslib_1.__importDefault(require("../../context/CommerceLayerContext"));function AddressesContainer(props){const{children,shipToDifferentAddress=!1,isBusiness,invertAddresses=!1}=props,[state,dispatch]=(0,react_1.useReducer)(AddressReducer_1.default,AddressReducer_1.addressInitialState),{order,orderId,updateOrder}=(0,react_1.useContext)(OrderContext_1.default),config=(0,react_1.useContext)(CommerceLayerContext_1.default);(0,react_1.useEffect)(()=>(dispatch({type:"setShipToDifferentAddress",payload:{shipToDifferentAddress,isBusiness,invertAddresses}}),()=>{dispatch({type:"cleanup",payload:{}})}),[shipToDifferentAddress,isBusiness,invertAddresses]);const contextValue=Object.assign(Object.assign({},state),{setAddressErrors:(errors,resource)=>{(0,AddressReducer_1.setAddressErrors)({errors,resource,dispatch,currentErrors:state.errors})},setAddress:params=>{AddressContext_1.defaultAddressContext.setAddress(Object.assign(Object.assign({},params),{dispatch,state}))},saveAddresses:customerEmail=>tslib_1.__awaiter(this,void 0,void 0,function*(){return yield(0,AddressReducer_1.saveAddresses)({config,dispatch,updateOrder,order,orderId,state,customerEmail})}),setCloneAddress:(id,resource)=>{(0,AddressReducer_1.setCloneAddress)(id,resource,dispatch)}});return(0,jsx_runtime_1.jsx)(AddressContext_1.default.Provider,{value:contextValue,children})}exports.AddressesContainer=AddressesContainer,exports.default=AddressesContainer;

package/lib/cjs/components/addresses/BillingAddressForm.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.BillingAddressForm=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),rapid_form_1=require("rapid-form"),react_1=require("react"),BillingAddressFormContext_1=tslib_1.__importDefault(require("../../context/BillingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),localStorage_1=require("../../utils/localStorage");function BillingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1}=props,p=tslib_1.__rest(props,["children","errorClassName","autoComplete","reset"]),{validation,values,errors,reset:resetForm}=(0,rapid_form_1.useRapidForm)(),{setAddressErrors,setAddress,isBusiness}=(0,react_1.useContext)(AddressContext_1.default),{saveAddressToCustomerAddressBook,order,include,addResourceToInclude,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),ref=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{var _a,_b,_c,_d,_e;if(include?.includes("billing_address")?includeLoaded?.billing_address||addResourceToInclude({newResourceLoaded:{billing_address:!0}}):addResourceToInclude({newResource:"billing_address"}),(0,isEmpty_1.default)(errors)){if(values&&Object.keys(values).length>0){setAddressErrors([],"billing_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("billing_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"billing_address",value:field.checked}))}setAddress({values:Object.assign(Object.assign({},values),isBusiness&&{business:isBusiness}),resource:"billing_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=(_a=errors[fieldName])===null||_a===void 0?void 0:_a.code,message=(_b=errors[fieldName])===null||_b===void 0?void 0:_b.message;["billing_address_state_code"].includes(fieldName)?values?.state_code?formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName}):delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName})}setAddressErrors(formErrors,"billing_address")}const checkboxChecked=((_d=(_c=ref.current)===null||_c===void 0?void 0:_c.querySelector('[name="billing_address_save_to_customer_book"]'))===null||_d===void 0?void 0:_d.checked)||(0,localStorage_1.getSaveBillingAddressToAddressBook)();reset&&(!(0,isEmpty_1.default)(values)||!(0,isEmpty_1.default)(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"billing_address",value:!1}),ref&&((_e=ref.current)===null||_e===void 0||_e.reset(),resetForm({target:ref.current}),setAddressErrors([],"billing_address"),setAddress({values:{},resource:"billing_address"})))},[errors,values,reset,include,includeLoaded,isBusiness]);const providerValues={isBusiness,values,validation,setValue:(name,value)=>{const field={[name.replace("billing_address_","")]:value};setAddress({values:Object.assign(Object.assign(Object.assign({},values),field),isBusiness&&{business:isBusiness}),resource:"billing_address"})},errorClassName,requiresBillingInfo:order?.requires_billing_info||!1,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return(0,jsx_runtime_1.jsx)(BillingAddressFormContext_1.default.Provider,{value:providerValues,children:(0,jsx_runtime_1.jsx)("form",Object.assign({ref,autoComplete},p,{children}))})}exports.BillingAddressForm=BillingAddressForm,exports.default=BillingAddressForm;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.BillingAddressForm=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),rapid_form_1=require("rapid-form"),react_1=require("react"),BillingAddressFormContext_1=tslib_1.__importDefault(require("../../context/BillingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),localStorage_1=require("../../utils/localStorage");function BillingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1}=props,p=tslib_1.__rest(props,["children","errorClassName","autoComplete","reset"]),{validation,values,errors,reset:resetForm,setValue:setValueForm}=(0,rapid_form_1.useRapidForm)(),{setAddressErrors,setAddress,isBusiness}=(0,react_1.useContext)(AddressContext_1.default),{saveAddressToCustomerAddressBook,order,include,addResourceToInclude,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),ref=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{var _a,_b,_c,_d,_e;if(include?.includes("billing_address")?includeLoaded?.billing_address||addResourceToInclude({newResourceLoaded:{billing_address:!0}}):addResourceToInclude({newResource:"billing_address"}),(0,isEmpty_1.default)(errors)){if(values&&Object.keys(values).length>0){setAddressErrors([],"billing_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("billing_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"billing_address",value:field.checked}))}setAddress({values:Object.assign(Object.assign({},values),isBusiness&&{business:isBusiness}),resource:"billing_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=(_a=errors[fieldName])===null||_a===void 0?void 0:_a.code,message=(_b=errors[fieldName])===null||_b===void 0?void 0:_b.message;["billing_address_state_code"].includes(fieldName)?values?.state_code?formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName}):delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName})}setAddressErrors(formErrors,"billing_address")}const checkboxChecked=((_d=(_c=ref.current)===null||_c===void 0?void 0:_c.querySelector('[name="billing_address_save_to_customer_book"]'))===null||_d===void 0?void 0:_d.checked)||(0,localStorage_1.getSaveBillingAddressToAddressBook)();reset&&(!(0,isEmpty_1.default)(values)||!(0,isEmpty_1.default)(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"billing_address",value:!1}),ref&&((_e=ref.current)===null||_e===void 0||_e.reset(),resetForm({target:ref.current}),setAddressErrors([],"billing_address"),setAddress({values:{},resource:"billing_address"})))},[errors,values,reset,include,includeLoaded,isBusiness]);const providerValues={isBusiness,values,validation,setValue:(name,value)=>{setValueForm(name,value);const field={[name.replace("billing_address_","")]:value};setAddress({values:Object.assign(Object.assign(Object.assign({},values),field),isBusiness&&{business:isBusiness}),resource:"billing_address"})},errorClassName,requiresBillingInfo:order?.requires_billing_info||!1,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return(0,jsx_runtime_1.jsx)(BillingAddressFormContext_1.default.Provider,{value:providerValues,children:(0,jsx_runtime_1.jsx)("form",Object.assign({ref,autoComplete},p,{children}))})}exports.BillingAddressForm=BillingAddressForm,exports.default=BillingAddressForm;

package/lib/cjs/components/addresses/ShippingAddressForm.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShippingAddressForm=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),rapid_form_1=require("rapid-form"),react_1=require("react"),ShippingAddressFormContext_1=tslib_1.__importDefault(require("../../context/ShippingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),localStorage_1=require("../../utils/localStorage");function ShippingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1}=props,p=tslib_1.__rest(props,["children","errorClassName","autoComplete","reset"]),{validation,values,errors,reset:resetForm}=(0,rapid_form_1.useRapidForm)(),{setAddressErrors,setAddress,shipToDifferentAddress,isBusiness,invertAddresses}=(0,react_1.useContext)(AddressContext_1.default),{saveAddressToCustomerAddressBook,include,addResourceToInclude,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),ref=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{var _a,_b,_c,_d,_e;if(include?.includes("shipping_address")?includeLoaded?.shipping_address||addResourceToInclude({newResourceLoaded:{shipping_address:!0}}):addResourceToInclude({newResource:"shipping_address"}),(0,isEmpty_1.default)(errors)){if(!(0,isEmpty_1.default)(values)&&(shipToDifferentAddress||invertAddresses)){setAddressErrors([],"shipping_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("shipping_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"shipping_address",value:field.checked}))}setAddress({values:Object.assign(Object.assign({},values),isBusiness&&{business:isBusiness}),resource:"shipping_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=(_a=errors[fieldName])===null||_a===void 0?void 0:_a.code,message=(_b=errors[fieldName])===null||_b===void 0?void 0:_b.message;["shipping_address_state_code"].includes(fieldName)?(0,isEmpty_1.default)(values.state_code)?delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName}):formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName})}(shipToDifferentAddress||invertAddresses)&&setAddressErrors(formErrors,"shipping_address")}const checkboxChecked=((_d=(_c=ref.current)===null||_c===void 0?void 0:_c.querySelector('[name="shipping_address_save_to_customer_book"]'))===null||_d===void 0?void 0:_d.checked)||(0,localStorage_1.getSaveShippingAddressToAddressBook)();reset&&(!(0,isEmpty_1.default)(values)||!(0,isEmpty_1.default)(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"shipping_address",value:!1}),ref&&((_e=ref.current)===null||_e===void 0||_e.reset(),resetForm({target:ref.current}),setAddressErrors([],"shipping_address"),setAddress({values:{},resource:"shipping_address"})))},[values,errors,shipToDifferentAddress,reset,include,includeLoaded,isBusiness]);const providerValues={values,validation,setValue:(name,value)=>{const field={[name.replace("shipping_address_","")]:value};setAddress({values:Object.assign(Object.assign(Object.assign({},values),field),isBusiness&&{business:isBusiness}),resource:"shipping_address"})},errorClassName,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return(0,jsx_runtime_1.jsx)(ShippingAddressFormContext_1.default.Provider,{value:providerValues,children:(0,jsx_runtime_1.jsx)("form",Object.assign({ref,autoComplete},p,{children}))})}exports.ShippingAddressForm=ShippingAddressForm,exports.default=ShippingAddressForm;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.ShippingAddressForm=void 0;const tslib_1=require("tslib"),jsx_runtime_1=require("react/jsx-runtime"),AddressContext_1=tslib_1.__importDefault(require("../../context/AddressContext")),rapid_form_1=require("rapid-form"),react_1=require("react"),ShippingAddressFormContext_1=tslib_1.__importDefault(require("../../context/ShippingAddressFormContext")),isEmpty_1=tslib_1.__importDefault(require("lodash/isEmpty")),OrderContext_1=tslib_1.__importDefault(require("../../context/OrderContext")),localStorage_1=require("../../utils/localStorage");function ShippingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1}=props,p=tslib_1.__rest(props,["children","errorClassName","autoComplete","reset"]),{validation,values,errors,reset:resetForm,setValue:setValueForm}=(0,rapid_form_1.useRapidForm)(),{setAddressErrors,setAddress,shipToDifferentAddress,isBusiness,invertAddresses}=(0,react_1.useContext)(AddressContext_1.default),{saveAddressToCustomerAddressBook,include,addResourceToInclude,includeLoaded}=(0,react_1.useContext)(OrderContext_1.default),ref=(0,react_1.useRef)(null);(0,react_1.useEffect)(()=>{var _a,_b,_c,_d,_e;if(include?.includes("shipping_address")?includeLoaded?.shipping_address||addResourceToInclude({newResourceLoaded:{shipping_address:!0}}):addResourceToInclude({newResource:"shipping_address"}),(0,isEmpty_1.default)(errors)){if(!(0,isEmpty_1.default)(values)&&(shipToDifferentAddress||invertAddresses)){setAddressErrors([],"shipping_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("shipping_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"shipping_address",value:field.checked}))}setAddress({values:Object.assign(Object.assign({},values),isBusiness&&{business:isBusiness}),resource:"shipping_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=(_a=errors[fieldName])===null||_a===void 0?void 0:_a.code,message=(_b=errors[fieldName])===null||_b===void 0?void 0:_b.message;["shipping_address_state_code"].includes(fieldName)?(0,isEmpty_1.default)(values.state_code)?delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName}):formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName})}(shipToDifferentAddress||invertAddresses)&&setAddressErrors(formErrors,"shipping_address")}const checkboxChecked=((_d=(_c=ref.current)===null||_c===void 0?void 0:_c.querySelector('[name="shipping_address_save_to_customer_book"]'))===null||_d===void 0?void 0:_d.checked)||(0,localStorage_1.getSaveShippingAddressToAddressBook)();reset&&(!(0,isEmpty_1.default)(values)||!(0,isEmpty_1.default)(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"shipping_address",value:!1}),ref&&((_e=ref.current)===null||_e===void 0||_e.reset(),resetForm({target:ref.current}),setAddressErrors([],"shipping_address"),setAddress({values:{},resource:"shipping_address"})))},[values,errors,shipToDifferentAddress,reset,include,includeLoaded,isBusiness]);const providerValues={values,validation,setValue:(name,value)=>{setValueForm(name,value);const field={[name.replace("shipping_address_","")]:value};setAddress({values:Object.assign(Object.assign(Object.assign({},values),field),isBusiness&&{business:isBusiness}),resource:"shipping_address"})},errorClassName,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return(0,jsx_runtime_1.jsx)(ShippingAddressFormContext_1.default.Provider,{value:providerValues,children:(0,jsx_runtime_1.jsx)("form",Object.assign({ref,autoComplete},p,{children}))})}exports.ShippingAddressForm=ShippingAddressForm,exports.default=ShippingAddressForm;

package/lib/cjs/context/AddressContext.d.ts

@@ -1,15 +1,15 @@
 /// <reference types="react" />
-import { type AddressState, type SetAddress, type AddressResource, type saveAddresses } from '../reducers/AddressReducer';
+import { type AddressState, setAddress, type AddressResource, type saveAddresses } from '../reducers/AddressReducer';
 import { type BaseError } from '../typings/errors';
 type DefaultContext = {
     saveAddresses?: (customerEmail?: string) => ReturnType<typeof saveAddresses>;
     setCloneAddress: (id: string, resource: AddressResource) => void;
-    setAddress: SetAddress;
+    setAddress: typeof setAddress;
     setAddressErrors: (errors: BaseError[], resource: AddressResource) => void;
 } & AddressState;
 export declare const defaultAddressContext: {
     setCloneAddress: () => void;
-    setAddress: SetAddress;
+    setAddress: typeof setAddress;
     setAddressErrors: () => void;
 };
 declare const AddressesContext: import("react").Context<DefaultContext>;

package/lib/cjs/reducers/AddressReducer.d.ts

@@ -37,10 +37,10 @@ export interface SetAddressParams<V extends AddressSchema> {
     values: V;
     resource: AddressResource;
     dispatch?: Dispatch<AddressAction>;
+    state?: AddressState;
 }
-export type SetAddress = <V extends AddressSchema>(params: SetAddressParams<V>) => void;
 export declare const setAddressErrors: SetAddressErrors;
-export declare const setAddress: SetAddress;
+export declare function setAddress<V extends AddressSchema>({ values, resource, dispatch, state }: SetAddressParams<V>): void;
 type SetCloneAddress = (id: string, resource: AddressResource, dispatch: Dispatch<AddressAction>) => void;
 export declare const setCloneAddress: SetCloneAddress;
 interface TSaveAddressesParams {

package/lib/cjs/reducers/AddressReducer.js

@@ -1,2 +1,2 @@
 "use client";
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.saveAddresses=exports.setCloneAddress=exports.setAddress=exports.setAddressErrors=exports.addressInitialState=exports.addressFields=void 0;const tslib_1=require("tslib"),baseReducer_1=tslib_1.__importDefault(require("../utils/baseReducer")),getSdk_1=tslib_1.__importDefault(require("../utils/getSdk")),camelCase_1=tslib_1.__importDefault(require("lodash/camelCase")),addressesManager_1=require("../utils/addressesManager");exports.addressFields=["city","company","country_code","first_name","last_name","line_1","line_2","phone","state_code","zip_code"],exports.addressInitialState={errors:[]};const setAddressErrors=({errors,dispatch,currentErrors=[],resource})=>{const billingErrors=resource==="billing_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="billing_address"),shippingErrors=resource==="shipping_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="shipping_address"),finalErrors=[...billingErrors,...shippingErrors];dispatch&&dispatch({type:"setErrors",payload:{errors:finalErrors}})};exports.setAddressErrors=setAddressErrors;const setAddress=({values,resource,dispatch})=>{dispatch&&dispatch({type:"setAddress",payload:{[`${resource}`]:values}})};exports.setAddress=setAddress;const setCloneAddress=(id,resource,dispatch)=>{dispatch({type:"setCloneAddress",payload:{[`${(0,camelCase_1.default)(resource)}Id`]:id}})};exports.setCloneAddress=setCloneAddress;function saveAddresses({config,updateOrder,order,state,customerEmail}){var _a,_b,_c,_d;return tslib_1.__awaiter(this,void 0,void 0,function*(){const{shipToDifferentAddress,invertAddresses,billing_address:billingAddress,shipping_address:shippingAddress,billingAddressId,shippingAddressId}=state;try{const sdk=(0,getSdk_1.default)(config);if(order){let orderAttributes=null;if(invertAddresses)orderAttributes=yield(0,addressesManager_1.invertedAddressesHandler)({billingAddress,billingAddressId,customerEmail,order,shipToDifferentAddress,shippingAddress,shippingAddressId,sdk});else{const doNotShipItems=(_a=order?.line_items)===null||_a===void 0?void 0:_a.every(lineItem=>{var _a2;return((_a2=lineItem?.item)===null||_a2===void 0?void 0:_a2.do_not_ship)===!0}),currentBillingAddressRef=(_b=order?.billing_address)===null||_b===void 0?void 0:_b.reference;if(orderAttributes={id:order?.id,_billing_address_clone_id:billingAddressId,_shipping_address_clone_id:billingAddressId,customer_email:customerEmail},currentBillingAddressRef===billingAddressId&&(orderAttributes._billing_address_clone_id=(_c=order?.billing_address)===null||_c===void 0?void 0:_c.id,orderAttributes._shipping_address_clone_id=(_d=order?.shipping_address)===null||_d===void 0?void 0:_d.id),billingAddress!=null&&Object.keys(billingAddress).length>0){delete orderAttributes._billing_address_clone_id,delete orderAttributes._shipping_address_clone_id,doNotShipItems||(orderAttributes._shipping_address_same_as_billing=!0);const hasMetadata=Object.keys(billingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");billingAddress.metadata=Object.assign(Object.assign({},billingAddress.metadata||{}),{[metadataKey]:billingAddress[key]}),delete billingAddress[key]});const address=yield sdk.addresses.create(billingAddress);orderAttributes.billing_address=sdk.addresses.relationship(address.id)}if(shipToDifferentAddress&&(delete orderAttributes._shipping_address_same_as_billing,shippingAddressId&&(orderAttributes._shipping_address_clone_id=shippingAddressId),shippingAddress!=null&&Object.keys(shippingAddress).length>0)){delete orderAttributes._shipping_address_clone_id;const hasMetadata=Object.keys(shippingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");shippingAddress.metadata=Object.assign(Object.assign({},shippingAddress.metadata||{}),{[metadataKey]:shippingAddress[key]}),delete shippingAddress[key]});const address=yield sdk.addresses.create(shippingAddress);orderAttributes.shipping_address=sdk.addresses.relationship(address.id)}}if(orderAttributes!=null&&updateOrder){const orderUpdated=yield updateOrder({id:order.id,attributes:orderAttributes});return{success:!0,order:orderUpdated?.order}}}return{success:!1}}catch(error){return console.error(error),{success:!1,error}}})}exports.saveAddresses=saveAddresses;const type=["setErrors","setAddress","setShipToDifferentAddress","setCloneAddress","cleanup"],addressReducer=(state,reducer)=>(0,baseReducer_1.default)(state,reducer,type);exports.default=addressReducer;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.saveAddresses=exports.setCloneAddress=exports.setAddress=exports.setAddressErrors=exports.addressInitialState=exports.addressFields=void 0;const tslib_1=require("tslib"),baseReducer_1=tslib_1.__importDefault(require("../utils/baseReducer")),getSdk_1=tslib_1.__importDefault(require("../utils/getSdk")),camelCase_1=tslib_1.__importDefault(require("lodash/camelCase")),addressesManager_1=require("../utils/addressesManager");exports.addressFields=["city","company","country_code","first_name","last_name","line_1","line_2","phone","state_code","zip_code"],exports.addressInitialState={errors:[]};const setAddressErrors=({errors,dispatch,currentErrors=[],resource})=>{const billingErrors=resource==="billing_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="billing_address"),shippingErrors=resource==="shipping_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="shipping_address"),finalErrors=[...billingErrors,...shippingErrors];dispatch&&dispatch({type:"setErrors",payload:{errors:finalErrors}})};exports.setAddressErrors=setAddressErrors;function setAddress({values,resource,dispatch,state}){const payload={[`${resource}`]:Object.assign(Object.assign({},state?.[resource]),values)};dispatch&&dispatch({type:"setAddress",payload})}exports.setAddress=setAddress;const setCloneAddress=(id,resource,dispatch)=>{dispatch({type:"setCloneAddress",payload:{[`${(0,camelCase_1.default)(resource)}Id`]:id}})};exports.setCloneAddress=setCloneAddress;function saveAddresses({config,updateOrder,order,state,customerEmail}){var _a,_b,_c,_d;return tslib_1.__awaiter(this,void 0,void 0,function*(){const{shipToDifferentAddress,invertAddresses,billing_address:billingAddress,shipping_address:shippingAddress,billingAddressId,shippingAddressId}=state;try{const sdk=(0,getSdk_1.default)(config);if(order){let orderAttributes=null;if(invertAddresses)orderAttributes=yield(0,addressesManager_1.invertedAddressesHandler)({billingAddress,billingAddressId,customerEmail,order,shipToDifferentAddress,shippingAddress,shippingAddressId,sdk});else{const doNotShipItems=(_a=order?.line_items)===null||_a===void 0?void 0:_a.every(lineItem=>{var _a2;return((_a2=lineItem?.item)===null||_a2===void 0?void 0:_a2.do_not_ship)===!0}),currentBillingAddressRef=(_b=order?.billing_address)===null||_b===void 0?void 0:_b.reference;if(orderAttributes={id:order?.id,_billing_address_clone_id:billingAddressId,_shipping_address_clone_id:billingAddressId,customer_email:customerEmail},currentBillingAddressRef===billingAddressId&&(orderAttributes._billing_address_clone_id=(_c=order?.billing_address)===null||_c===void 0?void 0:_c.id,orderAttributes._shipping_address_clone_id=(_d=order?.shipping_address)===null||_d===void 0?void 0:_d.id),billingAddress!=null&&Object.keys(billingAddress).length>0){delete orderAttributes._billing_address_clone_id,delete orderAttributes._shipping_address_clone_id,doNotShipItems||(orderAttributes._shipping_address_same_as_billing=!0);const hasMetadata=Object.keys(billingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");billingAddress.metadata=Object.assign(Object.assign({},billingAddress.metadata||{}),{[metadataKey]:billingAddress[key]}),delete billingAddress[key]});const address=yield sdk.addresses.create(billingAddress);orderAttributes.billing_address=sdk.addresses.relationship(address.id)}if(shipToDifferentAddress&&(delete orderAttributes._shipping_address_same_as_billing,shippingAddressId&&(orderAttributes._shipping_address_clone_id=shippingAddressId),shippingAddress!=null&&Object.keys(shippingAddress).length>0)){delete orderAttributes._shipping_address_clone_id;const hasMetadata=Object.keys(shippingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");shippingAddress.metadata=Object.assign(Object.assign({},shippingAddress.metadata||{}),{[metadataKey]:shippingAddress[key]}),delete shippingAddress[key]});const address=yield sdk.addresses.create(shippingAddress);orderAttributes.shipping_address=sdk.addresses.relationship(address.id)}}if(orderAttributes!=null&&updateOrder){const orderUpdated=yield updateOrder({id:order.id,attributes:orderAttributes});return{success:!0,order:orderUpdated?.order}}}return{success:!1}}catch(error){return console.error(error),{success:!1,error}}})}exports.saveAddresses=saveAddresses;const type=["setErrors","setAddress","setShipToDifferentAddress","setCloneAddress","cleanup"],addressReducer=(state,reducer)=>(0,baseReducer_1.default)(state,reducer,type);exports.default=addressReducer;

package/lib/esm/components/addresses/AddressStateSelector.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useMemo,useState}from"react";import BaseSelect from"../utils/BaseSelect";import BillingAddressFormContext from"../../context/BillingAddressFormContext";import ShippingAddressFormContext from"../../context/ShippingAddressFormContext";import isEmpty from"lodash/isEmpty";import{getStateOfCountry,isValidState}from"../../utils/countryStateCity";import AddressesContext from"../../context/AddressContext";import BaseInput from"../utils/BaseInput";import CustomerAddressFormContext from"../../context/CustomerAddressFormContext";export function AddressStateSelector(props){const{required=!0,value,name,className="",inputClassName="",selectClassName="",states,...p}=props,billingAddress=useContext(BillingAddressFormContext),shippingAddress=useContext(ShippingAddressFormContext),customerAddress=useContext(CustomerAddressFormContext),{errors:addressErrors}=useContext(AddressesContext),[hasError,setHasError]=useState(!1),[countryCode,setCountryCode]=useState(""),[val,setVal]=useState(value||""),stateOptions=useMemo(()=>isEmpty(countryCode)?[]:getStateOfCountry({countryCode,states}),[states,countryCode]),isEmptyStates=useMemo(()=>()=>isEmpty(stateOptions),[stateOptions]);useEffect(()=>{const billingCountryCode=typeof billingAddress?.values?.billing_address_country_code=="string"?billingAddress?.values?.billing_address_country_code:billingAddress?.values?.billing_address_country_code?.value;billingCountryCode&&billingCountryCode!==countryCode&&setCountryCode(billingCountryCode);const shippingCountryCode=typeof shippingAddress?.values?.shipping_address_country_code=="string"?shippingAddress?.values?.shipping_address_country_code:shippingAddress?.values?.shipping_address_country_code?.value;if(shippingCountryCode&&shippingCountryCode!==countryCode&&setCountryCode(shippingCountryCode),[Object.keys(billingAddress).length>0,billingCountryCode,countryCode!==billingCountryCode].every(Boolean)&&billingCountryCode&&!isValidState({stateCode:val,countryCode:billingCountryCode,states})&&!isEmptyStates()&&(billingAddress.resetField&&billingAddress?.resetField(name),setVal("")),[!isEmpty(shippingAddress),shippingCountryCode,countryCode!==shippingCountryCode].every(Boolean)&&shippingCountryCode&&!isValidState({stateCode:val,countryCode:shippingCountryCode,states})&&!isEmptyStates()&&(shippingAddress.resetField&&shippingAddress?.resetField(name),setVal("")),!isEmpty(billingAddress)){const fieldError=billingAddress?.errors?.[name]?.error;setHasError(!!fieldError)}if(!isEmpty(customerAddress)){const fieldError=customerAddress?.errors?.[name]?.error;setHasError(!!fieldError)}if(!isEmpty(shippingAddress)){const fieldError=shippingAddress?.errors?.[name]?.error;setHasError(!!fieldError)}return()=>{setHasError(!1)}},[value,billingAddress,shippingAddress,addressErrors,customerAddress]);const errorClassName=billingAddress?.errorClassName||shippingAddress?.errorClassName||customerAddress?.errorClassName||"",classNameComputed=isEmptyStates()?`${className} ${inputClassName} ${hasError?errorClassName:""}`:`${className} ${selectClassName} ${hasError?errorClassName:""}`;return isEmptyStates()?_jsx(BaseInput,{...p,name,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,className:classNameComputed,required,placeholder:p.placeholder?.label||"",defaultValue:val,type:"text"}):_jsx(BaseSelect,{...p,className:classNameComputed,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,required,options:stateOptions,name,value:val})}export default AddressStateSelector;
+import{jsx as _jsx}from"react/jsx-runtime";import{useContext,useEffect,useMemo,useState}from"react";import BaseSelect from"../utils/BaseSelect";import BillingAddressFormContext from"../../context/BillingAddressFormContext";import ShippingAddressFormContext from"../../context/ShippingAddressFormContext";import isEmpty from"lodash/isEmpty";import{getStateOfCountry,isValidState}from"../../utils/countryStateCity";import AddressesContext from"../../context/AddressContext";import BaseInput from"../utils/BaseInput";import CustomerAddressFormContext from"../../context/CustomerAddressFormContext";export function AddressStateSelector(props){const{required=!0,value,name,className="",inputClassName="",selectClassName="",states,...p}=props,billingAddress=useContext(BillingAddressFormContext),shippingAddress=useContext(ShippingAddressFormContext),customerAddress=useContext(CustomerAddressFormContext),{errors:addressErrors,billing_address:bAddress}=useContext(AddressesContext),[hasError,setHasError]=useState(!1),[countryCode,setCountryCode]=useState(""),[val,setVal]=useState(value||""),stateOptions=useMemo(()=>isEmpty(countryCode)?[]:getStateOfCountry({countryCode,states}),[states,countryCode]),isEmptyStates=useMemo(()=>()=>isEmpty(stateOptions),[stateOptions]);useEffect(()=>{const billingCountryCode=typeof billingAddress?.values?.billing_address_country_code=="string"?billingAddress?.values?.billing_address_country_code:billingAddress?.values?.billing_address_country_code?.value??bAddress?.country_code;billingCountryCode&&billingCountryCode!==countryCode&&setCountryCode(billingCountryCode);const shippingCountryCode=typeof shippingAddress?.values?.shipping_address_country_code=="string"?shippingAddress?.values?.shipping_address_country_code:shippingAddress?.values?.shipping_address_country_code?.value;shippingCountryCode&&shippingCountryCode!==countryCode&&setCountryCode(shippingCountryCode);const changeBillingCountry=[Object.keys(billingAddress).length>0,billingCountryCode,countryCode!==billingCountryCode].every(Boolean);!changeBillingCountry&&value!=null&&value!==val&&(billingAddress.setValue!=null&&billingAddress?.setValue(name,value),setVal(value)),changeBillingCountry&&billingCountryCode&&!isValidState({stateCode:val,countryCode:billingCountryCode,states})&&!isEmptyStates()&&(billingAddress.resetField&&billingAddress?.resetField(name),setVal(""));const changeShippingCountry=[!isEmpty(shippingAddress),shippingCountryCode,countryCode!==shippingCountryCode].every(Boolean);if(!changeShippingCountry&&value!=null&&value!==val&&(shippingAddress.setValue!=null&&shippingAddress?.setValue(name,value),setVal(value)),changeShippingCountry&&shippingCountryCode&&!isValidState({stateCode:val,countryCode:shippingCountryCode,states})&&!isEmptyStates()&&(shippingAddress.resetField&&shippingAddress?.resetField(name),setVal("")),!isEmpty(billingAddress)){const fieldError=billingAddress?.errors?.[name]?.error;setHasError(!!fieldError)}if(!isEmpty(customerAddress)){const fieldError=customerAddress?.errors?.[name]?.error;setHasError(!!fieldError)}if(!isEmpty(shippingAddress)){const fieldError=shippingAddress?.errors?.[name]?.error;setHasError(!!fieldError)}return()=>{setHasError(!1)}},[value,billingAddress?.values?.billing_address_country_code,shippingAddress?.values?.shipping_address_country_code,bAddress?.country_code,addressErrors,customerAddress]);const errorClassName=billingAddress?.errorClassName||shippingAddress?.errorClassName||customerAddress?.errorClassName||"",classNameComputed=isEmptyStates()?`${className} ${inputClassName} ${hasError?errorClassName:""}`:`${className} ${selectClassName} ${hasError?errorClassName:""}`;return isEmptyStates()?_jsx(BaseInput,{...p,name,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,className:classNameComputed,required,placeholder:p.placeholder?.label||"",defaultValue:val,type:"text"}):_jsx(BaseSelect,{...p,className:classNameComputed,ref:billingAddress?.validation||shippingAddress?.validation||customerAddress?.validation,required,options:stateOptions,name,value:val})}export default AddressStateSelector;

package/lib/esm/components/addresses/AddressesContainer.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext,{defaultAddressContext}from"../../context/AddressContext";import{useContext,useEffect,useReducer}from"react";import addressReducer,{addressInitialState,setAddressErrors,setCloneAddress,saveAddresses}from"../../reducers/AddressReducer";import OrderContext from"../../context/OrderContext";import CommerceLayerContext from"../../context/CommerceLayerContext";export function AddressesContainer(props){const{children,shipToDifferentAddress=!1,isBusiness,invertAddresses=!1}=props,[state,dispatch]=useReducer(addressReducer,addressInitialState),{order,orderId,updateOrder}=useContext(OrderContext),config=useContext(CommerceLayerContext);useEffect(()=>(dispatch({type:"setShipToDifferentAddress",payload:{shipToDifferentAddress,isBusiness,invertAddresses}}),()=>{dispatch({type:"cleanup",payload:{}})}),[shipToDifferentAddress,isBusiness,invertAddresses]);const contextValue={...state,setAddressErrors:(errors,resource)=>{setAddressErrors({errors,resource,dispatch,currentErrors:state.errors})},setAddress:params=>{defaultAddressContext.setAddress({...params,dispatch})},saveAddresses:async customerEmail=>await saveAddresses({config,dispatch,updateOrder,order,orderId,state,customerEmail}),setCloneAddress:(id,resource)=>{setCloneAddress(id,resource,dispatch)}};return _jsx(AddressesContext.Provider,{value:contextValue,children})}export default AddressesContainer;
+import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext,{defaultAddressContext}from"../../context/AddressContext";import{useContext,useEffect,useReducer}from"react";import addressReducer,{addressInitialState,setAddressErrors,setCloneAddress,saveAddresses}from"../../reducers/AddressReducer";import OrderContext from"../../context/OrderContext";import CommerceLayerContext from"../../context/CommerceLayerContext";export function AddressesContainer(props){const{children,shipToDifferentAddress=!1,isBusiness,invertAddresses=!1}=props,[state,dispatch]=useReducer(addressReducer,addressInitialState),{order,orderId,updateOrder}=useContext(OrderContext),config=useContext(CommerceLayerContext);useEffect(()=>(dispatch({type:"setShipToDifferentAddress",payload:{shipToDifferentAddress,isBusiness,invertAddresses}}),()=>{dispatch({type:"cleanup",payload:{}})}),[shipToDifferentAddress,isBusiness,invertAddresses]);const contextValue={...state,setAddressErrors:(errors,resource)=>{setAddressErrors({errors,resource,dispatch,currentErrors:state.errors})},setAddress:params=>{defaultAddressContext.setAddress({...params,dispatch,state})},saveAddresses:async customerEmail=>await saveAddresses({config,dispatch,updateOrder,order,orderId,state,customerEmail}),setCloneAddress:(id,resource)=>{setCloneAddress(id,resource,dispatch)}};return _jsx(AddressesContext.Provider,{value:contextValue,children})}export default AddressesContainer;

package/lib/esm/components/addresses/BillingAddressForm.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext from"../../context/AddressContext";import{useRapidForm}from"rapid-form";import{useContext,useEffect,useRef}from"react";import BillingAddressFormContext from"../../context/BillingAddressFormContext";import isEmpty from"lodash/isEmpty";import OrderContext from"../../context/OrderContext";import{getSaveBillingAddressToAddressBook}from"../../utils/localStorage";export function BillingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1,...p}=props,{validation,values,errors,reset:resetForm}=useRapidForm(),{setAddressErrors,setAddress,isBusiness}=useContext(AddressesContext),{saveAddressToCustomerAddressBook,order,include,addResourceToInclude,includeLoaded}=useContext(OrderContext),ref=useRef(null);useEffect(()=>{if(include?.includes("billing_address")?includeLoaded?.billing_address||addResourceToInclude({newResourceLoaded:{billing_address:!0}}):addResourceToInclude({newResource:"billing_address"}),isEmpty(errors)){if(values&&Object.keys(values).length>0){setAddressErrors([],"billing_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("billing_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"billing_address",value:field.checked}))}setAddress({values:{...values,...isBusiness&&{business:isBusiness}},resource:"billing_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=errors[fieldName]?.code,message=errors[fieldName]?.message;["billing_address_state_code"].includes(fieldName)?values?.state_code?formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName}):delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName})}setAddressErrors(formErrors,"billing_address")}const checkboxChecked=ref.current?.querySelector('[name="billing_address_save_to_customer_book"]')?.checked||getSaveBillingAddressToAddressBook();reset&&(!isEmpty(values)||!isEmpty(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"billing_address",value:!1}),ref&&(ref.current?.reset(),resetForm({target:ref.current}),setAddressErrors([],"billing_address"),setAddress({values:{},resource:"billing_address"})))},[errors,values,reset,include,includeLoaded,isBusiness]);const providerValues={isBusiness,values,validation,setValue:(name,value)=>{const field={[name.replace("billing_address_","")]:value};setAddress({values:{...values,...field,...isBusiness&&{business:isBusiness}},resource:"billing_address"})},errorClassName,requiresBillingInfo:order?.requires_billing_info||!1,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return _jsx(BillingAddressFormContext.Provider,{value:providerValues,children:_jsx("form",{ref,autoComplete,...p,children})})}export default BillingAddressForm;
+import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext from"../../context/AddressContext";import{useRapidForm}from"rapid-form";import{useContext,useEffect,useRef}from"react";import BillingAddressFormContext from"../../context/BillingAddressFormContext";import isEmpty from"lodash/isEmpty";import OrderContext from"../../context/OrderContext";import{getSaveBillingAddressToAddressBook}from"../../utils/localStorage";export function BillingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1,...p}=props,{validation,values,errors,reset:resetForm,setValue:setValueForm}=useRapidForm(),{setAddressErrors,setAddress,isBusiness}=useContext(AddressesContext),{saveAddressToCustomerAddressBook,order,include,addResourceToInclude,includeLoaded}=useContext(OrderContext),ref=useRef(null);useEffect(()=>{if(include?.includes("billing_address")?includeLoaded?.billing_address||addResourceToInclude({newResourceLoaded:{billing_address:!0}}):addResourceToInclude({newResource:"billing_address"}),isEmpty(errors)){if(values&&Object.keys(values).length>0){setAddressErrors([],"billing_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("billing_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"billing_address",value:field.checked}))}setAddress({values:{...values,...isBusiness&&{business:isBusiness}},resource:"billing_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=errors[fieldName]?.code,message=errors[fieldName]?.message;["billing_address_state_code"].includes(fieldName)?values?.state_code?formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName}):delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"billing_address",field:fieldName})}setAddressErrors(formErrors,"billing_address")}const checkboxChecked=ref.current?.querySelector('[name="billing_address_save_to_customer_book"]')?.checked||getSaveBillingAddressToAddressBook();reset&&(!isEmpty(values)||!isEmpty(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"billing_address",value:!1}),ref&&(ref.current?.reset(),resetForm({target:ref.current}),setAddressErrors([],"billing_address"),setAddress({values:{},resource:"billing_address"})))},[errors,values,reset,include,includeLoaded,isBusiness]);const providerValues={isBusiness,values,validation,setValue:(name,value)=>{setValueForm(name,value);const field={[name.replace("billing_address_","")]:value};setAddress({values:{...values,...field,...isBusiness&&{business:isBusiness}},resource:"billing_address"})},errorClassName,requiresBillingInfo:order?.requires_billing_info||!1,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return _jsx(BillingAddressFormContext.Provider,{value:providerValues,children:_jsx("form",{ref,autoComplete,...p,children})})}export default BillingAddressForm;

package/lib/esm/components/addresses/ShippingAddressForm.js

@@ -1,2 +1,2 @@
 "use client";
-import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext from"../../context/AddressContext";import{useRapidForm}from"rapid-form";import{useContext,useEffect,useRef}from"react";import ShippingAddressFormContext from"../../context/ShippingAddressFormContext";import isEmpty from"lodash/isEmpty";import OrderContext from"../../context/OrderContext";import{getSaveShippingAddressToAddressBook}from"../../utils/localStorage";export function ShippingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1,...p}=props,{validation,values,errors,reset:resetForm}=useRapidForm(),{setAddressErrors,setAddress,shipToDifferentAddress,isBusiness,invertAddresses}=useContext(AddressesContext),{saveAddressToCustomerAddressBook,include,addResourceToInclude,includeLoaded}=useContext(OrderContext),ref=useRef(null);useEffect(()=>{if(include?.includes("shipping_address")?includeLoaded?.shipping_address||addResourceToInclude({newResourceLoaded:{shipping_address:!0}}):addResourceToInclude({newResource:"shipping_address"}),isEmpty(errors)){if(!isEmpty(values)&&(shipToDifferentAddress||invertAddresses)){setAddressErrors([],"shipping_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("shipping_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"shipping_address",value:field.checked}))}setAddress({values:{...values,...isBusiness&&{business:isBusiness}},resource:"shipping_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=errors[fieldName]?.code,message=errors[fieldName]?.message;["shipping_address_state_code"].includes(fieldName)?isEmpty(values.state_code)?delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName}):formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName})}(shipToDifferentAddress||invertAddresses)&&setAddressErrors(formErrors,"shipping_address")}const checkboxChecked=ref.current?.querySelector('[name="shipping_address_save_to_customer_book"]')?.checked||getSaveShippingAddressToAddressBook();reset&&(!isEmpty(values)||!isEmpty(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"shipping_address",value:!1}),ref&&(ref.current?.reset(),resetForm({target:ref.current}),setAddressErrors([],"shipping_address"),setAddress({values:{},resource:"shipping_address"})))},[values,errors,shipToDifferentAddress,reset,include,includeLoaded,isBusiness]);const providerValues={values,validation,setValue:(name,value)=>{const field={[name.replace("shipping_address_","")]:value};setAddress({values:{...values,...field,...isBusiness&&{business:isBusiness}},resource:"shipping_address"})},errorClassName,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return _jsx(ShippingAddressFormContext.Provider,{value:providerValues,children:_jsx("form",{ref,autoComplete,...p,children})})}export default ShippingAddressForm;
+import{jsx as _jsx}from"react/jsx-runtime";import AddressesContext from"../../context/AddressContext";import{useRapidForm}from"rapid-form";import{useContext,useEffect,useRef}from"react";import ShippingAddressFormContext from"../../context/ShippingAddressFormContext";import isEmpty from"lodash/isEmpty";import OrderContext from"../../context/OrderContext";import{getSaveShippingAddressToAddressBook}from"../../utils/localStorage";export function ShippingAddressForm(props){const{children,errorClassName,autoComplete="on",reset=!1,...p}=props,{validation,values,errors,reset:resetForm,setValue:setValueForm}=useRapidForm(),{setAddressErrors,setAddress,shipToDifferentAddress,isBusiness,invertAddresses}=useContext(AddressesContext),{saveAddressToCustomerAddressBook,include,addResourceToInclude,includeLoaded}=useContext(OrderContext),ref=useRef(null);useEffect(()=>{if(include?.includes("shipping_address")?includeLoaded?.shipping_address||addResourceToInclude({newResourceLoaded:{shipping_address:!0}}):addResourceToInclude({newResource:"shipping_address"}),isEmpty(errors)){if(!isEmpty(values)&&(shipToDifferentAddress||invertAddresses)){setAddressErrors([],"shipping_address");for(const name in values){const field=values[name];(field?.value||field?.required===!1&&field?.type!=="checkbox")&&(values[name.replace("shipping_address_","")]=field.value,delete values[name]),field?.type==="checkbox"&&(delete values[name],saveAddressToCustomerAddressBook({type:"shipping_address",value:field.checked}))}setAddress({values:{...values,...isBusiness&&{business:isBusiness}},resource:"shipping_address"})}}else{const formErrors=[];for(const fieldName in errors){const code=errors[fieldName]?.code,message=errors[fieldName]?.message;["shipping_address_state_code"].includes(fieldName)?isEmpty(values.state_code)?delete errors[fieldName]:formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName}):formErrors.push({code,message:message||"",resource:"shipping_address",field:fieldName})}(shipToDifferentAddress||invertAddresses)&&setAddressErrors(formErrors,"shipping_address")}const checkboxChecked=ref.current?.querySelector('[name="shipping_address_save_to_customer_book"]')?.checked||getSaveShippingAddressToAddressBook();reset&&(!isEmpty(values)||!isEmpty(errors)||checkboxChecked)&&(saveAddressToCustomerAddressBook&&saveAddressToCustomerAddressBook({type:"shipping_address",value:!1}),ref&&(ref.current?.reset(),resetForm({target:ref.current}),setAddressErrors([],"shipping_address"),setAddress({values:{},resource:"shipping_address"})))},[values,errors,shipToDifferentAddress,reset,include,includeLoaded,isBusiness]);const providerValues={values,validation,setValue:(name,value)=>{setValueForm(name,value);const field={[name.replace("shipping_address_","")]:value};setAddress({values:{...values,...field,...isBusiness&&{business:isBusiness}},resource:"shipping_address"})},errorClassName,errors,resetField:name=>{resetForm({currentTarget:ref.current},name)}};return _jsx(ShippingAddressFormContext.Provider,{value:providerValues,children:_jsx("form",{ref,autoComplete,...p,children})})}export default ShippingAddressForm;

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

@@ -1,15 +1,15 @@
 /// <reference types="react" />
-import { type AddressState, type SetAddress, type AddressResource, type saveAddresses } from '../reducers/AddressReducer';
+import { type AddressState, setAddress, type AddressResource, type saveAddresses } from '../reducers/AddressReducer';
 import { type BaseError } from '../typings/errors';
 type DefaultContext = {
     saveAddresses?: (customerEmail?: string) => ReturnType<typeof saveAddresses>;
     setCloneAddress: (id: string, resource: AddressResource) => void;
-    setAddress: SetAddress;
+    setAddress: typeof setAddress;
     setAddressErrors: (errors: BaseError[], resource: AddressResource) => void;
 } & AddressState;
 export declare const defaultAddressContext: {
     setCloneAddress: () => void;
-    setAddress: SetAddress;
+    setAddress: typeof setAddress;
     setAddressErrors: () => void;
 };
 declare const AddressesContext: import("react").Context<DefaultContext>;

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

@@ -37,10 +37,10 @@ export interface SetAddressParams<V extends AddressSchema> {
     values: V;
     resource: AddressResource;
     dispatch?: Dispatch<AddressAction>;
+    state?: AddressState;
 }
-export type SetAddress = <V extends AddressSchema>(params: SetAddressParams<V>) => void;
 export declare const setAddressErrors: SetAddressErrors;
-export declare const setAddress: SetAddress;
+export declare function setAddress<V extends AddressSchema>({ values, resource, dispatch, state }: SetAddressParams<V>): void;
 type SetCloneAddress = (id: string, resource: AddressResource, dispatch: Dispatch<AddressAction>) => void;
 export declare const setCloneAddress: SetCloneAddress;
 interface TSaveAddressesParams {

package/lib/esm/reducers/AddressReducer.js

@@ -1,2 +1,2 @@
 "use client";
-import baseReducer from"../utils/baseReducer";import getSdk from"../utils/getSdk";import camelCase from"lodash/camelCase";import{invertedAddressesHandler}from"../utils/addressesManager";export const addressFields=["city","company","country_code","first_name","last_name","line_1","line_2","phone","state_code","zip_code"],addressInitialState={errors:[]},setAddressErrors=({errors,dispatch,currentErrors=[],resource})=>{const billingErrors=resource==="billing_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="billing_address"),shippingErrors=resource==="shipping_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="shipping_address"),finalErrors=[...billingErrors,...shippingErrors];dispatch&&dispatch({type:"setErrors",payload:{errors:finalErrors}})},setAddress=({values,resource,dispatch})=>{dispatch&&dispatch({type:"setAddress",payload:{[`${resource}`]:values}})},setCloneAddress=(id,resource,dispatch)=>{dispatch({type:"setCloneAddress",payload:{[`${camelCase(resource)}Id`]:id}})};export async function saveAddresses({config,updateOrder,order,state,customerEmail}){const{shipToDifferentAddress,invertAddresses,billing_address:billingAddress,shipping_address:shippingAddress,billingAddressId,shippingAddressId}=state;try{const sdk=getSdk(config);if(order){let orderAttributes=null;if(invertAddresses)orderAttributes=await invertedAddressesHandler({billingAddress,billingAddressId,customerEmail,order,shipToDifferentAddress,shippingAddress,shippingAddressId,sdk});else{const doNotShipItems=order?.line_items?.every(lineItem=>lineItem?.item?.do_not_ship===!0),currentBillingAddressRef=order?.billing_address?.reference;if(orderAttributes={id:order?.id,_billing_address_clone_id:billingAddressId,_shipping_address_clone_id:billingAddressId,customer_email:customerEmail},currentBillingAddressRef===billingAddressId&&(orderAttributes._billing_address_clone_id=order?.billing_address?.id,orderAttributes._shipping_address_clone_id=order?.shipping_address?.id),billingAddress!=null&&Object.keys(billingAddress).length>0){delete orderAttributes._billing_address_clone_id,delete orderAttributes._shipping_address_clone_id,doNotShipItems||(orderAttributes._shipping_address_same_as_billing=!0);const hasMetadata=Object.keys(billingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");billingAddress.metadata={...billingAddress.metadata||{},[metadataKey]:billingAddress[key]},delete billingAddress[key]});const address=await sdk.addresses.create(billingAddress);orderAttributes.billing_address=sdk.addresses.relationship(address.id)}if(shipToDifferentAddress&&(delete orderAttributes._shipping_address_same_as_billing,shippingAddressId&&(orderAttributes._shipping_address_clone_id=shippingAddressId),shippingAddress!=null&&Object.keys(shippingAddress).length>0)){delete orderAttributes._shipping_address_clone_id;const hasMetadata=Object.keys(shippingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");shippingAddress.metadata={...shippingAddress.metadata||{},[metadataKey]:shippingAddress[key]},delete shippingAddress[key]});const address=await sdk.addresses.create(shippingAddress);orderAttributes.shipping_address=sdk.addresses.relationship(address.id)}}if(orderAttributes!=null&&updateOrder)return{success:!0,order:(await updateOrder({id:order.id,attributes:orderAttributes}))?.order}}return{success:!1}}catch(error){return console.error(error),{success:!1,error}}}const type=["setErrors","setAddress","setShipToDifferentAddress","setCloneAddress","cleanup"],addressReducer=(state,reducer)=>baseReducer(state,reducer,type);export default addressReducer;
+import baseReducer from"../utils/baseReducer";import getSdk from"../utils/getSdk";import camelCase from"lodash/camelCase";import{invertedAddressesHandler}from"../utils/addressesManager";export const addressFields=["city","company","country_code","first_name","last_name","line_1","line_2","phone","state_code","zip_code"],addressInitialState={errors:[]},setAddressErrors=({errors,dispatch,currentErrors=[],resource})=>{const billingErrors=resource==="billing_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="billing_address"),shippingErrors=resource==="shipping_address"?errors.filter(e=>e.resource===resource):currentErrors.filter(e=>e.resource==="shipping_address"),finalErrors=[...billingErrors,...shippingErrors];dispatch&&dispatch({type:"setErrors",payload:{errors:finalErrors}})};export function setAddress({values,resource,dispatch,state}){const payload={[`${resource}`]:{...state?.[resource],...values}};dispatch&&dispatch({type:"setAddress",payload})}export const setCloneAddress=(id,resource,dispatch)=>{dispatch({type:"setCloneAddress",payload:{[`${camelCase(resource)}Id`]:id}})};export async function saveAddresses({config,updateOrder,order,state,customerEmail}){const{shipToDifferentAddress,invertAddresses,billing_address:billingAddress,shipping_address:shippingAddress,billingAddressId,shippingAddressId}=state;try{const sdk=getSdk(config);if(order){let orderAttributes=null;if(invertAddresses)orderAttributes=await invertedAddressesHandler({billingAddress,billingAddressId,customerEmail,order,shipToDifferentAddress,shippingAddress,shippingAddressId,sdk});else{const doNotShipItems=order?.line_items?.every(lineItem=>lineItem?.item?.do_not_ship===!0),currentBillingAddressRef=order?.billing_address?.reference;if(orderAttributes={id:order?.id,_billing_address_clone_id:billingAddressId,_shipping_address_clone_id:billingAddressId,customer_email:customerEmail},currentBillingAddressRef===billingAddressId&&(orderAttributes._billing_address_clone_id=order?.billing_address?.id,orderAttributes._shipping_address_clone_id=order?.shipping_address?.id),billingAddress!=null&&Object.keys(billingAddress).length>0){delete orderAttributes._billing_address_clone_id,delete orderAttributes._shipping_address_clone_id,doNotShipItems||(orderAttributes._shipping_address_same_as_billing=!0);const hasMetadata=Object.keys(billingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");billingAddress.metadata={...billingAddress.metadata||{},[metadataKey]:billingAddress[key]},delete billingAddress[key]});const address=await sdk.addresses.create(billingAddress);orderAttributes.billing_address=sdk.addresses.relationship(address.id)}if(shipToDifferentAddress&&(delete orderAttributes._shipping_address_same_as_billing,shippingAddressId&&(orderAttributes._shipping_address_clone_id=shippingAddressId),shippingAddress!=null&&Object.keys(shippingAddress).length>0)){delete orderAttributes._shipping_address_clone_id;const hasMetadata=Object.keys(shippingAddress).filter(key=>!!key.startsWith("metadata_"));hasMetadata?.length>0&&hasMetadata.forEach(key=>{const metadataKey=key.replace("metadata_","");shippingAddress.metadata={...shippingAddress.metadata||{},[metadataKey]:shippingAddress[key]},delete shippingAddress[key]});const address=await sdk.addresses.create(shippingAddress);orderAttributes.shipping_address=sdk.addresses.relationship(address.id)}}if(orderAttributes!=null&&updateOrder)return{success:!0,order:(await updateOrder({id:order.id,attributes:orderAttributes}))?.order}}return{success:!1}}catch(error){return console.error(error),{success:!1,error}}}const type=["setErrors","setAddress","setShipToDifferentAddress","setCloneAddress","cleanup"],addressReducer=(state,reducer)=>baseReducer(state,reducer,type);export default addressReducer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/react-components",
-  "version": "4.8.5",
+  "version": "4.8.6-beta.0",
   "description": "The Official Commerce Layer React Components",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.js",